@cloudscape-design/components 3.0.622 → 3.0.624
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/area-chart/chart-container.js +11 -11
- package/area-chart/chart-container.js.map +1 -1
- package/area-chart/internal.d.ts.map +1 -1
- package/area-chart/internal.js +3 -0
- package/area-chart/internal.js.map +1 -1
- package/area-chart/model/compute-chart-props.d.ts +4 -3
- package/area-chart/model/compute-chart-props.d.ts.map +1 -1
- package/area-chart/model/compute-chart-props.js +5 -2
- package/area-chart/model/compute-chart-props.js.map +1 -1
- package/area-chart/model/index.d.ts +1 -1
- package/area-chart/model/index.d.ts.map +1 -1
- package/area-chart/model/index.js.map +1 -1
- package/area-chart/model/use-chart-model.d.ts +2 -1
- package/area-chart/model/use-chart-model.d.ts.map +1 -1
- package/area-chart/model/use-chart-model.js +23 -14
- package/area-chart/model/use-chart-model.js.map +1 -1
- package/container/use-sticky-header.js +1 -1
- package/container/use-sticky-header.js.map +1 -1
- package/form-field/internal.d.ts.map +1 -1
- package/form-field/internal.js +3 -2
- package/form-field/internal.js.map +1 -1
- package/internal/components/cartesian-chart/{bottom-labels.d.ts → block-end-labels.d.ts} +5 -5
- package/internal/components/cartesian-chart/block-end-labels.d.ts.map +1 -0
- package/internal/components/cartesian-chart/{bottom-labels.js → block-end-labels.js} +5 -5
- package/internal/components/cartesian-chart/block-end-labels.js.map +1 -0
- package/internal/components/cartesian-chart/{left-labels.d.ts → inline-start-labels.d.ts} +4 -4
- package/internal/components/cartesian-chart/inline-start-labels.d.ts.map +1 -0
- package/internal/components/cartesian-chart/{left-labels.js → inline-start-labels.js} +9 -6
- package/internal/components/cartesian-chart/inline-start-labels.js.map +1 -0
- package/internal/components/cartesian-chart/labels-measure.js +2 -2
- package/internal/components/cartesian-chart/labels-measure.js.map +1 -1
- package/internal/components/cartesian-chart/styles.css.js +27 -27
- package/internal/components/cartesian-chart/styles.scoped.css +31 -31
- package/internal/components/cartesian-chart/styles.selectors.js +27 -27
- package/internal/components/chart-legend/index.d.ts.map +1 -1
- package/internal/components/chart-legend/index.js +7 -10
- package/internal/components/chart-legend/index.js.map +1 -1
- package/internal/components/responsive-text/index.d.ts +1 -1
- package/internal/components/responsive-text/index.d.ts.map +1 -1
- package/internal/components/responsive-text/index.js +9 -4
- package/internal/components/responsive-text/index.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/environment.json +1 -1
- package/internal/generated/theming/index.cjs +4 -0
- package/internal/generated/theming/index.cjs.d.ts +16 -0
- package/internal/generated/theming/index.d.ts +16 -0
- package/internal/generated/theming/index.js +4 -0
- package/internal/manifest.json +1 -1
- package/internal/utils/handle-key.d.ts +1 -1
- package/internal/utils/handle-key.d.ts.map +1 -1
- package/internal/utils/handle-key.js +1 -1
- package/internal/utils/handle-key.js.map +1 -1
- package/mixed-line-bar-chart/chart-container.d.ts.map +1 -1
- package/mixed-line-bar-chart/chart-container.js +12 -12
- package/mixed-line-bar-chart/chart-container.js.map +1 -1
- package/package.json +1 -1
- package/pie-chart/responsive-text.d.ts.map +1 -1
- package/pie-chart/responsive-text.js +5 -1
- package/pie-chart/responsive-text.js.map +1 -1
- package/internal/components/cartesian-chart/bottom-labels.d.ts.map +0 -1
- package/internal/components/cartesian-chart/bottom-labels.js.map +0 -1
- package/internal/components/cartesian-chart/left-labels.d.ts.map +0 -1
- package/internal/components/cartesian-chart/left-labels.js.map +0 -1
|
@@ -5,8 +5,8 @@ import { useMergeRefs } from '../internal/hooks/use-merge-refs';
|
|
|
5
5
|
import ChartPlot from '../internal/components/chart-plot';
|
|
6
6
|
import AxisLabel from '../internal/components/cartesian-chart/axis-label';
|
|
7
7
|
import LabelsMeasure from '../internal/components/cartesian-chart/labels-measure';
|
|
8
|
-
import
|
|
9
|
-
import
|
|
8
|
+
import InlineStartLabels from '../internal/components/cartesian-chart/inline-start-labels';
|
|
9
|
+
import BlockEndLabels, { useBLockEndLabels } from '../internal/components/cartesian-chart/block-end-labels';
|
|
10
10
|
import EmphasizedBaseline from '../internal/components/cartesian-chart/emphasized-baseline';
|
|
11
11
|
import AreaDataSeries from './elements/data-series';
|
|
12
12
|
import AreaChartPopover from './elements/chart-popover';
|
|
@@ -17,20 +17,20 @@ import useContainerWidth from '../internal/utils/use-container-width';
|
|
|
17
17
|
import { useSelector } from './async-store';
|
|
18
18
|
import { CartesianChartContainer } from '../internal/components/cartesian-chart/chart-container';
|
|
19
19
|
const DEFAULT_CHART_WIDTH = 500;
|
|
20
|
-
const
|
|
21
|
-
const
|
|
20
|
+
const INLINE_START_LABELS_MARGIN = 16;
|
|
21
|
+
const BLOCK_END_LABELS_OFFSET = 12;
|
|
22
22
|
export default memo(ChartContainer);
|
|
23
23
|
function ChartContainer({ model, autoWidth, xTitle, yTitle, detailPopoverSize, detailPopoverFooter, ariaLabel, ariaLabelledby, ariaDescription, i18nStrings: { xTickFormatter: deprecatedXTickFormatter, yTickFormatter: deprecatedYTickFormatter, detailTotalFormatter: deprecatedDetailTotalFormatter, detailTotalLabel, chartAriaRoleDescription, xAxisAriaRoleDescription, yAxisAriaRoleDescription, detailPopoverDismissAriaLabel, } = {}, fitHeight, minHeight, xTickFormatter = deprecatedXTickFormatter, yTickFormatter = deprecatedYTickFormatter, detailTotalFormatter = deprecatedDetailTotalFormatter, }) {
|
|
24
|
-
const [
|
|
24
|
+
const [inlineStartLabelsWidth, setInlineStartLabelsWidth] = useState(0);
|
|
25
25
|
const [containerWidth, containerWidthRef] = useContainerWidth(DEFAULT_CHART_WIDTH);
|
|
26
|
-
const
|
|
27
|
-
const
|
|
26
|
+
const maxInlineStartLabelsWidth = Math.round(containerWidth / 2);
|
|
27
|
+
const blockEndLabelsProps = useBLockEndLabels({
|
|
28
28
|
ticks: model.computed.xTicks,
|
|
29
29
|
scale: model.computed.xScale,
|
|
30
30
|
tickFormatter: xTickFormatter,
|
|
31
31
|
});
|
|
32
32
|
// Calculate the width of the plot area and tell it to the parent.
|
|
33
|
-
const plotWidth = Math.max(0, containerWidth -
|
|
33
|
+
const plotWidth = Math.max(0, containerWidth - inlineStartLabelsWidth - INLINE_START_LABELS_MARGIN);
|
|
34
34
|
useEffect(() => {
|
|
35
35
|
autoWidth(plotWidth);
|
|
36
36
|
}, [autoWidth, plotWidth]);
|
|
@@ -46,11 +46,11 @@ function ChartContainer({ model, autoWidth, xTitle, yTitle, detailPopoverSize, d
|
|
|
46
46
|
const isPointHighlighted = model.interactions.get().highlightedPoint !== null;
|
|
47
47
|
const highlightedX = useSelector(model.interactions, state => state.highlightedX);
|
|
48
48
|
const detailPopoverFooterContent = useMemo(() => (detailPopoverFooter && highlightedX ? detailPopoverFooter(highlightedX[0].x) : null), [detailPopoverFooter, highlightedX]);
|
|
49
|
-
return (React.createElement(CartesianChartContainer, { ref: mergedRef, minHeight: minHeight +
|
|
49
|
+
return (React.createElement(CartesianChartContainer, { ref: mergedRef, minHeight: minHeight + blockEndLabelsProps.height, fitHeight: !!fitHeight, leftAxisLabel: React.createElement(AxisLabel, { axis: "y", position: "left", title: yTitle }), leftAxisLabelMeasure: React.createElement(LabelsMeasure, { scale: model.computed.yScale, ticks: model.computed.yTicks, tickFormatter: yTickFormatter, autoWidth: setInlineStartLabelsWidth, maxLabelsWidth: maxInlineStartLabelsWidth }), bottomAxisLabel: React.createElement(AxisLabel, { axis: "x", position: "bottom", title: xTitle }), chartPlot: React.createElement(ChartPlot, { ref: model.refs.plot, width: "100%", height: fitHeight ? `calc(100% - ${blockEndLabelsProps.height}px)` : model.height, offsetBottom: blockEndLabelsProps.height, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, ariaDescription: ariaDescription, ariaRoleDescription: chartAriaRoleDescription, activeElementKey: !(highlightDetails === null || highlightDetails === void 0 ? void 0 : highlightDetails.isPopoverPinned) && (highlightDetails === null || highlightDetails === void 0 ? void 0 : highlightDetails.activeLabel), activeElementRef: isPointHighlighted ? highlightedPointRef : model.refs.verticalMarker, activeElementFocusOffset: isPointHighlighted ? 3 : { x: 8, y: 0 }, isClickable: !(highlightDetails === null || highlightDetails === void 0 ? void 0 : highlightDetails.isPopoverPinned), onMouseMove: model.handlers.onSVGMouseMove, onMouseOut: model.handlers.onSVGMouseOut, onClick: model.handlers.onSVGMouseDown, onKeyDown: model.handlers.onSVGKeyDown, onApplicationFocus: model.handlers.onApplicationFocus, onApplicationBlur: model.handlers.onApplicationBlur },
|
|
50
50
|
React.createElement("line", { ref: model.refs.plotMeasure, x1: "0", x2: "0", y1: "0", y2: "100%", stroke: "transparent", strokeWidth: 1, style: { pointerEvents: 'none' } }),
|
|
51
|
-
React.createElement(
|
|
51
|
+
React.createElement(InlineStartLabels, { plotWidth: model.width, plotHeight: model.height, scale: model.computed.yScale, ticks: model.computed.yTicks, tickFormatter: yTickFormatter, title: yTitle, ariaRoleDescription: yAxisAriaRoleDescription, maxLabelsWidth: maxInlineStartLabelsWidth }),
|
|
52
52
|
React.createElement(AreaDataSeries, { model: model }),
|
|
53
|
-
React.createElement(
|
|
53
|
+
React.createElement(BlockEndLabels, Object.assign({}, blockEndLabelsProps, { width: model.width, height: model.height, scale: model.computed.xScale, title: xTitle, ariaRoleDescription: xAxisAriaRoleDescription, offsetLeft: inlineStartLabelsWidth + BLOCK_END_LABELS_OFFSET, offsetRight: BLOCK_END_LABELS_OFFSET })),
|
|
54
54
|
React.createElement(EmphasizedBaseline, { width: model.width, height: model.height, scale: model.computed.yScale }),
|
|
55
55
|
React.createElement(AreaVerticalMarker, { model: model }),
|
|
56
56
|
React.createElement(AreaHighlightedPoint, { ref: highlightedPointRef, model: model, ariaLabel: highlightDetails === null || highlightDetails === void 0 ? void 0 : highlightDetails.activeLabel })), popover: React.createElement(AreaChartPopover, { model: model, highlightDetails: highlightDetails, dismissAriaLabel: detailPopoverDismissAriaLabel, size: detailPopoverSize, footer: detailPopoverFooterContent, onBlur: model.handlers.onApplicationBlur }) }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chart-container.js","sourceRoot":"","sources":["../../../src/area-chart/chart-container.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAEhE,OAAO,SAAS,MAAM,mCAAmC,CAAC;AAC1D,OAAO,SAAS,MAAM,mDAAmD,CAAC;AAC1E,OAAO,aAAa,MAAM,uDAAuD,CAAC;AAClF,OAAO,UAAU,MAAM,oDAAoD,CAAC;AAC5E,OAAO,YAAY,EAAE,EAAE,eAAe,EAAE,MAAM,sDAAsD,CAAC;AACrG,OAAO,kBAAkB,MAAM,4DAA4D,CAAC;AAG5F,OAAO,cAAc,MAAM,wBAAwB,CAAC;AACpD,OAAO,gBAAgB,MAAM,0BAA0B,CAAC;AACxD,OAAO,oBAAoB,MAAM,8BAA8B,CAAC;AAChE,OAAO,kBAAkB,MAAM,4BAA4B,CAAC;AAE5D,OAAO,mBAAmB,MAAM,kCAAkC,CAAC;AACnE,OAAO,iBAAiB,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,uBAAuB,EAAE,MAAM,wDAAwD,CAAC;AAEjG,MAAM,mBAAmB,GAAG,GAAG,CAAC;AAChC,MAAM,kBAAkB,GAAG,EAAE,CAAC;AAC9B,MAAM,oBAAoB,GAAG,EAAE,CAAC;AAyBhC,eAAe,IAAI,CAAC,cAAc,CAA0B,CAAC;AAE7D,SAAS,cAAc,CAAqC,EAC1D,KAAK,EACL,SAAS,EACT,MAAM,EACN,MAAM,EACN,iBAAiB,EACjB,mBAAmB,EACnB,SAAS,EACT,cAAc,EACd,eAAe,EACf,WAAW,EAAE,EACX,cAAc,EAAE,wBAAwB,EACxC,cAAc,EAAE,wBAAwB,EACxC,oBAAoB,EAAE,8BAA8B,EACpD,gBAAgB,EAChB,wBAAwB,EACxB,wBAAwB,EACxB,wBAAwB,EACxB,6BAA6B,GAC9B,GAAG,EAAE,EACN,SAAS,EACT,SAAS,EACT,cAAc,GAAG,wBAAwB,EACzC,cAAc,GAAG,wBAAwB,EACzC,oBAAoB,GAAG,8BAA8B,GAC9B;IACvB,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAC1D,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,iBAAiB,CAAC,mBAAmB,CAAC,CAAC;IACnF,MAAM,kBAAkB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,GAAG,CAAC,CAAC,CAAC;IAE1D,MAAM,iBAAiB,GAAG,eAAe,CAAC;QACxC,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,MAAM;QAC5B,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,MAAM;QAC5B,aAAa,EAAE,cAA+B;KAC/C,CAAC,CAAC;IAEH,kEAAkE;IAClE,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,cAAc,GAAG,eAAe,GAAG,kBAAkB,CAAC,CAAC;IACrF,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,CAAC,SAAS,CAAC,CAAC;IACvB,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC;IAE3B,MAAM,gBAAgB,GAAG,mBAAmB,CAAC;QAC3C,KAAK;QACL,cAAc;QACd,cAAc;QACd,oBAAoB;QACpB,gBAAgB;KACjB,CAAC,CAAC;IAEH,MAAM,mBAAmB,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAEtD,MAAM,SAAS,GAAG,YAAY,CAAC,iBAAiB,EAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IAExE,MAAM,kBAAkB,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,EAAE,CAAC,gBAAgB,KAAK,IAAI,CAAC;IAE9E,MAAM,YAAY,GAAG,WAAW,CAAC,KAAK,CAAC,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;IAElF,MAAM,0BAA0B,GAAG,OAAO,CACxC,GAAG,EAAE,CAAC,CAAC,mBAAmB,IAAI,YAAY,CAAC,CAAC,CAAC,mBAAmB,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EAC3F,CAAC,mBAAmB,EAAE,YAAY,CAAC,CACpC,CAAC;IAEF,OAAO,CACL,oBAAC,uBAAuB,IACtB,GAAG,EAAE,SAAS,EACd,SAAS,EAAE,SAAS,GAAG,iBAAiB,CAAC,MAAM,EAC/C,SAAS,EAAE,CAAC,CAAC,SAAS,EACtB,aAAa,EAAE,oBAAC,SAAS,IAAC,IAAI,EAAC,GAAG,EAAC,QAAQ,EAAC,MAAM,EAAC,KAAK,EAAE,MAAM,GAAI,EACpE,oBAAoB,EAClB,oBAAC,aAAa,IACZ,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,MAAM,EAC5B,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,MAAM,EAC5B,aAAa,EAAE,cAA+B,EAC9C,SAAS,EAAE,kBAAkB,EAC7B,cAAc,EAAE,kBAAkB,GAClC,EAEJ,eAAe,EAAE,oBAAC,SAAS,IAAC,IAAI,EAAC,GAAG,EAAC,QAAQ,EAAC,QAAQ,EAAC,KAAK,EAAE,MAAM,GAAI,EACxE,SAAS,EACP,oBAAC,SAAS,IACR,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,EACpB,KAAK,EAAC,MAAM,EACZ,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,eAAe,iBAAiB,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,EAC/E,YAAY,EAAE,iBAAiB,CAAC,MAAM,EACtC,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,eAAe,EAAE,eAAe,EAChC,mBAAmB,EAAE,wBAAwB,EAC7C,gBAAgB,EAAE,CAAC,CAAA,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,eAAe,CAAA,KAAI,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,WAAW,CAAA,EACrF,gBAAgB,EAAE,kBAAkB,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,cAAc,EACtF,wBAAwB,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EACjE,WAAW,EAAE,CAAC,CAAA,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,eAAe,CAAA,EAC/C,WAAW,EAAE,KAAK,CAAC,QAAQ,CAAC,cAAc,EAC1C,UAAU,EAAE,KAAK,CAAC,QAAQ,CAAC,aAAa,EACxC,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,cAAc,EACtC,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,YAAY,EACtC,kBAAkB,EAAE,KAAK,CAAC,QAAQ,CAAC,kBAAkB,EACrD,iBAAiB,EAAE,KAAK,CAAC,QAAQ,CAAC,iBAAiB;YAEnD,8BACE,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,WAAW,EAC3B,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,MAAM,EACT,MAAM,EAAC,aAAa,EACpB,WAAW,EAAE,CAAC,EACd,KAAK,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE,GAChC;YAEF,oBAAC,UAAU,IACT,SAAS,EAAE,KAAK,CAAC,KAAK,EACtB,UAAU,EAAE,KAAK,CAAC,MAAM,EACxB,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,MAAM,EAC5B,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,MAAM,EAC5B,aAAa,EAAE,cAAc,EAC7B,KAAK,EAAE,MAAM,EACb,mBAAmB,EAAE,wBAAwB,EAC7C,cAAc,EAAE,kBAAkB,GAClC;YAEF,oBAAC,cAAc,IAAC,KAAK,EAAE,KAAK,GAAI;YAEhC,oBAAC,YAAY,oBACP,iBAAiB,IACrB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,MAAM,EAC5B,KAAK,EAAE,MAAM,EACb,mBAAmB,EAAE,wBAAwB,EAC7C,UAAU,EAAE,eAAe,GAAG,oBAAoB,EAClD,WAAW,EAAE,oBAAoB,IACjC;YAEF,oBAAC,kBAAkB,IAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,MAAM,GAAI;YAE9F,oBAAC,kBAAkB,IAAC,KAAK,EAAE,KAAK,GAAI;YAEpC,oBAAC,oBAAoB,IAAC,GAAG,EAAE,mBAAmB,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,WAAW,GAAI,CAChG,EAEd,OAAO,EACL,oBAAC,gBAAgB,IACf,KAAK,EAAE,KAAK,EACZ,gBAAgB,EAAE,gBAAgB,EAClC,gBAAgB,EAAE,6BAA6B,EAC/C,IAAI,EAAE,iBAAiB,EACvB,MAAM,EAAE,0BAA0B,EAClC,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC,iBAAiB,GACxC,GAEJ,CACH,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState, useEffect, memo, useRef, useMemo } from 'react';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\n\nimport ChartPlot from '../internal/components/chart-plot';\nimport AxisLabel from '../internal/components/cartesian-chart/axis-label';\nimport LabelsMeasure from '../internal/components/cartesian-chart/labels-measure';\nimport LeftLabels from '../internal/components/cartesian-chart/left-labels';\nimport BottomLabels, { useBottomLabels } from '../internal/components/cartesian-chart/bottom-labels';\nimport EmphasizedBaseline from '../internal/components/cartesian-chart/emphasized-baseline';\nimport { AreaChartProps } from './interfaces';\nimport { ChartModel } from './model';\nimport AreaDataSeries from './elements/data-series';\nimport AreaChartPopover from './elements/chart-popover';\nimport AreaHighlightedPoint from './elements/highlighted-point';\nimport AreaVerticalMarker from './elements/vertical-marker';\n\nimport useHighlightDetails from './elements/use-highlight-details';\nimport useContainerWidth from '../internal/utils/use-container-width';\nimport { useSelector } from './async-store';\nimport { CartesianChartContainer } from '../internal/components/cartesian-chart/chart-container';\n\nconst DEFAULT_CHART_WIDTH = 500;\nconst LEFT_LABELS_MARGIN = 16;\nconst BOTTOM_LABELS_OFFSET = 12;\n\ntype TickFormatter = undefined | ((value: AreaChartProps.DataTypes) => string);\n\ninterface ChartContainerProps<T extends AreaChartProps.DataTypes>\n extends Pick<\n AreaChartProps<T>,\n | 'xTitle'\n | 'yTitle'\n | 'xTickFormatter'\n | 'yTickFormatter'\n | 'detailTotalFormatter'\n | 'detailPopoverSize'\n | 'detailPopoverFooter'\n | 'ariaLabel'\n | 'ariaLabelledby'\n | 'ariaDescription'\n | 'i18nStrings'\n > {\n model: ChartModel<T>;\n autoWidth: (value: number) => void;\n fitHeight?: boolean;\n minHeight: number;\n}\n\nexport default memo(ChartContainer) as typeof ChartContainer;\n\nfunction ChartContainer<T extends AreaChartProps.DataTypes>({\n model,\n autoWidth,\n xTitle,\n yTitle,\n detailPopoverSize,\n detailPopoverFooter,\n ariaLabel,\n ariaLabelledby,\n ariaDescription,\n i18nStrings: {\n xTickFormatter: deprecatedXTickFormatter,\n yTickFormatter: deprecatedYTickFormatter,\n detailTotalFormatter: deprecatedDetailTotalFormatter,\n detailTotalLabel,\n chartAriaRoleDescription,\n xAxisAriaRoleDescription,\n yAxisAriaRoleDescription,\n detailPopoverDismissAriaLabel,\n } = {},\n fitHeight,\n minHeight,\n xTickFormatter = deprecatedXTickFormatter,\n yTickFormatter = deprecatedYTickFormatter,\n detailTotalFormatter = deprecatedDetailTotalFormatter,\n}: ChartContainerProps<T>) {\n const [leftLabelsWidth, setLeftLabelsWidth] = useState(0);\n const [containerWidth, containerWidthRef] = useContainerWidth(DEFAULT_CHART_WIDTH);\n const maxLeftLabelsWidth = Math.round(containerWidth / 2);\n\n const bottomLabelsProps = useBottomLabels({\n ticks: model.computed.xTicks,\n scale: model.computed.xScale,\n tickFormatter: xTickFormatter as TickFormatter,\n });\n\n // Calculate the width of the plot area and tell it to the parent.\n const plotWidth = Math.max(0, containerWidth - leftLabelsWidth - LEFT_LABELS_MARGIN);\n useEffect(() => {\n autoWidth(plotWidth);\n }, [autoWidth, plotWidth]);\n\n const highlightDetails = useHighlightDetails({\n model,\n xTickFormatter,\n yTickFormatter,\n detailTotalFormatter,\n detailTotalLabel,\n });\n\n const highlightedPointRef = useRef<SVGGElement>(null);\n\n const mergedRef = useMergeRefs(containerWidthRef, model.refs.container);\n\n const isPointHighlighted = model.interactions.get().highlightedPoint !== null;\n\n const highlightedX = useSelector(model.interactions, state => state.highlightedX);\n\n const detailPopoverFooterContent = useMemo(\n () => (detailPopoverFooter && highlightedX ? detailPopoverFooter(highlightedX[0].x) : null),\n [detailPopoverFooter, highlightedX]\n );\n\n return (\n <CartesianChartContainer\n ref={mergedRef}\n minHeight={minHeight + bottomLabelsProps.height}\n fitHeight={!!fitHeight}\n leftAxisLabel={<AxisLabel axis=\"y\" position=\"left\" title={yTitle} />}\n leftAxisLabelMeasure={\n <LabelsMeasure\n scale={model.computed.yScale}\n ticks={model.computed.yTicks}\n tickFormatter={yTickFormatter as TickFormatter}\n autoWidth={setLeftLabelsWidth}\n maxLabelsWidth={maxLeftLabelsWidth}\n />\n }\n bottomAxisLabel={<AxisLabel axis=\"x\" position=\"bottom\" title={xTitle} />}\n chartPlot={\n <ChartPlot\n ref={model.refs.plot}\n width=\"100%\"\n height={fitHeight ? `calc(100% - ${bottomLabelsProps.height}px)` : model.height}\n offsetBottom={bottomLabelsProps.height}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n ariaDescription={ariaDescription}\n ariaRoleDescription={chartAriaRoleDescription}\n activeElementKey={!highlightDetails?.isPopoverPinned && highlightDetails?.activeLabel}\n activeElementRef={isPointHighlighted ? highlightedPointRef : model.refs.verticalMarker}\n activeElementFocusOffset={isPointHighlighted ? 3 : { x: 8, y: 0 }}\n isClickable={!highlightDetails?.isPopoverPinned}\n onMouseMove={model.handlers.onSVGMouseMove}\n onMouseOut={model.handlers.onSVGMouseOut}\n onClick={model.handlers.onSVGMouseDown}\n onKeyDown={model.handlers.onSVGKeyDown}\n onApplicationFocus={model.handlers.onApplicationFocus}\n onApplicationBlur={model.handlers.onApplicationBlur}\n >\n <line\n ref={model.refs.plotMeasure}\n x1=\"0\"\n x2=\"0\"\n y1=\"0\"\n y2=\"100%\"\n stroke=\"transparent\"\n strokeWidth={1}\n style={{ pointerEvents: 'none' }}\n />\n\n <LeftLabels\n plotWidth={model.width}\n plotHeight={model.height}\n scale={model.computed.yScale}\n ticks={model.computed.yTicks}\n tickFormatter={yTickFormatter}\n title={yTitle}\n ariaRoleDescription={yAxisAriaRoleDescription}\n maxLabelsWidth={maxLeftLabelsWidth}\n />\n\n <AreaDataSeries model={model} />\n\n <BottomLabels\n {...bottomLabelsProps}\n width={model.width}\n height={model.height}\n scale={model.computed.xScale}\n title={xTitle}\n ariaRoleDescription={xAxisAriaRoleDescription}\n offsetLeft={leftLabelsWidth + BOTTOM_LABELS_OFFSET}\n offsetRight={BOTTOM_LABELS_OFFSET}\n />\n\n <EmphasizedBaseline width={model.width} height={model.height} scale={model.computed.yScale} />\n\n <AreaVerticalMarker model={model} />\n\n <AreaHighlightedPoint ref={highlightedPointRef} model={model} ariaLabel={highlightDetails?.activeLabel} />\n </ChartPlot>\n }\n popover={\n <AreaChartPopover\n model={model}\n highlightDetails={highlightDetails}\n dismissAriaLabel={detailPopoverDismissAriaLabel}\n size={detailPopoverSize}\n footer={detailPopoverFooterContent}\n onBlur={model.handlers.onApplicationBlur}\n />\n }\n />\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"chart-container.js","sourceRoot":"","sources":["../../../src/area-chart/chart-container.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState, useEffect, memo, useRef, useMemo } from 'react';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\n\nimport ChartPlot from '../internal/components/chart-plot';\nimport AxisLabel from '../internal/components/cartesian-chart/axis-label';\nimport LabelsMeasure from '../internal/components/cartesian-chart/labels-measure';\nimport InlineStartLabels from '../internal/components/cartesian-chart/inline-start-labels';\nimport BlockEndLabels, { useBLockEndLabels } from '../internal/components/cartesian-chart/block-end-labels';\nimport EmphasizedBaseline from '../internal/components/cartesian-chart/emphasized-baseline';\nimport { AreaChartProps } from './interfaces';\nimport { ChartModel } from './model';\nimport AreaDataSeries from './elements/data-series';\nimport AreaChartPopover from './elements/chart-popover';\nimport AreaHighlightedPoint from './elements/highlighted-point';\nimport AreaVerticalMarker from './elements/vertical-marker';\n\nimport useHighlightDetails from './elements/use-highlight-details';\nimport useContainerWidth from '../internal/utils/use-container-width';\nimport { useSelector } from './async-store';\nimport { CartesianChartContainer } from '../internal/components/cartesian-chart/chart-container';\n\nconst DEFAULT_CHART_WIDTH = 500;\nconst INLINE_START_LABELS_MARGIN = 16;\nconst BLOCK_END_LABELS_OFFSET = 12;\n\ntype TickFormatter = undefined | ((value: AreaChartProps.DataTypes) => string);\n\ninterface ChartContainerProps<T extends AreaChartProps.DataTypes>\n extends Pick<\n AreaChartProps<T>,\n | 'xTitle'\n | 'yTitle'\n | 'xTickFormatter'\n | 'yTickFormatter'\n | 'detailTotalFormatter'\n | 'detailPopoverSize'\n | 'detailPopoverFooter'\n | 'ariaLabel'\n | 'ariaLabelledby'\n | 'ariaDescription'\n | 'i18nStrings'\n > {\n model: ChartModel<T>;\n autoWidth: (value: number) => void;\n fitHeight?: boolean;\n minHeight: number;\n}\n\nexport default memo(ChartContainer) as typeof ChartContainer;\n\nfunction ChartContainer<T extends AreaChartProps.DataTypes>({\n model,\n autoWidth,\n xTitle,\n yTitle,\n detailPopoverSize,\n detailPopoverFooter,\n ariaLabel,\n ariaLabelledby,\n ariaDescription,\n i18nStrings: {\n xTickFormatter: deprecatedXTickFormatter,\n yTickFormatter: deprecatedYTickFormatter,\n detailTotalFormatter: deprecatedDetailTotalFormatter,\n detailTotalLabel,\n chartAriaRoleDescription,\n xAxisAriaRoleDescription,\n yAxisAriaRoleDescription,\n detailPopoverDismissAriaLabel,\n } = {},\n fitHeight,\n minHeight,\n xTickFormatter = deprecatedXTickFormatter,\n yTickFormatter = deprecatedYTickFormatter,\n detailTotalFormatter = deprecatedDetailTotalFormatter,\n}: ChartContainerProps<T>) {\n const [inlineStartLabelsWidth, setInlineStartLabelsWidth] = useState(0);\n const [containerWidth, containerWidthRef] = useContainerWidth(DEFAULT_CHART_WIDTH);\n const maxInlineStartLabelsWidth = Math.round(containerWidth / 2);\n\n const blockEndLabelsProps = useBLockEndLabels({\n ticks: model.computed.xTicks,\n scale: model.computed.xScale,\n tickFormatter: xTickFormatter as TickFormatter,\n });\n\n // Calculate the width of the plot area and tell it to the parent.\n const plotWidth = Math.max(0, containerWidth - inlineStartLabelsWidth - INLINE_START_LABELS_MARGIN);\n useEffect(() => {\n autoWidth(plotWidth);\n }, [autoWidth, plotWidth]);\n\n const highlightDetails = useHighlightDetails({\n model,\n xTickFormatter,\n yTickFormatter,\n detailTotalFormatter,\n detailTotalLabel,\n });\n\n const highlightedPointRef = useRef<SVGGElement>(null);\n\n const mergedRef = useMergeRefs(containerWidthRef, model.refs.container);\n\n const isPointHighlighted = model.interactions.get().highlightedPoint !== null;\n\n const highlightedX = useSelector(model.interactions, state => state.highlightedX);\n\n const detailPopoverFooterContent = useMemo(\n () => (detailPopoverFooter && highlightedX ? detailPopoverFooter(highlightedX[0].x) : null),\n [detailPopoverFooter, highlightedX]\n );\n\n return (\n <CartesianChartContainer\n ref={mergedRef}\n minHeight={minHeight + blockEndLabelsProps.height}\n fitHeight={!!fitHeight}\n leftAxisLabel={<AxisLabel axis=\"y\" position=\"left\" title={yTitle} />}\n leftAxisLabelMeasure={\n <LabelsMeasure\n scale={model.computed.yScale}\n ticks={model.computed.yTicks}\n tickFormatter={yTickFormatter as TickFormatter}\n autoWidth={setInlineStartLabelsWidth}\n maxLabelsWidth={maxInlineStartLabelsWidth}\n />\n }\n bottomAxisLabel={<AxisLabel axis=\"x\" position=\"bottom\" title={xTitle} />}\n chartPlot={\n <ChartPlot\n ref={model.refs.plot}\n width=\"100%\"\n height={fitHeight ? `calc(100% - ${blockEndLabelsProps.height}px)` : model.height}\n offsetBottom={blockEndLabelsProps.height}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n ariaDescription={ariaDescription}\n ariaRoleDescription={chartAriaRoleDescription}\n activeElementKey={!highlightDetails?.isPopoverPinned && highlightDetails?.activeLabel}\n activeElementRef={isPointHighlighted ? highlightedPointRef : model.refs.verticalMarker}\n activeElementFocusOffset={isPointHighlighted ? 3 : { x: 8, y: 0 }}\n isClickable={!highlightDetails?.isPopoverPinned}\n onMouseMove={model.handlers.onSVGMouseMove}\n onMouseOut={model.handlers.onSVGMouseOut}\n onClick={model.handlers.onSVGMouseDown}\n onKeyDown={model.handlers.onSVGKeyDown}\n onApplicationFocus={model.handlers.onApplicationFocus}\n onApplicationBlur={model.handlers.onApplicationBlur}\n >\n <line\n ref={model.refs.plotMeasure}\n x1=\"0\"\n x2=\"0\"\n y1=\"0\"\n y2=\"100%\"\n stroke=\"transparent\"\n strokeWidth={1}\n style={{ pointerEvents: 'none' }}\n />\n\n <InlineStartLabels\n plotWidth={model.width}\n plotHeight={model.height}\n scale={model.computed.yScale}\n ticks={model.computed.yTicks}\n tickFormatter={yTickFormatter}\n title={yTitle}\n ariaRoleDescription={yAxisAriaRoleDescription}\n maxLabelsWidth={maxInlineStartLabelsWidth}\n />\n\n <AreaDataSeries model={model} />\n\n <BlockEndLabels\n {...blockEndLabelsProps}\n width={model.width}\n height={model.height}\n scale={model.computed.xScale}\n title={xTitle}\n ariaRoleDescription={xAxisAriaRoleDescription}\n offsetLeft={inlineStartLabelsWidth + BLOCK_END_LABELS_OFFSET}\n offsetRight={BLOCK_END_LABELS_OFFSET}\n />\n\n <EmphasizedBaseline width={model.width} height={model.height} scale={model.computed.yScale} />\n\n <AreaVerticalMarker model={model} />\n\n <AreaHighlightedPoint ref={highlightedPointRef} model={model} ariaLabel={highlightDetails?.activeLabel} />\n </ChartPlot>\n }\n popover={\n <AreaChartPopover\n model={model}\n highlightDetails={highlightDetails}\n dismissAriaLabel={detailPopoverDismissAriaLabel}\n size={detailPopoverSize}\n footer={detailPopoverFooterContent}\n onBlur={model.handlers.onApplicationBlur}\n />\n }\n />\n );\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/area-chart/internal.tsx"],"names":[],"mappings":";AAWA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAOlF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/area-chart/internal.tsx"],"names":[],"mappings":";AAWA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAOlF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAKjD,KAAK,sBAAsB,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,IAAI,YAAY,CAC5E,cAAc,CAAC,CAAC,CAAC,EACjB,QAAQ,GAAG,YAAY,GAAG,YAAY,GAAG,YAAY,GAAG,mBAAmB,GAAG,aAAa,CAC5F,GACC,0BAA0B,CAAC;AAE7B,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,EAAE,EAC5E,SAAS,EACT,MAAM,EACN,UAAU,EACV,UAAU,EACV,OAAO,EACP,OAAO,EACP,cAAc,EACd,cAAc,EACd,oBAAoB,EACpB,iBAAiB,EAAE,2BAA2B,EAC9C,aAAa,EAAE,uBAAuB,EACtC,MAAM,EAAE,cAAc,EACtB,cAAc,EAAE,yBAAyB,EACzC,iBAAiB,EAAE,2BAA2B,EAC9C,WAAW,EACX,SAAS,EACT,cAAc,EACd,eAAe,EACf,MAAM,EACN,MAAM,EACN,UAAU,EACV,iBAAiB,EACjB,UAAU,EACV,WAAW,EACX,UAAU,EACV,iBAAiB,EACjB,mBAAmB,EACnB,KAAK,EACL,OAAO,EACP,SAAS,EACT,WAAW,EACX,YAAY,EACZ,eAAe,EACf,iBAAwB,EACxB,GAAG,KAAK,EACT,EAAE,sBAAsB,CAAC,CAAC,CAAC,eA2I3B"}
|
package/area-chart/internal.js
CHANGED
|
@@ -18,6 +18,7 @@ import { warnOnce } from '@cloudscape-design/component-toolkit/internal';
|
|
|
18
18
|
import { useMergeRefs } from '../internal/hooks/use-merge-refs';
|
|
19
19
|
import { nodeBelongs } from '../internal/utils/node-belongs';
|
|
20
20
|
import { ChartWrapper } from '../internal/components/chart-wrapper';
|
|
21
|
+
import { getIsRtl } from '../internal/direction';
|
|
21
22
|
export default function InternalAreaChart(_a) {
|
|
22
23
|
var { fitHeight, height, xScaleType, yScaleType, xDomain, yDomain, xTickFormatter, yTickFormatter, detailTotalFormatter, highlightedSeries: controlledHighlightedSeries, visibleSeries: controlledVisibleSeries, series: externalSeries, onFilterChange: controlledOnVisibleChange, onHighlightChange: controlledOnHighlightChange, i18nStrings, ariaLabel, ariaLabelledby, ariaDescription, xTitle, yTitle, hideFilter, additionalFilters, hideLegend, legendTitle, statusType, detailPopoverSize, detailPopoverFooter, empty, noMatch, errorText, loadingText, recoveryText, onRecoveryClick, __internalRootRef = null } = _a, props = __rest(_a, ["fitHeight", "height", "xScaleType", "yScaleType", "xDomain", "yDomain", "xTickFormatter", "yTickFormatter", "detailTotalFormatter", "highlightedSeries", "visibleSeries", "series", "onFilterChange", "onHighlightChange", "i18nStrings", "ariaLabel", "ariaLabelledby", "ariaDescription", "xTitle", "yTitle", "hideFilter", "additionalFilters", "hideLegend", "legendTitle", "statusType", "detailPopoverSize", "detailPopoverFooter", "empty", "noMatch", "errorText", "loadingText", "recoveryText", "onRecoveryClick", "__internalRootRef"]);
|
|
23
24
|
const baseProps = getBaseProps(props);
|
|
@@ -35,7 +36,9 @@ export default function InternalAreaChart(_a) {
|
|
|
35
36
|
const [width, setWidth] = useState(0);
|
|
36
37
|
const [visibleSeries, setVisibleSeries] = useFilterProps(externalSeries, controlledVisibleSeries, controlledOnVisibleChange);
|
|
37
38
|
const [highlightedSeries, setHighlightedSeries] = useHighlightProps(externalSeries, controlledHighlightedSeries, controlledOnHighlightChange);
|
|
39
|
+
const isRtl = containerRef.current ? getIsRtl(containerRef.current) : false;
|
|
38
40
|
const model = useChartModel({
|
|
41
|
+
isRtl,
|
|
39
42
|
fitHeight,
|
|
40
43
|
externalSeries,
|
|
41
44
|
visibleSeries,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/area-chart/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { isDevelopment } from '../internal/is-development';\nimport { getBaseProps } from '../internal/base-component';\nimport ChartStatusContainer, { getChartStatus } from '../internal/components/chart-status-container';\n\nimport AreaChartFilter from './elements/area-chart-filter';\nimport AreaChartLegend from './elements/area-chart-legend';\nimport { AreaChartProps } from './interfaces';\nimport ChartContainer from './chart-container';\nimport styles from './styles.css.js';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport useChartModel from './model/use-chart-model';\nimport useFilterProps from './model/use-filter-props';\nimport useHighlightProps from './model/use-highlight-props';\nimport { isSeriesValid } from './model/utils';\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { SomeRequired } from '../internal/types';\nimport { nodeBelongs } from '../internal/utils/node-belongs';\nimport { ChartWrapper } from '../internal/components/chart-wrapper';\n\ntype InternalAreaChartProps<T extends AreaChartProps.DataTypes> = SomeRequired<\n AreaChartProps<T>,\n 'height' | 'xScaleType' | 'yScaleType' | 'statusType' | 'detailPopoverSize' | 'i18nStrings'\n> &\n InternalBaseComponentProps;\n\nexport default function InternalAreaChart<T extends AreaChartProps.DataTypes>({\n fitHeight,\n height,\n xScaleType,\n yScaleType,\n xDomain,\n yDomain,\n xTickFormatter,\n yTickFormatter,\n detailTotalFormatter,\n highlightedSeries: controlledHighlightedSeries,\n visibleSeries: controlledVisibleSeries,\n series: externalSeries,\n onFilterChange: controlledOnVisibleChange,\n onHighlightChange: controlledOnHighlightChange,\n i18nStrings,\n ariaLabel,\n ariaLabelledby,\n ariaDescription,\n xTitle,\n yTitle,\n hideFilter,\n additionalFilters,\n hideLegend,\n legendTitle,\n statusType,\n detailPopoverSize,\n detailPopoverFooter,\n empty,\n noMatch,\n errorText,\n loadingText,\n recoveryText,\n onRecoveryClick,\n __internalRootRef = null,\n ...props\n}: InternalAreaChartProps<T>) {\n const baseProps = getBaseProps(props);\n const containerRef = useRef<HTMLDivElement>(null);\n const popoverRef = useRef<HTMLDivElement>(null);\n\n if (isDevelopment) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useEffect(() => {\n if (!isSeriesValid(externalSeries)) {\n warnOnce(\n 'AreaChart',\n \"The `series` property violates the component's constraints: all `area` \" +\n 'series must have `data` arrays of the same length and with the same x-values.'\n );\n }\n }, [externalSeries]);\n }\n\n const [width, setWidth] = useState(0);\n const [visibleSeries, setVisibleSeries] = useFilterProps(\n externalSeries,\n controlledVisibleSeries,\n controlledOnVisibleChange\n );\n const [highlightedSeries, setHighlightedSeries] = useHighlightProps(\n externalSeries,\n controlledHighlightedSeries,\n controlledOnHighlightChange\n );\n const model = useChartModel({\n fitHeight,\n externalSeries,\n visibleSeries,\n setVisibleSeries,\n highlightedSeries,\n setHighlightedSeries,\n xDomain,\n yDomain,\n xScaleType,\n yScaleType,\n height,\n width,\n popoverRef,\n });\n\n const { isEmpty, isNoMatch, showChart } = getChartStatus({\n externalData: externalSeries,\n visibleData: visibleSeries,\n statusType,\n });\n const showFilters = statusType === 'finished' && (!isEmpty || isNoMatch) && (additionalFilters || !hideFilter);\n const showLegend = !hideLegend && !isEmpty && statusType === 'finished';\n const reserveLegendSpace = !showChart && !hideLegend;\n const reserveFilterSpace = !showChart && !isNoMatch && (!hideFilter || additionalFilters);\n\n useEffect(() => {\n const onKeyDown = model.handlers.onDocumentKeyDown;\n document.addEventListener('keydown', onKeyDown);\n return () => document.removeEventListener('keydown', onKeyDown);\n }, [model.handlers.onDocumentKeyDown]);\n\n const onBlur = (event: React.FocusEvent) => {\n if (event.relatedTarget && !nodeBelongs(containerRef.current, event.relatedTarget)) {\n model.handlers.onContainerBlur();\n }\n };\n\n const mergedRef = useMergeRefs(containerRef, __internalRootRef);\n\n return (\n <ChartWrapper\n ref={mergedRef}\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n fitHeight={!!fitHeight}\n contentMinHeight={height}\n defaultFilter={\n showFilters && !hideFilter ? (\n <AreaChartFilter\n model={model}\n filterLabel={i18nStrings.filterLabel}\n filterPlaceholder={i18nStrings.filterPlaceholder}\n filterSelectedAriaLabel={i18nStrings.filterSelectedAriaLabel}\n />\n ) : null\n }\n additionalFilters={showFilters ? additionalFilters : null}\n reserveFilterSpace={!!reserveFilterSpace}\n reserveLegendSpace={!!reserveLegendSpace}\n chartStatus={\n <ChartStatusContainer\n isEmpty={isEmpty}\n isNoMatch={isNoMatch}\n showChart={showChart}\n statusType={statusType}\n empty={empty}\n noMatch={noMatch}\n loadingText={loadingText}\n errorText={errorText}\n recoveryText={recoveryText}\n onRecoveryClick={onRecoveryClick}\n />\n }\n chart={\n showChart ? (\n <ChartContainer\n model={model}\n autoWidth={setWidth}\n detailPopoverSize={detailPopoverSize}\n detailPopoverFooter={detailPopoverFooter}\n xTitle={xTitle}\n yTitle={yTitle}\n xTickFormatter={xTickFormatter}\n yTickFormatter={yTickFormatter}\n detailTotalFormatter={detailTotalFormatter}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n ariaDescription={ariaDescription}\n i18nStrings={i18nStrings}\n fitHeight={fitHeight}\n minHeight={height}\n />\n ) : null\n }\n legend={\n showLegend ? (\n <AreaChartLegend\n plotContainerRef={containerRef}\n model={model}\n legendTitle={legendTitle}\n ariaLabel={i18nStrings.legendAriaLabel}\n />\n ) : null\n }\n onBlur={onBlur}\n />\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/area-chart/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { isDevelopment } from '../internal/is-development';\nimport { getBaseProps } from '../internal/base-component';\nimport ChartStatusContainer, { getChartStatus } from '../internal/components/chart-status-container';\n\nimport AreaChartFilter from './elements/area-chart-filter';\nimport AreaChartLegend from './elements/area-chart-legend';\nimport { AreaChartProps } from './interfaces';\nimport ChartContainer from './chart-container';\nimport styles from './styles.css.js';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport useChartModel from './model/use-chart-model';\nimport useFilterProps from './model/use-filter-props';\nimport useHighlightProps from './model/use-highlight-props';\nimport { isSeriesValid } from './model/utils';\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { SomeRequired } from '../internal/types';\nimport { nodeBelongs } from '../internal/utils/node-belongs';\nimport { ChartWrapper } from '../internal/components/chart-wrapper';\nimport { getIsRtl } from '../internal/direction';\n\ntype InternalAreaChartProps<T extends AreaChartProps.DataTypes> = SomeRequired<\n AreaChartProps<T>,\n 'height' | 'xScaleType' | 'yScaleType' | 'statusType' | 'detailPopoverSize' | 'i18nStrings'\n> &\n InternalBaseComponentProps;\n\nexport default function InternalAreaChart<T extends AreaChartProps.DataTypes>({\n fitHeight,\n height,\n xScaleType,\n yScaleType,\n xDomain,\n yDomain,\n xTickFormatter,\n yTickFormatter,\n detailTotalFormatter,\n highlightedSeries: controlledHighlightedSeries,\n visibleSeries: controlledVisibleSeries,\n series: externalSeries,\n onFilterChange: controlledOnVisibleChange,\n onHighlightChange: controlledOnHighlightChange,\n i18nStrings,\n ariaLabel,\n ariaLabelledby,\n ariaDescription,\n xTitle,\n yTitle,\n hideFilter,\n additionalFilters,\n hideLegend,\n legendTitle,\n statusType,\n detailPopoverSize,\n detailPopoverFooter,\n empty,\n noMatch,\n errorText,\n loadingText,\n recoveryText,\n onRecoveryClick,\n __internalRootRef = null,\n ...props\n}: InternalAreaChartProps<T>) {\n const baseProps = getBaseProps(props);\n const containerRef = useRef<HTMLDivElement>(null);\n const popoverRef = useRef<HTMLDivElement>(null);\n\n if (isDevelopment) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useEffect(() => {\n if (!isSeriesValid(externalSeries)) {\n warnOnce(\n 'AreaChart',\n \"The `series` property violates the component's constraints: all `area` \" +\n 'series must have `data` arrays of the same length and with the same x-values.'\n );\n }\n }, [externalSeries]);\n }\n\n const [width, setWidth] = useState(0);\n const [visibleSeries, setVisibleSeries] = useFilterProps(\n externalSeries,\n controlledVisibleSeries,\n controlledOnVisibleChange\n );\n const [highlightedSeries, setHighlightedSeries] = useHighlightProps(\n externalSeries,\n controlledHighlightedSeries,\n controlledOnHighlightChange\n );\n const isRtl = containerRef.current ? getIsRtl(containerRef.current) : false;\n const model = useChartModel({\n isRtl,\n fitHeight,\n externalSeries,\n visibleSeries,\n setVisibleSeries,\n highlightedSeries,\n setHighlightedSeries,\n xDomain,\n yDomain,\n xScaleType,\n yScaleType,\n height,\n width,\n popoverRef,\n });\n\n const { isEmpty, isNoMatch, showChart } = getChartStatus({\n externalData: externalSeries,\n visibleData: visibleSeries,\n statusType,\n });\n const showFilters = statusType === 'finished' && (!isEmpty || isNoMatch) && (additionalFilters || !hideFilter);\n const showLegend = !hideLegend && !isEmpty && statusType === 'finished';\n const reserveLegendSpace = !showChart && !hideLegend;\n const reserveFilterSpace = !showChart && !isNoMatch && (!hideFilter || additionalFilters);\n\n useEffect(() => {\n const onKeyDown = model.handlers.onDocumentKeyDown;\n document.addEventListener('keydown', onKeyDown);\n return () => document.removeEventListener('keydown', onKeyDown);\n }, [model.handlers.onDocumentKeyDown]);\n\n const onBlur = (event: React.FocusEvent) => {\n if (event.relatedTarget && !nodeBelongs(containerRef.current, event.relatedTarget)) {\n model.handlers.onContainerBlur();\n }\n };\n\n const mergedRef = useMergeRefs(containerRef, __internalRootRef);\n\n return (\n <ChartWrapper\n ref={mergedRef}\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n fitHeight={!!fitHeight}\n contentMinHeight={height}\n defaultFilter={\n showFilters && !hideFilter ? (\n <AreaChartFilter\n model={model}\n filterLabel={i18nStrings.filterLabel}\n filterPlaceholder={i18nStrings.filterPlaceholder}\n filterSelectedAriaLabel={i18nStrings.filterSelectedAriaLabel}\n />\n ) : null\n }\n additionalFilters={showFilters ? additionalFilters : null}\n reserveFilterSpace={!!reserveFilterSpace}\n reserveLegendSpace={!!reserveLegendSpace}\n chartStatus={\n <ChartStatusContainer\n isEmpty={isEmpty}\n isNoMatch={isNoMatch}\n showChart={showChart}\n statusType={statusType}\n empty={empty}\n noMatch={noMatch}\n loadingText={loadingText}\n errorText={errorText}\n recoveryText={recoveryText}\n onRecoveryClick={onRecoveryClick}\n />\n }\n chart={\n showChart ? (\n <ChartContainer\n model={model}\n autoWidth={setWidth}\n detailPopoverSize={detailPopoverSize}\n detailPopoverFooter={detailPopoverFooter}\n xTitle={xTitle}\n yTitle={yTitle}\n xTickFormatter={xTickFormatter}\n yTickFormatter={yTickFormatter}\n detailTotalFormatter={detailTotalFormatter}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n ariaDescription={ariaDescription}\n i18nStrings={i18nStrings}\n fitHeight={fitHeight}\n minHeight={height}\n />\n ) : null\n }\n legend={\n showLegend ? (\n <AreaChartLegend\n plotContainerRef={containerRef}\n model={model}\n legendTitle={legendTitle}\n ariaLabel={i18nStrings.legendAriaLabel}\n />\n ) : null\n }\n onBlur={onBlur}\n />\n );\n}\n"]}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { AreaChartProps } from '../interfaces';
|
|
2
|
-
import { XDomain, XScaleType, YDomain, YScaleType } from '../../internal/components/cartesian-chart/interfaces';
|
|
2
|
+
import { ChartDomain, XDomain, XScaleType, YDomain, YScaleType } from '../../internal/components/cartesian-chart/interfaces';
|
|
3
3
|
import { ChartScale, NumericChartScale } from '../../internal/components/cartesian-chart/scales';
|
|
4
|
-
export default function computeChartProps<T extends AreaChartProps.DataTypes>({ series, xDomain: externalXDomain, yDomain: externalYDomain, xScaleType, yScaleType, height, width, }: {
|
|
4
|
+
export default function computeChartProps<T extends AreaChartProps.DataTypes>({ isRtl, series, xDomain: externalXDomain, yDomain: externalYDomain, xScaleType, yScaleType, height, width, }: {
|
|
5
|
+
isRtl?: boolean;
|
|
5
6
|
series: readonly AreaChartProps.Series<T>[];
|
|
6
7
|
xDomain?: XDomain<T>;
|
|
7
8
|
yDomain?: YDomain;
|
|
@@ -10,7 +11,7 @@ export default function computeChartProps<T extends AreaChartProps.DataTypes>({
|
|
|
10
11
|
height: number;
|
|
11
12
|
width: number;
|
|
12
13
|
}): {
|
|
13
|
-
xDomain:
|
|
14
|
+
xDomain: ChartDomain<T>;
|
|
14
15
|
yDomain: readonly number[];
|
|
15
16
|
xScale: ChartScale;
|
|
16
17
|
yScale: NumericChartScale;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compute-chart-props.d.ts","sourceRoot":"","sources":["../../../../src/area-chart/model/compute-chart-props.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAG/C,OAAO,
|
|
1
|
+
{"version":3,"file":"compute-chart-props.d.ts","sourceRoot":"","sources":["../../../../src/area-chart/model/compute-chart-props.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAG/C,OAAO,EACL,WAAW,EACX,OAAO,EACP,UAAU,EACV,OAAO,EACP,UAAU,EACX,MAAM,sDAAsD,CAAC;AAO9D,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,kDAAkD,CAAC;AAEjG,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,EAAE,EAC5E,KAAK,EACL,MAAM,EACN,OAAO,EAAE,eAAe,EACxB,OAAO,EAAE,eAAe,EACxB,UAAU,EACV,UAAU,EACV,MAAM,EACN,KAAK,GACN,EAAE;IACD,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,EAAE,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5C,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,UAAU,CAAC;IACvB,UAAU,EAAE,UAAU,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf;;;;;;;;;;;;EAkBA"}
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
import { computePlotPoints, computeDomainX, computeDomainY } from './utils';
|
|
2
2
|
import { createXTicks, createYTicks, getXTickCount, getYTickCount, } from '../../internal/components/cartesian-chart/ticks';
|
|
3
3
|
import { ChartScale, NumericChartScale } from '../../internal/components/cartesian-chart/scales';
|
|
4
|
-
export default function computeChartProps({ series, xDomain: externalXDomain, yDomain: externalYDomain, xScaleType, yScaleType, height, width, }) {
|
|
5
|
-
const xDomain = externalXDomain
|
|
4
|
+
export default function computeChartProps({ isRtl, series, xDomain: externalXDomain, yDomain: externalYDomain, xScaleType, yScaleType, height, width, }) {
|
|
5
|
+
const xDomain = externalXDomain ? [...externalXDomain] : computeDomainX(series);
|
|
6
|
+
if (isRtl && Array.isArray(xDomain)) {
|
|
7
|
+
xDomain.reverse();
|
|
8
|
+
}
|
|
6
9
|
const xTickCount = getXTickCount(width);
|
|
7
10
|
const xScale = new ChartScale(xScaleType, xDomain, [0, width]);
|
|
8
11
|
const xTicks = xScale.domain.length > 0 ? createXTicks(xScale, xTickCount) : [];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compute-chart-props.js","sourceRoot":"","sources":["../../../../src/area-chart/model/compute-chart-props.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"compute-chart-props.js","sourceRoot":"","sources":["../../../../src/area-chart/model/compute-chart-props.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAS5E,OAAO,EACL,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,aAAa,GACd,MAAM,iDAAiD,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,kDAAkD,CAAC;AAEjG,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAqC,EAC5E,KAAK,EACL,MAAM,EACN,OAAO,EAAE,eAAe,EACxB,OAAO,EAAE,eAAe,EACxB,UAAU,EACV,UAAU,EACV,MAAM,EACN,KAAK,GAUN;IACC,MAAM,OAAO,GAAG,eAAe,CAAC,CAAC,CAAE,CAAC,GAAG,eAAe,CAA+B,CAAC,CAAC,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;IAC/G,IAAI,KAAK,IAAI,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;QACnC,OAAO,CAAC,OAAO,EAAE,CAAC;KACnB;IAED,MAAM,UAAU,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC;IACxC,MAAM,MAAM,GAAG,IAAI,UAAU,CAAC,UAAU,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;IAC/D,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAEhF,MAAM,OAAO,GAAG,eAAe,IAAI,cAAc,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IACtE,MAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IACzC,MAAM,MAAM,GAAG,IAAI,iBAAiB,CAAC,UAAU,EAAE,OAAO,EAAE,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,eAAe,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC;IAC5G,MAAM,MAAM,GAAG,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IAEhD,MAAM,IAAI,GAAG,iBAAiB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;IAEvD,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC;AACpE,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { AreaChartProps } from '../interfaces';\nimport { computePlotPoints, computeDomainX, computeDomainY } from './utils';\n\nimport {\n ChartDomain,\n XDomain,\n XScaleType,\n YDomain,\n YScaleType,\n} from '../../internal/components/cartesian-chart/interfaces';\nimport {\n createXTicks,\n createYTicks,\n getXTickCount,\n getYTickCount,\n} from '../../internal/components/cartesian-chart/ticks';\nimport { ChartScale, NumericChartScale } from '../../internal/components/cartesian-chart/scales';\n\nexport default function computeChartProps<T extends AreaChartProps.DataTypes>({\n isRtl,\n series,\n xDomain: externalXDomain,\n yDomain: externalYDomain,\n xScaleType,\n yScaleType,\n height,\n width,\n}: {\n isRtl?: boolean;\n series: readonly AreaChartProps.Series<T>[];\n xDomain?: XDomain<T>;\n yDomain?: YDomain;\n xScaleType: XScaleType;\n yScaleType: YScaleType;\n height: number;\n width: number;\n}) {\n const xDomain = externalXDomain ? ([...externalXDomain] as unknown as ChartDomain<T>) : computeDomainX(series);\n if (isRtl && Array.isArray(xDomain)) {\n xDomain.reverse();\n }\n\n const xTickCount = getXTickCount(width);\n const xScale = new ChartScale(xScaleType, xDomain, [0, width]);\n const xTicks = xScale.domain.length > 0 ? createXTicks(xScale, xTickCount) : [];\n\n const yDomain = externalYDomain || computeDomainY(series, yScaleType);\n const yTickCount = getYTickCount(height);\n const yScale = new NumericChartScale(yScaleType, yDomain, [height, 0], externalYDomain ? null : yTickCount);\n const yTicks = createYTicks(yScale, yTickCount);\n\n const plot = computePlotPoints(series, xScale, yScale);\n\n return { xDomain, yDomain, xScale, yScale, xTicks, yTicks, plot };\n}\n"]}
|
|
@@ -16,7 +16,7 @@ export interface ChartModel<T extends AreaChartProps.DataTypes> {
|
|
|
16
16
|
onSVGMouseMove: (event: React.MouseEvent<SVGElement>) => void;
|
|
17
17
|
onSVGMouseOut: (event: React.MouseEvent<SVGElement>) => void;
|
|
18
18
|
onSVGMouseDown: (event: React.MouseEvent<SVGSVGElement>) => void;
|
|
19
|
-
onSVGKeyDown: (event: React.KeyboardEvent) => void;
|
|
19
|
+
onSVGKeyDown: (event: React.KeyboardEvent<HTMLElement | SVGElement>) => void;
|
|
20
20
|
onApplicationFocus: (event: React.FocusEvent<Element>, trigger: 'mouse' | 'keyboard') => void;
|
|
21
21
|
onApplicationBlur: (event: React.FocusEvent<Element>) => void;
|
|
22
22
|
onFilterSeries: (series: readonly AreaChartProps.Series<T>[]) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/area-chart/model/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,qBAAqB,EAAE,MAAM,+CAA+C,CAAC;AACtF,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,kDAAkD,CAAC;AACjG,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,sDAAsD,CAAC;AACxF,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAEpD,MAAM,WAAW,UAAU,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS;IAC5D,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5C,SAAS,EAAE,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IAC/C,iBAAiB,CAAC,MAAM,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;IAClF,QAAQ,EAAE,UAAU,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;IACtC,QAAQ,EAAE;QACR,cAAc,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;QAC9D,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;QAC7D,cAAc,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;QACjE,YAAY,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/area-chart/model/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/area-chart/model/index.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { ChartSeriesMarkerType } from '../../internal/components/chart-series-marker';\nimport { ChartScale, NumericChartScale } from '../../internal/components/cartesian-chart/scales';\nimport { XDomain, YDomain } from '../../internal/components/cartesian-chart/interfaces';\nimport { AreaChartProps } from '../interfaces';\nimport { ChartPlotRef } from '../../internal/components/chart-plot';\nimport { ReadonlyAsyncStore } from '../async-store';\n\nexport interface ChartModel<T extends AreaChartProps.DataTypes> {\n height: number;\n width: number;\n series: readonly AreaChartProps.Series<T>[];\n allSeries: readonly AreaChartProps.Series<T>[];\n getInternalSeries(series: AreaChartProps.Series<T>): ChartModel.InternalSeries<T>;\n computed: ChartModel.ComputedProps<T>;\n handlers: {\n onSVGMouseMove: (event: React.MouseEvent<SVGElement>) => void;\n onSVGMouseOut: (event: React.MouseEvent<SVGElement>) => void;\n onSVGMouseDown: (event: React.MouseEvent<SVGSVGElement>) => void;\n onSVGKeyDown: (event: React.KeyboardEvent) => void;\n onApplicationFocus: (event: React.FocusEvent<Element>, trigger: 'mouse' | 'keyboard') => void;\n onApplicationBlur: (event: React.FocusEvent<Element>) => void;\n onFilterSeries: (series: readonly AreaChartProps.Series<T>[]) => void;\n onLegendHighlight: (series: null | AreaChartProps.Series<T>) => void;\n onPopoverDismiss: (outsideClick?: boolean) => void;\n onContainerBlur: () => void;\n onDocumentKeyDown: (event: KeyboardEvent) => void;\n onPopoverLeave: (event: React.MouseEvent) => void;\n };\n interactions: ReadonlyAsyncStore<ChartModel.InteractionsState<T>>;\n refs: {\n plot: React.RefObject<ChartPlotRef>;\n plotMeasure: React.Ref<SVGLineElement>;\n container: React.RefObject<HTMLDivElement>;\n verticalMarker: React.RefObject<SVGLineElement>;\n popoverRef: React.RefObject<HTMLElement>;\n };\n}\n\nexport namespace ChartModel {\n export interface ComputedProps<T extends AreaChartProps.DataTypes> {\n xDomain: XDomain<T>;\n yDomain: YDomain;\n xScale: ChartScale;\n yScale: NumericChartScale;\n xTicks: AreaChartProps.DataTypes[];\n yTicks: number[];\n plot: {\n xy: readonly PlotPoint<T>[][];\n xs: readonly PlotPoint<T>[][];\n sx: readonly PlotPoint<T>[][];\n };\n }\n\n export interface InteractionsState<T> {\n highlightedX: null | readonly PlotPoint<T>[];\n highlightedPoint: null | PlotPoint<T>;\n highlightedSeries: null | AreaChartProps.Series<T>;\n legendSeries: null | AreaChartProps.Series<T>;\n isPopoverPinned: boolean;\n }\n\n export interface InternalSeries<T> {\n series: AreaChartProps.Series<T>;\n title: string;\n color: string;\n markerType: ChartSeriesMarkerType;\n formatValue: (y: number, x: T) => string | number;\n }\n\n export interface PlotPoint<T> {\n x: T;\n y0: number;\n y1: number;\n scaled: { x: number; y0: number; y1: number };\n index: { x: number; y: number; s: number };\n value: number;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/area-chart/model/index.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { ChartSeriesMarkerType } from '../../internal/components/chart-series-marker';\nimport { ChartScale, NumericChartScale } from '../../internal/components/cartesian-chart/scales';\nimport { XDomain, YDomain } from '../../internal/components/cartesian-chart/interfaces';\nimport { AreaChartProps } from '../interfaces';\nimport { ChartPlotRef } from '../../internal/components/chart-plot';\nimport { ReadonlyAsyncStore } from '../async-store';\n\nexport interface ChartModel<T extends AreaChartProps.DataTypes> {\n height: number;\n width: number;\n series: readonly AreaChartProps.Series<T>[];\n allSeries: readonly AreaChartProps.Series<T>[];\n getInternalSeries(series: AreaChartProps.Series<T>): ChartModel.InternalSeries<T>;\n computed: ChartModel.ComputedProps<T>;\n handlers: {\n onSVGMouseMove: (event: React.MouseEvent<SVGElement>) => void;\n onSVGMouseOut: (event: React.MouseEvent<SVGElement>) => void;\n onSVGMouseDown: (event: React.MouseEvent<SVGSVGElement>) => void;\n onSVGKeyDown: (event: React.KeyboardEvent<HTMLElement | SVGElement>) => void;\n onApplicationFocus: (event: React.FocusEvent<Element>, trigger: 'mouse' | 'keyboard') => void;\n onApplicationBlur: (event: React.FocusEvent<Element>) => void;\n onFilterSeries: (series: readonly AreaChartProps.Series<T>[]) => void;\n onLegendHighlight: (series: null | AreaChartProps.Series<T>) => void;\n onPopoverDismiss: (outsideClick?: boolean) => void;\n onContainerBlur: () => void;\n onDocumentKeyDown: (event: KeyboardEvent) => void;\n onPopoverLeave: (event: React.MouseEvent) => void;\n };\n interactions: ReadonlyAsyncStore<ChartModel.InteractionsState<T>>;\n refs: {\n plot: React.RefObject<ChartPlotRef>;\n plotMeasure: React.Ref<SVGLineElement>;\n container: React.RefObject<HTMLDivElement>;\n verticalMarker: React.RefObject<SVGLineElement>;\n popoverRef: React.RefObject<HTMLElement>;\n };\n}\n\nexport namespace ChartModel {\n export interface ComputedProps<T extends AreaChartProps.DataTypes> {\n xDomain: XDomain<T>;\n yDomain: YDomain;\n xScale: ChartScale;\n yScale: NumericChartScale;\n xTicks: AreaChartProps.DataTypes[];\n yTicks: number[];\n plot: {\n xy: readonly PlotPoint<T>[][];\n xs: readonly PlotPoint<T>[][];\n sx: readonly PlotPoint<T>[][];\n };\n }\n\n export interface InteractionsState<T> {\n highlightedX: null | readonly PlotPoint<T>[];\n highlightedPoint: null | PlotPoint<T>;\n highlightedSeries: null | AreaChartProps.Series<T>;\n legendSeries: null | AreaChartProps.Series<T>;\n isPopoverPinned: boolean;\n }\n\n export interface InternalSeries<T> {\n series: AreaChartProps.Series<T>;\n title: string;\n color: string;\n markerType: ChartSeriesMarkerType;\n formatValue: (y: number, x: T) => string | number;\n }\n\n export interface PlotPoint<T> {\n x: T;\n y0: number;\n y1: number;\n scaled: { x: number; y0: number; y1: number };\n index: { x: number; y: number; s: number };\n value: number;\n }\n}\n"]}
|
|
@@ -3,6 +3,7 @@ import { RefObject } from 'react';
|
|
|
3
3
|
import { XDomain, XScaleType, YDomain, YScaleType } from '../../internal/components/cartesian-chart/interfaces';
|
|
4
4
|
import { ChartModel } from './index';
|
|
5
5
|
export interface UseChartModelProps<T extends AreaChartProps.DataTypes> {
|
|
6
|
+
isRtl?: boolean;
|
|
6
7
|
fitHeight?: boolean;
|
|
7
8
|
externalSeries: readonly AreaChartProps.Series<T>[];
|
|
8
9
|
visibleSeries: readonly AreaChartProps.Series<T>[];
|
|
@@ -17,5 +18,5 @@ export interface UseChartModelProps<T extends AreaChartProps.DataTypes> {
|
|
|
17
18
|
width: number;
|
|
18
19
|
popoverRef: RefObject<HTMLElement>;
|
|
19
20
|
}
|
|
20
|
-
export default function useChartModel<T extends AreaChartProps.DataTypes>({ fitHeight, externalSeries: allSeries, visibleSeries: series, setVisibleSeries, highlightedSeries, setHighlightedSeries, xDomain, yDomain, xScaleType, yScaleType, height: explicitHeight, width, popoverRef, }: UseChartModelProps<T>): ChartModel<T>;
|
|
21
|
+
export default function useChartModel<T extends AreaChartProps.DataTypes>({ isRtl, fitHeight, externalSeries: allSeries, visibleSeries: series, setVisibleSeries, highlightedSeries, setHighlightedSeries, xDomain, yDomain, xScaleType, yScaleType, height: explicitHeight, width, popoverRef, }: UseChartModelProps<T>): ChartModel<T>;
|
|
21
22
|
//# sourceMappingURL=use-chart-model.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-chart-model.d.ts","sourceRoot":"","sources":["../../../../src/area-chart/model/use-chart-model.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAc,EAA8B,SAAS,EAAc,MAAM,OAAO,CAAC;AAKjF,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,sDAAsD,CAAC;AAIhH,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"use-chart-model.d.ts","sourceRoot":"","sources":["../../../../src/area-chart/model/use-chart-model.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAc,EAA8B,SAAS,EAAc,MAAM,OAAO,CAAC;AAKjF,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,sDAAsD,CAAC;AAIhH,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAarC,MAAM,WAAW,kBAAkB,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS;IACpE,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACpD,aAAa,EAAE,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACnD,gBAAgB,EAAE,CAAC,MAAM,EAAE,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,IAAI,CAAC;IACxE,iBAAiB,EAAE,IAAI,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACnD,oBAAoB,EAAE,CAAC,MAAM,EAAE,IAAI,GAAG,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACxE,OAAO,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,UAAU,CAAC;IACvB,UAAU,EAAE,UAAU,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;CACpC;AAGD,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,EAAE,EACxE,KAAK,EACL,SAAS,EACT,cAAc,EAAE,SAAS,EACzB,aAAa,EAAE,MAAM,EACrB,gBAAgB,EAChB,iBAAiB,EACjB,oBAAoB,EACpB,OAAO,EACP,OAAO,EACP,UAAU,EACV,UAAU,EACV,MAAM,EAAE,cAAc,EACtB,KAAK,EACL,UAAU,GACX,EAAE,kBAAkB,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAmUvC"}
|
|
@@ -10,11 +10,12 @@ import { useReaction } from '../async-store';
|
|
|
10
10
|
import { useHeightMeasure } from '../../internal/hooks/container-queries/use-height-measure';
|
|
11
11
|
import { useStableCallback } from '@cloudscape-design/component-toolkit/internal';
|
|
12
12
|
import { nodeBelongs } from '../../internal/utils/node-belongs';
|
|
13
|
+
import handleKey from '../../internal/utils/handle-key';
|
|
13
14
|
const MAX_HOVER_MARGIN = 6;
|
|
14
15
|
const SVG_HOVER_THROTTLE = 25;
|
|
15
16
|
const POPOVER_DEADZONE = 12;
|
|
16
17
|
// Represents the core the chart logic, including the model of all allowed user interactions.
|
|
17
|
-
export default function useChartModel({ fitHeight, externalSeries: allSeries, visibleSeries: series, setVisibleSeries, highlightedSeries, setHighlightedSeries, xDomain, yDomain, xScaleType, yScaleType, height: explicitHeight, width, popoverRef, }) {
|
|
18
|
+
export default function useChartModel({ isRtl, fitHeight, externalSeries: allSeries, visibleSeries: series, setVisibleSeries, highlightedSeries, setHighlightedSeries, xDomain, yDomain, xScaleType, yScaleType, height: explicitHeight, width, popoverRef, }) {
|
|
18
19
|
var _a;
|
|
19
20
|
// Chart elements refs used in handlers.
|
|
20
21
|
const plotRef = useRef(null);
|
|
@@ -27,6 +28,7 @@ export default function useChartModel({ fitHeight, externalSeries: allSeries, vi
|
|
|
27
28
|
const model = useMemo(() => {
|
|
28
29
|
// Compute scales, ticks and two-dimensional plots.
|
|
29
30
|
const computed = computeChartProps({
|
|
31
|
+
isRtl,
|
|
30
32
|
series,
|
|
31
33
|
xDomain,
|
|
32
34
|
yDomain,
|
|
@@ -171,18 +173,13 @@ export default function useChartModel({ fitHeight, externalSeries: allSeries, vi
|
|
|
171
173
|
if (interactions.get().isPopoverPinned) {
|
|
172
174
|
return;
|
|
173
175
|
}
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
}
|
|
182
|
-
// Pin popover.
|
|
183
|
-
else if (keyCode === KeyCode.enter || keyCode === KeyCode.space) {
|
|
184
|
-
interactions.pinPopover();
|
|
185
|
-
}
|
|
176
|
+
handleKey(event, {
|
|
177
|
+
onBlockEnd: () => moveBetweenSeries(-1),
|
|
178
|
+
onBlockStart: () => moveBetweenSeries(1),
|
|
179
|
+
onInlineStart: () => moveWithinXAxis(-1),
|
|
180
|
+
onInlineEnd: () => moveWithinXAxis(1),
|
|
181
|
+
onActivate: () => interactions.pinPopover(),
|
|
182
|
+
});
|
|
186
183
|
};
|
|
187
184
|
const highlightFirstX = () => {
|
|
188
185
|
interactions.highlightX(interactions.plot.xy[0]);
|
|
@@ -276,7 +273,19 @@ export default function useChartModel({ fitHeight, externalSeries: allSeries, vi
|
|
|
276
273
|
popoverRef,
|
|
277
274
|
},
|
|
278
275
|
};
|
|
279
|
-
}, [
|
|
276
|
+
}, [
|
|
277
|
+
allSeries,
|
|
278
|
+
series,
|
|
279
|
+
xDomain,
|
|
280
|
+
yDomain,
|
|
281
|
+
xScaleType,
|
|
282
|
+
yScaleType,
|
|
283
|
+
height,
|
|
284
|
+
width,
|
|
285
|
+
stableSetVisibleSeries,
|
|
286
|
+
popoverRef,
|
|
287
|
+
isRtl,
|
|
288
|
+
]);
|
|
280
289
|
// Notify client when series highlight change.
|
|
281
290
|
useReaction(model.interactions, state => state.highlightedSeries, setHighlightedSeries);
|
|
282
291
|
// Update interactions store when series highlight in a controlled way.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-chart-model.js","sourceRoot":"","sources":["../../../../src/area-chart/model/use-chart-model.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { AreaChartProps } from '../interfaces';\nimport React, { useEffect, useMemo, useRef, RefObject, MouseEvent } from 'react';\nimport { nodeContains } from '@cloudscape-design/component-toolkit/dom';\nimport { findClosest, circleIndex } from './utils';\n\nimport { KeyCode } from '../../internal/keycode';\nimport { XDomain, XScaleType, YDomain, YScaleType } from '../../internal/components/cartesian-chart/interfaces';\nimport computeChartProps from './compute-chart-props';\nimport createSeriesDecorator from './create-series-decorator';\nimport InteractionsStore from './interactions-store';\nimport { ChartModel } from './index';\nimport { ChartPlotRef } from '../../internal/components/chart-plot';\nimport { throttle } from '../../internal/utils/throttle';\nimport { useReaction } from '../async-store';\nimport { useHeightMeasure } from '../../internal/hooks/container-queries/use-height-measure';\nimport { useStableCallback } from '@cloudscape-design/component-toolkit/internal';\nimport { nodeBelongs } from '../../internal/utils/node-belongs';\n\nconst MAX_HOVER_MARGIN = 6;\nconst SVG_HOVER_THROTTLE = 25;\nconst POPOVER_DEADZONE = 12;\n\nexport interface UseChartModelProps<T extends AreaChartProps.DataTypes> {\n fitHeight?: boolean;\n externalSeries: readonly AreaChartProps.Series<T>[];\n visibleSeries: readonly AreaChartProps.Series<T>[];\n setVisibleSeries: (series: readonly AreaChartProps.Series<T>[]) => void;\n highlightedSeries: null | AreaChartProps.Series<T>;\n setHighlightedSeries: (series: null | AreaChartProps.Series<T>) => void;\n xDomain?: XDomain<T>;\n yDomain?: YDomain;\n xScaleType: XScaleType;\n yScaleType: YScaleType;\n height: number;\n width: number;\n popoverRef: RefObject<HTMLElement>;\n}\n\n// Represents the core the chart logic, including the model of all allowed user interactions.\nexport default function useChartModel<T extends AreaChartProps.DataTypes>({\n fitHeight,\n externalSeries: allSeries,\n visibleSeries: series,\n setVisibleSeries,\n highlightedSeries,\n setHighlightedSeries,\n xDomain,\n yDomain,\n xScaleType,\n yScaleType,\n height: explicitHeight,\n width,\n popoverRef,\n}: UseChartModelProps<T>): ChartModel<T> {\n // Chart elements refs used in handlers.\n const plotRef = useRef<ChartPlotRef>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const verticalMarkerRef = useRef<SVGLineElement>(null);\n\n const plotMeasureRef = useRef<SVGLineElement>(null);\n const hasVisibleSeries = series.length > 0;\n const height = useHeightMeasure(() => plotMeasureRef.current, !fitHeight, [hasVisibleSeries]) ?? explicitHeight;\n\n const stableSetVisibleSeries = useStableCallback(setVisibleSeries);\n\n const model = useMemo(() => {\n // Compute scales, ticks and two-dimensional plots.\n const computed = computeChartProps({\n series,\n xDomain,\n yDomain,\n xScaleType,\n yScaleType,\n height,\n width,\n });\n\n // A store for chart interactions that don't require plot recomputation.\n const interactions = new InteractionsStore(series, computed.plot);\n\n const containsMultipleSeries = interactions.series.length > 1;\n\n // A series decorator to provide extra props such as color and marker type.\n const getInternalSeries = createSeriesDecorator(allSeries);\n\n const isMouseOverPopover = (clientX: number, clientY: number) => {\n if (popoverRef.current?.firstChild) {\n const popoverPosition = (popoverRef.current.firstChild as HTMLElement).getBoundingClientRect();\n if (\n clientX > popoverPosition.x - POPOVER_DEADZONE &&\n clientX < popoverPosition.x + popoverPosition.width + POPOVER_DEADZONE &&\n clientY > popoverPosition.y - POPOVER_DEADZONE &&\n clientY < popoverPosition.y + popoverPosition.height + POPOVER_DEADZONE\n ) {\n return true;\n }\n }\n return false;\n };\n\n // A Callback for svg mouseover to hover the plot points.\n // Throttling is necessary for a substantially smoother customer experience.\n const onSVGMouseMoveThrottled = throttle((clientX: number, clientY: number) => {\n // No hover logic when the popover is pinned or no data available.\n if (\n interactions.get().isPopoverPinned ||\n !plotRef.current ||\n interactions.plot.xy.length === 0 ||\n isMouseOverPopover(clientX, clientY)\n ) {\n return;\n }\n\n const svgRect = plotRef.current.svg.getBoundingClientRect();\n const offsetX = clientX - svgRect.left;\n const offsetY = clientY - svgRect.top;\n\n const closestX = findClosest(interactions.plot.xy, offsetX, xPoints => xPoints[0].scaled.x);\n const closestPoint = findClosest(closestX, offsetY, point => point.scaled.y1);\n\n // If close enough to the point - highlight the point and its column.\n // If not - only highlight the closest column.\n if (\n Math.abs(offsetX - closestPoint.scaled.x) < MAX_HOVER_MARGIN &&\n Math.abs(offsetY - closestPoint.scaled.y1) < MAX_HOVER_MARGIN\n ) {\n interactions.highlightPoint(closestPoint);\n } else {\n interactions.highlightX(closestX);\n }\n }, SVG_HOVER_THROTTLE);\n\n const onSVGMouseMove = ({ clientX, clientY }: React.MouseEvent<SVGElement>) =>\n onSVGMouseMoveThrottled(clientX, clientY);\n\n // A callback for svg mouseout to clear all highlights.\n const onSVGMouseOut = (event: React.MouseEvent<SVGElement>) => {\n // Because the mouseover is throttled, in can occur slightly after the mouseout,\n // neglecting its effect; cancelling the throttled function prevents that.\n onSVGMouseMoveThrottled.cancel();\n\n // No hover logic when the popover is pinned or mouse is over popover\n if (interactions.get().isPopoverPinned || isMouseOverPopover(event.clientX, event.clientY)) {\n return;\n }\n\n // Check if the target is contained within svg to allow hovering on the popover body.\n if (!nodeContains(plotRef.current!.svg, event.relatedTarget as Element)) {\n interactions.clearHighlightedLegend();\n interactions.clearHighlight();\n }\n };\n\n // A callback for svg click to pin/unpin the popover.\n const onSVGMouseDown = (event: React.MouseEvent<SVGSVGElement>) => {\n interactions.togglePopoverPin();\n event.preventDefault();\n };\n\n const moveWithinXAxis = (direction: -1 | 1) => {\n if (interactions.get().highlightedPoint) {\n return moveWithinSeries(direction);\n } else if (containsMultipleSeries) {\n const { highlightedX } = interactions.get();\n if (highlightedX) {\n const currentXIndex = highlightedX[0].index.x;\n const nextXIndex = circleIndex(currentXIndex + direction, [0, interactions.plot.xy.length - 1]);\n interactions.highlightX(interactions.plot.xy[nextXIndex]);\n }\n }\n };\n\n // A helper function to highlight the next or previous point within selected series.\n const moveWithinSeries = (direction: -1 | 1) => {\n // Can only use motion when a particular point is highlighted.\n const point = interactions.get().highlightedPoint;\n if (!point) {\n return;\n }\n\n // Take the index of the currently highlighted series.\n const sIndex = point.index.s;\n // Take the incremented(circularly) x-index of the currently highlighted point.\n const xIndex = circleIndex(point.index.x + direction, [0, interactions.plot.xs.length - 1]);\n // Highlight the next point using x:s grouped data.\n interactions.highlightPoint(interactions.plot.xs[xIndex][sIndex]);\n };\n\n // A helper function to highlight the next or previous point within the selected column.\n const moveBetweenSeries = (direction: -1 | 1) => {\n const point = interactions.get().highlightedPoint;\n if (!point) {\n const { highlightedX } = interactions.get();\n if (highlightedX) {\n const xIndex = highlightedX[0].index.x;\n const points = interactions.plot.xy[xIndex];\n const yIndex = direction === 1 ? 0 : points.length - 1;\n interactions.highlightPoint(points[yIndex]);\n }\n return;\n }\n\n // Take the index of the currently highlighted column.\n const xIndex = point.index.x;\n const currentYIndex = point.index.y;\n\n if (\n containsMultipleSeries &&\n ((currentYIndex === 0 && direction === -1) ||\n (currentYIndex === interactions.plot.xy[xIndex].length - 1 && direction === 1))\n ) {\n interactions.highlightX(interactions.plot.xy[xIndex]);\n } else {\n // Take the incremented(circularly) y-index of the currently highlighted point.\n const nextYIndex = circleIndex(currentYIndex + direction, [0, interactions.plot.xy[xIndex].length - 1]);\n // Highlight the next point using x:y grouped data.\n interactions.highlightPoint(interactions.plot.xy[xIndex][nextYIndex]);\n }\n };\n\n // A callback for svg keydown to enable motions and popover pin with the keyboard.\n const onSVGKeyDown = (event: React.KeyboardEvent) => {\n const keyCode = event.keyCode;\n if (\n keyCode !== KeyCode.up &&\n keyCode !== KeyCode.right &&\n keyCode !== KeyCode.down &&\n keyCode !== KeyCode.left &&\n keyCode !== KeyCode.space &&\n keyCode !== KeyCode.enter\n ) {\n return;\n }\n\n // Preventing default fixes an issue in Safari+VO when VO additionally interprets arrow keys as its commands.\n event.preventDefault();\n\n // No keydown logic when the popover is pinned.\n if (interactions.get().isPopoverPinned) {\n return;\n }\n\n // Move up/down.\n if (keyCode === KeyCode.down || keyCode === KeyCode.up) {\n moveBetweenSeries(keyCode === KeyCode.down ? -1 : 1);\n }\n // Move left/right.\n else if (keyCode === KeyCode.left || keyCode === KeyCode.right) {\n moveWithinXAxis(keyCode === KeyCode.right ? 1 : -1);\n }\n // Pin popover.\n else if (keyCode === KeyCode.enter || keyCode === KeyCode.space) {\n interactions.pinPopover();\n }\n };\n\n const highlightFirstX = () => {\n interactions.highlightX(interactions.plot.xy[0]);\n };\n\n // A callback for application focus to highlight series.\n const onApplicationFocus = (_event: React.FocusEvent, trigger: 'mouse' | 'keyboard') => {\n // When focus is caused by a click event nothing is expected as clicks are handled separately.\n if (trigger === 'keyboard') {\n const { highlightedX, highlightedPoint, highlightedSeries, legendSeries } = interactions.get();\n if (containsMultipleSeries && !highlightedX && !highlightedPoint && !highlightedSeries && !legendSeries) {\n highlightFirstX();\n } else if (!highlightedX) {\n interactions.highlightFirstPoint();\n }\n }\n };\n\n // A callback for application blur to clear all highlights unless the popover is pinned.\n const onApplicationBlur = (event: React.FocusEvent<Element>) => {\n // Pinned popover stays pinned even if the focus is lost.\n // If blur is not caused by the popover, forget the previously highlighted point.\n if (!nodeBelongs(containerRef.current, event.relatedTarget) && !interactions.get().isPopoverPinned) {\n interactions.clearHighlight();\n }\n };\n\n const onFilterSeries = (series: readonly AreaChartProps.Series<T>[]) => {\n stableSetVisibleSeries(series);\n };\n\n const onLegendHighlight = (series: null | AreaChartProps.Series<T>) => {\n interactions.highlightSeries(series);\n };\n\n const onPopoverDismiss = (outsideClick?: boolean) => {\n interactions.unpinPopover();\n\n // Return focus back to the application or plot (when no point is highlighted).\n if (!outsideClick) {\n // The delay is needed to bypass focus events caused by click or keypress needed to unpin the popover.\n setTimeout(() => {\n if (interactions.get().highlightedPoint || interactions.get().highlightedX) {\n plotRef.current!.focusApplication();\n } else {\n interactions.clearHighlight();\n plotRef.current!.focusPlot();\n }\n }, 0);\n }\n };\n\n const onContainerBlur = () => {\n interactions.clearState();\n };\n\n const onDocumentKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n interactions.clearHighlight();\n interactions.clearHighlightedLegend();\n }\n };\n\n const onPopoverLeave = (event: MouseEvent) => {\n if (nodeContains(plotRef.current!.svg, event.relatedTarget as Element) || interactions.get().isPopoverPinned) {\n return;\n }\n interactions.clearHighlight();\n interactions.clearHighlightedLegend();\n };\n return {\n width,\n height,\n series,\n allSeries,\n getInternalSeries,\n computed,\n interactions,\n handlers: {\n onSVGMouseMove,\n onSVGMouseOut,\n onSVGMouseDown,\n onSVGKeyDown,\n onApplicationFocus,\n onApplicationBlur,\n onFilterSeries,\n onLegendHighlight,\n onPopoverDismiss,\n onContainerBlur,\n onDocumentKeyDown,\n onPopoverLeave,\n },\n refs: {\n plot: plotRef,\n plotMeasure: plotMeasureRef,\n container: containerRef,\n verticalMarker: verticalMarkerRef,\n popoverRef,\n },\n };\n }, [allSeries, series, xDomain, yDomain, xScaleType, yScaleType, height, width, stableSetVisibleSeries, popoverRef]);\n\n // Notify client when series highlight change.\n useReaction(model.interactions, state => state.highlightedSeries, setHighlightedSeries);\n\n // Update interactions store when series highlight in a controlled way.\n useEffect(() => {\n if (highlightedSeries !== model.interactions.get().highlightedSeries) {\n model.interactions.highlightSeries(highlightedSeries);\n }\n }, [model, highlightedSeries]);\n\n return model;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"use-chart-model.js","sourceRoot":"","sources":["../../../../src/area-chart/model/use-chart-model.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { AreaChartProps } from '../interfaces';\nimport React, { useEffect, useMemo, useRef, RefObject, MouseEvent } from 'react';\nimport { nodeContains } from '@cloudscape-design/component-toolkit/dom';\nimport { findClosest, circleIndex } from './utils';\n\nimport { KeyCode } from '../../internal/keycode';\nimport { XDomain, XScaleType, YDomain, YScaleType } from '../../internal/components/cartesian-chart/interfaces';\nimport computeChartProps from './compute-chart-props';\nimport createSeriesDecorator from './create-series-decorator';\nimport InteractionsStore from './interactions-store';\nimport { ChartModel } from './index';\nimport { ChartPlotRef } from '../../internal/components/chart-plot';\nimport { throttle } from '../../internal/utils/throttle';\nimport { useReaction } from '../async-store';\nimport { useHeightMeasure } from '../../internal/hooks/container-queries/use-height-measure';\nimport { useStableCallback } from '@cloudscape-design/component-toolkit/internal';\nimport { nodeBelongs } from '../../internal/utils/node-belongs';\nimport handleKey from '../../internal/utils/handle-key';\n\nconst MAX_HOVER_MARGIN = 6;\nconst SVG_HOVER_THROTTLE = 25;\nconst POPOVER_DEADZONE = 12;\n\nexport interface UseChartModelProps<T extends AreaChartProps.DataTypes> {\n isRtl?: boolean;\n fitHeight?: boolean;\n externalSeries: readonly AreaChartProps.Series<T>[];\n visibleSeries: readonly AreaChartProps.Series<T>[];\n setVisibleSeries: (series: readonly AreaChartProps.Series<T>[]) => void;\n highlightedSeries: null | AreaChartProps.Series<T>;\n setHighlightedSeries: (series: null | AreaChartProps.Series<T>) => void;\n xDomain?: XDomain<T>;\n yDomain?: YDomain;\n xScaleType: XScaleType;\n yScaleType: YScaleType;\n height: number;\n width: number;\n popoverRef: RefObject<HTMLElement>;\n}\n\n// Represents the core the chart logic, including the model of all allowed user interactions.\nexport default function useChartModel<T extends AreaChartProps.DataTypes>({\n isRtl,\n fitHeight,\n externalSeries: allSeries,\n visibleSeries: series,\n setVisibleSeries,\n highlightedSeries,\n setHighlightedSeries,\n xDomain,\n yDomain,\n xScaleType,\n yScaleType,\n height: explicitHeight,\n width,\n popoverRef,\n}: UseChartModelProps<T>): ChartModel<T> {\n // Chart elements refs used in handlers.\n const plotRef = useRef<ChartPlotRef>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const verticalMarkerRef = useRef<SVGLineElement>(null);\n\n const plotMeasureRef = useRef<SVGLineElement>(null);\n const hasVisibleSeries = series.length > 0;\n const height = useHeightMeasure(() => plotMeasureRef.current, !fitHeight, [hasVisibleSeries]) ?? explicitHeight;\n\n const stableSetVisibleSeries = useStableCallback(setVisibleSeries);\n\n const model = useMemo(() => {\n // Compute scales, ticks and two-dimensional plots.\n const computed = computeChartProps({\n isRtl,\n series,\n xDomain,\n yDomain,\n xScaleType,\n yScaleType,\n height,\n width,\n });\n\n // A store for chart interactions that don't require plot recomputation.\n const interactions = new InteractionsStore(series, computed.plot);\n\n const containsMultipleSeries = interactions.series.length > 1;\n\n // A series decorator to provide extra props such as color and marker type.\n const getInternalSeries = createSeriesDecorator(allSeries);\n\n const isMouseOverPopover = (clientX: number, clientY: number) => {\n if (popoverRef.current?.firstChild) {\n const popoverPosition = (popoverRef.current.firstChild as HTMLElement).getBoundingClientRect();\n if (\n clientX > popoverPosition.x - POPOVER_DEADZONE &&\n clientX < popoverPosition.x + popoverPosition.width + POPOVER_DEADZONE &&\n clientY > popoverPosition.y - POPOVER_DEADZONE &&\n clientY < popoverPosition.y + popoverPosition.height + POPOVER_DEADZONE\n ) {\n return true;\n }\n }\n return false;\n };\n\n // A Callback for svg mouseover to hover the plot points.\n // Throttling is necessary for a substantially smoother customer experience.\n const onSVGMouseMoveThrottled = throttle((clientX: number, clientY: number) => {\n // No hover logic when the popover is pinned or no data available.\n if (\n interactions.get().isPopoverPinned ||\n !plotRef.current ||\n interactions.plot.xy.length === 0 ||\n isMouseOverPopover(clientX, clientY)\n ) {\n return;\n }\n\n const svgRect = plotRef.current.svg.getBoundingClientRect();\n const offsetX = clientX - svgRect.left;\n const offsetY = clientY - svgRect.top;\n\n const closestX = findClosest(interactions.plot.xy, offsetX, xPoints => xPoints[0].scaled.x);\n const closestPoint = findClosest(closestX, offsetY, point => point.scaled.y1);\n\n // If close enough to the point - highlight the point and its column.\n // If not - only highlight the closest column.\n if (\n Math.abs(offsetX - closestPoint.scaled.x) < MAX_HOVER_MARGIN &&\n Math.abs(offsetY - closestPoint.scaled.y1) < MAX_HOVER_MARGIN\n ) {\n interactions.highlightPoint(closestPoint);\n } else {\n interactions.highlightX(closestX);\n }\n }, SVG_HOVER_THROTTLE);\n\n const onSVGMouseMove = ({ clientX, clientY }: React.MouseEvent<SVGElement>) =>\n onSVGMouseMoveThrottled(clientX, clientY);\n\n // A callback for svg mouseout to clear all highlights.\n const onSVGMouseOut = (event: React.MouseEvent<SVGElement>) => {\n // Because the mouseover is throttled, in can occur slightly after the mouseout,\n // neglecting its effect; cancelling the throttled function prevents that.\n onSVGMouseMoveThrottled.cancel();\n\n // No hover logic when the popover is pinned or mouse is over popover\n if (interactions.get().isPopoverPinned || isMouseOverPopover(event.clientX, event.clientY)) {\n return;\n }\n\n // Check if the target is contained within svg to allow hovering on the popover body.\n if (!nodeContains(plotRef.current!.svg, event.relatedTarget as Element)) {\n interactions.clearHighlightedLegend();\n interactions.clearHighlight();\n }\n };\n\n // A callback for svg click to pin/unpin the popover.\n const onSVGMouseDown = (event: React.MouseEvent<SVGSVGElement>) => {\n interactions.togglePopoverPin();\n event.preventDefault();\n };\n\n const moveWithinXAxis = (direction: -1 | 1) => {\n if (interactions.get().highlightedPoint) {\n return moveWithinSeries(direction);\n } else if (containsMultipleSeries) {\n const { highlightedX } = interactions.get();\n if (highlightedX) {\n const currentXIndex = highlightedX[0].index.x;\n const nextXIndex = circleIndex(currentXIndex + direction, [0, interactions.plot.xy.length - 1]);\n interactions.highlightX(interactions.plot.xy[nextXIndex]);\n }\n }\n };\n\n // A helper function to highlight the next or previous point within selected series.\n const moveWithinSeries = (direction: -1 | 1) => {\n // Can only use motion when a particular point is highlighted.\n const point = interactions.get().highlightedPoint;\n if (!point) {\n return;\n }\n\n // Take the index of the currently highlighted series.\n const sIndex = point.index.s;\n // Take the incremented(circularly) x-index of the currently highlighted point.\n const xIndex = circleIndex(point.index.x + direction, [0, interactions.plot.xs.length - 1]);\n // Highlight the next point using x:s grouped data.\n interactions.highlightPoint(interactions.plot.xs[xIndex][sIndex]);\n };\n\n // A helper function to highlight the next or previous point within the selected column.\n const moveBetweenSeries = (direction: -1 | 1) => {\n const point = interactions.get().highlightedPoint;\n if (!point) {\n const { highlightedX } = interactions.get();\n if (highlightedX) {\n const xIndex = highlightedX[0].index.x;\n const points = interactions.plot.xy[xIndex];\n const yIndex = direction === 1 ? 0 : points.length - 1;\n interactions.highlightPoint(points[yIndex]);\n }\n return;\n }\n\n // Take the index of the currently highlighted column.\n const xIndex = point.index.x;\n const currentYIndex = point.index.y;\n\n if (\n containsMultipleSeries &&\n ((currentYIndex === 0 && direction === -1) ||\n (currentYIndex === interactions.plot.xy[xIndex].length - 1 && direction === 1))\n ) {\n interactions.highlightX(interactions.plot.xy[xIndex]);\n } else {\n // Take the incremented(circularly) y-index of the currently highlighted point.\n const nextYIndex = circleIndex(currentYIndex + direction, [0, interactions.plot.xy[xIndex].length - 1]);\n // Highlight the next point using x:y grouped data.\n interactions.highlightPoint(interactions.plot.xy[xIndex][nextYIndex]);\n }\n };\n\n // A callback for svg keydown to enable motions and popover pin with the keyboard.\n const onSVGKeyDown = (event: React.KeyboardEvent<HTMLElement | SVGElement>) => {\n const keyCode = event.keyCode;\n if (\n keyCode !== KeyCode.up &&\n keyCode !== KeyCode.right &&\n keyCode !== KeyCode.down &&\n keyCode !== KeyCode.left &&\n keyCode !== KeyCode.space &&\n keyCode !== KeyCode.enter\n ) {\n return;\n }\n\n // Preventing default fixes an issue in Safari+VO when VO additionally interprets arrow keys as its commands.\n event.preventDefault();\n\n // No keydown logic when the popover is pinned.\n if (interactions.get().isPopoverPinned) {\n return;\n }\n\n handleKey(event, {\n onBlockEnd: () => moveBetweenSeries(-1),\n onBlockStart: () => moveBetweenSeries(1),\n onInlineStart: () => moveWithinXAxis(-1),\n onInlineEnd: () => moveWithinXAxis(1),\n onActivate: () => interactions.pinPopover(),\n });\n };\n\n const highlightFirstX = () => {\n interactions.highlightX(interactions.plot.xy[0]);\n };\n\n // A callback for application focus to highlight series.\n const onApplicationFocus = (_event: React.FocusEvent, trigger: 'mouse' | 'keyboard') => {\n // When focus is caused by a click event nothing is expected as clicks are handled separately.\n if (trigger === 'keyboard') {\n const { highlightedX, highlightedPoint, highlightedSeries, legendSeries } = interactions.get();\n if (containsMultipleSeries && !highlightedX && !highlightedPoint && !highlightedSeries && !legendSeries) {\n highlightFirstX();\n } else if (!highlightedX) {\n interactions.highlightFirstPoint();\n }\n }\n };\n\n // A callback for application blur to clear all highlights unless the popover is pinned.\n const onApplicationBlur = (event: React.FocusEvent<Element>) => {\n // Pinned popover stays pinned even if the focus is lost.\n // If blur is not caused by the popover, forget the previously highlighted point.\n if (!nodeBelongs(containerRef.current, event.relatedTarget) && !interactions.get().isPopoverPinned) {\n interactions.clearHighlight();\n }\n };\n\n const onFilterSeries = (series: readonly AreaChartProps.Series<T>[]) => {\n stableSetVisibleSeries(series);\n };\n\n const onLegendHighlight = (series: null | AreaChartProps.Series<T>) => {\n interactions.highlightSeries(series);\n };\n\n const onPopoverDismiss = (outsideClick?: boolean) => {\n interactions.unpinPopover();\n\n // Return focus back to the application or plot (when no point is highlighted).\n if (!outsideClick) {\n // The delay is needed to bypass focus events caused by click or keypress needed to unpin the popover.\n setTimeout(() => {\n if (interactions.get().highlightedPoint || interactions.get().highlightedX) {\n plotRef.current!.focusApplication();\n } else {\n interactions.clearHighlight();\n plotRef.current!.focusPlot();\n }\n }, 0);\n }\n };\n\n const onContainerBlur = () => {\n interactions.clearState();\n };\n\n const onDocumentKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n interactions.clearHighlight();\n interactions.clearHighlightedLegend();\n }\n };\n\n const onPopoverLeave = (event: MouseEvent) => {\n if (nodeContains(plotRef.current!.svg, event.relatedTarget as Element) || interactions.get().isPopoverPinned) {\n return;\n }\n interactions.clearHighlight();\n interactions.clearHighlightedLegend();\n };\n return {\n width,\n height,\n series,\n allSeries,\n getInternalSeries,\n computed,\n interactions,\n handlers: {\n onSVGMouseMove,\n onSVGMouseOut,\n onSVGMouseDown,\n onSVGKeyDown,\n onApplicationFocus,\n onApplicationBlur,\n onFilterSeries,\n onLegendHighlight,\n onPopoverDismiss,\n onContainerBlur,\n onDocumentKeyDown,\n onPopoverLeave,\n },\n refs: {\n plot: plotRef,\n plotMeasure: plotMeasureRef,\n container: containerRef,\n verticalMarker: verticalMarkerRef,\n popoverRef,\n },\n };\n }, [\n allSeries,\n series,\n xDomain,\n yDomain,\n xScaleType,\n yScaleType,\n height,\n width,\n stableSetVisibleSeries,\n popoverRef,\n isRtl,\n ]);\n\n // Notify client when series highlight change.\n useReaction(model.interactions, state => state.highlightedSeries, setHighlightedSeries);\n\n // Update interactions store when series highlight in a controlled way.\n useEffect(() => {\n if (highlightedSeries !== model.interactions.get().highlightedSeries) {\n model.interactions.highlightSeries(highlightedSeries);\n }\n }, [model, highlightedSeries]);\n\n return model;\n}\n"]}
|
|
@@ -7,7 +7,7 @@ import { useMobile } from '../internal/hooks/use-mobile';
|
|
|
7
7
|
import globalVars from '../internal/styles/global-vars';
|
|
8
8
|
export function computeOffset({ isMobile, __stickyOffset, __mobileStickyOffset, hasInnerOverflowParents, }) {
|
|
9
9
|
const localOffset = isMobile ? (__stickyOffset !== null && __stickyOffset !== void 0 ? __stickyOffset : 0) - (__mobileStickyOffset !== null && __mobileStickyOffset !== void 0 ? __mobileStickyOffset : 0) : __stickyOffset !== null && __stickyOffset !== void 0 ? __stickyOffset : 0;
|
|
10
|
-
if (hasInnerOverflowParents) {
|
|
10
|
+
if (hasInnerOverflowParents || __stickyOffset !== undefined) {
|
|
11
11
|
return `${localOffset}px`;
|
|
12
12
|
}
|
|
13
13
|
const globalOffset = `var(${globalVars.stickyVerticalTopOffset}, 0px)`;
|