@cloudscape-design/components 3.0.417 → 3.0.419

package/area-chart/chart-container.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart-container.d.ts","sourceRoot":"lib/default/","sources":["area-chart/chart-container.tsx"],"names":[],"mappings":";AAWA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAiBrC,UAAU,mBAAmB,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,CAC9D,SAAQ,IAAI,CACV,cAAc,CAAC,CAAC,CAAC,EACf,QAAQ,GACR,QAAQ,GACR,gBAAgB,GAChB,gBAAgB,GAChB,sBAAsB,GACtB,mBAAmB,GACnB,qBAAqB,GACrB,WAAW,GACX,gBAAgB,GAChB,iBAAiB,GACjB,aAAa,CAChB;IACD,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC;IACrB,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;CACnB;;AAED,wBAA6D;AAE7D,iBAAS,cAAc,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,EAAE,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,GACzB,EACN,SAAS,EACT,SAAS,EACT,cAAyC,EACzC,cAAyC,EACzC,oBAAqD,GACtD,EAAE,mBAAmB,CAAC,CAAC,CAAC,eA6HxB"}
+{"version":3,"file":"chart-container.d.ts","sourceRoot":"lib/default/","sources":["area-chart/chart-container.tsx"],"names":[],"mappings":";AAWA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAiBrC,UAAU,mBAAmB,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,CAC9D,SAAQ,IAAI,CACV,cAAc,CAAC,CAAC,CAAC,EACf,QAAQ,GACR,QAAQ,GACR,gBAAgB,GAChB,gBAAgB,GAChB,sBAAsB,GACtB,mBAAmB,GACnB,qBAAqB,GACrB,WAAW,GACX,gBAAgB,GAChB,iBAAiB,GACjB,aAAa,CAChB;IACD,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC;IACrB,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;CACnB;;AAED,wBAA6D;AAE7D,iBAAS,cAAc,CAAC,CAAC,SAAS,cAAc,CAAC,SAAS,EAAE,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,GACzB,EACN,SAAS,EACT,SAAS,EACT,cAAyC,EACzC,cAAyC,EACzC,oBAAqD,GACtD,EAAE,mBAAmB,CAAC,CAAC,CAAC,eAgIxB"}

package/area-chart/chart-container.js

