@fluentui/react-charting 5.9.34 → 5.9.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +28 -1
- package/CHANGELOG.md +13 -2
- package/dist/react-charting.js +1 -1
- package/dist/react-charting.min.js +1 -1
- package/lib/components/LineChart/eventAnnotation/EventAnnotation.js +3 -1
- package/lib/components/LineChart/eventAnnotation/EventAnnotation.js.map +1 -1
- package/lib/components/LineChart/eventAnnotation/LabelLink.js +2 -3
- package/lib/components/LineChart/eventAnnotation/LabelLink.js.map +1 -1
- package/lib/version.js +1 -1
- package/lib/version.js.map +1 -1
- package/lib-amd/components/LineChart/eventAnnotation/EventAnnotation.js +3 -1
- package/lib-amd/components/LineChart/eventAnnotation/EventAnnotation.js.map +1 -1
- package/lib-amd/components/LineChart/eventAnnotation/LabelLink.js +2 -3
- package/lib-amd/components/LineChart/eventAnnotation/LabelLink.js.map +1 -1
- package/lib-amd/version.js +1 -1
- package/lib-amd/version.js.map +1 -1
- package/lib-commonjs/components/LineChart/eventAnnotation/EventAnnotation.js +3 -1
- package/lib-commonjs/components/LineChart/eventAnnotation/EventAnnotation.js.map +1 -1
- package/lib-commonjs/components/LineChart/eventAnnotation/LabelLink.js +2 -3
- package/lib-commonjs/components/LineChart/eventAnnotation/LabelLink.js.map +1 -1
- package/lib-commonjs/version.js +1 -1
- package/lib-commonjs/version.js.map +1 -1
- package/package.json +4 -4
|
@@ -12,7 +12,9 @@ export var EventsAnnotation = function (props) {
|
|
|
12
12
|
var axisRange = props.scale.range();
|
|
13
13
|
var lineDefs = props.events.map(function (e) { return (__assign(__assign({}, e), { x: props.scale(e.date) })); });
|
|
14
14
|
lineDefs.sort(function (e1, e2) { return +e1.date - +e2.date; });
|
|
15
|
-
var
|
|
15
|
+
var darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)');
|
|
16
|
+
var fill = darkThemeMq.matches ? 'rgb(255,255,255)' : props.strokeColor;
|
|
17
|
+
var lines = uniqBy(lineDefs, function (x) { return x.date.toString(); }).map(function (x, i) { return (React.createElement("line", { key: i, x1: x.x, x2: x.x, y1: lineTopY, y2: props.chartYBottom, stroke: fill, strokeDasharray: "8" })); });
|
|
16
18
|
var labelLinks = calculateLabels(lineDefs, textWidth + textPadding, axisRange[1], axisRange[0]).map(function (x, i) { return (React.createElement(LabelLink, __assign({ key: i }, {
|
|
17
19
|
lineDefs: lineDefs,
|
|
18
20
|
labelDef: x,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EventAnnotation.js","sourceRoot":"../src/","sources":["components/LineChart/eventAnnotation/EventAnnotation.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAC1D,OAAO,EAAY,SAAS,EAAa,MAAM,aAAa,CAAC;AAS7D,MAAM,CAAC,IAAM,gBAAgB,GAA0D,UAAA,KAAK;IAC1F,IAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC;IAC5D,IAAM,KAAK,GAAG,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC;IACnC,IAAM,QAAQ,GAAG,KAAK,GAAG,CAAC,CAAC;IAC3B,IAAM,WAAW,GAAG,CAAC,CAAC;IACtB,IAAM,UAAU,GAAG,EAAE,CAAC;IACtB,IAAM,QAAQ,GAAG,MAAM,CAAC;IACxB,IAAM,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IAEtC,IAAM,QAAQ,GAAe,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,UAAA,CAAC,IAAI,OAAA,uBAAM,CAAC,KAAE,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,IAAG,EAAlC,CAAkC,CAAC,CAAC;IAEvF,QAAQ,CAAC,IAAI,CAAC,UAAC,EAAE,EAAE,EAAE,IAAK,OAAA,CAAC,EAAE,CAAC,IAAI,GAAG,CAAC,EAAE,CAAC,IAAI,EAAnB,CAAmB,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"EventAnnotation.js","sourceRoot":"../src/","sources":["components/LineChart/eventAnnotation/EventAnnotation.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { ScaleTime } from 'd3-scale';\nimport { findIndex } from '@fluentui/react/lib/Utilities';\nimport { ILineDef, LabelLink, ILabelDef } from './LabelLink';\nimport { IEventsAnnotationProps } from '../LineChart.types';\n\ninterface IEventsAnnotationExtendProps extends IEventsAnnotationProps {\n scale: ScaleTime<number, number>;\n chartYBottom: number;\n chartYTop: number;\n}\n\nexport const EventsAnnotation: React.FunctionComponent<IEventsAnnotationExtendProps> = props => {\n const textWidth = props.labelWidth ? props.labelWidth : 105;\n const textY = props.chartYTop - 20;\n const lineTopY = textY + 7;\n const textPadding = 5;\n const lineHeight = 18;\n const fontSize = '10pt';\n const axisRange = props.scale.range();\n\n const lineDefs: ILineDef[] = props.events.map(e => ({ ...e, x: props.scale(e.date) }));\n\n lineDefs.sort((e1, e2) => +e1.date - +e2.date);\n const darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)');\n const fill: string | undefined = darkThemeMq.matches ? 'rgb(255,255,255)' : props.strokeColor;\n\n const lines = uniqBy(lineDefs, x => x.date.toString()).map((x, i) => (\n <line key={i} x1={x.x} x2={x.x} y1={lineTopY} y2={props.chartYBottom} stroke={fill} strokeDasharray=\"8\" />\n ));\n\n const labelLinks = calculateLabels(lineDefs, textWidth + textPadding, axisRange[1], axisRange[0]).map((x, i) => (\n <LabelLink\n key={i}\n {...{\n lineDefs,\n labelDef: x,\n textY,\n textWidth,\n textLineHeight: lineHeight,\n textFontSize: fontSize,\n textColor: props.labelColor,\n mergedLabel: props.mergedLabel,\n }}\n />\n ));\n\n return (\n <>\n {lines}\n {labelLinks}\n </>\n );\n};\n\nfunction calculateLabels(lineDefs: ILineDef[], textWidth: number, maxX: number, minX: number): ILabelDef[] {\n const calculateLabel = (lastX: number, currentIdx: number): ILabelDef[] => {\n // base case 1\n if (currentIdx === lineDefs.length) {\n return [];\n }\n\n const { x } = lineDefs[currentIdx];\n const leftXBoundary = x - textWidth;\n\n // cannot render on top of other text\n if (x < lastX) {\n return [];\n }\n\n // base case 2\n if (currentIdx === lineDefs.length - 1) {\n if (lastX < leftXBoundary) {\n return [{ x: x, anchor: 'end', aggregatedIdx: [currentIdx] }];\n } else if (x + textWidth < maxX) {\n return [{ x: x, anchor: 'start', aggregatedIdx: [currentIdx] }];\n }\n\n return [];\n }\n\n if (lastX < leftXBoundary) {\n // label on left side\n return backtrack(currentIdx, 'end');\n } else {\n // label on right side\n return backtrack(currentIdx, 'start');\n }\n };\n\n const backtrack = (currentIdx: number, anchor: 'start' | 'end'): ILabelDef[] => {\n const bd = anchor === 'end' ? lineDefs[currentIdx].x : lineDefs[currentIdx].x + textWidth;\n\n let idx = findIndex(\n lineDefs,\n ds => ds.x > bd && (ds.x - textWidth >= bd || ds.x + textWidth < maxX),\n currentIdx + 1,\n );\n if (idx === -1) {\n idx = lineDefs.length;\n }\n\n const aggregatedIdx: number[] = [];\n for (let i = currentIdx; i < idx; i++) {\n aggregatedIdx.push(i);\n }\n const next = calculateLabel(bd, idx);\n\n next.unshift({ x: lineDefs[currentIdx].x, anchor, aggregatedIdx });\n return next;\n };\n\n return calculateLabel(minX, 0);\n}\n\n/** Get unique items of `arr`, comparing based on the result of calling `iteratee` on each item. */\nfunction uniqBy<T>(arr: T[], iteratee: (x: T) => string): T[] {\n const seen: string[] = [];\n const result: T[] = [];\n for (const x of arr) {\n const comp = iteratee(x);\n if (seen.indexOf(comp) === -1) {\n result.push(x);\n seen.push(comp);\n }\n }\n return result;\n}\n"]}
|
|
@@ -21,14 +21,13 @@ export var LabelLink = function (props) {
|
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
var text;
|
|
24
|
-
var
|
|
24
|
+
var darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)');
|
|
25
|
+
var fill = darkThemeMq.matches ? 'rgb(255,255,255)' : props.textColor;
|
|
25
26
|
if (props.labelDef.aggregatedIdx.length === 1) {
|
|
26
27
|
text = props.lineDefs[props.labelDef.aggregatedIdx[0]].event;
|
|
27
|
-
fill = props.textColor;
|
|
28
28
|
}
|
|
29
29
|
else {
|
|
30
30
|
text = props.mergedLabel(props.labelDef.aggregatedIdx.length);
|
|
31
|
-
fill = props.textColor;
|
|
32
31
|
}
|
|
33
32
|
return (React.createElement(React.Fragment, null,
|
|
34
33
|
React.createElement("g", { ref: gRef, onClick: onClick, "data-is-focusable": true, style: { cursor: 'pointer' } },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LabelLink.js","sourceRoot":"../src/","sources":["components/LineChart/eventAnnotation/LabelLink.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,kBAAkB,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAE/E,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAuBpC,MAAM,CAAC,IAAM,SAAS,GAA6C,UAAA,KAAK;IACtE,IAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAc,IAAI,CAAC,CAAC;IACvC,IAAA,KAA0B,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAA9C,QAAQ,QAAA,EAAE,WAAW,QAAyB,CAAC;IACtD,IAAM,SAAS,GAAG,cAAM,OAAA,WAAW,CAAC,KAAK,CAAC,EAAlB,CAAkB,CAAC;IAC3C,IAAM,OAAO,GAAG,cAAM,OAAA,WAAW,CAAC,IAAI,CAAC,EAAjB,CAAiB,CAAC;IACxC,IAAM,YAAY,GAAG,UAAC,CAAsC,IAAK,OAAA,kDAAwB,IAAI,IAAG,CAAC,IAAI,CAAC,EAAE,CAAO,EAA9C,CAA8C,CAAC;IAEhH,IAAI,OAAO,GAAoB,IAAI,CAAC;IACpC,IAAI,QAAQ,EAAE;QACZ,IAAM,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,UAAA,CAAC,IAAI,OAAA,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,YAAa,EAA/B,CAA+B,CAAC,CAAC,MAAM,CAAC,UAAA,CAAC,IAAI,OAAA,CAAC,CAAC,CAAC,EAAH,CAAG,CAAC,CAAC;QACtG,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YACpB,OAAO,GAAG,CACR,oBAAC,OAAO,IACN,MAAM,EAAE,IAAI,CAAC,OAAO;gBACpB,6CAA6C;gBAC7C,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,IAAI,EACrB,IAAI,EAAC,QAAQ;gBAEb,oBAAC,SAAS,IAAC,oBAAoB,EAAE,IAAI,EAAE,SAAS,EAAE,kBAAkB,CAAC,QAAQ;oBAC3E,oBAAC,IAAI,IACH,KAAK,EAAE,KAAK;wBACZ,6CAA6C;wBAC7C,YAAY,EAAE,YAAY,GAC1B,CACQ,CACJ,CACX,CAAC;SACH;KACF;IAED,IAAI,IAAY,CAAC;IACjB,IAAI,
|
|
1
|
+
{"version":3,"file":"LabelLink.js","sourceRoot":"../src/","sources":["components/LineChart/eventAnnotation/LabelLink.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Callout, FocusZone, FocusZoneDirection, List } from '@fluentui/react';\nimport { IEventAnnotation } from '../../../types/IEventAnnotation';\nimport { Textbox } from './Textbox';\n\nexport interface ILineDef extends IEventAnnotation {\n x: number;\n}\n\nexport interface ILabelDef {\n x: number;\n aggregatedIdx: number[];\n anchor: 'start' | 'end';\n}\n\ninterface ILabelLinkProps {\n lineDefs: ILineDef[];\n labelDef: ILabelDef;\n textY: number;\n textWidth: number;\n textLineHeight: number;\n textFontSize: string;\n textColor: string;\n mergedLabel: (count: number) => string;\n}\n\nexport const LabelLink: React.FunctionComponent<ILabelLinkProps> = props => {\n const gRef = React.useRef<SVGGElement>(null);\n const [showCard, setShowCard] = React.useState(false);\n const onDismiss = () => setShowCard(false);\n const onClick = () => setShowCard(true);\n const onRenderCell = (i: (() => React.ReactNode) | undefined) => <div data-is-focusable={true}>{i && i()}</div>;\n\n let callout: React.ReactNode = null;\n if (showCard) {\n const cards = props.labelDef.aggregatedIdx.map(i => props.lineDefs[i].onRenderCard!).filter(c => !!c);\n if (cards.length > 0) {\n callout = (\n <Callout\n target={gRef.current}\n // eslint-disable-next-line react/jsx-no-bind\n onDismiss={onDismiss}\n setInitialFocus={true}\n role=\"dialog\"\n >\n <FocusZone isCircularNavigation={true} direction={FocusZoneDirection.vertical}>\n <List<() => React.ReactNode>\n items={cards}\n // eslint-disable-next-line react/jsx-no-bind\n onRenderCell={onRenderCell}\n />\n </FocusZone>\n </Callout>\n );\n }\n }\n\n let text: string;\n const darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)');\n const fill: string | undefined = darkThemeMq.matches ? 'rgb(255,255,255)' : props.textColor;\n if (props.labelDef.aggregatedIdx.length === 1) {\n text = props.lineDefs[props.labelDef.aggregatedIdx[0]].event;\n } else {\n text = props.mergedLabel(props.labelDef.aggregatedIdx.length);\n }\n\n return (\n <>\n <g ref={gRef} onClick={onClick} data-is-focusable={true} style={{ cursor: 'pointer' }}>\n <Textbox\n text={text}\n x={props.labelDef.x}\n y={props.textY}\n width={props.textWidth}\n lineHeight={props.textLineHeight}\n textAnchor={props.labelDef.anchor}\n fontSize={props.textFontSize}\n fill={fill}\n />\n </g>\n {callout}\n </>\n );\n};\n"]}
|
package/lib/version.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
// Do not modify this file; it is generated as part of publish.
|
|
2
2
|
// The checked in version is a placeholder only and will not be updated.
|
|
3
3
|
import { setVersion } from '@fluentui/set-version';
|
|
4
|
-
setVersion('@fluentui/react-charting', '5.9.
|
|
4
|
+
setVersion('@fluentui/react-charting', '5.9.35');
|
|
5
5
|
//# sourceMappingURL=version.js.map
|
package/lib/version.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.js","sourceRoot":"../src/","sources":["version.ts"],"names":[],"mappings":"AAAA,+DAA+D;AAC/D,wEAAwE;AACxE,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACnD,UAAU,CAAC,0BAA0B,EAAE,QAAQ,CAAC,CAAC","sourcesContent":["// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/react-charting', '5.9.
|
|
1
|
+
{"version":3,"file":"version.js","sourceRoot":"../src/","sources":["version.ts"],"names":[],"mappings":"AAAA,+DAA+D;AAC/D,wEAAwE;AACxE,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACnD,UAAU,CAAC,0BAA0B,EAAE,QAAQ,CAAC,CAAC","sourcesContent":["// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/react-charting', '5.9.35');"]}
|
|
@@ -12,7 +12,9 @@ define(["require", "exports", "tslib", "react", "@fluentui/react/lib/Utilities",
|
|
|
12
12
|
var axisRange = props.scale.range();
|
|
13
13
|
var lineDefs = props.events.map(function (e) { return (tslib_1.__assign(tslib_1.__assign({}, e), { x: props.scale(e.date) })); });
|
|
14
14
|
lineDefs.sort(function (e1, e2) { return +e1.date - +e2.date; });
|
|
15
|
-
var
|
|
15
|
+
var darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)');
|
|
16
|
+
var fill = darkThemeMq.matches ? 'rgb(255,255,255)' : props.strokeColor;
|
|
17
|
+
var lines = uniqBy(lineDefs, function (x) { return x.date.toString(); }).map(function (x, i) { return (React.createElement("line", { key: i, x1: x.x, x2: x.x, y1: lineTopY, y2: props.chartYBottom, stroke: fill, strokeDasharray: "8" })); });
|
|
16
18
|
var labelLinks = calculateLabels(lineDefs, textWidth + textPadding, axisRange[1], axisRange[0]).map(function (x, i) { return (React.createElement(LabelLink_1.LabelLink, tslib_1.__assign({ key: i }, {
|
|
17
19
|
lineDefs: lineDefs,
|
|
18
20
|
labelDef: x,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EventAnnotation.js","sourceRoot":"../src/","sources":["components/LineChart/eventAnnotation/EventAnnotation.tsx"],"names":[],"mappings":";;;;IAYO,IAAM,gBAAgB,GAA0D,UAAA,KAAK;QAC1F,IAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC;QAC5D,IAAM,KAAK,GAAG,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC;QACnC,IAAM,QAAQ,GAAG,KAAK,GAAG,CAAC,CAAC;QAC3B,IAAM,WAAW,GAAG,CAAC,CAAC;QACtB,IAAM,UAAU,GAAG,EAAE,CAAC;QACtB,IAAM,QAAQ,GAAG,MAAM,CAAC;QACxB,IAAM,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;QAEtC,IAAM,QAAQ,GAAe,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,UAAA,CAAC,IAAI,OAAA,uCAAM,CAAC,KAAE,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,IAAG,EAAlC,CAAkC,CAAC,CAAC;QAEvF,QAAQ,CAAC,IAAI,CAAC,UAAC,EAAE,EAAE,EAAE,IAAK,OAAA,CAAC,EAAE,CAAC,IAAI,GAAG,CAAC,EAAE,CAAC,IAAI,EAAnB,CAAmB,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"EventAnnotation.js","sourceRoot":"../src/","sources":["components/LineChart/eventAnnotation/EventAnnotation.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { ScaleTime } from 'd3-scale';\nimport { findIndex } from '@fluentui/react/lib/Utilities';\nimport { ILineDef, LabelLink, ILabelDef } from './LabelLink';\nimport { IEventsAnnotationProps } from '../LineChart.types';\n\ninterface IEventsAnnotationExtendProps extends IEventsAnnotationProps {\n scale: ScaleTime<number, number>;\n chartYBottom: number;\n chartYTop: number;\n}\n\nexport const EventsAnnotation: React.FunctionComponent<IEventsAnnotationExtendProps> = props => {\n const textWidth = props.labelWidth ? props.labelWidth : 105;\n const textY = props.chartYTop - 20;\n const lineTopY = textY + 7;\n const textPadding = 5;\n const lineHeight = 18;\n const fontSize = '10pt';\n const axisRange = props.scale.range();\n\n const lineDefs: ILineDef[] = props.events.map(e => ({ ...e, x: props.scale(e.date) }));\n\n lineDefs.sort((e1, e2) => +e1.date - +e2.date);\n const darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)');\n const fill: string | undefined = darkThemeMq.matches ? 'rgb(255,255,255)' : props.strokeColor;\n\n const lines = uniqBy(lineDefs, x => x.date.toString()).map((x, i) => (\n <line key={i} x1={x.x} x2={x.x} y1={lineTopY} y2={props.chartYBottom} stroke={fill} strokeDasharray=\"8\" />\n ));\n\n const labelLinks = calculateLabels(lineDefs, textWidth + textPadding, axisRange[1], axisRange[0]).map((x, i) => (\n <LabelLink\n key={i}\n {...{\n lineDefs,\n labelDef: x,\n textY,\n textWidth,\n textLineHeight: lineHeight,\n textFontSize: fontSize,\n textColor: props.labelColor,\n mergedLabel: props.mergedLabel,\n }}\n />\n ));\n\n return (\n <>\n {lines}\n {labelLinks}\n </>\n );\n};\n\nfunction calculateLabels(lineDefs: ILineDef[], textWidth: number, maxX: number, minX: number): ILabelDef[] {\n const calculateLabel = (lastX: number, currentIdx: number): ILabelDef[] => {\n // base case 1\n if (currentIdx === lineDefs.length) {\n return [];\n }\n\n const { x } = lineDefs[currentIdx];\n const leftXBoundary = x - textWidth;\n\n // cannot render on top of other text\n if (x < lastX) {\n return [];\n }\n\n // base case 2\n if (currentIdx === lineDefs.length - 1) {\n if (lastX < leftXBoundary) {\n return [{ x: x, anchor: 'end', aggregatedIdx: [currentIdx] }];\n } else if (x + textWidth < maxX) {\n return [{ x: x, anchor: 'start', aggregatedIdx: [currentIdx] }];\n }\n\n return [];\n }\n\n if (lastX < leftXBoundary) {\n // label on left side\n return backtrack(currentIdx, 'end');\n } else {\n // label on right side\n return backtrack(currentIdx, 'start');\n }\n };\n\n const backtrack = (currentIdx: number, anchor: 'start' | 'end'): ILabelDef[] => {\n const bd = anchor === 'end' ? lineDefs[currentIdx].x : lineDefs[currentIdx].x + textWidth;\n\n let idx = findIndex(\n lineDefs,\n ds => ds.x > bd && (ds.x - textWidth >= bd || ds.x + textWidth < maxX),\n currentIdx + 1,\n );\n if (idx === -1) {\n idx = lineDefs.length;\n }\n\n const aggregatedIdx: number[] = [];\n for (let i = currentIdx; i < idx; i++) {\n aggregatedIdx.push(i);\n }\n const next = calculateLabel(bd, idx);\n\n next.unshift({ x: lineDefs[currentIdx].x, anchor, aggregatedIdx });\n return next;\n };\n\n return calculateLabel(minX, 0);\n}\n\n/** Get unique items of `arr`, comparing based on the result of calling `iteratee` on each item. */\nfunction uniqBy<T>(arr: T[], iteratee: (x: T) => string): T[] {\n const seen: string[] = [];\n const result: T[] = [];\n for (const x of arr) {\n const comp = iteratee(x);\n if (seen.indexOf(comp) === -1) {\n result.push(x);\n seen.push(comp);\n }\n }\n return result;\n}\n"]}
|
|
@@ -22,14 +22,13 @@ define(["require", "exports", "react", "@fluentui/react", "./Textbox"], function
|
|
|
22
22
|
}
|
|
23
23
|
}
|
|
24
24
|
var text;
|
|
25
|
-
var
|
|
25
|
+
var darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)');
|
|
26
|
+
var fill = darkThemeMq.matches ? 'rgb(255,255,255)' : props.textColor;
|
|
26
27
|
if (props.labelDef.aggregatedIdx.length === 1) {
|
|
27
28
|
text = props.lineDefs[props.labelDef.aggregatedIdx[0]].event;
|
|
28
|
-
fill = props.textColor;
|
|
29
29
|
}
|
|
30
30
|
else {
|
|
31
31
|
text = props.mergedLabel(props.labelDef.aggregatedIdx.length);
|
|
32
|
-
fill = props.textColor;
|
|
33
32
|
}
|
|
34
33
|
return (React.createElement(React.Fragment, null,
|
|
35
34
|
React.createElement("g", { ref: gRef, onClick: onClick, "data-is-focusable": true, style: { cursor: 'pointer' } },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LabelLink.js","sourceRoot":"../src/","sources":["components/LineChart/eventAnnotation/LabelLink.tsx"],"names":[],"mappings":";;;;IA0BO,IAAM,SAAS,GAA6C,UAAA,KAAK;QACtE,IAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAc,IAAI,CAAC,CAAC;QACvC,IAAA,KAA0B,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAA9C,QAAQ,QAAA,EAAE,WAAW,QAAyB,CAAC;QACtD,IAAM,SAAS,GAAG,cAAM,OAAA,WAAW,CAAC,KAAK,CAAC,EAAlB,CAAkB,CAAC;QAC3C,IAAM,OAAO,GAAG,cAAM,OAAA,WAAW,CAAC,IAAI,CAAC,EAAjB,CAAiB,CAAC;QACxC,IAAM,YAAY,GAAG,UAAC,CAAsC,IAAK,OAAA,kDAAwB,IAAI,IAAG,CAAC,IAAI,CAAC,EAAE,CAAO,EAA9C,CAA8C,CAAC;QAEhH,IAAI,OAAO,GAAoB,IAAI,CAAC;QACpC,IAAI,QAAQ,EAAE;YACZ,IAAM,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,UAAA,CAAC,IAAI,OAAA,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,YAAa,EAA/B,CAA+B,CAAC,CAAC,MAAM,CAAC,UAAA,CAAC,IAAI,OAAA,CAAC,CAAC,CAAC,EAAH,CAAG,CAAC,CAAC;YACtG,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;gBACpB,OAAO,GAAG,CACR,oBAAC,eAAO,IACN,MAAM,EAAE,IAAI,CAAC,OAAO;oBACpB,6CAA6C;oBAC7C,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,IAAI,EACrB,IAAI,EAAC,QAAQ;oBAEb,oBAAC,iBAAS,IAAC,oBAAoB,EAAE,IAAI,EAAE,SAAS,EAAE,0BAAkB,CAAC,QAAQ;wBAC3E,oBAAC,YAAI,IACH,KAAK,EAAE,KAAK;4BACZ,6CAA6C;4BAC7C,YAAY,EAAE,YAAY,GAC1B,CACQ,CACJ,CACX,CAAC;aACH;SACF;QAED,IAAI,IAAY,CAAC;QACjB,IAAI,
|
|
1
|
+
{"version":3,"file":"LabelLink.js","sourceRoot":"../src/","sources":["components/LineChart/eventAnnotation/LabelLink.tsx"],"names":[],"mappings":";;;;IA0BO,IAAM,SAAS,GAA6C,UAAA,KAAK;QACtE,IAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAc,IAAI,CAAC,CAAC;QACvC,IAAA,KAA0B,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAA9C,QAAQ,QAAA,EAAE,WAAW,QAAyB,CAAC;QACtD,IAAM,SAAS,GAAG,cAAM,OAAA,WAAW,CAAC,KAAK,CAAC,EAAlB,CAAkB,CAAC;QAC3C,IAAM,OAAO,GAAG,cAAM,OAAA,WAAW,CAAC,IAAI,CAAC,EAAjB,CAAiB,CAAC;QACxC,IAAM,YAAY,GAAG,UAAC,CAAsC,IAAK,OAAA,kDAAwB,IAAI,IAAG,CAAC,IAAI,CAAC,EAAE,CAAO,EAA9C,CAA8C,CAAC;QAEhH,IAAI,OAAO,GAAoB,IAAI,CAAC;QACpC,IAAI,QAAQ,EAAE;YACZ,IAAM,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,UAAA,CAAC,IAAI,OAAA,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,YAAa,EAA/B,CAA+B,CAAC,CAAC,MAAM,CAAC,UAAA,CAAC,IAAI,OAAA,CAAC,CAAC,CAAC,EAAH,CAAG,CAAC,CAAC;YACtG,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;gBACpB,OAAO,GAAG,CACR,oBAAC,eAAO,IACN,MAAM,EAAE,IAAI,CAAC,OAAO;oBACpB,6CAA6C;oBAC7C,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,IAAI,EACrB,IAAI,EAAC,QAAQ;oBAEb,oBAAC,iBAAS,IAAC,oBAAoB,EAAE,IAAI,EAAE,SAAS,EAAE,0BAAkB,CAAC,QAAQ;wBAC3E,oBAAC,YAAI,IACH,KAAK,EAAE,KAAK;4BACZ,6CAA6C;4BAC7C,YAAY,EAAE,YAAY,GAC1B,CACQ,CACJ,CACX,CAAC;aACH;SACF;QAED,IAAI,IAAY,CAAC;QACjB,IAAM,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC;QACtE,IAAM,IAAI,GAAuB,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC;QAC5F,IAAI,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,KAAK,CAAC,EAAE;YAC7C,IAAI,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;SAC9D;aAAM;YACL,IAAI,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;SAC/D;QAED,OAAO,CACL;YACE,2BAAG,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,uBAAqB,IAAI,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE;gBACnF,oBAAC,iBAAO,IACN,IAAI,EAAE,IAAI,EACV,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,EACnB,CAAC,EAAE,KAAK,CAAC,KAAK,EACd,KAAK,EAAE,KAAK,CAAC,SAAS,EACtB,UAAU,EAAE,KAAK,CAAC,cAAc,EAChC,UAAU,EAAE,KAAK,CAAC,QAAQ,CAAC,MAAM,EACjC,QAAQ,EAAE,KAAK,CAAC,YAAY,EAC5B,IAAI,EAAE,IAAI,GACV,CACA;YACH,OAAO,CACP,CACJ,CAAC;IACJ,CAAC,CAAC;IAzDW,QAAA,SAAS,aAyDpB","sourcesContent":["import * as React from 'react';\nimport { Callout, FocusZone, FocusZoneDirection, List } from '@fluentui/react';\nimport { IEventAnnotation } from '../../../types/IEventAnnotation';\nimport { Textbox } from './Textbox';\n\nexport interface ILineDef extends IEventAnnotation {\n x: number;\n}\n\nexport interface ILabelDef {\n x: number;\n aggregatedIdx: number[];\n anchor: 'start' | 'end';\n}\n\ninterface ILabelLinkProps {\n lineDefs: ILineDef[];\n labelDef: ILabelDef;\n textY: number;\n textWidth: number;\n textLineHeight: number;\n textFontSize: string;\n textColor: string;\n mergedLabel: (count: number) => string;\n}\n\nexport const LabelLink: React.FunctionComponent<ILabelLinkProps> = props => {\n const gRef = React.useRef<SVGGElement>(null);\n const [showCard, setShowCard] = React.useState(false);\n const onDismiss = () => setShowCard(false);\n const onClick = () => setShowCard(true);\n const onRenderCell = (i: (() => React.ReactNode) | undefined) => <div data-is-focusable={true}>{i && i()}</div>;\n\n let callout: React.ReactNode = null;\n if (showCard) {\n const cards = props.labelDef.aggregatedIdx.map(i => props.lineDefs[i].onRenderCard!).filter(c => !!c);\n if (cards.length > 0) {\n callout = (\n <Callout\n target={gRef.current}\n // eslint-disable-next-line react/jsx-no-bind\n onDismiss={onDismiss}\n setInitialFocus={true}\n role=\"dialog\"\n >\n <FocusZone isCircularNavigation={true} direction={FocusZoneDirection.vertical}>\n <List<() => React.ReactNode>\n items={cards}\n // eslint-disable-next-line react/jsx-no-bind\n onRenderCell={onRenderCell}\n />\n </FocusZone>\n </Callout>\n );\n }\n }\n\n let text: string;\n const darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)');\n const fill: string | undefined = darkThemeMq.matches ? 'rgb(255,255,255)' : props.textColor;\n if (props.labelDef.aggregatedIdx.length === 1) {\n text = props.lineDefs[props.labelDef.aggregatedIdx[0]].event;\n } else {\n text = props.mergedLabel(props.labelDef.aggregatedIdx.length);\n }\n\n return (\n <>\n <g ref={gRef} onClick={onClick} data-is-focusable={true} style={{ cursor: 'pointer' }}>\n <Textbox\n text={text}\n x={props.labelDef.x}\n y={props.textY}\n width={props.textWidth}\n lineHeight={props.textLineHeight}\n textAnchor={props.labelDef.anchor}\n fontSize={props.textFontSize}\n fill={fill}\n />\n </g>\n {callout}\n </>\n );\n};\n"]}
|
package/lib-amd/version.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
define(["require", "exports", "@fluentui/set-version"], function (require, exports, set_version_1) {
|
|
2
2
|
"use strict";
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
-
set_version_1.setVersion('@fluentui/react-charting', '5.9.
|
|
4
|
+
set_version_1.setVersion('@fluentui/react-charting', '5.9.35');
|
|
5
5
|
});
|
|
6
6
|
//# sourceMappingURL=version.js.map
|
package/lib-amd/version.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.js","sourceRoot":"../src/","sources":["version.ts"],"names":[],"mappings":";;;IAGA,wBAAU,CAAC,0BAA0B,EAAE,QAAQ,CAAC,CAAC","sourcesContent":["// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/react-charting', '5.9.
|
|
1
|
+
{"version":3,"file":"version.js","sourceRoot":"../src/","sources":["version.ts"],"names":[],"mappings":";;;IAGA,wBAAU,CAAC,0BAA0B,EAAE,QAAQ,CAAC,CAAC","sourcesContent":["// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/react-charting', '5.9.35');"]}
|
|
@@ -15,7 +15,9 @@ var EventsAnnotation = function (props) {
|
|
|
15
15
|
var axisRange = props.scale.range();
|
|
16
16
|
var lineDefs = props.events.map(function (e) { return (tslib_1.__assign(tslib_1.__assign({}, e), { x: props.scale(e.date) })); });
|
|
17
17
|
lineDefs.sort(function (e1, e2) { return +e1.date - +e2.date; });
|
|
18
|
-
var
|
|
18
|
+
var darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)');
|
|
19
|
+
var fill = darkThemeMq.matches ? 'rgb(255,255,255)' : props.strokeColor;
|
|
20
|
+
var lines = uniqBy(lineDefs, function (x) { return x.date.toString(); }).map(function (x, i) { return (React.createElement("line", { key: i, x1: x.x, x2: x.x, y1: lineTopY, y2: props.chartYBottom, stroke: fill, strokeDasharray: "8" })); });
|
|
19
21
|
var labelLinks = calculateLabels(lineDefs, textWidth + textPadding, axisRange[1], axisRange[0]).map(function (x, i) { return (React.createElement(LabelLink_1.LabelLink, tslib_1.__assign({ key: i }, {
|
|
20
22
|
lineDefs: lineDefs,
|
|
21
23
|
labelDef: x,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EventAnnotation.js","sourceRoot":"../src/","sources":["components/LineChart/eventAnnotation/EventAnnotation.tsx"],"names":[],"mappings":";;;;AAAA,6BAA+B;AAE/B,2DAA0D;AAC1D,yCAA6D;AAStD,IAAM,gBAAgB,GAA0D,UAAA,KAAK;IAC1F,IAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC;IAC5D,IAAM,KAAK,GAAG,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC;IACnC,IAAM,QAAQ,GAAG,KAAK,GAAG,CAAC,CAAC;IAC3B,IAAM,WAAW,GAAG,CAAC,CAAC;IACtB,IAAM,UAAU,GAAG,EAAE,CAAC;IACtB,IAAM,QAAQ,GAAG,MAAM,CAAC;IACxB,IAAM,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IAEtC,IAAM,QAAQ,GAAe,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,UAAA,CAAC,IAAI,OAAA,uCAAM,CAAC,KAAE,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,IAAG,EAAlC,CAAkC,CAAC,CAAC;IAEvF,QAAQ,CAAC,IAAI,CAAC,UAAC,EAAE,EAAE,EAAE,IAAK,OAAA,CAAC,EAAE,CAAC,IAAI,GAAG,CAAC,EAAE,CAAC,IAAI,EAAnB,CAAmB,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"EventAnnotation.js","sourceRoot":"../src/","sources":["components/LineChart/eventAnnotation/EventAnnotation.tsx"],"names":[],"mappings":";;;;AAAA,6BAA+B;AAE/B,2DAA0D;AAC1D,yCAA6D;AAStD,IAAM,gBAAgB,GAA0D,UAAA,KAAK;IAC1F,IAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC;IAC5D,IAAM,KAAK,GAAG,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC;IACnC,IAAM,QAAQ,GAAG,KAAK,GAAG,CAAC,CAAC;IAC3B,IAAM,WAAW,GAAG,CAAC,CAAC;IACtB,IAAM,UAAU,GAAG,EAAE,CAAC;IACtB,IAAM,QAAQ,GAAG,MAAM,CAAC;IACxB,IAAM,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IAEtC,IAAM,QAAQ,GAAe,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,UAAA,CAAC,IAAI,OAAA,uCAAM,CAAC,KAAE,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,IAAG,EAAlC,CAAkC,CAAC,CAAC;IAEvF,QAAQ,CAAC,IAAI,CAAC,UAAC,EAAE,EAAE,EAAE,IAAK,OAAA,CAAC,EAAE,CAAC,IAAI,GAAG,CAAC,EAAE,CAAC,IAAI,EAAnB,CAAmB,CAAC,CAAC;IAC/C,IAAM,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC;IACtE,IAAM,IAAI,GAAuB,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,KAAK,CAAC,WAAW,CAAC;IAE9F,IAAM,KAAK,GAAG,MAAM,CAAC,QAAQ,EAAE,UAAA,CAAC,IAAI,OAAA,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAjB,CAAiB,CAAC,CAAC,GAAG,CAAC,UAAC,CAAC,EAAE,CAAC,IAAK,OAAA,CACnE,8BAAM,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,CAAC,YAAY,EAAE,MAAM,EAAE,IAAI,EAAE,eAAe,EAAC,GAAG,GAAG,CAC3G,EAFoE,CAEpE,CAAC,CAAC;IAEH,IAAM,UAAU,GAAG,eAAe,CAAC,QAAQ,EAAE,SAAS,GAAG,WAAW,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,UAAC,CAAC,EAAE,CAAC,IAAK,OAAA,CAC9G,oBAAC,qBAAS,qBACR,GAAG,EAAE,CAAC,IACF;QACF,QAAQ,UAAA;QACR,QAAQ,EAAE,CAAC;QACX,KAAK,OAAA;QACL,SAAS,WAAA;QACT,cAAc,EAAE,UAAU;QAC1B,YAAY,EAAE,QAAQ;QACtB,SAAS,EAAE,KAAK,CAAC,UAAU;QAC3B,WAAW,EAAE,KAAK,CAAC,WAAW;KAC/B,EACD,CACH,EAd+G,CAc/G,CAAC,CAAC;IAEH,OAAO,CACL;QACG,KAAK;QACL,UAAU,CACV,CACJ,CAAC;AACJ,CAAC,CAAC;AAzCW,QAAA,gBAAgB,oBAyC3B;AAEF,SAAS,eAAe,CAAC,QAAoB,EAAE,SAAiB,EAAE,IAAY,EAAE,IAAY;IAC1F,IAAM,cAAc,GAAG,UAAC,KAAa,EAAE,UAAkB;QACvD,cAAc;QACd,IAAI,UAAU,KAAK,QAAQ,CAAC,MAAM,EAAE;YAClC,OAAO,EAAE,CAAC;SACX;QAEO,IAAA,CAAC,GAAK,QAAQ,CAAC,UAAU,CAAC,EAAzB,CAA0B;QACnC,IAAM,aAAa,GAAG,CAAC,GAAG,SAAS,CAAC;QAEpC,qCAAqC;QACrC,IAAI,CAAC,GAAG,KAAK,EAAE;YACb,OAAO,EAAE,CAAC;SACX;QAED,cAAc;QACd,IAAI,UAAU,KAAK,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;YACtC,IAAI,KAAK,GAAG,aAAa,EAAE;gBACzB,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;aAC/D;iBAAM,IAAI,CAAC,GAAG,SAAS,GAAG,IAAI,EAAE;gBAC/B,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;aACjE;YAED,OAAO,EAAE,CAAC;SACX;QAED,IAAI,KAAK,GAAG,aAAa,EAAE;YACzB,qBAAqB;YACrB,OAAO,SAAS,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;SACrC;aAAM;YACL,sBAAsB;YACtB,OAAO,SAAS,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;SACvC;IACH,CAAC,CAAC;IAEF,IAAM,SAAS,GAAG,UAAC,UAAkB,EAAE,MAAuB;QAC5D,IAAM,EAAE,GAAG,MAAM,KAAK,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;QAE1F,IAAI,GAAG,GAAG,qBAAS,CACjB,QAAQ,EACR,UAAA,EAAE,IAAI,OAAA,EAAE,CAAC,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC,GAAG,SAAS,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC,GAAG,SAAS,GAAG,IAAI,CAAC,EAAhE,CAAgE,EACtE,UAAU,GAAG,CAAC,CACf,CAAC;QACF,IAAI,GAAG,KAAK,CAAC,CAAC,EAAE;YACd,GAAG,GAAG,QAAQ,CAAC,MAAM,CAAC;SACvB;QAED,IAAM,aAAa,GAAa,EAAE,CAAC;QACnC,KAAK,IAAI,CAAC,GAAG,UAAU,EAAE,CAAC,GAAG,GAAG,EAAE,CAAC,EAAE,EAAE;YACrC,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;SACvB;QACD,IAAM,IAAI,GAAG,cAAc,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC;QAErC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,MAAM,QAAA,EAAE,aAAa,eAAA,EAAE,CAAC,CAAC;QACnE,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;IAEF,OAAO,cAAc,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;AACjC,CAAC;AAED,mGAAmG;AACnG,SAAS,MAAM,CAAI,GAAQ,EAAE,QAA0B;IACrD,IAAM,IAAI,GAAa,EAAE,CAAC;IAC1B,IAAM,MAAM,GAAQ,EAAE,CAAC;IACvB,KAAgB,UAAG,EAAH,WAAG,EAAH,iBAAG,EAAH,IAAG,EAAE;QAAhB,IAAM,CAAC,YAAA;QACV,IAAM,IAAI,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;QACzB,IAAI,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE;YAC7B,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;YACf,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SACjB;KACF;IACD,OAAO,MAAM,CAAC;AAChB,CAAC","sourcesContent":["import * as React from 'react';\nimport { ScaleTime } from 'd3-scale';\nimport { findIndex } from '@fluentui/react/lib/Utilities';\nimport { ILineDef, LabelLink, ILabelDef } from './LabelLink';\nimport { IEventsAnnotationProps } from '../LineChart.types';\n\ninterface IEventsAnnotationExtendProps extends IEventsAnnotationProps {\n scale: ScaleTime<number, number>;\n chartYBottom: number;\n chartYTop: number;\n}\n\nexport const EventsAnnotation: React.FunctionComponent<IEventsAnnotationExtendProps> = props => {\n const textWidth = props.labelWidth ? props.labelWidth : 105;\n const textY = props.chartYTop - 20;\n const lineTopY = textY + 7;\n const textPadding = 5;\n const lineHeight = 18;\n const fontSize = '10pt';\n const axisRange = props.scale.range();\n\n const lineDefs: ILineDef[] = props.events.map(e => ({ ...e, x: props.scale(e.date) }));\n\n lineDefs.sort((e1, e2) => +e1.date - +e2.date);\n const darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)');\n const fill: string | undefined = darkThemeMq.matches ? 'rgb(255,255,255)' : props.strokeColor;\n\n const lines = uniqBy(lineDefs, x => x.date.toString()).map((x, i) => (\n <line key={i} x1={x.x} x2={x.x} y1={lineTopY} y2={props.chartYBottom} stroke={fill} strokeDasharray=\"8\" />\n ));\n\n const labelLinks = calculateLabels(lineDefs, textWidth + textPadding, axisRange[1], axisRange[0]).map((x, i) => (\n <LabelLink\n key={i}\n {...{\n lineDefs,\n labelDef: x,\n textY,\n textWidth,\n textLineHeight: lineHeight,\n textFontSize: fontSize,\n textColor: props.labelColor,\n mergedLabel: props.mergedLabel,\n }}\n />\n ));\n\n return (\n <>\n {lines}\n {labelLinks}\n </>\n );\n};\n\nfunction calculateLabels(lineDefs: ILineDef[], textWidth: number, maxX: number, minX: number): ILabelDef[] {\n const calculateLabel = (lastX: number, currentIdx: number): ILabelDef[] => {\n // base case 1\n if (currentIdx === lineDefs.length) {\n return [];\n }\n\n const { x } = lineDefs[currentIdx];\n const leftXBoundary = x - textWidth;\n\n // cannot render on top of other text\n if (x < lastX) {\n return [];\n }\n\n // base case 2\n if (currentIdx === lineDefs.length - 1) {\n if (lastX < leftXBoundary) {\n return [{ x: x, anchor: 'end', aggregatedIdx: [currentIdx] }];\n } else if (x + textWidth < maxX) {\n return [{ x: x, anchor: 'start', aggregatedIdx: [currentIdx] }];\n }\n\n return [];\n }\n\n if (lastX < leftXBoundary) {\n // label on left side\n return backtrack(currentIdx, 'end');\n } else {\n // label on right side\n return backtrack(currentIdx, 'start');\n }\n };\n\n const backtrack = (currentIdx: number, anchor: 'start' | 'end'): ILabelDef[] => {\n const bd = anchor === 'end' ? lineDefs[currentIdx].x : lineDefs[currentIdx].x + textWidth;\n\n let idx = findIndex(\n lineDefs,\n ds => ds.x > bd && (ds.x - textWidth >= bd || ds.x + textWidth < maxX),\n currentIdx + 1,\n );\n if (idx === -1) {\n idx = lineDefs.length;\n }\n\n const aggregatedIdx: number[] = [];\n for (let i = currentIdx; i < idx; i++) {\n aggregatedIdx.push(i);\n }\n const next = calculateLabel(bd, idx);\n\n next.unshift({ x: lineDefs[currentIdx].x, anchor, aggregatedIdx });\n return next;\n };\n\n return calculateLabel(minX, 0);\n}\n\n/** Get unique items of `arr`, comparing based on the result of calling `iteratee` on each item. */\nfunction uniqBy<T>(arr: T[], iteratee: (x: T) => string): T[] {\n const seen: string[] = [];\n const result: T[] = [];\n for (const x of arr) {\n const comp = iteratee(x);\n if (seen.indexOf(comp) === -1) {\n result.push(x);\n seen.push(comp);\n }\n }\n return result;\n}\n"]}
|
|
@@ -24,14 +24,13 @@ var LabelLink = function (props) {
|
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
26
|
var text;
|
|
27
|
-
var
|
|
27
|
+
var darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)');
|
|
28
|
+
var fill = darkThemeMq.matches ? 'rgb(255,255,255)' : props.textColor;
|
|
28
29
|
if (props.labelDef.aggregatedIdx.length === 1) {
|
|
29
30
|
text = props.lineDefs[props.labelDef.aggregatedIdx[0]].event;
|
|
30
|
-
fill = props.textColor;
|
|
31
31
|
}
|
|
32
32
|
else {
|
|
33
33
|
text = props.mergedLabel(props.labelDef.aggregatedIdx.length);
|
|
34
|
-
fill = props.textColor;
|
|
35
34
|
}
|
|
36
35
|
return (React.createElement(React.Fragment, null,
|
|
37
36
|
React.createElement("g", { ref: gRef, onClick: onClick, "data-is-focusable": true, style: { cursor: 'pointer' } },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LabelLink.js","sourceRoot":"../src/","sources":["components/LineChart/eventAnnotation/LabelLink.tsx"],"names":[],"mappings":";;;AAAA,6BAA+B;AAC/B,yCAA+E;AAE/E,qCAAoC;AAuB7B,IAAM,SAAS,GAA6C,UAAA,KAAK;IACtE,IAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAc,IAAI,CAAC,CAAC;IACvC,IAAA,KAA0B,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAA9C,QAAQ,QAAA,EAAE,WAAW,QAAyB,CAAC;IACtD,IAAM,SAAS,GAAG,cAAM,OAAA,WAAW,CAAC,KAAK,CAAC,EAAlB,CAAkB,CAAC;IAC3C,IAAM,OAAO,GAAG,cAAM,OAAA,WAAW,CAAC,IAAI,CAAC,EAAjB,CAAiB,CAAC;IACxC,IAAM,YAAY,GAAG,UAAC,CAAsC,IAAK,OAAA,kDAAwB,IAAI,IAAG,CAAC,IAAI,CAAC,EAAE,CAAO,EAA9C,CAA8C,CAAC;IAEhH,IAAI,OAAO,GAAoB,IAAI,CAAC;IACpC,IAAI,QAAQ,EAAE;QACZ,IAAM,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,UAAA,CAAC,IAAI,OAAA,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,YAAa,EAA/B,CAA+B,CAAC,CAAC,MAAM,CAAC,UAAA,CAAC,IAAI,OAAA,CAAC,CAAC,CAAC,EAAH,CAAG,CAAC,CAAC;QACtG,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YACpB,OAAO,GAAG,CACR,oBAAC,eAAO,IACN,MAAM,EAAE,IAAI,CAAC,OAAO;gBACpB,6CAA6C;gBAC7C,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,IAAI,EACrB,IAAI,EAAC,QAAQ;gBAEb,oBAAC,iBAAS,IAAC,oBAAoB,EAAE,IAAI,EAAE,SAAS,EAAE,0BAAkB,CAAC,QAAQ;oBAC3E,oBAAC,YAAI,IACH,KAAK,EAAE,KAAK;wBACZ,6CAA6C;wBAC7C,YAAY,EAAE,YAAY,GAC1B,CACQ,CACJ,CACX,CAAC;SACH;KACF;IAED,IAAI,IAAY,CAAC;IACjB,IAAI,
|
|
1
|
+
{"version":3,"file":"LabelLink.js","sourceRoot":"../src/","sources":["components/LineChart/eventAnnotation/LabelLink.tsx"],"names":[],"mappings":";;;AAAA,6BAA+B;AAC/B,yCAA+E;AAE/E,qCAAoC;AAuB7B,IAAM,SAAS,GAA6C,UAAA,KAAK;IACtE,IAAM,IAAI,GAAG,KAAK,CAAC,MAAM,CAAc,IAAI,CAAC,CAAC;IACvC,IAAA,KAA0B,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAA9C,QAAQ,QAAA,EAAE,WAAW,QAAyB,CAAC;IACtD,IAAM,SAAS,GAAG,cAAM,OAAA,WAAW,CAAC,KAAK,CAAC,EAAlB,CAAkB,CAAC;IAC3C,IAAM,OAAO,GAAG,cAAM,OAAA,WAAW,CAAC,IAAI,CAAC,EAAjB,CAAiB,CAAC;IACxC,IAAM,YAAY,GAAG,UAAC,CAAsC,IAAK,OAAA,kDAAwB,IAAI,IAAG,CAAC,IAAI,CAAC,EAAE,CAAO,EAA9C,CAA8C,CAAC;IAEhH,IAAI,OAAO,GAAoB,IAAI,CAAC;IACpC,IAAI,QAAQ,EAAE;QACZ,IAAM,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,UAAA,CAAC,IAAI,OAAA,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,YAAa,EAA/B,CAA+B,CAAC,CAAC,MAAM,CAAC,UAAA,CAAC,IAAI,OAAA,CAAC,CAAC,CAAC,EAAH,CAAG,CAAC,CAAC;QACtG,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YACpB,OAAO,GAAG,CACR,oBAAC,eAAO,IACN,MAAM,EAAE,IAAI,CAAC,OAAO;gBACpB,6CAA6C;gBAC7C,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,IAAI,EACrB,IAAI,EAAC,QAAQ;gBAEb,oBAAC,iBAAS,IAAC,oBAAoB,EAAE,IAAI,EAAE,SAAS,EAAE,0BAAkB,CAAC,QAAQ;oBAC3E,oBAAC,YAAI,IACH,KAAK,EAAE,KAAK;wBACZ,6CAA6C;wBAC7C,YAAY,EAAE,YAAY,GAC1B,CACQ,CACJ,CACX,CAAC;SACH;KACF;IAED,IAAI,IAAY,CAAC;IACjB,IAAM,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC;IACtE,IAAM,IAAI,GAAuB,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC;IAC5F,IAAI,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,KAAK,CAAC,EAAE;QAC7C,IAAI,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;KAC9D;SAAM;QACL,IAAI,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;KAC/D;IAED,OAAO,CACL;QACE,2BAAG,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,uBAAqB,IAAI,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE;YACnF,oBAAC,iBAAO,IACN,IAAI,EAAE,IAAI,EACV,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,EACnB,CAAC,EAAE,KAAK,CAAC,KAAK,EACd,KAAK,EAAE,KAAK,CAAC,SAAS,EACtB,UAAU,EAAE,KAAK,CAAC,cAAc,EAChC,UAAU,EAAE,KAAK,CAAC,QAAQ,CAAC,MAAM,EACjC,QAAQ,EAAE,KAAK,CAAC,YAAY,EAC5B,IAAI,EAAE,IAAI,GACV,CACA;QACH,OAAO,CACP,CACJ,CAAC;AACJ,CAAC,CAAC;AAzDW,QAAA,SAAS,aAyDpB","sourcesContent":["import * as React from 'react';\nimport { Callout, FocusZone, FocusZoneDirection, List } from '@fluentui/react';\nimport { IEventAnnotation } from '../../../types/IEventAnnotation';\nimport { Textbox } from './Textbox';\n\nexport interface ILineDef extends IEventAnnotation {\n x: number;\n}\n\nexport interface ILabelDef {\n x: number;\n aggregatedIdx: number[];\n anchor: 'start' | 'end';\n}\n\ninterface ILabelLinkProps {\n lineDefs: ILineDef[];\n labelDef: ILabelDef;\n textY: number;\n textWidth: number;\n textLineHeight: number;\n textFontSize: string;\n textColor: string;\n mergedLabel: (count: number) => string;\n}\n\nexport const LabelLink: React.FunctionComponent<ILabelLinkProps> = props => {\n const gRef = React.useRef<SVGGElement>(null);\n const [showCard, setShowCard] = React.useState(false);\n const onDismiss = () => setShowCard(false);\n const onClick = () => setShowCard(true);\n const onRenderCell = (i: (() => React.ReactNode) | undefined) => <div data-is-focusable={true}>{i && i()}</div>;\n\n let callout: React.ReactNode = null;\n if (showCard) {\n const cards = props.labelDef.aggregatedIdx.map(i => props.lineDefs[i].onRenderCard!).filter(c => !!c);\n if (cards.length > 0) {\n callout = (\n <Callout\n target={gRef.current}\n // eslint-disable-next-line react/jsx-no-bind\n onDismiss={onDismiss}\n setInitialFocus={true}\n role=\"dialog\"\n >\n <FocusZone isCircularNavigation={true} direction={FocusZoneDirection.vertical}>\n <List<() => React.ReactNode>\n items={cards}\n // eslint-disable-next-line react/jsx-no-bind\n onRenderCell={onRenderCell}\n />\n </FocusZone>\n </Callout>\n );\n }\n }\n\n let text: string;\n const darkThemeMq = window.matchMedia('(prefers-color-scheme: dark)');\n const fill: string | undefined = darkThemeMq.matches ? 'rgb(255,255,255)' : props.textColor;\n if (props.labelDef.aggregatedIdx.length === 1) {\n text = props.lineDefs[props.labelDef.aggregatedIdx[0]].event;\n } else {\n text = props.mergedLabel(props.labelDef.aggregatedIdx.length);\n }\n\n return (\n <>\n <g ref={gRef} onClick={onClick} data-is-focusable={true} style={{ cursor: 'pointer' }}>\n <Textbox\n text={text}\n x={props.labelDef.x}\n y={props.textY}\n width={props.textWidth}\n lineHeight={props.textLineHeight}\n textAnchor={props.labelDef.anchor}\n fontSize={props.textFontSize}\n fill={fill}\n />\n </g>\n {callout}\n </>\n );\n};\n"]}
|
package/lib-commonjs/version.js
CHANGED
|
@@ -3,5 +3,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
// Do not modify this file; it is generated as part of publish.
|
|
4
4
|
// The checked in version is a placeholder only and will not be updated.
|
|
5
5
|
var set_version_1 = require("@fluentui/set-version");
|
|
6
|
-
set_version_1.setVersion('@fluentui/react-charting', '5.9.
|
|
6
|
+
set_version_1.setVersion('@fluentui/react-charting', '5.9.35');
|
|
7
7
|
//# sourceMappingURL=version.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.js","sourceRoot":"../src/","sources":["version.ts"],"names":[],"mappings":";;AAAA,+DAA+D;AAC/D,wEAAwE;AACxE,qDAAmD;AACnD,wBAAU,CAAC,0BAA0B,EAAE,QAAQ,CAAC,CAAC","sourcesContent":["// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/react-charting', '5.9.
|
|
1
|
+
{"version":3,"file":"version.js","sourceRoot":"../src/","sources":["version.ts"],"names":[],"mappings":";;AAAA,+DAA+D;AAC/D,wEAAwE;AACxE,qDAAmD;AACnD,wBAAU,CAAC,0BAA0B,EAAE,QAAQ,CAAC,CAAC","sourcesContent":["// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/react-charting', '5.9.35');"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-charting",
|
|
3
|
-
"version": "5.9.
|
|
3
|
+
"version": "5.9.35",
|
|
4
4
|
"description": "Experimental React charting components for building experiences for Microsoft 365.",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -28,13 +28,13 @@
|
|
|
28
28
|
},
|
|
29
29
|
"devDependencies": {
|
|
30
30
|
"@fluentui/eslint-plugin": "*",
|
|
31
|
-
"@fluentui/react": "^8.68.
|
|
31
|
+
"@fluentui/react": "^8.68.4",
|
|
32
32
|
"@types/react-addons-test-utils": "0.14.18",
|
|
33
33
|
"@fluentui/scripts": "^1.0.0",
|
|
34
34
|
"@fluentui/jest-serializer-merge-styles": "^8.0.19"
|
|
35
35
|
},
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@fluentui/react-focus": "^8.
|
|
37
|
+
"@fluentui/react-focus": "^8.6.0",
|
|
38
38
|
"@microsoft/load-themed-styles": "^1.10.26",
|
|
39
39
|
"@types/d3-array": "1.2.1",
|
|
40
40
|
"@types/d3-axis": "1.0.10",
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
"tslib": "^2.1.0"
|
|
57
57
|
},
|
|
58
58
|
"peerDependencies": {
|
|
59
|
-
"@fluentui/react": "^8.68.
|
|
59
|
+
"@fluentui/react": "^8.68.4",
|
|
60
60
|
"@types/react": ">=16.8.0 <18.0.0",
|
|
61
61
|
"@types/react-dom": ">=16.8.0 <18.0.0",
|
|
62
62
|
"react": ">=16.8.0 <18.0.0",
|