@@ -23,6 +23,7 @@ export default memo(ChartContainer);
 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, }) {
     const [leftLabelsWidth, setLeftLabelsWidth] = useState(0);
     const [containerWidth, containerWidthRef] = useContainerWidth(DEFAULT_CHART_WIDTH);
+    const maxLeftLabelsWidth = Math.round(containerWidth / 2);
     const bottomLabelsProps = useBottomLabels({
         ticks: model.computed.xTicks,
         scale: model.computed.xScale,
@@ -45,9 +46,9 @@ function ChartContainer({ model, autoWidth, xTitle, yTitle, detailPopoverSize, d
     const isPointHighlighted = model.interactions.get().highlightedPoint !== null;
     const highlightedX = useSelector(model.interactions, state => state.highlightedX);
     const detailPopoverFooterContent = useMemo(() => (detailPopoverFooter && highlightedX ? detailPopoverFooter(highlightedX[0].x) : null), [detailPopoverFooter, highlightedX]);
-    return (React.createElement(CartesianChartContainer, { ref: mergedRef, minHeight: minHeight + bottomLabelsProps.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: setLeftLabelsWidth }), bottomAxisLabel: React.createElement(AxisLabel, { axis: "x", position: "bottom", title: xTitle }), chartPlot: React.createElement(ChartPlot, { ref: model.refs.plot, width: "100%", height: fitHeight ? `calc(100% - ${bottomLabelsProps.height}px)` : model.height, offsetBottom: bottomLabelsProps.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, onMouseDown: model.handlers.onSVGMouseDown, onKeyDown: model.handlers.onSVGKeyDown, onFocus: model.handlers.onSVGFocus, onBlur: model.handlers.onSVGBlur },
+    return (React.createElement(CartesianChartContainer, { ref: mergedRef, minHeight: minHeight + bottomLabelsProps.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: setLeftLabelsWidth, maxLabelsWidth: maxLeftLabelsWidth }), bottomAxisLabel: React.createElement(AxisLabel, { axis: "x", position: "bottom", title: xTitle }), chartPlot: React.createElement(ChartPlot, { ref: model.refs.plot, width: "100%", height: fitHeight ? `calc(100% - ${bottomLabelsProps.height}px)` : model.height, offsetBottom: bottomLabelsProps.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, onMouseDown: model.handlers.onSVGMouseDown, onKeyDown: model.handlers.onSVGKeyDown, onFocus: model.handlers.onSVGFocus, onBlur: model.handlers.onSVGBlur },
             React.createElement("line", { ref: model.refs.plotMeasure, x1: "0", x2: "0", y1: "0", y2: "100%", stroke: "transparent", strokeWidth: 1, style: { pointerEvents: 'none' } }),
-            React.createElement(LeftLabels, { width: model.width, height: model.height, scale: model.computed.yScale, ticks: model.computed.yTicks, tickFormatter: yTickFormatter, title: yTitle, ariaRoleDescription: yAxisAriaRoleDescription }),
+            React.createElement(LeftLabels, { plotWidth: model.width, plotHeight: model.height, scale: model.computed.yScale, ticks: model.computed.yTicks, tickFormatter: yTickFormatter, title: yTitle, ariaRoleDescription: yAxisAriaRoleDescription, maxLabelsWidth: maxLeftLabelsWidth }),
             React.createElement(AreaDataSeries, { model: model }),
             React.createElement(BottomLabels, Object.assign({}, bottomLabelsProps, { width: model.width, height: model.height, scale: model.computed.xScale, title: xTitle, ariaRoleDescription: xAxisAriaRoleDescription, offsetLeft: leftLabelsWidth + BOTTOM_LABELS_OFFSET, offsetRight: BOTTOM_LABELS_OFFSET })),
             React.createElement(EmphasizedBaseline, { width: model.width, height: model.height, scale: model.computed.yScale }),

package/area-chart/chart-container.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart-container.js","sourceRoot":"lib/default/","sources":["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 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\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        />\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          onMouseDown={model.handlers.onSVGMouseDown}\n          onKeyDown={model.handlers.onSVGKeyDown}\n          onFocus={model.handlers.onSVGFocus}\n          onBlur={model.handlers.onSVGBlur}\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            width={model.width}\n            height={model.height}\n            scale={model.computed.yScale}\n            ticks={model.computed.yTicks}\n            tickFormatter={yTickFormatter}\n            title={yTitle}\n            ariaRoleDescription={yAxisAriaRoleDescription}\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        />\n      }\n    />\n  );\n}\n"]}
+{"version":3,"file":"chart-container.js","sourceRoot":"lib/default/","sources":["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 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          onMouseDown={model.handlers.onSVGMouseDown}\n          onKeyDown={model.handlers.onSVGKeyDown}\n          onFocus={model.handlers.onSVGFocus}\n          onBlur={model.handlers.onSVGBlur}\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        />\n      }\n    />\n  );\n}\n"]}

package/internal/components/cartesian-chart/label-utils.d.ts

@@ -12,4 +12,8 @@ export declare function formatTicks({ ticks, scale, getLabelSpace, tickFormatter
     tickFormatter?: (value: any) => string;
 }): FormattedTick[];
 export declare function getVisibleTicks(ticks: readonly FormattedTick[], from: number, until: number, balanceTicks?: boolean): readonly FormattedTick[];
+export declare function getSVGTextSize(element: null | SVGTextElement): undefined | {
+    width: number;
+    height: number;
+};
 //# sourceMappingURL=label-utils.d.ts.map

package/internal/components/cartesian-chart/label-utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"label-utils.d.ts","sourceRoot":"lib/default/","sources":["internal/components/cartesian-chart/label-utils.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAIzD,MAAM,WAAW,aAAa;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,EAAE,CAAC;CACjB;AAED,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,aAAa,EACb,aAAa,GACd,EAAE;IACD,KAAK,EAAE,SAAS,cAAc,EAAE,CAAC;IACjC,KAAK,EAAE,UAAU,GAAG,iBAAiB,CAAC;IACtC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACzC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,MAAM,CAAC;CACxC,GAAG,aAAa,EAAE,CAOlB;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,SAAS,aAAa,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,YAAY,UAAQ,4BAGjH"}
+{"version":3,"file":"label-utils.d.ts","sourceRoot":"lib/default/","sources":["internal/components/cartesian-chart/label-utils.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAIzD,MAAM,WAAW,aAAa;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,EAAE,CAAC;CACjB;AAED,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,aAAa,EACb,aAAa,GACd,EAAE;IACD,KAAK,EAAE,SAAS,cAAc,EAAE,CAAC;IACjC,KAAK,EAAE,UAAU,GAAG,iBAAiB,CAAC;IACtC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACzC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,MAAM,CAAC;CACxC,GAAG,aAAa,EAAE,CAOlB;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,SAAS,aAAa,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,YAAY,UAAQ,4BAGjH;AAkDD,wBAAgB,cAAc,CAAC,OAAO,EAAE,IAAI,GAAG,cAAc,GAAG,SAAS,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAK5G"}

package/internal/components/cartesian-chart/label-utils.js

@@ -52,4 +52,12 @@ function hasIntersection(a, b) {
     const rightEdge = right.position - right.space / 2;
     return leftEdge > rightEdge;
 }
+// Ignoring as unsupported in JSDom.
+/* istanbul ignore next */
+export function getSVGTextSize(element) {
+    if (element && element.getBBox) {
+        return element.getBBox();
+    }
+    return undefined;
+}
 //# sourceMappingURL=label-utils.js.map

package/internal/components/cartesian-chart/label-utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"label-utils.js","sourceRoot":"lib/default/","sources":["internal/components/cartesian-chart/label-utils.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 { ChartDataTypes } from './interfaces';\nimport { ChartScale, NumericChartScale } from './scales';\n\nconst SPACE_BETWEEN = 4;\n\nexport interface FormattedTick {\n  position: number;\n  space: number;\n  lines: string[];\n}\n\nexport function formatTicks({\n  ticks,\n  scale,\n  getLabelSpace,\n  tickFormatter,\n}: {\n  ticks: readonly ChartDataTypes[];\n  scale: ChartScale | NumericChartScale;\n  getLabelSpace: (label: string) => number;\n  tickFormatter?: (value: any) => string;\n}): FormattedTick[] {\n  return ticks.map(tick => {\n    const position = scale.d3Scale(tick as any) ?? NaN;\n    const label = tickFormatter ? tickFormatter(tick as any) : tick.toString();\n    const lines = (label + '').split('\\n');\n    return { position, lines, space: Math.max(...lines.map(getLabelSpace)) };\n  });\n}\n\nexport function getVisibleTicks(ticks: readonly FormattedTick[], from: number, until: number, balanceTicks = false) {\n  ticks = getTicksInRange(ticks, from, until);\n  return balanceTicks ? getReducedTicks(ticks) : removeIntersections(ticks);\n}\n\nfunction getTicksInRange(ticks: readonly FormattedTick[], from: number, until: number) {\n  return ticks.filter(tick => from <= tick.position - tick.space / 2 && tick.position + tick.space / 2 <= until);\n}\n\nfunction getReducedTicks(ticks: readonly FormattedTick[]): readonly FormattedTick[] {\n  const reduceLabelRatio = findReduceLabelRatio(ticks);\n\n  const reducedTicks = [];\n  for (let index = 0; index < ticks.length; index += reduceLabelRatio) {\n    reducedTicks.push(ticks[index]);\n  }\n  return reducedTicks;\n}\n\n// Returns a ratio such that all elements can be displayed with no intersections.\nfunction findReduceLabelRatio(ticks: readonly FormattedTick[], ratio = 1): number {\n  if (ratio >= ticks.length) {\n    return ratio;\n  }\n  for (let i = ratio; i < ticks.length; i += ratio) {\n    if (hasIntersection(ticks[i - ratio], ticks[i])) {\n      return findReduceLabelRatio(ticks, ratio + 1);\n    }\n  }\n  return ratio;\n}\n\nfunction removeIntersections(ticks: readonly FormattedTick[]) {\n  const visibleTicks = [];\n  let prevTick = null;\n  for (const tick of ticks) {\n    if (!prevTick || !hasIntersection(prevTick, tick)) {\n      visibleTicks.push(tick);\n      prevTick = tick;\n    }\n  }\n  return visibleTicks;\n}\n\nfunction hasIntersection(a: FormattedTick, b: FormattedTick) {\n  const [left, right] = a.position < b.position ? [a, b] : [b, a];\n  const leftEdge = left.position + left.space / 2 + SPACE_BETWEEN;\n  const rightEdge = right.position - right.space / 2;\n  return leftEdge > rightEdge;\n}\n"]}
+{"version":3,"file":"label-utils.js","sourceRoot":"lib/default/","sources":["internal/components/cartesian-chart/label-utils.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 { ChartDataTypes } from './interfaces';\nimport { ChartScale, NumericChartScale } from './scales';\n\nconst SPACE_BETWEEN = 4;\n\nexport interface FormattedTick {\n  position: number;\n  space: number;\n  lines: string[];\n}\n\nexport function formatTicks({\n  ticks,\n  scale,\n  getLabelSpace,\n  tickFormatter,\n}: {\n  ticks: readonly ChartDataTypes[];\n  scale: ChartScale | NumericChartScale;\n  getLabelSpace: (label: string) => number;\n  tickFormatter?: (value: any) => string;\n}): FormattedTick[] {\n  return ticks.map(tick => {\n    const position = scale.d3Scale(tick as any) ?? NaN;\n    const label = tickFormatter ? tickFormatter(tick as any) : tick.toString();\n    const lines = (label + '').split('\\n');\n    return { position, lines, space: Math.max(...lines.map(getLabelSpace)) };\n  });\n}\n\nexport function getVisibleTicks(ticks: readonly FormattedTick[], from: number, until: number, balanceTicks = false) {\n  ticks = getTicksInRange(ticks, from, until);\n  return balanceTicks ? getReducedTicks(ticks) : removeIntersections(ticks);\n}\n\nfunction getTicksInRange(ticks: readonly FormattedTick[], from: number, until: number) {\n  return ticks.filter(tick => from <= tick.position - tick.space / 2 && tick.position + tick.space / 2 <= until);\n}\n\nfunction getReducedTicks(ticks: readonly FormattedTick[]): readonly FormattedTick[] {\n  const reduceLabelRatio = findReduceLabelRatio(ticks);\n\n  const reducedTicks = [];\n  for (let index = 0; index < ticks.length; index += reduceLabelRatio) {\n    reducedTicks.push(ticks[index]);\n  }\n  return reducedTicks;\n}\n\n// Returns a ratio such that all elements can be displayed with no intersections.\nfunction findReduceLabelRatio(ticks: readonly FormattedTick[], ratio = 1): number {\n  if (ratio >= ticks.length) {\n    return ratio;\n  }\n  for (let i = ratio; i < ticks.length; i += ratio) {\n    if (hasIntersection(ticks[i - ratio], ticks[i])) {\n      return findReduceLabelRatio(ticks, ratio + 1);\n    }\n  }\n  return ratio;\n}\n\nfunction removeIntersections(ticks: readonly FormattedTick[]) {\n  const visibleTicks = [];\n  let prevTick = null;\n  for (const tick of ticks) {\n    if (!prevTick || !hasIntersection(prevTick, tick)) {\n      visibleTicks.push(tick);\n      prevTick = tick;\n    }\n  }\n  return visibleTicks;\n}\n\nfunction hasIntersection(a: FormattedTick, b: FormattedTick) {\n  const [left, right] = a.position < b.position ? [a, b] : [b, a];\n  const leftEdge = left.position + left.space / 2 + SPACE_BETWEEN;\n  const rightEdge = right.position - right.space / 2;\n  return leftEdge > rightEdge;\n}\n\n// Ignoring as unsupported in JSDom.\n/* istanbul ignore next */\nexport function getSVGTextSize(element: null | SVGTextElement): undefined | { width: number; height: number } {\n  if (element && element.getBBox) {\n    return element.getBBox();\n  }\n  return undefined;\n}\n"]}

package/internal/components/cartesian-chart/labels-measure.d.ts

@@ -6,8 +6,9 @@ interface LabelsMeasureProps {
     ticks: readonly ChartDataTypes[];
     tickFormatter?: (value: ChartDataTypes) => string;
     autoWidth: (value: number) => void;
+    maxLabelsWidth?: number;
 }
 declare const _default: typeof LabelsMeasure;
 export default _default;
-declare function LabelsMeasure({ scale, ticks, tickFormatter, autoWidth }: LabelsMeasureProps): JSX.Element;
+declare function LabelsMeasure({ scale, ticks, tickFormatter, autoWidth, maxLabelsWidth }: LabelsMeasureProps): JSX.Element;
 //# sourceMappingURL=labels-measure.d.ts.map

package/internal/components/cartesian-chart/labels-measure.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"labels-measure.d.ts","sourceRoot":"lib/default/","sources":["internal/components/cartesian-chart/labels-measure.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAGzD,OAAO,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;AAG1E,UAAU,kBAAkB;IAC1B,KAAK,EAAE,UAAU,GAAG,iBAAiB,CAAC;IACtC,KAAK,EAAE,SAAS,cAAc,EAAE,CAAC;IACjC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,MAAM,CAAC;IAClD,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;;AAED,wBAA2D;AAG3D,iBAAS,aAAa,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,EAAE,kBAAkB,eA0BpF"}
+{"version":3,"file":"labels-measure.d.ts","sourceRoot":"lib/default/","sources":["internal/components/cartesian-chart/labels-measure.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAGzD,OAAO,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;AAG1E,UAAU,kBAAkB;IAC1B,KAAK,EAAE,UAAU,GAAG,iBAAiB,CAAC;IACtC,KAAK,EAAE,SAAS,cAAc,EAAE,CAAC;IACjC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,MAAM,CAAC;IAClD,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;;AAED,wBAA2D;AAG3D,iBAAS,aAAa,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,cAAc,EAAE,EAAE,kBAAkB,eAqCpG"}

package/internal/components/cartesian-chart/labels-measure.js

@@ -1,12 +1,12 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import React, { memo, useEffect } from 'react';
+import React, { memo, useEffect, Fragment } from 'react';
 import clsx from 'clsx';
 import styles from './styles.css.js';
 import { useContainerQuery } from '@cloudscape-design/component-toolkit';
 export default memo(LabelsMeasure);
 // Places the invisible left-hand side labels to calculate their maximum width.
-function LabelsMeasure({ scale, ticks, tickFormatter, autoWidth }) {
+function LabelsMeasure({ scale, ticks, tickFormatter, autoWidth, maxLabelsWidth }) {
     const [width, ref] = useContainerQuery(rect => rect.contentBoxWidth);
     // Tell elements's width to the parent.
     useEffect(() => {
@@ -17,8 +17,10 @@ function LabelsMeasure({ scale, ticks, tickFormatter, autoWidth }) {
         if (scaledValue === undefined || !isFinite(scaledValue)) {
             return null;
         }
-        return (React.createElement("div", { key: `${value}`, className: styles['labels-left__label'], "aria-hidden": "true" }, tickFormatter ? tickFormatter(value) : value.toString()));
+        const formattedValue = tickFormatter ? tickFormatter(value) : value.toString();
+        const lines = (formattedValue + '').split('\n');
+        return (React.createElement(Fragment, { key: `${value}` }, lines.map((line, lineIndex) => (React.createElement("div", { key: lineIndex, className: styles['labels-left__label'], "aria-hidden": "true" }, line)))));
     };
-    return (React.createElement("div", { ref: ref, className: clsx(styles['labels-left'], styles['labels-left--hidden']) }, ticks.map(labelMapper)));
+    return (React.createElement("div", { ref: ref, className: clsx(styles['labels-left'], styles['labels-left--hidden']), style: { maxWidth: maxLabelsWidth } }, ticks.map(labelMapper)));
 }
 //# sourceMappingURL=labels-measure.js.map

package/internal/components/cartesian-chart/labels-measure.js.map

@@ -1 +1 @@
-{"version":3,"file":"labels-measure.js","sourceRoot":"lib/default/","sources":["internal/components/cartesian-chart/labels-measure.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,IAAI,MAAM,MAAM,CAAC;AAIxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AASzE,eAAe,IAAI,CAAC,aAAa,CAAyB,CAAC;AAE3D,+EAA+E;AAC/E,SAAS,aAAa,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,SAAS,EAAsB;IACnF,MAAM,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,iBAAiB,CAAS,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IAE7E,uCAAuC;IACvC,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC;IACxB,CAAC,EAAE,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC;IAEvB,MAAM,WAAW,GAAG,CAAC,KAAqB,EAAE,EAAE;QAC5C,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,KAAY,CAAC,CAAC;QAChD,IAAI,WAAW,KAAK,SAAS,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE;YACvD,OAAO,IAAI,CAAC;SACb;QAED,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,oBAAoB,CAAC,iBAAc,MAAM,IAC9E,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,KAAY,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,CAC3D,CACP,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC,qBAAqB,CAAC,CAAC,IACjF,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CACnB,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo, useEffect } from 'react';\nimport clsx from 'clsx';\n\nimport { ChartScale, NumericChartScale } from './scales';\n\nimport styles from './styles.css.js';\nimport { ChartDataTypes } from '../../../mixed-line-bar-chart/interfaces';\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\n\ninterface LabelsMeasureProps {\n  scale: ChartScale | NumericChartScale;\n  ticks: readonly ChartDataTypes[];\n  tickFormatter?: (value: ChartDataTypes) => string;\n  autoWidth: (value: number) => void;\n}\n\nexport default memo(LabelsMeasure) as typeof LabelsMeasure;\n\n// Places the invisible left-hand side labels to calculate their maximum width.\nfunction LabelsMeasure({ scale, ticks, tickFormatter, autoWidth }: LabelsMeasureProps) {\n  const [width, ref] = useContainerQuery<number>(rect => rect.contentBoxWidth);\n\n  // Tell elements's width to the parent.\n  useEffect(() => {\n    autoWidth(width || 0);\n  }, [autoWidth, width]);\n\n  const labelMapper = (value: ChartDataTypes) => {\n    const scaledValue = scale.d3Scale(value as any);\n    if (scaledValue === undefined || !isFinite(scaledValue)) {\n      return null;\n    }\n\n    return (\n      <div key={`${value}`} className={styles['labels-left__label']} aria-hidden=\"true\">\n        {tickFormatter ? tickFormatter(value as any) : value.toString()}\n      </div>\n    );\n  };\n\n  return (\n    <div ref={ref} className={clsx(styles['labels-left'], styles['labels-left--hidden'])}>\n      {ticks.map(labelMapper)}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"labels-measure.js","sourceRoot":"lib/default/","sources":["internal/components/cartesian-chart/labels-measure.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,IAAI,MAAM,MAAM,CAAC;AAIxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AAUzE,eAAe,IAAI,CAAC,aAAa,CAAyB,CAAC;AAE3D,+EAA+E;AAC/E,SAAS,aAAa,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,cAAc,EAAsB;IACnG,MAAM,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,iBAAiB,CAAS,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IAE7E,uCAAuC;IACvC,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC;IACxB,CAAC,EAAE,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC;IAEvB,MAAM,WAAW,GAAG,CAAC,KAAqB,EAAE,EAAE;QAC5C,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,KAAY,CAAC,CAAC;QAChD,IAAI,WAAW,KAAK,SAAS,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE;YACvD,OAAO,IAAI,CAAC;SACb;QAED,MAAM,cAAc,GAAG,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,KAAY,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;QACtF,MAAM,KAAK,GAAG,CAAC,cAAc,GAAG,EAAE,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QAEhD,OAAO,CACL,oBAAC,QAAQ,IAAC,GAAG,EAAE,GAAG,KAAK,EAAE,IACtB,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,CAC9B,6BAAK,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,CAAC,oBAAoB,CAAC,iBAAc,MAAM,IAC7E,IAAI,CACD,CACP,CAAC,CACO,CACZ,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC,qBAAqB,CAAC,CAAC,EACrE,KAAK,EAAE,EAAE,QAAQ,EAAE,cAAc,EAAE,IAElC,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CACnB,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo, useEffect, Fragment } from 'react';\nimport clsx from 'clsx';\n\nimport { ChartScale, NumericChartScale } from './scales';\n\nimport styles from './styles.css.js';\nimport { ChartDataTypes } from '../../../mixed-line-bar-chart/interfaces';\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\n\ninterface LabelsMeasureProps {\n  scale: ChartScale | NumericChartScale;\n  ticks: readonly ChartDataTypes[];\n  tickFormatter?: (value: ChartDataTypes) => string;\n  autoWidth: (value: number) => void;\n  maxLabelsWidth?: number;\n}\n\nexport default memo(LabelsMeasure) as typeof LabelsMeasure;\n\n// Places the invisible left-hand side labels to calculate their maximum width.\nfunction LabelsMeasure({ scale, ticks, tickFormatter, autoWidth, maxLabelsWidth }: LabelsMeasureProps) {\n  const [width, ref] = useContainerQuery<number>(rect => rect.contentBoxWidth);\n\n  // Tell elements's width to the parent.\n  useEffect(() => {\n    autoWidth(width || 0);\n  }, [autoWidth, width]);\n\n  const labelMapper = (value: ChartDataTypes) => {\n    const scaledValue = scale.d3Scale(value as any);\n    if (scaledValue === undefined || !isFinite(scaledValue)) {\n      return null;\n    }\n\n    const formattedValue = tickFormatter ? tickFormatter(value as any) : value.toString();\n    const lines = (formattedValue + '').split('\\n');\n\n    return (\n      <Fragment key={`${value}`}>\n        {lines.map((line, lineIndex) => (\n          <div key={lineIndex} className={styles['labels-left__label']} aria-hidden=\"true\">\n            {line}\n          </div>\n        ))}\n      </Fragment>\n    );\n  };\n\n  return (\n    <div\n      ref={ref}\n      className={clsx(styles['labels-left'], styles['labels-left--hidden'])}\n      style={{ maxWidth: maxLabelsWidth }}\n    >\n      {ticks.map(labelMapper)}\n    </div>\n  );\n}\n"]}

package/internal/components/cartesian-chart/left-labels.d.ts

@@ -3,8 +3,9 @@ import { ChartScale, NumericChartScale } from './scales';
 import { ChartDataTypes } from '../../../mixed-line-bar-chart/interfaces';
 interface LeftLabelsProps {
     axis?: 'x' | 'y';
-    width: number;
-    height: number;
+    plotWidth: number;
+    plotHeight: number;
+    maxLabelsWidth?: number;
     scale: ChartScale | NumericChartScale;
     ticks: readonly ChartDataTypes[];
     tickFormatter?: (value: number) => string;
@@ -13,5 +14,5 @@ interface LeftLabelsProps {
 }
 declare const _default: typeof LeftLabels;
 export default _default;
-declare function LeftLabels({ axis, width, height, scale, ticks, tickFormatter, title, ariaRoleDescription, }: LeftLabelsProps): JSX.Element;
+declare function LeftLabels({ axis, plotWidth, plotHeight, maxLabelsWidth, scale, ticks, tickFormatter, title, ariaRoleDescription, }: LeftLabelsProps): JSX.Element;
 //# sourceMappingURL=left-labels.d.ts.map

package/internal/components/cartesian-chart/left-labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"left-labels.d.ts","sourceRoot":"lib/default/","sources":["internal/components/cartesian-chart/left-labels.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAKzD,OAAO,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;AAK1E,UAAU,eAAe;IACvB,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,UAAU,GAAG,iBAAiB,CAAC;IACtC,KAAK,EAAE,SAAS,cAAc,EAAE,CAAC;IACjC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B;;AAED,wBAAqD;AAGrD,iBAAS,UAAU,CAAC,EAClB,IAAU,EACV,KAAK,EACL,MAAM,EACN,KAAK,EACL,KAAK,EACL,aAAa,EACb,KAAK,EACL,mBAAmB,GACpB,EAAE,eAAe,eAkEjB"}
+{"version":3,"file":"left-labels.d.ts","sourceRoot":"lib/default/","sources":["internal/components/cartesian-chart/left-labels.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAKzD,OAAO,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;AAM1E,UAAU,eAAe;IACvB,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,EAAE,UAAU,GAAG,iBAAiB,CAAC;IACtC,KAAK,EAAE,SAAS,cAAc,EAAE,CAAC;IACjC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B;;AAED,wBAAqD;AAGrD,iBAAS,UAAU,CAAC,EAClB,IAAU,EACV,SAAS,EACT,UAAU,EACV,cAAyC,EACzC,KAAK,EACL,KAAK,EACL,aAAa,EACb,KAAK,EACL,mBAAmB,GACpB,EAAE,eAAe,eA4EjB"}

package/internal/components/cartesian-chart/left-labels.js

@@ -2,40 +2,50 @@
 // SPDX-License-Identifier: Apache-2.0
 import React, { memo, useRef } from 'react';
 import clsx from 'clsx';
-import { TICK_LENGTH, TICK_MARGIN } from './constants';
+import { TICK_LENGTH, TICK_LINE_HEIGHT, TICK_MARGIN } from './constants';
 import styles from './styles.css.js';
-import { formatTicks, getVisibleTicks } from './label-utils';
+import { formatTicks, getSVGTextSize, getVisibleTicks } from './label-utils';
 import { useInternalI18n } from '../../../i18n/context';
+import ResponsiveText from '../responsive-text';
 const OFFSET_PX = 12;
 export default memo(LeftLabels);
 // Renders the visible tick labels on the left axis, as well as their grid lines.
-function LeftLabels({ axis = 'y', width, height, scale, ticks, tickFormatter, title, ariaRoleDescription, }) {
+function LeftLabels({ axis = 'y', plotWidth, plotHeight, maxLabelsWidth = Number.POSITIVE_INFINITY, scale, ticks, tickFormatter, title, ariaRoleDescription, }) {
     const i18n = useInternalI18n('[charts]');
     const virtualTextRef = useRef(null);
     const yOffset = axis === 'x' && scale.isCategorical() ? Math.max(0, scale.d3Scale.bandwidth() - 1) / 2 : 0;
-    const cacheRef = useRef({});
+    const labelToBoxCache = useRef({});
     const getLabelSpace = (label) => {
-        if (cacheRef.current[label] !== undefined) {
-            return cacheRef.current[label];
+        var _a, _b, _c, _d;
+        if (labelToBoxCache.current[label] !== undefined) {
+            return (_b = (_a = labelToBoxCache.current[label]) === null || _a === void 0 ? void 0 : _a.height) !== null && _b !== void 0 ? _b : 0;
         }
-        if (virtualTextRef.current && virtualTextRef.current.getBBox) {
+        if (virtualTextRef.current) {
             virtualTextRef.current.textContent = label;
-            cacheRef.current[label] = virtualTextRef.current.getBBox().height;
-            return cacheRef.current[label];
         }
-        return 0;
+        labelToBoxCache.current[label] = getSVGTextSize(virtualTextRef.current);
+        return (_d = (_c = labelToBoxCache.current[label]) === null || _c === void 0 ? void 0 : _c.height) !== null && _d !== void 0 ? _d : 0;
     };
     const formattedTicks = formatTicks({ ticks, scale, getLabelSpace, tickFormatter });
     if (virtualTextRef.current) {
         virtualTextRef.current.textContent = '';
     }
     const from = 0 - OFFSET_PX - yOffset;
-    const until = height + OFFSET_PX - yOffset;
+    const until = plotHeight + OFFSET_PX - yOffset;
     const visibleTicks = getVisibleTicks(formattedTicks, from, until);
     return (React.createElement("g", { className: clsx(styles['labels-left']), "aria-label": title, role: "list", "aria-roledescription": i18n('i18nStrings.chartAriaRoleDescription', ariaRoleDescription), "aria-hidden": true },
         visibleTicks.map(({ position, lines }, index) => isFinite(position) && (React.createElement("g", { key: index, role: "listitem", transform: `translate(0,${position + yOffset})`, className: clsx(styles.ticks, axis === 'x' ? styles['ticks--x'] : styles['ticks--y']) },
-            axis === 'y' && (React.createElement("line", { className: clsx(styles.grid, styles.ticks_line), x1: -TICK_LENGTH, y1: 0, x2: width, y2: 0, "aria-hidden": "true" })),
-            React.createElement("text", { className: styles.ticks__text, x: -(TICK_LENGTH + TICK_MARGIN), y: 0 }, lines.join(' '))))),
+            axis === 'y' && (React.createElement("line", { className: clsx(styles.grid, styles.ticks_line), x1: -TICK_LENGTH, y1: 0, x2: plotWidth, y2: 0, "aria-hidden": "true" })),
+            lines.map((line, lineIndex) => {
+                var _a, _b;
+                const lineTextProps = {
+                    x: -(TICK_LENGTH + TICK_MARGIN),
+                    y: (lineIndex - (lines.length - 1) * 0.5) * TICK_LINE_HEIGHT,
+                    className: styles.ticks__text,
+                    children: line,
+                };
+                return ((_b = (_a = labelToBoxCache.current[lines[0]]) === null || _a === void 0 ? void 0 : _a.width) !== null && _b !== void 0 ? _b : 0) > maxLabelsWidth ? (React.createElement(ResponsiveText, Object.assign({ key: lineIndex }, lineTextProps, { maxWidth: maxLabelsWidth }))) : (React.createElement("text", Object.assign({ key: lineIndex }, lineTextProps)));
+            })))),
         React.createElement("text", { ref: virtualTextRef, x: 0, y: 0, style: { visibility: 'hidden' }, "aria-hidden": "true" })));
 }
 //# sourceMappingURL=left-labels.js.map

package/internal/components/cartesian-chart/left-labels.js.map

@@ -1 +1 @@
-{"version":3,"file":"left-labels.js","sourceRoot":"lib/default/","sources":["internal/components/cartesian-chart/left-labels.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, { memo, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { ChartScale, NumericChartScale } from './scales';\nimport { TICK_LENGTH, TICK_MARGIN } from './constants';\n\nimport styles from './styles.css.js';\nimport { formatTicks, getVisibleTicks } from './label-utils';\nimport { ChartDataTypes } from '../../../mixed-line-bar-chart/interfaces';\nimport { useInternalI18n } from '../../../i18n/context';\n\nconst OFFSET_PX = 12;\n\ninterface LeftLabelsProps {\n  axis?: 'x' | 'y';\n  width: number;\n  height: number;\n  scale: ChartScale | NumericChartScale;\n  ticks: readonly ChartDataTypes[];\n  tickFormatter?: (value: number) => string;\n  title?: string;\n  ariaRoleDescription?: string;\n}\n\nexport default memo(LeftLabels) as typeof LeftLabels;\n\n// Renders the visible tick labels on the left axis, as well as their grid lines.\nfunction LeftLabels({\n  axis = 'y',\n  width,\n  height,\n  scale,\n  ticks,\n  tickFormatter,\n  title,\n  ariaRoleDescription,\n}: LeftLabelsProps) {\n  const i18n = useInternalI18n('[charts]');\n  const virtualTextRef = useRef<SVGTextElement>(null);\n\n  const yOffset = axis === 'x' && scale.isCategorical() ? Math.max(0, scale.d3Scale.bandwidth() - 1) / 2 : 0;\n\n  const cacheRef = useRef<{ [label: string]: number }>({});\n  const getLabelSpace = (label: string) => {\n    if (cacheRef.current[label] !== undefined) {\n      return cacheRef.current[label];\n    }\n    if (virtualTextRef.current && virtualTextRef.current.getBBox) {\n      virtualTextRef.current.textContent = label;\n      cacheRef.current[label] = virtualTextRef.current.getBBox().height;\n      return cacheRef.current[label];\n    }\n    return 0;\n  };\n\n  const formattedTicks = formatTicks({ ticks, scale, getLabelSpace, tickFormatter });\n\n  if (virtualTextRef.current) {\n    virtualTextRef.current.textContent = '';\n  }\n\n  const from = 0 - OFFSET_PX - yOffset;\n  const until = height + OFFSET_PX - yOffset;\n  const visibleTicks = getVisibleTicks(formattedTicks, from, until);\n\n  return (\n    <g\n      className={clsx(styles['labels-left'])}\n      aria-label={title}\n      role=\"list\"\n      aria-roledescription={i18n('i18nStrings.chartAriaRoleDescription', ariaRoleDescription)}\n      aria-hidden={true}\n    >\n      {visibleTicks.map(\n        ({ position, lines }, index) =>\n          isFinite(position) && (\n            <g\n              key={index}\n              role=\"listitem\"\n              transform={`translate(0,${position + yOffset})`}\n              className={clsx(styles.ticks, axis === 'x' ? styles['ticks--x'] : styles['ticks--y'])}\n            >\n              {axis === 'y' && (\n                <line\n                  className={clsx(styles.grid, styles.ticks_line)}\n                  x1={-TICK_LENGTH}\n                  y1={0}\n                  x2={width}\n                  y2={0}\n                  aria-hidden=\"true\"\n                />\n              )}\n              <text className={styles.ticks__text} x={-(TICK_LENGTH + TICK_MARGIN)} y={0}>\n                {lines.join(' ')}\n              </text>\n            </g>\n          )\n      )}\n\n      <text ref={virtualTextRef} x={0} y={0} style={{ visibility: 'hidden' }} aria-hidden=\"true\"></text>\n    </g>\n  );\n}\n"]}
+{"version":3,"file":"left-labels.js","sourceRoot":"lib/default/","sources":["internal/components/cartesian-chart/left-labels.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, { memo, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { ChartScale, NumericChartScale } from './scales';\nimport { TICK_LENGTH, TICK_LINE_HEIGHT, TICK_MARGIN } from './constants';\n\nimport styles from './styles.css.js';\nimport { formatTicks, getSVGTextSize, getVisibleTicks } from './label-utils';\nimport { ChartDataTypes } from '../../../mixed-line-bar-chart/interfaces';\nimport { useInternalI18n } from '../../../i18n/context';\nimport ResponsiveText from '../responsive-text';\n\nconst OFFSET_PX = 12;\n\ninterface LeftLabelsProps {\n  axis?: 'x' | 'y';\n  plotWidth: number;\n  plotHeight: number;\n  maxLabelsWidth?: number;\n  scale: ChartScale | NumericChartScale;\n  ticks: readonly ChartDataTypes[];\n  tickFormatter?: (value: number) => string;\n  title?: string;\n  ariaRoleDescription?: string;\n}\n\nexport default memo(LeftLabels) as typeof LeftLabels;\n\n// Renders the visible tick labels on the left axis, as well as their grid lines.\nfunction LeftLabels({\n  axis = 'y',\n  plotWidth,\n  plotHeight,\n  maxLabelsWidth = Number.POSITIVE_INFINITY,\n  scale,\n  ticks,\n  tickFormatter,\n  title,\n  ariaRoleDescription,\n}: LeftLabelsProps) {\n  const i18n = useInternalI18n('[charts]');\n  const virtualTextRef = useRef<SVGTextElement>(null);\n\n  const yOffset = axis === 'x' && scale.isCategorical() ? Math.max(0, scale.d3Scale.bandwidth() - 1) / 2 : 0;\n\n  const labelToBoxCache = useRef<{ [label: string]: undefined | { width: number; height: number } }>({});\n  const getLabelSpace = (label: string) => {\n    if (labelToBoxCache.current[label] !== undefined) {\n      return labelToBoxCache.current[label]?.height ?? 0;\n    }\n    if (virtualTextRef.current) {\n      virtualTextRef.current.textContent = label;\n    }\n    labelToBoxCache.current[label] = getSVGTextSize(virtualTextRef.current);\n    return labelToBoxCache.current[label]?.height ?? 0;\n  };\n\n  const formattedTicks = formatTicks({ ticks, scale, getLabelSpace, tickFormatter });\n\n  if (virtualTextRef.current) {\n    virtualTextRef.current.textContent = '';\n  }\n\n  const from = 0 - OFFSET_PX - yOffset;\n  const until = plotHeight + OFFSET_PX - yOffset;\n  const visibleTicks = getVisibleTicks(formattedTicks, from, until);\n\n  return (\n    <g\n      className={clsx(styles['labels-left'])}\n      aria-label={title}\n      role=\"list\"\n      aria-roledescription={i18n('i18nStrings.chartAriaRoleDescription', ariaRoleDescription)}\n      aria-hidden={true}\n    >\n      {visibleTicks.map(\n        ({ position, lines }, index) =>\n          isFinite(position) && (\n            <g\n              key={index}\n              role=\"listitem\"\n              transform={`translate(0,${position + yOffset})`}\n              className={clsx(styles.ticks, axis === 'x' ? styles['ticks--x'] : styles['ticks--y'])}\n            >\n              {axis === 'y' && (\n                <line\n                  className={clsx(styles.grid, styles.ticks_line)}\n                  x1={-TICK_LENGTH}\n                  y1={0}\n                  x2={plotWidth}\n                  y2={0}\n                  aria-hidden=\"true\"\n                />\n              )}\n\n              {lines.map((line, lineIndex) => {\n                const lineTextProps = {\n                  x: -(TICK_LENGTH + TICK_MARGIN),\n                  y: (lineIndex - (lines.length - 1) * 0.5) * TICK_LINE_HEIGHT,\n                  className: styles.ticks__text,\n                  children: line,\n                };\n                return (labelToBoxCache.current[lines[0]]?.width ?? 0) > maxLabelsWidth ? (\n                  <ResponsiveText key={lineIndex} {...lineTextProps} maxWidth={maxLabelsWidth} />\n                ) : (\n                  <text key={lineIndex} {...lineTextProps} />\n                );\n              })}\n            </g>\n          )\n      )}\n\n      <text ref={virtualTextRef} x={0} y={0} style={{ visibility: 'hidden' }} aria-hidden=\"true\"></text>\n    </g>\n  );\n}\n"]}

package/internal/components/responsive-text/index.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface ResponsiveTextProps {
+    x: number;
+    y: number;
+    className?: string;
+    children: string;
+    maxWidth: number;
+}
+declare const _default: React.MemoExoticComponent<typeof ResponsiveText>;
+export default _default;
+declare function ResponsiveText({ x, y, className, children, maxWidth }: ResponsiveTextProps): JSX.Element;
+export declare function renderTextContent(textNode: SVGTextElement, text: string, maxWidth: number): void;
+//# sourceMappingURL=index.d.ts.map

package/internal/components/responsive-text/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/components/responsive-text/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAGvD,UAAU,mBAAmB;IAC3B,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;CAClB;;AAED,wBAAoC;AAEpC,iBAAS,cAAc,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,mBAAmB,eAanF;AAED,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,cAAc,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,QAWzF"}

package/internal/components/responsive-text/index.js

@@ -0,0 +1,32 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React, { memo, useEffect, useRef } from 'react';
+import { getTextWidth } from './responsive-text-utils';
+export default memo(ResponsiveText);
+function ResponsiveText({ x, y, className, children, maxWidth }) {
+    const textRef = useRef(null);
+    // Determine the visible width of the text and if necessary truncate it until it fits.
+    useEffect(() => {
+        renderTextContent(textRef.current, children, maxWidth);
+    }, [maxWidth, children]);
+    return (React.createElement("text", { ref: textRef, x: x, y: y, style: { textAnchor: 'end' }, className: className }, children));
+}
+export function renderTextContent(textNode, text, maxWidth) {
+    let visibleLength = text.length;
+    while (visibleLength >= 0) {
+        textNode.textContent = truncateText(text, visibleLength);
+        if (getTextWidth(textNode) <= maxWidth) {
+            return;
+        }
+        else {
+            visibleLength--;
+        }
+    }
+}
+function truncateText(text, maxLength) {
+    if (text.length === maxLength) {
+        return text;
+    }
+    return text.slice(0, maxLength) + '…';
+}
+//# sourceMappingURL=index.js.map

package/internal/components/responsive-text/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/components/responsive-text/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAUvD,eAAe,IAAI,CAAC,cAAc,CAAC,CAAC;AAEpC,SAAS,cAAc,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAuB;IAClF,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE7C,sFAAsF;IACtF,SAAS,CAAC,GAAG,EAAE;QACb,iBAAiB,CAAC,OAAO,CAAC,OAAQ,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAC1D,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEzB,OAAO,CACL,8BAAM,GAAG,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,SAAS,IAC/E,QAAQ,CACJ,CACR,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,iBAAiB,CAAC,QAAwB,EAAE,IAAY,EAAE,QAAgB;IACxF,IAAI,aAAa,GAAG,IAAI,CAAC,MAAM,CAAC;IAChC,OAAO,aAAa,IAAI,CAAC,EAAE;QACzB,QAAQ,CAAC,WAAW,GAAG,YAAY,CAAC,IAAI,EAAE,aAAa,CAAC,CAAC;QAEzD,IAAI,YAAY,CAAC,QAAQ,CAAC,IAAI,QAAQ,EAAE;YACtC,OAAO;SACR;aAAM;YACL,aAAa,EAAE,CAAC;SACjB;KACF;AACH,CAAC;AAED,SAAS,YAAY,CAAC,IAAY,EAAE,SAAiB;IACnD,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,EAAE;QAC7B,OAAO,IAAI,CAAC;KACb;IACD,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,SAAS,CAAC,GAAG,GAAG,CAAC;AACxC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo, useEffect, useRef } from 'react';\nimport { getTextWidth } from './responsive-text-utils';\n\ninterface ResponsiveTextProps {\n  x: number;\n  y: number;\n  className?: string;\n  children: string;\n  maxWidth: number;\n}\n\nexport default memo(ResponsiveText);\n\nfunction ResponsiveText({ x, y, className, children, maxWidth }: ResponsiveTextProps) {\n  const textRef = useRef<SVGTextElement>(null);\n\n  // Determine the visible width of the text and if necessary truncate it until it fits.\n  useEffect(() => {\n    renderTextContent(textRef.current!, children, maxWidth);\n  }, [maxWidth, children]);\n\n  return (\n    <text ref={textRef} x={x} y={y} style={{ textAnchor: 'end' }} className={className}>\n      {children}\n    </text>\n  );\n}\n\nexport function renderTextContent(textNode: SVGTextElement, text: string, maxWidth: number) {\n  let visibleLength = text.length;\n  while (visibleLength >= 0) {\n    textNode.textContent = truncateText(text, visibleLength);\n\n    if (getTextWidth(textNode) <= maxWidth) {\n      return;\n    } else {\n      visibleLength--;\n    }\n  }\n}\n\nfunction truncateText(text: string, maxLength: number) {\n  if (text.length === maxLength) {\n    return text;\n  }\n  return text.slice(0, maxLength) + '…';\n}\n"]}

package/internal/components/responsive-text/responsive-text-utils.d.ts

@@ -0,0 +1,2 @@
+export declare function getTextWidth(textNode: SVGTextElement): number;
+//# sourceMappingURL=responsive-text-utils.d.ts.map

package/internal/components/responsive-text/responsive-text-utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"responsive-text-utils.d.ts","sourceRoot":"lib/default/","sources":["internal/components/responsive-text/responsive-text-utils.ts"],"names":[],"mappings":"AAKA,wBAAgB,YAAY,CAAC,QAAQ,EAAE,cAAc,UAKpD"}

package/internal/components/responsive-text/responsive-text-utils.js

@@ -0,0 +1,11 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+// Ignoring as unsupported in JSDom.
+/* istanbul ignore next */
+export function getTextWidth(textNode) {
+    if (textNode.getComputedTextLength) {
+        return textNode.getComputedTextLength();
+    }
+    return -1;
+}
+//# sourceMappingURL=responsive-text-utils.js.map

package/internal/components/responsive-text/responsive-text-utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"responsive-text-utils.js","sourceRoot":"lib/default/","sources":["internal/components/responsive-text/responsive-text-utils.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,oCAAoC;AACpC,0BAA0B;AAC1B,MAAM,UAAU,YAAY,CAAC,QAAwB;IACnD,IAAI,QAAQ,CAAC,qBAAqB,EAAE;QAClC,OAAO,QAAQ,CAAC,qBAAqB,EAAE,CAAC;KACzC;IACD,OAAO,CAAC,CAAC,CAAC;AACZ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\n// Ignoring as unsupported in JSDom.\n/* istanbul ignore next */\nexport function getTextWidth(textNode: SVGTextElement) {\n  if (textNode.getComputedTextLength) {\n    return textNode.getComputedTextLength();\n  }\n  return -1;\n}\n"]}

package/internal/environment.js

@@ -1,4 +1,4 @@
 export var PACKAGE_SOURCE = "components";
-export var PACKAGE_VERSION = "3.0.0 (733845a7)";
+export var PACKAGE_VERSION = "3.0.0 (e443ad08)";
 export var THEME = "open-source-visual-refresh";
 export var ALWAYS_VISUAL_REFRESH = true;

package/internal/environment.json

@@ -1,6 +1,6 @@
 {
   "PACKAGE_SOURCE": "components",
-  "PACKAGE_VERSION": "3.0.0 (733845a7)",
+  "PACKAGE_VERSION": "3.0.0 (e443ad08)",
   "THEME": "default",
   "ALWAYS_VISUAL_REFRESH": false
 }

package/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "733845a776e6257ec6d838ecdbc6a0925ef0cf30"
+  "commit": "e443ad0810149da92b3299acd762a08b1ff1080c"
 }

package/mixed-line-bar-chart/chart-container.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart-container.d.ts","sourceRoot":"lib/default/","sources":["mixed-line-bar-chart/chart-container.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"chart-container.d.ts","sourceRoot":"lib/default/","sources":["mixed-line-bar-chart/chart-container.tsx"],"names":[],"mappings":"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"}

package/mixed-line-bar-chart/chart-container.js

@@ -40,6 +40,7 @@ export default function ChartContainer(_a) {
     const [leftLabelsWidth, setLeftLabelsWidth] = useState(0);
     const [verticalMarkerX, setVerticalMarkerX] = useState(null);
     const [containerWidth, containerMeasureRef] = useContainerWidth(500);
+    const maxLeftLabelsWidth = Math.round(containerWidth / 2);
     const plotWidth = containerWidth ? containerWidth - leftLabelsWidth - LEFT_LABELS_MARGIN : 500;
     const containerRefObject = useRef(null);
     const containerRef = useMergeRefs(containerMeasureRef, containerRefObject);
@@ -325,10 +326,10 @@ export default function ChartContainer(_a) {
     const activeLiveRegion = activeAriaLabel && !highlightedPoint && highlightedGroupIndex === null ? activeAriaLabel : '';
     const isLineXKeyboardFocused = isPlotFocused && !highlightedPoint && verticalMarkerX;
     const isRefresh = useVisualRefresh();
-    return (React.createElement(CartesianChartContainer, { ref: containerRef, minHeight: explicitPlotHeight + bottomLabelsProps.height, fitHeight: !!fitHeight, leftAxisLabel: React.createElement(AxisLabel, { axis: y, position: "left", title: leftAxisProps.title }), leftAxisLabelMeasure: React.createElement(LabelsMeasure, { ticks: leftAxisProps.ticks, scale: leftAxisProps.scale, tickFormatter: leftAxisProps.tickFormatter, autoWidth: setLeftLabelsWidth }), bottomAxisLabel: React.createElement(AxisLabel, { axis: x, position: "bottom", title: bottomAxisProps.title }), chartPlot: React.createElement(ChartPlot, { ref: plotRef, width: "100%", height: fitHeight ? `calc(100% - ${bottomLabelsProps.height}px)` : plotHeight, offsetBottom: bottomLabelsProps.height, isClickable: isPopoverOpen && !isPopoverPinned, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, ariaDescription: ariaDescription, ariaRoleDescription: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.chartAriaRoleDescription, ariaLiveRegion: activeLiveRegion, activeElementRef: highlightedElementRef, activeElementKey: isPlotFocused &&
+    return (React.createElement(CartesianChartContainer, { ref: containerRef, minHeight: explicitPlotHeight + bottomLabelsProps.height, fitHeight: !!fitHeight, leftAxisLabel: React.createElement(AxisLabel, { axis: y, position: "left", title: leftAxisProps.title }), leftAxisLabelMeasure: React.createElement(LabelsMeasure, { ticks: leftAxisProps.ticks, scale: leftAxisProps.scale, tickFormatter: leftAxisProps.tickFormatter, autoWidth: setLeftLabelsWidth, maxLabelsWidth: maxLeftLabelsWidth }), bottomAxisLabel: React.createElement(AxisLabel, { axis: x, position: "bottom", title: bottomAxisProps.title }), chartPlot: React.createElement(ChartPlot, { ref: plotRef, width: "100%", height: fitHeight ? `calc(100% - ${bottomLabelsProps.height}px)` : plotHeight, offsetBottom: bottomLabelsProps.height, isClickable: isPopoverOpen && !isPopoverPinned, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, ariaDescription: ariaDescription, ariaRoleDescription: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.chartAriaRoleDescription, ariaLiveRegion: activeLiveRegion, activeElementRef: highlightedElementRef, activeElementKey: isPlotFocused &&
                 ((_c = highlightedGroupIndex === null || highlightedGroupIndex === void 0 ? void 0 : highlightedGroupIndex.toString()) !== null && _c !== void 0 ? _c : (isLineXKeyboardFocused ? `point-index-${handlers.xIndex}` : point === null || point === void 0 ? void 0 : point.key)), activeElementFocusOffset: isGroupNavigation ? 0 : isLineXKeyboardFocused ? { x: 8, y: 0 } : 3, onMouseMove: onSVGMouseMove, onMouseOut: onSVGMouseOut, onMouseDown: onSVGMouseDown, onFocus: onSVGFocus, onBlur: onSVGBlur, onKeyDown: onSVGKeyDown },
             React.createElement("line", { ref: plotMeasureRef, x1: "0", x2: "0", y1: "0", y2: "100%", stroke: "transparent", strokeWidth: 1, style: { pointerEvents: 'none' } }),
-            React.createElement(LeftLabels, { axis: y, ticks: leftAxisProps.ticks, scale: leftAxisProps.scale, tickFormatter: leftAxisProps.tickFormatter, title: leftAxisProps.title, ariaRoleDescription: leftAxisProps.ariaRoleDescription, width: plotWidth, height: plotHeight }),
+            React.createElement(LeftLabels, { axis: y, ticks: leftAxisProps.ticks, scale: leftAxisProps.scale, tickFormatter: leftAxisProps.tickFormatter, title: leftAxisProps.title, ariaRoleDescription: leftAxisProps.ariaRoleDescription, maxLabelsWidth: maxLeftLabelsWidth, plotWidth: plotWidth, plotHeight: plotHeight }),
             horizontalBars && (React.createElement(VerticalGridLines, { scale: yAxisProps.scale, ticks: yAxisProps.ticks, height: plotHeight })),
             emphasizeBaselineAxis && linesOnly && (React.createElement(EmphasizedBaseline, { axis: x, scale: yAxisProps.scale, width: plotWidth, height: plotHeight })),
             React.createElement(DataSeries, { axis: x, plotWidth: plotWidth, plotHeight: plotHeight, highlightedSeries: highlightedSeries !== null && highlightedSeries !== void 0 ? highlightedSeries : null, highlightedGroupIndex: highlightedGroupIndex, stackedBars: stackedBars, isGroupNavigation: isGroupNavigation, visibleSeries: visibleSeries, xScale: xAxisProps.scale, yScale: yAxisProps.scale }),