@cloudscape-design/chart-components 1.0.17 → 1.0.18

package/core/components/core-legend.d.ts

@@ -2,11 +2,12 @@
 import { NonCancelableEventHandler } from "../../internal/events";
 import { ChartAPI } from "../chart-api";
 import { BaseI18nStrings, CoreChartProps } from "../interfaces";
-export declare function ChartLegend({ api, title, actions, position, i18nStrings, onItemHighlight, getLegendTooltipContent, }: {
+export declare function ChartLegend({ api, title, actions, position, i18nStrings, onItemHighlight, getLegendTooltipContent, horizontalAlignment, }: {
     api: ChartAPI;
     title?: string;
     actions?: React.ReactNode;
     position: "bottom" | "side";
+    horizontalAlignment?: CoreChartProps.LegendOptionsHorizontalAlignment;
     i18nStrings?: BaseI18nStrings;
     onItemHighlight?: NonCancelableEventHandler<CoreChartProps.LegendItemHighlightDetail>;
     getLegendTooltipContent?: CoreChartProps.GetLegendTooltipContent;

package/core/components/core-legend.js

@@ -5,7 +5,7 @@ import { useInternalI18n } from "@cloudscape-design/components/internal/do-not-u
 import { ChartLegend as ChartLegendComponent } from "../../internal/components/chart-legend";
 import { fireNonCancelableEvent } from "../../internal/events";
 import { useSelector } from "../../internal/utils/async-store";
-export function ChartLegend({ api, title, actions, position, i18nStrings, onItemHighlight, getLegendTooltipContent, }) {
+export function ChartLegend({ api, title, actions, position, i18nStrings, onItemHighlight, getLegendTooltipContent, horizontalAlignment = "start", }) {
     const i18n = useInternalI18n("[charts]");
     const ariaLabel = i18n("i18nStrings.legendAriaLabel", i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.legendAriaLabel);
     const legendItems = useSelector(api.legendStore, (s) => s.items);
@@ -13,7 +13,7 @@ export function ChartLegend({ api, title, actions, position, i18nStrings, onItem
     if (legendItems.length === 0) {
         return null;
     }
-    return (_jsx(ChartLegendComponent, { ariaLabel: ariaLabel, legendTitle: title, items: legendItems, actions: actions, position: position, onItemVisibilityChange: api.onItemVisibilityChange, onItemHighlightExit: api.onClearChartItemsHighlight, onItemHighlightEnter: (item) => {
+    return (_jsx(ChartLegendComponent, { ariaLabel: ariaLabel, legendTitle: title, items: legendItems, horizontalAlignment: horizontalAlignment, actions: actions, position: position, onItemVisibilityChange: api.onItemVisibilityChange, onItemHighlightExit: api.onClearChartItemsHighlight, onItemHighlightEnter: (item) => {
             api.onHighlightChartItems([item.id]);
             fireNonCancelableEvent(onItemHighlight, { item });
         }, getTooltipContent: (props) => {

package/core/components/core-legend.js.map

@@ -1 +1 @@
-{"version":3,"file":"core-legend.js","sourceRoot":"","sources":["../../../../src/core/components/core-legend.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,eAAe,EAAE,MAAM,wDAAwD,CAAC;AAEzF,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,wCAAwC,CAAC;AAC7F,OAAO,EAAE,sBAAsB,EAA6B,MAAM,uBAAuB,CAAC;AAC1F,OAAO,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAI/D,MAAM,UAAU,WAAW,CAAC,EAC1B,GAAG,EACH,KAAK,EACL,OAAO,EACP,QAAQ,EACR,WAAW,EACX,eAAe,EACf,uBAAuB,GASxB;IACC,MAAM,IAAI,GAAG,eAAe,CAAC,UAAU,CAAC,CAAC;IACzC,MAAM,SAAS,GAAG,IAAI,CAAC,6BAA6B,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,eAAe,CAAC,CAAC;IACpF,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IACjE,MAAM,oBAAoB,GAAG,WAAW,CAAC,GAAG,CAAC,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;IAE5E,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC,EAAE;QAC5B,OAAO,IAAI,CAAC;KACb;IACD,OAAO,CACL,KAAC,oBAAoB,IACnB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,KAAK,EAClB,KAAK,EAAE,WAAW,EAClB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,sBAAsB,EAAE,GAAG,CAAC,sBAAsB,EAClD,mBAAmB,EAAE,GAAG,CAAC,0BAA0B,EACnD,oBAAoB,EAAE,CAAC,IAAI,EAAE,EAAE;YAC7B,GAAG,CAAC,qBAAqB,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;YACrC,sBAAsB,CAAC,eAAe,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC;QACpD,CAAC,EACD,iBAAiB,EAAE,CAAC,KAAK,EAAE,EAAE;;YAC3B,IAAI,oBAAoB,EAAE;gBACxB,OAAO,IAAI,CAAC;aACb;YACD,OAAO,MAAA,uBAAuB,aAAvB,uBAAuB,uBAAvB,uBAAuB,CAAG,KAAK,CAAC,mCAAI,IAAI,CAAC;QAClD,CAAC,GACD,CACH,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useInternalI18n } from \"@cloudscape-design/components/internal/do-not-use/i18n\";\n\nimport { ChartLegend as ChartLegendComponent } from \"../../internal/components/chart-legend\";\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from \"../../internal/events\";\nimport { useSelector } from \"../../internal/utils/async-store\";\nimport { ChartAPI } from \"../chart-api\";\nimport { BaseI18nStrings, CoreChartProps } from \"../interfaces\";\n\nexport function ChartLegend({\n  api,\n  title,\n  actions,\n  position,\n  i18nStrings,\n  onItemHighlight,\n  getLegendTooltipContent,\n}: {\n  api: ChartAPI;\n  title?: string;\n  actions?: React.ReactNode;\n  position: \"bottom\" | \"side\";\n  i18nStrings?: BaseI18nStrings;\n  onItemHighlight?: NonCancelableEventHandler<CoreChartProps.LegendItemHighlightDetail>;\n  getLegendTooltipContent?: CoreChartProps.GetLegendTooltipContent;\n}) {\n  const i18n = useInternalI18n(\"[charts]\");\n  const ariaLabel = i18n(\"i18nStrings.legendAriaLabel\", i18nStrings?.legendAriaLabel);\n  const legendItems = useSelector(api.legendStore, (s) => s.items);\n  const isChartTooltipPinned = useSelector(api.tooltipStore, (s) => s.pinned);\n\n  if (legendItems.length === 0) {\n    return null;\n  }\n  return (\n    <ChartLegendComponent\n      ariaLabel={ariaLabel}\n      legendTitle={title}\n      items={legendItems}\n      actions={actions}\n      position={position}\n      onItemVisibilityChange={api.onItemVisibilityChange}\n      onItemHighlightExit={api.onClearChartItemsHighlight}\n      onItemHighlightEnter={(item) => {\n        api.onHighlightChartItems([item.id]);\n        fireNonCancelableEvent(onItemHighlight, { item });\n      }}\n      getTooltipContent={(props) => {\n        if (isChartTooltipPinned) {\n          return null;\n        }\n        return getLegendTooltipContent?.(props) ?? null;\n      }}\n    />\n  );\n}\n"]}
+{"version":3,"file":"core-legend.js","sourceRoot":"","sources":["../../../../src/core/components/core-legend.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,eAAe,EAAE,MAAM,wDAAwD,CAAC;AAEzF,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,wCAAwC,CAAC;AAC7F,OAAO,EAAE,sBAAsB,EAA6B,MAAM,uBAAuB,CAAC;AAC1F,OAAO,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAI/D,MAAM,UAAU,WAAW,CAAC,EAC1B,GAAG,EACH,KAAK,EACL,OAAO,EACP,QAAQ,EACR,WAAW,EACX,eAAe,EACf,uBAAuB,EACvB,mBAAmB,GAAG,OAAO,GAU9B;IACC,MAAM,IAAI,GAAG,eAAe,CAAC,UAAU,CAAC,CAAC;IACzC,MAAM,SAAS,GAAG,IAAI,CAAC,6BAA6B,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,eAAe,CAAC,CAAC;IACpF,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IACjE,MAAM,oBAAoB,GAAG,WAAW,CAAC,GAAG,CAAC,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;IAE5E,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC,EAAE;QAC5B,OAAO,IAAI,CAAC;KACb;IACD,OAAO,CACL,KAAC,oBAAoB,IACnB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,KAAK,EAClB,KAAK,EAAE,WAAW,EAClB,mBAAmB,EAAE,mBAAmB,EACxC,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,sBAAsB,EAAE,GAAG,CAAC,sBAAsB,EAClD,mBAAmB,EAAE,GAAG,CAAC,0BAA0B,EACnD,oBAAoB,EAAE,CAAC,IAAI,EAAE,EAAE;YAC7B,GAAG,CAAC,qBAAqB,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;YACrC,sBAAsB,CAAC,eAAe,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC;QACpD,CAAC,EACD,iBAAiB,EAAE,CAAC,KAAK,EAAE,EAAE;;YAC3B,IAAI,oBAAoB,EAAE;gBACxB,OAAO,IAAI,CAAC;aACb;YACD,OAAO,MAAA,uBAAuB,aAAvB,uBAAuB,uBAAvB,uBAAuB,CAAG,KAAK,CAAC,mCAAI,IAAI,CAAC;QAClD,CAAC,GACD,CACH,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useInternalI18n } from \"@cloudscape-design/components/internal/do-not-use/i18n\";\n\nimport { ChartLegend as ChartLegendComponent } from \"../../internal/components/chart-legend\";\nimport { fireNonCancelableEvent, NonCancelableEventHandler } from \"../../internal/events\";\nimport { useSelector } from \"../../internal/utils/async-store\";\nimport { ChartAPI } from \"../chart-api\";\nimport { BaseI18nStrings, CoreChartProps } from \"../interfaces\";\n\nexport function ChartLegend({\n  api,\n  title,\n  actions,\n  position,\n  i18nStrings,\n  onItemHighlight,\n  getLegendTooltipContent,\n  horizontalAlignment = \"start\",\n}: {\n  api: ChartAPI;\n  title?: string;\n  actions?: React.ReactNode;\n  position: \"bottom\" | \"side\";\n  horizontalAlignment?: CoreChartProps.LegendOptionsHorizontalAlignment;\n  i18nStrings?: BaseI18nStrings;\n  onItemHighlight?: NonCancelableEventHandler<CoreChartProps.LegendItemHighlightDetail>;\n  getLegendTooltipContent?: CoreChartProps.GetLegendTooltipContent;\n}) {\n  const i18n = useInternalI18n(\"[charts]\");\n  const ariaLabel = i18n(\"i18nStrings.legendAriaLabel\", i18nStrings?.legendAriaLabel);\n  const legendItems = useSelector(api.legendStore, (s) => s.items);\n  const isChartTooltipPinned = useSelector(api.tooltipStore, (s) => s.pinned);\n\n  if (legendItems.length === 0) {\n    return null;\n  }\n  return (\n    <ChartLegendComponent\n      ariaLabel={ariaLabel}\n      legendTitle={title}\n      items={legendItems}\n      horizontalAlignment={horizontalAlignment}\n      actions={actions}\n      position={position}\n      onItemVisibilityChange={api.onItemVisibilityChange}\n      onItemHighlightExit={api.onClearChartItemsHighlight}\n      onItemHighlightEnter={(item) => {\n        api.onHighlightChartItems([item.id]);\n        fireNonCancelableEvent(onItemHighlight, { item });\n      }}\n      getTooltipContent={(props) => {\n        if (isChartTooltipPinned) {\n          return null;\n        }\n        return getLegendTooltipContent?.(props) ?? null;\n      }}\n    />\n  );\n}\n"]}

package/core/interfaces.d.ts

@@ -355,7 +355,12 @@ export declare namespace CoreChartProps {
     interface LegendOptions extends BaseLegendOptions {
         bottomMaxHeight?: number;
         position?: "bottom" | "side";
+        /**
+         * This property only applies when `position="bottom"`.
+         */
+        horizontalAlignment?: LegendOptionsHorizontalAlignment;
     }
+    type LegendOptionsHorizontalAlignment = "start" | "center";
     type LegendItem = InternalComponentTypes.LegendItem;
     type LegendTooltipContent = InternalComponentTypes.LegendTooltipContent;
     type GetLegendTooltipContent = InternalComponentTypes.GetLegendTooltipContent;
@@ -416,6 +421,7 @@ export interface CoreLegendProps {
     ariaLabel?: string;
     actions?: React.ReactNode;
     alignment?: "horizontal" | "vertical";
+    horizontalAlignment?: CoreChartProps.LegendOptionsHorizontalAlignment;
     onClearHighlight?: NonCancelableEventHandler;
     onItemHighlight?: NonCancelableEventHandler<CoreLegendProps.ItemHighlightDetail>;
     onVisibleItemsChange?: NonCancelableEventHandler<CoreLegendProps.VisibleItemsChangeDetail>;

package/core/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/core/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type Highcharts from \"highcharts\";\n\nimport type * as InternalComponentTypes from \"../internal/components/interfaces\";\nimport { type NonCancelableEventHandler } from \"../internal/events\";\n\n// All charts take `highcharts` instance, that can be served statically or dynamically.\n// Although it has to be of type Highcharts, the TS type we use is `null | object`, so\n// that it is ignored by the documenter.\n\n/**\n * This interface includes common public chart properties, applicable for all chart types.\n */\nexport interface BaseChartOptions {\n  /**\n   * The Highcharts instance, which can be obtained using `import Highcharts from \"highcharts\"`.\n   * Supported Highcharts versions: 12.\n   */\n  highcharts: null | object;\n\n  /**\n   * Custom content that renders when `highcharts=null`. It renders a spinner if not defined.\n   */\n  fallback?: React.ReactNode;\n\n  /**\n   * The height of the chart plot in pixels. It does not include legend and filter.\n   */\n  chartHeight?: number;\n\n  /**\n   * The chart automatically adjusts its height to fill the parent container when this property is set.\n   */\n  fitHeight?: boolean;\n\n  /**\n   * Defines the minimum allowed height of the chart plot. Use this when `fitHeight=true` to\n   * prevent the chart plot from becoming too small to display its content. When the parent\n   * container is shorter than the minimum height, a vertical scrollbar appears automatically.\n   */\n  chartMinHeight?: number;\n\n  /**\n   * Defines the minimum allowed width of the chart plot. When the parent container is narrower than the\n   * minimum width, the horizontal scrollbar is automatically added.\n   */\n  chartMinWidth?: number;\n\n  /**\n   * Defines the ARIA label for the chart container.\n   * This property corresponds to [lang.chartContainerLabel](https://api.highcharts.com/highcharts/lang.accessibility.chartContainerLabel),\n   * and requires the [accessibility module](https://www.highcharts.com/docs/accessibility/accessibility-module).\n   */\n  ariaLabel?: string;\n\n  /**\n   * Defines the ARIA description of the chart container.\n   * This property corresponds to [accessibility.description](https://api.highcharts.com/highcharts/accessibility.description),\n   * and requires the [accessibility module](https://www.highcharts.com/docs/accessibility/accessibility-module).\n   */\n  ariaDescription?: string;\n\n  /**\n   * Defines chart legend options, including:\n   * * `enabled` (optional, boolean) - Hides legend when set to `false`.\n   * * `title` (optional, string) - Visible label, shown above the legend.\n   * * `actions` (optional, slot) - A slot before the legend that can be used to render custom actions.\n   */\n  legend?: BaseLegendOptions;\n\n  /**\n   * Defines options to represent empty, no-match, loading, and error state of the chart, including:\n   * * `statusType` (optional, \"finished\" | \"loading\" | \"error\") - Specifies the current status of loading data.\n   * * `empty` (optional, ReactNode) - Content displayed when the chart data is empty.\n   * * `noMatch` (optional, ReactNode) - Content displayed when there is no data to display due to the built-in filtering.\n   * * `loading` (optional, ReactNode) - Content displayed when `statusType=\"loading\"`. If omitted, the default loading state\n   * is shown, using `i18n.loadingText` or built-in i18n.\n   * * `error` (optional, ReactNode) - Content displayed when `statusType=\"error\"`. If omitted, the default error state\n   * is shown, using `i18n.errorText` and `i18n.recoveryText` (when `onRecoveryClick` is provided), or built-in i18n.\n   * * `onRecoveryClick` (optional, function) - Called when the user clicks the recovery button that appears when using default error\n   * state, and only if `onRecoveryClick` is provided. Use this to enable the user to retry a failed request or provide another option\n   * for the user to recover from the error.\n   */\n  noData?: BaseNoDataOptions;\n\n  /**\n   * Defines options for filtering in the chart, including:\n   * * `seriesFilter` (optional, boolean) - Displays default series filter at the top of the chart.\n   * * `additionalFilters` (optional, slot) - A slot for custom chart filters at the top of the chart.\n   */\n  filter?: BaseFilterOptions;\n}\n\nexport interface BaseLegendOptions {\n  enabled?: boolean;\n  title?: string;\n  actions?: React.ReactNode;\n}\n\nexport interface BaseNoDataOptions {\n  statusType?: \"finished\" | \"loading\" | \"error\";\n  empty?: React.ReactNode;\n  error?: React.ReactNode;\n  loading?: React.ReactNode;\n  noMatch?: React.ReactNode;\n  onRecoveryClick?: NonCancelableEventHandler;\n}\n\nexport interface BaseTooltipDetail {\n  key: React.ReactNode;\n  value: React.ReactNode;\n}\n\nexport interface BaseI18nStrings {\n  loadingText?: string;\n  errorText?: string;\n  recoveryText?: string;\n  seriesFilterLabel?: string;\n  seriesFilterPlaceholder?: string;\n  seriesFilterSelectedAriaLabel?: string;\n  legendAriaLabel?: string;\n  detailPopoverDismissAriaLabel?: string;\n  chartRoleDescription?: string;\n}\n\nexport interface WithCartesianI18nStrings {\n  /**\n   * An object that contains all of the localized strings required by the component.\n   * @i18n\n   *\n   * Available properties:\n   * * `loadingText` (optional, string) - Text, displayed when the chart is loading, i.e. when `noData.statusType` is set to \"loading\".\n   * * `errorText` (optional, string) - Text, displayed when the chart is in error state, i.e. when `noData.statusType` is set to \"error\".\n   * * `recoveryText` (optional, string) - Text for the recovery button, displayed next to the error text.\n   * * `seriesFilterLabel` (optional, string) - Text for the visible label of the default series filter.\n   * * `seriesFilterPlaceholder` (optional, string) - Text for the default series filter placeholder.\n   * * `seriesFilterSelectedAriaLabel` (optional, string) - ARIA label of the default series filter which is appended to any option that is selected.\n   * * `legendAriaLabel` (optional, string) - ARIA label that is associated with the legend in case there is no visible `legend.title` defined.\n   * * `detailPopoverDismissAriaLabel` (optional, string) - ARIA label for the details popover dismiss button.\n   * * `chartRoleDescription` (optional, string) - Accessible role description of the chart plot area, e.g. \"interactive chart\".\n   * * `xAxisRoleDescription` (optional, string) - Accessible role description of the x axis, e.g. \"x axis\".\n   * * `yAxisRoleDescription` (optional, string) - Accessible role description of the y axis, e.g. \"y axis\".\n   */\n  i18nStrings?: CartesianI18nStrings;\n}\n\nexport interface WithPieI18nStrings {\n  /**\n   * An object that contains all of the localized strings required by the component.\n   * @i18n\n   *\n   * Available properties:\n   * * `loadingText` (optional, string) - Text, displayed when the chart is loading, i.e. when `noData.statusType` is set to \"loading\".\n   * * `errorText` (optional, string) - Text, displayed when the chart is in error state, i.e. when `noData.statusType` is set to \"error\".\n   * * `recoveryText` (optional, string) - Text for the recovery button, displayed next to the error text.\n   * * `seriesFilterLabel` (optional, string) - Text for the visible label of the default series filter.\n   * * `seriesFilterPlaceholder` (optional, string) - Text for the default series filter placeholder.\n   * * `seriesFilterSelectedAriaLabel` (optional, string) - ARIA label of the default series filter which is appended to any option that is selected.\n   * * `legendAriaLabel` (optional, string) - ARIA label that is associated with the legend in case there is no visible `legend.title` defined.\n   * * `detailPopoverDismissAriaLabel` (optional, string) - ARIA label for the details popover dismiss button.\n   * * `chartRoleDescription` (optional, string) - Accessible role description of the chart plot area, e.g. \"interactive chart\".\n   * * `segmentRoleDescription` (optional, string) - Accessible role description of the segment.\n   */\n  i18nStrings?: PieI18nStrings;\n}\n\nexport interface CartesianI18nStrings extends BaseI18nStrings {\n  xAxisRoleDescription?: string;\n  yAxisRoleDescription?: string;\n}\n\nexport interface PieI18nStrings extends BaseI18nStrings {\n  segmentRoleDescription?: string;\n}\n\nexport interface BaseFilterOptions {\n  seriesFilter?: boolean;\n  additionalFilters?: React.ReactNode;\n}\n\nexport interface BaseTooltipPointFormatted {\n  key?: React.ReactNode;\n  value?: React.ReactNode;\n  description?: React.ReactNode;\n  expandable?: boolean;\n  subItems?: ReadonlyArray<{ key: React.ReactNode; value: React.ReactNode }>;\n}\n\nexport interface AreaSeriesOptions extends BaseCartesianLineLikeOptions {\n  type: \"area\";\n  data: readonly PointDataItemType[];\n}\n\nexport interface AreaSplineSeriesOptions extends BaseCartesianLineLikeOptions {\n  type: \"areaspline\";\n  data: readonly PointDataItemType[];\n}\n\nexport interface ColumnSeriesOptions extends BaseCartesianSeriesOptions {\n  type: \"column\";\n  data: readonly PointDataItemType[];\n}\n\nexport interface LineSeriesOptions extends BaseCartesianLineLikeOptions {\n  type: \"line\";\n  data: readonly PointDataItemType[];\n}\n\nexport interface SplineSeriesOptions extends BaseCartesianLineLikeOptions {\n  type: \"spline\";\n  data: readonly PointDataItemType[];\n}\n\nexport interface ScatterSeriesOptions extends BaseCartesianSeriesOptions {\n  type: \"scatter\";\n  data: readonly PointDataItemType[];\n  marker?: PointMarkerOptions;\n}\n\nexport interface ErrorBarSeriesOptions extends Omit<BaseCartesianSeriesOptions, \"name\"> {\n  type: \"errorbar\";\n  name?: string;\n  data: readonly RangeDataItemOptions[];\n  linkedTo: string;\n}\n\nexport interface XThresholdSeriesOptions extends BaseCartesianLineLikeOptions {\n  type: \"x-threshold\";\n  value: number;\n}\n\nexport interface YThresholdSeriesOptions extends BaseCartesianLineLikeOptions {\n  type: \"y-threshold\";\n  value: number;\n}\n\nexport interface PieSeriesOptions extends BaseSeriesOptions {\n  type: \"pie\";\n  data: readonly PieSegmentOptions[];\n}\n\nexport interface DonutSeriesOptions extends BaseSeriesOptions {\n  type: \"donut\";\n  data: readonly PieSegmentOptions[];\n}\n\nexport interface PieSegmentOptions {\n  y: number | null;\n  id?: string;\n  name: string;\n  color?: string;\n}\n\nexport type PointDataItemType = null | number | PointDataItemOptions;\n\nexport interface PointDataItemOptions {\n  x?: number;\n  y: number | null;\n}\n\nexport interface RangeDataItemOptions {\n  x?: number;\n  low: number;\n  high: number;\n}\n\ninterface BaseSeriesOptions {\n  id?: string;\n  name: string;\n  color?: string;\n}\n\ntype BaseCartesianSeriesOptions = BaseSeriesOptions;\n\ninterface BaseCartesianLineLikeOptions extends BaseCartesianSeriesOptions {\n  dashStyle?: Highcharts.DashStyleValue;\n}\n\n// The symbols union matches that of Highcharts.PointMarkerOptionsObject\ninterface PointMarkerOptions {\n  symbol?: \"circle\" | \"diamond\" | \"square\" | \"triangle\" | \"triangle-down\";\n}\n\nexport interface CoreCartesianOptions {\n  /**\n   * When set to `true`, adds a visual emphasis on the zero baseline axis.\n   */\n  emphasizeBaseline?: boolean;\n  /**\n   * Controls the placement of the vertical axis title.\n   * When set to \"side\", displays the title along the axis line.\n   */\n  verticalAxisTitlePlacement?: \"top\" | \"side\";\n}\n\nexport interface CoreChartProps\n  extends Pick<\n      BaseChartOptions,\n      | \"highcharts\"\n      | \"fallback\"\n      | \"fitHeight\"\n      | \"chartHeight\"\n      | \"chartMinHeight\"\n      | \"chartMinWidth\"\n      | \"ariaLabel\"\n      | \"ariaDescription\"\n      | \"filter\"\n      | \"noData\"\n    >,\n    CoreCartesianOptions {\n  /**\n   * The Highcharts options. Cloudscape injects custom styles and settings, but all can be\n   * overridden with explicitly provided options. An exception is event handlers - those are\n   * not overridden, but merged with Cloudscape event handlers so that both are getting called.\n   */\n  options: CoreChartProps.ChartOptions;\n  /**\n   * The Cloudscape tooltip, that comes with a vertical cursor when used on cartesian series.\n   * The tooltip content is only shown when `getContent` property is defined, which is called\n   * for each visited { x, y } point.\n   */\n  tooltip?: CoreChartProps.TooltipOptions;\n  /**\n   * A custom slot above the chart plot, chart's axis title, and filter.\n   */\n  header?: CoreChartProps.HeaderOptions;\n  /**\n   * Prop for passing a custom navigation control component to be rendered with the chart.\n   * Use this property to add timeline navigation, range selectors, or other custom navigation elements.\n   */\n  navigator?: React.ReactNode;\n  /**\n   * A custom slot below the chart plot and legend.\n   */\n  footer?: CoreChartProps.FooterOptions;\n  /**\n   * Chart legend options.\n   */\n  legend?: CoreChartProps.LegendOptions;\n  /**\n   * The callback to init the chart's API when it is ready. The API includes the Highcharts chart object, and\n   * additional Cloudscape methods.\n   */\n  callback?: (chart: CoreChartProps.ChartAPI) => void;\n  /**\n   * This is used to provide a test-utils selector. Do not use this property to provide custom styles.\n   */\n  className?: string;\n  /**\n   * IDs of visible series or points.\n   */\n  visibleItems?: readonly string[];\n  /**\n   * Called when a legend item is highlighted.\n   */\n  onLegendItemHighlight?: NonCancelableEventHandler<CoreChartProps.LegendItemHighlightDetail>;\n  /**\n   * Called when series/points visibility changes due to user interaction with legend or filter.\n   */\n  onVisibleItemsChange?: NonCancelableEventHandler<CoreChartProps.VisibleItemsChangeDetail>;\n  /**\n   * Called whenever chart tooltip is rendered to provide content for tooltip's header, body, and (optional) footer.\n   */\n  getTooltipContent?: CoreChartProps.GetTooltipContent;\n  /**\n   * Called whenever a legend item is hovered to provide content for legend tooltip's header, body, and (optional) footer.\n   * If not provided, no tooltip will be displayed.\n   */\n  getLegendTooltipContent?: CoreChartProps.GetLegendTooltipContent;\n  /**\n   * Called whenever chart point or group is highlighted.\n   */\n  onHighlight?: NonCancelableEventHandler<CoreChartProps.HighlightChangeDetail>;\n  /**\n   * Called whenever chart point or group loses highlight.\n   */\n  onClearHighlight?: NonCancelableEventHandler<CoreChartProps.HighlightClearDetail>;\n  /**\n   * Use Cloudscape keyboard navigation.\n   */\n  keyboardNavigation?: boolean;\n  /**\n   * An object that contains all of the localized strings required by the component.\n   * @i18n\n   */\n  i18nStrings?: CartesianI18nStrings & PieI18nStrings;\n}\n\nexport namespace CoreChartProps {\n  // The API methods allow programmatic triggering of chart's behaviors, some of which are not accessible via React state.\n  // This enables advanced integration scenarios, such as building a custom legend, or making multiple charts synchronized.\n  export interface ChartAPI {\n    chart: Highcharts.Chart;\n    highcharts: typeof Highcharts;\n    highlightItems(itemIds: readonly string[]): void;\n    setItemsVisible(itemIds: readonly string[]): void;\n    highlightChartPoint(point: Highcharts.Point): void;\n    highlightChartGroup(group: readonly Highcharts.Point[]): void;\n    clearChartHighlight(): void;\n  }\n\n  // The extended version of Highcharts.Options. The axes types are extended with Cloudscape value formatter.\n  // We use a custom formatter because we cannot use the built-in Highcharts formatter for our tooltip.\n  export type ChartOptions = Omit<Highcharts.Options, \"xAxis\" | \"yAxis\"> & {\n    xAxis?: XAxisOptions | XAxisOptions[];\n    yAxis?: YAxisOptions | YAxisOptions[];\n  };\n  export type XAxisOptions = Highcharts.XAxisOptions & { valueFormatter?: (value: null | number) => string };\n  export type YAxisOptions = Highcharts.YAxisOptions & { valueFormatter?: (value: null | number) => string };\n\n  export interface HeaderOptions {\n    content: React.ReactNode;\n  }\n  export interface FooterOptions {\n    content: React.ReactNode;\n  }\n\n  export interface LegendOptions extends BaseLegendOptions {\n    bottomMaxHeight?: number;\n    position?: \"bottom\" | \"side\";\n  }\n  export type LegendItem = InternalComponentTypes.LegendItem;\n  export type LegendTooltipContent = InternalComponentTypes.LegendTooltipContent;\n  export type GetLegendTooltipContent = InternalComponentTypes.GetLegendTooltipContent;\n  export type GetLegendTooltipContentProps = InternalComponentTypes.GetLegendTooltipContentProps;\n\n  export interface TooltipOptions {\n    enabled?: boolean;\n    placement?: \"middle\" | \"outside\" | \"target\";\n    size?: \"small\" | \"medium\" | \"large\";\n  }\n\n  export type GetTooltipContent = (props: GetTooltipContentProps) => TooltipContentRenderer;\n  export interface GetTooltipContentProps {\n    point: null | Highcharts.Point;\n    group: readonly Highcharts.Point[];\n  }\n  export interface TooltipContentRenderer {\n    point?: (props: TooltipPointProps) => TooltipPointFormatted;\n    details?: (props: TooltipDetailsProps) => readonly TooltipDetail[];\n    header?: (props: TooltipSlotProps) => React.ReactNode;\n    body?: (props: TooltipSlotProps) => React.ReactNode;\n    footer?: (props: TooltipSlotProps) => React.ReactNode;\n  }\n  export type TooltipPointFormatted = BaseTooltipPointFormatted;\n  export interface TooltipContentItem {\n    point: Highcharts.Point;\n    errorRanges: Highcharts.Point[];\n  }\n  export interface TooltipPointProps {\n    item: TooltipContentItem;\n  }\n  export interface TooltipSlotProps {\n    x: number;\n    items: TooltipContentItem[];\n  }\n\n  export interface TooltipDetailsProps {\n    point: Highcharts.Point;\n  }\n\n  export type TooltipDetail = BaseTooltipDetail;\n\n  export interface LegendItemHighlightDetail {\n    item: LegendItem;\n  }\n  export interface VisibleItemsChangeDetail {\n    items: readonly LegendItem[];\n    isApiCall: boolean;\n  }\n  export interface HighlightChangeDetail {\n    point: null | Highcharts.Point;\n    group: readonly Highcharts.Point[];\n    isApiCall: boolean;\n  }\n  export interface HighlightClearDetail {\n    isApiCall: boolean;\n  }\n\n  export type I18nStrings = CartesianI18nStrings & PieI18nStrings;\n}\n\nexport interface CoreLegendProps {\n  items: readonly CoreLegendProps.Item[];\n  title?: string;\n  ariaLabel?: string;\n  actions?: React.ReactNode;\n  alignment?: \"horizontal\" | \"vertical\";\n  onClearHighlight?: NonCancelableEventHandler;\n  onItemHighlight?: NonCancelableEventHandler<CoreLegendProps.ItemHighlightDetail>;\n  onVisibleItemsChange?: NonCancelableEventHandler<CoreLegendProps.VisibleItemsChangeDetail>;\n  getLegendTooltipContent?: CoreLegendProps.GetTooltipContent;\n}\n\nexport namespace CoreLegendProps {\n  export type Item = InternalComponentTypes.LegendItem;\n  export type GetTooltipContent = InternalComponentTypes.GetLegendTooltipContent;\n  export interface ItemHighlightDetail {\n    item: Item;\n  }\n  export interface VisibleItemsChangeDetail {\n    items: readonly string[];\n  }\n}\n\n// Utility types\n\nexport interface Rect {\n  x: number;\n  y: number;\n  height: number;\n  width: number;\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/core/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type Highcharts from \"highcharts\";\n\nimport type * as InternalComponentTypes from \"../internal/components/interfaces\";\nimport { type NonCancelableEventHandler } from \"../internal/events\";\n\n// All charts take `highcharts` instance, that can be served statically or dynamically.\n// Although it has to be of type Highcharts, the TS type we use is `null | object`, so\n// that it is ignored by the documenter.\n\n/**\n * This interface includes common public chart properties, applicable for all chart types.\n */\nexport interface BaseChartOptions {\n  /**\n   * The Highcharts instance, which can be obtained using `import Highcharts from \"highcharts\"`.\n   * Supported Highcharts versions: 12.\n   */\n  highcharts: null | object;\n\n  /**\n   * Custom content that renders when `highcharts=null`. It renders a spinner if not defined.\n   */\n  fallback?: React.ReactNode;\n\n  /**\n   * The height of the chart plot in pixels. It does not include legend and filter.\n   */\n  chartHeight?: number;\n\n  /**\n   * The chart automatically adjusts its height to fill the parent container when this property is set.\n   */\n  fitHeight?: boolean;\n\n  /**\n   * Defines the minimum allowed height of the chart plot. Use this when `fitHeight=true` to\n   * prevent the chart plot from becoming too small to display its content. When the parent\n   * container is shorter than the minimum height, a vertical scrollbar appears automatically.\n   */\n  chartMinHeight?: number;\n\n  /**\n   * Defines the minimum allowed width of the chart plot. When the parent container is narrower than the\n   * minimum width, the horizontal scrollbar is automatically added.\n   */\n  chartMinWidth?: number;\n\n  /**\n   * Defines the ARIA label for the chart container.\n   * This property corresponds to [lang.chartContainerLabel](https://api.highcharts.com/highcharts/lang.accessibility.chartContainerLabel),\n   * and requires the [accessibility module](https://www.highcharts.com/docs/accessibility/accessibility-module).\n   */\n  ariaLabel?: string;\n\n  /**\n   * Defines the ARIA description of the chart container.\n   * This property corresponds to [accessibility.description](https://api.highcharts.com/highcharts/accessibility.description),\n   * and requires the [accessibility module](https://www.highcharts.com/docs/accessibility/accessibility-module).\n   */\n  ariaDescription?: string;\n\n  /**\n   * Defines chart legend options, including:\n   * * `enabled` (optional, boolean) - Hides legend when set to `false`.\n   * * `title` (optional, string) - Visible label, shown above the legend.\n   * * `actions` (optional, slot) - A slot before the legend that can be used to render custom actions.\n   */\n  legend?: BaseLegendOptions;\n\n  /**\n   * Defines options to represent empty, no-match, loading, and error state of the chart, including:\n   * * `statusType` (optional, \"finished\" | \"loading\" | \"error\") - Specifies the current status of loading data.\n   * * `empty` (optional, ReactNode) - Content displayed when the chart data is empty.\n   * * `noMatch` (optional, ReactNode) - Content displayed when there is no data to display due to the built-in filtering.\n   * * `loading` (optional, ReactNode) - Content displayed when `statusType=\"loading\"`. If omitted, the default loading state\n   * is shown, using `i18n.loadingText` or built-in i18n.\n   * * `error` (optional, ReactNode) - Content displayed when `statusType=\"error\"`. If omitted, the default error state\n   * is shown, using `i18n.errorText` and `i18n.recoveryText` (when `onRecoveryClick` is provided), or built-in i18n.\n   * * `onRecoveryClick` (optional, function) - Called when the user clicks the recovery button that appears when using default error\n   * state, and only if `onRecoveryClick` is provided. Use this to enable the user to retry a failed request or provide another option\n   * for the user to recover from the error.\n   */\n  noData?: BaseNoDataOptions;\n\n  /**\n   * Defines options for filtering in the chart, including:\n   * * `seriesFilter` (optional, boolean) - Displays default series filter at the top of the chart.\n   * * `additionalFilters` (optional, slot) - A slot for custom chart filters at the top of the chart.\n   */\n  filter?: BaseFilterOptions;\n}\n\nexport interface BaseLegendOptions {\n  enabled?: boolean;\n  title?: string;\n  actions?: React.ReactNode;\n}\n\nexport interface BaseNoDataOptions {\n  statusType?: \"finished\" | \"loading\" | \"error\";\n  empty?: React.ReactNode;\n  error?: React.ReactNode;\n  loading?: React.ReactNode;\n  noMatch?: React.ReactNode;\n  onRecoveryClick?: NonCancelableEventHandler;\n}\n\nexport interface BaseTooltipDetail {\n  key: React.ReactNode;\n  value: React.ReactNode;\n}\n\nexport interface BaseI18nStrings {\n  loadingText?: string;\n  errorText?: string;\n  recoveryText?: string;\n  seriesFilterLabel?: string;\n  seriesFilterPlaceholder?: string;\n  seriesFilterSelectedAriaLabel?: string;\n  legendAriaLabel?: string;\n  detailPopoverDismissAriaLabel?: string;\n  chartRoleDescription?: string;\n}\n\nexport interface WithCartesianI18nStrings {\n  /**\n   * An object that contains all of the localized strings required by the component.\n   * @i18n\n   *\n   * Available properties:\n   * * `loadingText` (optional, string) - Text, displayed when the chart is loading, i.e. when `noData.statusType` is set to \"loading\".\n   * * `errorText` (optional, string) - Text, displayed when the chart is in error state, i.e. when `noData.statusType` is set to \"error\".\n   * * `recoveryText` (optional, string) - Text for the recovery button, displayed next to the error text.\n   * * `seriesFilterLabel` (optional, string) - Text for the visible label of the default series filter.\n   * * `seriesFilterPlaceholder` (optional, string) - Text for the default series filter placeholder.\n   * * `seriesFilterSelectedAriaLabel` (optional, string) - ARIA label of the default series filter which is appended to any option that is selected.\n   * * `legendAriaLabel` (optional, string) - ARIA label that is associated with the legend in case there is no visible `legend.title` defined.\n   * * `detailPopoverDismissAriaLabel` (optional, string) - ARIA label for the details popover dismiss button.\n   * * `chartRoleDescription` (optional, string) - Accessible role description of the chart plot area, e.g. \"interactive chart\".\n   * * `xAxisRoleDescription` (optional, string) - Accessible role description of the x axis, e.g. \"x axis\".\n   * * `yAxisRoleDescription` (optional, string) - Accessible role description of the y axis, e.g. \"y axis\".\n   */\n  i18nStrings?: CartesianI18nStrings;\n}\n\nexport interface WithPieI18nStrings {\n  /**\n   * An object that contains all of the localized strings required by the component.\n   * @i18n\n   *\n   * Available properties:\n   * * `loadingText` (optional, string) - Text, displayed when the chart is loading, i.e. when `noData.statusType` is set to \"loading\".\n   * * `errorText` (optional, string) - Text, displayed when the chart is in error state, i.e. when `noData.statusType` is set to \"error\".\n   * * `recoveryText` (optional, string) - Text for the recovery button, displayed next to the error text.\n   * * `seriesFilterLabel` (optional, string) - Text for the visible label of the default series filter.\n   * * `seriesFilterPlaceholder` (optional, string) - Text for the default series filter placeholder.\n   * * `seriesFilterSelectedAriaLabel` (optional, string) - ARIA label of the default series filter which is appended to any option that is selected.\n   * * `legendAriaLabel` (optional, string) - ARIA label that is associated with the legend in case there is no visible `legend.title` defined.\n   * * `detailPopoverDismissAriaLabel` (optional, string) - ARIA label for the details popover dismiss button.\n   * * `chartRoleDescription` (optional, string) - Accessible role description of the chart plot area, e.g. \"interactive chart\".\n   * * `segmentRoleDescription` (optional, string) - Accessible role description of the segment.\n   */\n  i18nStrings?: PieI18nStrings;\n}\n\nexport interface CartesianI18nStrings extends BaseI18nStrings {\n  xAxisRoleDescription?: string;\n  yAxisRoleDescription?: string;\n}\n\nexport interface PieI18nStrings extends BaseI18nStrings {\n  segmentRoleDescription?: string;\n}\n\nexport interface BaseFilterOptions {\n  seriesFilter?: boolean;\n  additionalFilters?: React.ReactNode;\n}\n\nexport interface BaseTooltipPointFormatted {\n  key?: React.ReactNode;\n  value?: React.ReactNode;\n  description?: React.ReactNode;\n  expandable?: boolean;\n  subItems?: ReadonlyArray<{ key: React.ReactNode; value: React.ReactNode }>;\n}\n\nexport interface AreaSeriesOptions extends BaseCartesianLineLikeOptions {\n  type: \"area\";\n  data: readonly PointDataItemType[];\n}\n\nexport interface AreaSplineSeriesOptions extends BaseCartesianLineLikeOptions {\n  type: \"areaspline\";\n  data: readonly PointDataItemType[];\n}\n\nexport interface ColumnSeriesOptions extends BaseCartesianSeriesOptions {\n  type: \"column\";\n  data: readonly PointDataItemType[];\n}\n\nexport interface LineSeriesOptions extends BaseCartesianLineLikeOptions {\n  type: \"line\";\n  data: readonly PointDataItemType[];\n}\n\nexport interface SplineSeriesOptions extends BaseCartesianLineLikeOptions {\n  type: \"spline\";\n  data: readonly PointDataItemType[];\n}\n\nexport interface ScatterSeriesOptions extends BaseCartesianSeriesOptions {\n  type: \"scatter\";\n  data: readonly PointDataItemType[];\n  marker?: PointMarkerOptions;\n}\n\nexport interface ErrorBarSeriesOptions extends Omit<BaseCartesianSeriesOptions, \"name\"> {\n  type: \"errorbar\";\n  name?: string;\n  data: readonly RangeDataItemOptions[];\n  linkedTo: string;\n}\n\nexport interface XThresholdSeriesOptions extends BaseCartesianLineLikeOptions {\n  type: \"x-threshold\";\n  value: number;\n}\n\nexport interface YThresholdSeriesOptions extends BaseCartesianLineLikeOptions {\n  type: \"y-threshold\";\n  value: number;\n}\n\nexport interface PieSeriesOptions extends BaseSeriesOptions {\n  type: \"pie\";\n  data: readonly PieSegmentOptions[];\n}\n\nexport interface DonutSeriesOptions extends BaseSeriesOptions {\n  type: \"donut\";\n  data: readonly PieSegmentOptions[];\n}\n\nexport interface PieSegmentOptions {\n  y: number | null;\n  id?: string;\n  name: string;\n  color?: string;\n}\n\nexport type PointDataItemType = null | number | PointDataItemOptions;\n\nexport interface PointDataItemOptions {\n  x?: number;\n  y: number | null;\n}\n\nexport interface RangeDataItemOptions {\n  x?: number;\n  low: number;\n  high: number;\n}\n\ninterface BaseSeriesOptions {\n  id?: string;\n  name: string;\n  color?: string;\n}\n\ntype BaseCartesianSeriesOptions = BaseSeriesOptions;\n\ninterface BaseCartesianLineLikeOptions extends BaseCartesianSeriesOptions {\n  dashStyle?: Highcharts.DashStyleValue;\n}\n\n// The symbols union matches that of Highcharts.PointMarkerOptionsObject\ninterface PointMarkerOptions {\n  symbol?: \"circle\" | \"diamond\" | \"square\" | \"triangle\" | \"triangle-down\";\n}\n\nexport interface CoreCartesianOptions {\n  /**\n   * When set to `true`, adds a visual emphasis on the zero baseline axis.\n   */\n  emphasizeBaseline?: boolean;\n  /**\n   * Controls the placement of the vertical axis title.\n   * When set to \"side\", displays the title along the axis line.\n   */\n  verticalAxisTitlePlacement?: \"top\" | \"side\";\n}\n\nexport interface CoreChartProps\n  extends Pick<\n      BaseChartOptions,\n      | \"highcharts\"\n      | \"fallback\"\n      | \"fitHeight\"\n      | \"chartHeight\"\n      | \"chartMinHeight\"\n      | \"chartMinWidth\"\n      | \"ariaLabel\"\n      | \"ariaDescription\"\n      | \"filter\"\n      | \"noData\"\n    >,\n    CoreCartesianOptions {\n  /**\n   * The Highcharts options. Cloudscape injects custom styles and settings, but all can be\n   * overridden with explicitly provided options. An exception is event handlers - those are\n   * not overridden, but merged with Cloudscape event handlers so that both are getting called.\n   */\n  options: CoreChartProps.ChartOptions;\n  /**\n   * The Cloudscape tooltip, that comes with a vertical cursor when used on cartesian series.\n   * The tooltip content is only shown when `getContent` property is defined, which is called\n   * for each visited { x, y } point.\n   */\n  tooltip?: CoreChartProps.TooltipOptions;\n  /**\n   * A custom slot above the chart plot, chart's axis title, and filter.\n   */\n  header?: CoreChartProps.HeaderOptions;\n  /**\n   * Prop for passing a custom navigation control component to be rendered with the chart.\n   * Use this property to add timeline navigation, range selectors, or other custom navigation elements.\n   */\n  navigator?: React.ReactNode;\n  /**\n   * A custom slot below the chart plot and legend.\n   */\n  footer?: CoreChartProps.FooterOptions;\n  /**\n   * Chart legend options.\n   */\n  legend?: CoreChartProps.LegendOptions;\n  /**\n   * The callback to init the chart's API when it is ready. The API includes the Highcharts chart object, and\n   * additional Cloudscape methods.\n   */\n  callback?: (chart: CoreChartProps.ChartAPI) => void;\n  /**\n   * This is used to provide a test-utils selector. Do not use this property to provide custom styles.\n   */\n  className?: string;\n  /**\n   * IDs of visible series or points.\n   */\n  visibleItems?: readonly string[];\n  /**\n   * Called when a legend item is highlighted.\n   */\n  onLegendItemHighlight?: NonCancelableEventHandler<CoreChartProps.LegendItemHighlightDetail>;\n  /**\n   * Called when series/points visibility changes due to user interaction with legend or filter.\n   */\n  onVisibleItemsChange?: NonCancelableEventHandler<CoreChartProps.VisibleItemsChangeDetail>;\n  /**\n   * Called whenever chart tooltip is rendered to provide content for tooltip's header, body, and (optional) footer.\n   */\n  getTooltipContent?: CoreChartProps.GetTooltipContent;\n  /**\n   * Called whenever a legend item is hovered to provide content for legend tooltip's header, body, and (optional) footer.\n   * If not provided, no tooltip will be displayed.\n   */\n  getLegendTooltipContent?: CoreChartProps.GetLegendTooltipContent;\n  /**\n   * Called whenever chart point or group is highlighted.\n   */\n  onHighlight?: NonCancelableEventHandler<CoreChartProps.HighlightChangeDetail>;\n  /**\n   * Called whenever chart point or group loses highlight.\n   */\n  onClearHighlight?: NonCancelableEventHandler<CoreChartProps.HighlightClearDetail>;\n  /**\n   * Use Cloudscape keyboard navigation.\n   */\n  keyboardNavigation?: boolean;\n  /**\n   * An object that contains all of the localized strings required by the component.\n   * @i18n\n   */\n  i18nStrings?: CartesianI18nStrings & PieI18nStrings;\n}\n\nexport namespace CoreChartProps {\n  // The API methods allow programmatic triggering of chart's behaviors, some of which are not accessible via React state.\n  // This enables advanced integration scenarios, such as building a custom legend, or making multiple charts synchronized.\n  export interface ChartAPI {\n    chart: Highcharts.Chart;\n    highcharts: typeof Highcharts;\n    highlightItems(itemIds: readonly string[]): void;\n    setItemsVisible(itemIds: readonly string[]): void;\n    highlightChartPoint(point: Highcharts.Point): void;\n    highlightChartGroup(group: readonly Highcharts.Point[]): void;\n    clearChartHighlight(): void;\n  }\n\n  // The extended version of Highcharts.Options. The axes types are extended with Cloudscape value formatter.\n  // We use a custom formatter because we cannot use the built-in Highcharts formatter for our tooltip.\n  export type ChartOptions = Omit<Highcharts.Options, \"xAxis\" | \"yAxis\"> & {\n    xAxis?: XAxisOptions | XAxisOptions[];\n    yAxis?: YAxisOptions | YAxisOptions[];\n  };\n  export type XAxisOptions = Highcharts.XAxisOptions & { valueFormatter?: (value: null | number) => string };\n  export type YAxisOptions = Highcharts.YAxisOptions & { valueFormatter?: (value: null | number) => string };\n\n  export interface HeaderOptions {\n    content: React.ReactNode;\n  }\n  export interface FooterOptions {\n    content: React.ReactNode;\n  }\n\n  export interface LegendOptions extends BaseLegendOptions {\n    bottomMaxHeight?: number;\n    position?: \"bottom\" | \"side\";\n    /**\n     * This property only applies when `position=\"bottom\"`.\n     */\n    horizontalAlignment?: LegendOptionsHorizontalAlignment;\n  }\n\n  export type LegendOptionsHorizontalAlignment = \"start\" | \"center\";\n\n  export type LegendItem = InternalComponentTypes.LegendItem;\n  export type LegendTooltipContent = InternalComponentTypes.LegendTooltipContent;\n  export type GetLegendTooltipContent = InternalComponentTypes.GetLegendTooltipContent;\n  export type GetLegendTooltipContentProps = InternalComponentTypes.GetLegendTooltipContentProps;\n\n  export interface TooltipOptions {\n    enabled?: boolean;\n    placement?: \"middle\" | \"outside\" | \"target\";\n    size?: \"small\" | \"medium\" | \"large\";\n  }\n\n  export type GetTooltipContent = (props: GetTooltipContentProps) => TooltipContentRenderer;\n  export interface GetTooltipContentProps {\n    point: null | Highcharts.Point;\n    group: readonly Highcharts.Point[];\n  }\n  export interface TooltipContentRenderer {\n    point?: (props: TooltipPointProps) => TooltipPointFormatted;\n    details?: (props: TooltipDetailsProps) => readonly TooltipDetail[];\n    header?: (props: TooltipSlotProps) => React.ReactNode;\n    body?: (props: TooltipSlotProps) => React.ReactNode;\n    footer?: (props: TooltipSlotProps) => React.ReactNode;\n  }\n  export type TooltipPointFormatted = BaseTooltipPointFormatted;\n  export interface TooltipContentItem {\n    point: Highcharts.Point;\n    errorRanges: Highcharts.Point[];\n  }\n  export interface TooltipPointProps {\n    item: TooltipContentItem;\n  }\n  export interface TooltipSlotProps {\n    x: number;\n    items: TooltipContentItem[];\n  }\n\n  export interface TooltipDetailsProps {\n    point: Highcharts.Point;\n  }\n\n  export type TooltipDetail = BaseTooltipDetail;\n\n  export interface LegendItemHighlightDetail {\n    item: LegendItem;\n  }\n  export interface VisibleItemsChangeDetail {\n    items: readonly LegendItem[];\n    isApiCall: boolean;\n  }\n  export interface HighlightChangeDetail {\n    point: null | Highcharts.Point;\n    group: readonly Highcharts.Point[];\n    isApiCall: boolean;\n  }\n  export interface HighlightClearDetail {\n    isApiCall: boolean;\n  }\n\n  export type I18nStrings = CartesianI18nStrings & PieI18nStrings;\n}\n\nexport interface CoreLegendProps {\n  items: readonly CoreLegendProps.Item[];\n  title?: string;\n  ariaLabel?: string;\n  actions?: React.ReactNode;\n  alignment?: \"horizontal\" | \"vertical\";\n  horizontalAlignment?: CoreChartProps.LegendOptionsHorizontalAlignment;\n  onClearHighlight?: NonCancelableEventHandler;\n  onItemHighlight?: NonCancelableEventHandler<CoreLegendProps.ItemHighlightDetail>;\n  onVisibleItemsChange?: NonCancelableEventHandler<CoreLegendProps.VisibleItemsChangeDetail>;\n  getLegendTooltipContent?: CoreLegendProps.GetTooltipContent;\n}\n\nexport namespace CoreLegendProps {\n  export type Item = InternalComponentTypes.LegendItem;\n  export type GetTooltipContent = InternalComponentTypes.GetLegendTooltipContent;\n  export interface ItemHighlightDetail {\n    item: Item;\n  }\n  export interface VisibleItemsChangeDetail {\n    items: readonly string[];\n  }\n}\n\n// Utility types\n\nexport interface Rect {\n  x: number;\n  y: number;\n  height: number;\n  width: number;\n}\n"]}

package/internal/components/chart-legend/index.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import { CoreChartProps } from "../../../core/interfaces";
 import { GetLegendTooltipContentProps, LegendItem, LegendTooltipContent } from "../interfaces";
 export interface ChartLegendProps {
     items: readonly LegendItem[];
@@ -6,9 +7,10 @@ export interface ChartLegendProps {
     ariaLabel?: string;
     actions?: React.ReactNode;
     position: "bottom" | "side";
+    horizontalAlignment: CoreChartProps.LegendOptionsHorizontalAlignment;
     onItemHighlightEnter: (item: LegendItem) => void;
     onItemHighlightExit: () => void;
     onItemVisibilityChange: (hiddenItems: string[]) => void;
     getTooltipContent: (props: GetLegendTooltipContentProps) => null | LegendTooltipContent;
 }
-export declare const ChartLegend: ({ items, legendTitle, ariaLabel, actions, position, onItemVisibilityChange, onItemHighlightEnter, onItemHighlightExit, getTooltipContent, }: ChartLegendProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ChartLegend: ({ items, legendTitle, ariaLabel, actions, position, onItemVisibilityChange, onItemHighlightEnter, onItemHighlightExit, getTooltipContent, horizontalAlignment, }: ChartLegendProps) => import("react/jsx-runtime").JSX.Element;

package/internal/components/chart-legend/index.js

@@ -12,7 +12,7 @@ import testClasses from "./test-classes/styles.css.js";
 const TOOLTIP_BLUR_DELAY = 50;
 const HIGHLIGHT_LOST_DELAY = 50;
 const SCROLL_DELAY = 100;
-export const ChartLegend = ({ items, legendTitle, ariaLabel, actions, position, onItemVisibilityChange, onItemHighlightEnter, onItemHighlightExit, getTooltipContent, }) => {
+export const ChartLegend = ({ items, legendTitle, ariaLabel, actions, position, onItemVisibilityChange, onItemHighlightEnter, onItemHighlightExit, getTooltipContent, horizontalAlignment, }) => {
     var _a;
     const containerRef = useRef(null);
     const elementsByIndexRef = useRef([]);
@@ -178,10 +178,13 @@ export const ChartLegend = ({ items, legendTitle, ariaLabel, actions, position,
     const tooltipPosition = position === "bottom" ? "bottom" : "left";
     return (_jsx(SingleTabStopNavigationProvider, { ref: navigationAPI, navigationActive: true, getNextFocusTarget: () => getNextFocusTarget(), onUnregisterActive: (element) => onUnregisterActive(element, navigationAPI), children: _jsxs("div", { ref: containerRef, role: "toolbar", "aria-label": legendTitle || ariaLabel, className: clsx(testClasses.root, styles.root, {
                 [styles["root-side"]]: position === "side",
-            }), onMouseEnter: () => (isMouseInContainer.current = true), onMouseLeave: () => (isMouseInContainer.current = false), children: [legendTitle && (_jsx(Box, { fontWeight: "bold", className: testClasses.title, children: legendTitle })), _jsxs("div", { 
+            }), onMouseEnter: () => (isMouseInContainer.current = true), onMouseLeave: () => (isMouseInContainer.current = false), children: [legendTitle && (_jsx(Box, { fontWeight: "bold", className: clsx(testClasses.title, {
+                        [styles[`legend-title-${horizontalAlignment}`]]: position === "bottom",
+                    }), children: legendTitle })), _jsxs("div", { 
                     // The list element is not focusable. However, the focus lands on it regardless, when testing in Firefox.
                     // Setting the tab index to -1 does fix the problem.
                     tabIndex: -1, className: clsx(styles.list, {
+                        [styles[`list-bottom-${horizontalAlignment}`]]: position === "bottom",
                         [styles["list-bottom"]]: position === "bottom",
                         [styles["list-side"]]: position === "side",
                     }), children: [actions && (_jsx(_Fragment, { children: _jsxs("div", { className: clsx(testClasses.actions, styles.actions, {
@@ -191,6 +194,7 @@ export const ChartLegend = ({ items, legendTitle, ariaLabel, actions, position,
                                             [styles["actions-divider-bottom"]]: position === "bottom",
                                             [styles["actions-divider-side"]]: position === "side",
                                         }) })] }) })), _jsx("div", { className: clsx({
+                                [styles[`legend-bottom-${horizontalAlignment}`]]: position === "bottom",
                                 [styles["legend-bottom"]]: position === "bottom",
                                 [styles["legend-side"]]: position === "side",
                             }), children: items.map((item, index) => {

package/internal/components/chart-legend/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-legend/index.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\n\nimport { forwardRef, Ref, useEffect, useMemo, useRef, useState } from \"react\";\nimport clsx from \"clsx\";\n\nimport {\n  circleIndex,\n  handleKey,\n  KeyCode,\n  SingleTabStopNavigationAPI,\n  SingleTabStopNavigationProvider,\n  useMergeRefs,\n  useSingleTabStopNavigation,\n} from \"@cloudscape-design/component-toolkit/internal\";\nimport Box from \"@cloudscape-design/components/box\";\nimport { InternalChartTooltip } from \"@cloudscape-design/components/internal/do-not-use/chart-tooltip\";\n\nimport { DebouncedCall } from \"../../utils/utils\";\nimport { GetLegendTooltipContentProps, LegendItem, LegendTooltipContent } from \"../interfaces\";\n\nimport styles from \"./styles.css.js\";\nimport testClasses from \"./test-classes/styles.css.js\";\n\nconst TOOLTIP_BLUR_DELAY = 50;\nconst HIGHLIGHT_LOST_DELAY = 50;\nconst SCROLL_DELAY = 100;\n\nexport interface ChartLegendProps {\n  items: readonly LegendItem[];\n  legendTitle?: string;\n  ariaLabel?: string;\n  actions?: React.ReactNode;\n  position: \"bottom\" | \"side\";\n  onItemHighlightEnter: (item: LegendItem) => void;\n  onItemHighlightExit: () => void;\n  onItemVisibilityChange: (hiddenItems: string[]) => void;\n  getTooltipContent: (props: GetLegendTooltipContentProps) => null | LegendTooltipContent;\n}\n\nexport const ChartLegend = ({\n  items,\n  legendTitle,\n  ariaLabel,\n  actions,\n  position,\n  onItemVisibilityChange,\n  onItemHighlightEnter,\n  onItemHighlightExit,\n  getTooltipContent,\n}: ChartLegendProps) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const elementsByIndexRef = useRef<Record<number, HTMLElement>>([]);\n  const elementsByIdRef = useRef<Record<string, HTMLElement>>({});\n  const tooltipRef = useRef<HTMLElement>(null);\n  const highlightControl = useMemo(() => new DebouncedCall(), []);\n  const scrollIntoViewControl = useMemo(() => new DebouncedCall(), []);\n  const [selectedIndex, setSelectedIndex] = useState<number>(0);\n  const [tooltipItemId, setTooltipItemId] = useState<string | null>(null);\n  const { showTooltip, hideTooltip } = useMemo(() => {\n    const control = new DebouncedCall();\n    return {\n      showTooltip(itemId: string) {\n        control.call(() => setTooltipItemId(itemId));\n      },\n      hideTooltip(lock = false) {\n        control.call(() => setTooltipItemId(null), TOOLTIP_BLUR_DELAY);\n        if (lock) {\n          control.lock(TOOLTIP_BLUR_DELAY);\n        }\n      },\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!tooltipItemId) {\n      return;\n    }\n    const onDocumentKeyDown = (event: KeyboardEvent) => {\n      if (event.keyCode === KeyCode.escape) {\n        hideTooltip(true);\n        elementsByIdRef.current[tooltipItemId]?.focus();\n      }\n    };\n    document.addEventListener(\"keydown\", onDocumentKeyDown, true);\n    return () => {\n      document.removeEventListener(\"keydown\", onDocumentKeyDown, true);\n    };\n  }, [items, tooltipItemId, hideTooltip]);\n  const isMouseInContainer = useRef<boolean>(false);\n\n  // Scrolling to the highlighted legend item.\n  useEffect(() => {\n    const highlightedIndex = items.findIndex((item) => item.highlighted);\n    if (highlightedIndex === -1) {\n      return;\n    }\n    scrollIntoViewControl.call(() => {\n      if (isMouseInContainer.current) {\n        return;\n      }\n      const container = containerRef.current;\n      const element = elementsByIndexRef.current?.[highlightedIndex];\n      if (!container || !element) {\n        return;\n      }\n      const elementRect = element.getBoundingClientRect();\n      const containerRect = container.getBoundingClientRect();\n      const isVisible = elementRect.top >= containerRect.top && elementRect.bottom <= containerRect.bottom;\n      if (!isVisible) {\n        const elementCenter = elementRect.top + elementRect.height / 2;\n        const containerCenter = containerRect.top + containerRect.height / 2;\n        const top = container.scrollTop + (elementCenter - containerCenter);\n        container.scrollTo({ top, behavior: \"smooth\" });\n      }\n    }, SCROLL_DELAY);\n  }, [items, scrollIntoViewControl]);\n\n  const showHighlight = (itemId: string) => {\n    const item = items.find((item) => item.id === itemId);\n    if (item?.visible) {\n      highlightControl.cancelPrevious();\n      onItemHighlightEnter(item);\n    }\n  };\n  const clearHighlight = () => {\n    highlightControl.call(onItemHighlightExit, HIGHLIGHT_LOST_DELAY);\n  };\n\n  const navigationAPI = useRef<SingleTabStopNavigationAPI>(null);\n\n  function onFocus(index: number, itemId: string) {\n    setSelectedIndex(index);\n    navigationAPI.current!.updateFocusTarget();\n    showHighlight(itemId);\n    showTooltip(itemId);\n  }\n\n  function onBlur(event: React.FocusEvent) {\n    navigationAPI.current!.updateFocusTarget();\n\n    // Hide tooltip and clear highlight unless focus moves inside tooltip;\n    if (tooltipRef.current && event.relatedTarget && !tooltipRef.current.contains(event.relatedTarget)) {\n      clearHighlight();\n      hideTooltip();\n    }\n  }\n\n  function focusElement(index: number) {\n    elementsByIndexRef.current[index]?.focus();\n  }\n\n  function onKeyDown(event: React.KeyboardEvent<HTMLElement>) {\n    if (\n      event.keyCode === KeyCode.right ||\n      event.keyCode === KeyCode.left ||\n      event.keyCode === KeyCode.up ||\n      event.keyCode === KeyCode.down ||\n      event.keyCode === KeyCode.home ||\n      event.keyCode === KeyCode.end ||\n      event.keyCode === KeyCode.escape\n    ) {\n      // Preventing default fixes an issue in Safari+VO when VO additionally interprets arrow keys as its commands.\n      event.preventDefault();\n\n      const range = [0, items.length - 1] as [number, number];\n\n      handleKey(event, {\n        onInlineStart: () => focusElement(circleIndex(selectedIndex - 1, range)),\n        onInlineEnd: () => focusElement(circleIndex(selectedIndex + 1, range)),\n        onBlockStart: () => focusElement(circleIndex(selectedIndex - 1, range)),\n        onBlockEnd: () => focusElement(circleIndex(selectedIndex + 1, range)),\n        onHome: () => focusElement(0),\n        onEnd: () => focusElement(items.length - 1),\n        onEscape: () => onItemHighlightExit(),\n      });\n    }\n  }\n\n  function getNextFocusTarget(): null | HTMLElement {\n    if (containerRef.current) {\n      const buttons: HTMLButtonElement[] = Array.from(containerRef.current.querySelectorAll(`.${styles.item}`));\n      return buttons[selectedIndex] ?? null;\n    }\n    return null;\n  }\n\n  function onUnregisterActive(\n    focusableElement: HTMLElement,\n    navigationAPI: React.RefObject<{ getFocusTarget: () => HTMLElement | null }>,\n  ) {\n    const target = navigationAPI.current?.getFocusTarget();\n\n    if (target && target.dataset.itemid !== focusableElement.dataset.itemid) {\n      target.focus();\n    }\n  }\n\n  useEffect(() => {\n    navigationAPI.current!.updateFocusTarget();\n  });\n\n  const toggleItem = (itemId: string) => {\n    const visibleItems = items.filter((i) => i.visible).map((i) => i.id);\n    if (visibleItems.includes(itemId)) {\n      onItemVisibilityChange(visibleItems.filter((visibleItemId) => visibleItemId !== itemId));\n    } else {\n      onItemVisibilityChange([...visibleItems, itemId]);\n    }\n    // Needed for touch devices.\n    onItemHighlightExit();\n  };\n\n  const selectItem = (itemId: string) => {\n    const visibleItems = items.filter((i) => i.visible).map((i) => i.id);\n    if (visibleItems.length === 1 && visibleItems[0] === itemId) {\n      onItemVisibilityChange(items.map((i) => i.id));\n    } else {\n      onItemVisibilityChange([itemId]);\n    }\n    // Needed for touch devices.\n    onItemHighlightExit();\n  };\n\n  const tooltipTrack = useRef<null | HTMLElement>(null);\n  const tooltipTarget = items.find((item) => item.id === tooltipItemId) ?? null;\n  tooltipTrack.current = tooltipItemId ? elementsByIdRef.current[tooltipItemId] : null;\n  const tooltipContent = tooltipTarget && getTooltipContent({ legendItem: tooltipTarget });\n  const tooltipPosition = position === \"bottom\" ? \"bottom\" : \"left\";\n\n  return (\n    <SingleTabStopNavigationProvider\n      ref={navigationAPI}\n      navigationActive={true}\n      getNextFocusTarget={() => getNextFocusTarget()}\n      onUnregisterActive={(element: HTMLElement) => onUnregisterActive(element, navigationAPI)}\n    >\n      <div\n        ref={containerRef}\n        role=\"toolbar\"\n        aria-label={legendTitle || ariaLabel}\n        className={clsx(testClasses.root, styles.root, {\n          [styles[\"root-side\"]]: position === \"side\",\n        })}\n        onMouseEnter={() => (isMouseInContainer.current = true)}\n        onMouseLeave={() => (isMouseInContainer.current = false)}\n      >\n        {legendTitle && (\n          <Box fontWeight=\"bold\" className={testClasses.title}>\n            {legendTitle}\n          </Box>\n        )}\n\n        <div\n          // The list element is not focusable. However, the focus lands on it regardless, when testing in Firefox.\n          // Setting the tab index to -1 does fix the problem.\n          tabIndex={-1}\n          className={clsx(styles.list, {\n            [styles[\"list-bottom\"]]: position === \"bottom\",\n            [styles[\"list-side\"]]: position === \"side\",\n          })}\n        >\n          {actions && (\n            <>\n              <div\n                className={clsx(testClasses.actions, styles.actions, {\n                  [styles[\"actions-bottom\"]]: position === \"bottom\",\n                  [styles[\"actions-side\"]]: position === \"side\",\n                })}\n              >\n                {actions}\n                <div\n                  className={clsx(styles[\"actions-divider\"], {\n                    [styles[\"actions-divider-bottom\"]]: position === \"bottom\",\n                    [styles[\"actions-divider-side\"]]: position === \"side\",\n                  })}\n                />\n              </div>\n            </>\n          )}\n          <div\n            className={clsx({\n              [styles[\"legend-bottom\"]]: position === \"bottom\",\n              [styles[\"legend-side\"]]: position === \"side\",\n            })}\n          >\n            {items.map((item, index) => {\n              const handlers = {\n                onMouseEnter: () => {\n                  showHighlight(item.id);\n                  showTooltip(item.id);\n                },\n                onMouseLeave: () => {\n                  clearHighlight();\n                  hideTooltip();\n                },\n                onFocus: () => {\n                  onFocus(index, item.id);\n                },\n                onBlur: (event: React.FocusEvent) => {\n                  onBlur(event);\n                },\n                onKeyDown,\n              };\n              const thisTriggerRef = (elem: null | HTMLElement) => {\n                if (elem) {\n                  elementsByIndexRef.current[index] = elem;\n                  elementsByIdRef.current[item.id] = elem;\n                } else {\n                  delete elementsByIndexRef.current[index];\n                  delete elementsByIdRef.current[index];\n                }\n              };\n              return (\n                <LegendItemTrigger\n                  key={index}\n                  {...handlers}\n                  ref={thisTriggerRef}\n                  onClick={(event) => {\n                    if (event.metaKey || event.ctrlKey) {\n                      toggleItem(item.id);\n                    } else {\n                      selectItem(item.id);\n                    }\n                  }}\n                  isHighlighted={item.highlighted}\n                  someHighlighted={items.some((item) => item.highlighted)}\n                  itemId={item.id}\n                  label={item.name}\n                  visible={item.visible}\n                  marker={item.marker}\n                />\n              );\n            })}\n          </div>\n        </div>\n        {tooltipContent && (\n          <InternalChartTooltip\n            trackRef={tooltipTrack}\n            trackKey={tooltipTarget.id}\n            container={null}\n            dismissButton={false}\n            onDismiss={() => {}}\n            position={tooltipPosition}\n            title={tooltipContent.header}\n            onMouseEnter={() => showTooltip(tooltipTarget.id)}\n            onMouseLeave={() => hideTooltip()}\n            onBlur={() => hideTooltip()}\n            footer={\n              tooltipContent.footer && (\n                <>\n                  <hr aria-hidden={true} />\n                  {tooltipContent.footer}\n                </>\n              )\n            }\n          >\n            {tooltipContent.body}\n          </InternalChartTooltip>\n        )}\n      </div>\n    </SingleTabStopNavigationProvider>\n  );\n};\n\nconst LegendItemTrigger = forwardRef(\n  (\n    {\n      isHighlighted,\n      someHighlighted,\n      itemId,\n      label,\n      marker,\n      visible,\n      onClick,\n      triggerRef,\n      onMouseEnter,\n      onMouseLeave,\n      onFocus,\n      onBlur,\n      onKeyDown,\n    }: {\n      isHighlighted?: boolean;\n      someHighlighted?: boolean;\n      itemId: string;\n      label: string;\n      marker?: React.ReactNode;\n      visible: boolean;\n      onClick: (event: React.MouseEvent) => void;\n      onMarkerClick?: () => void;\n      triggerRef?: Ref<HTMLElement>;\n      onMouseEnter?: () => void;\n      onMouseLeave?: () => void;\n      onFocus?: () => void;\n      onBlur?: (event: React.FocusEvent) => void;\n      onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n    },\n    ref: Ref<HTMLButtonElement>,\n  ) => {\n    const refObject = useRef<HTMLDivElement>(null);\n    const mergedRef = useMergeRefs(ref, triggerRef, refObject);\n    const { tabIndex } = useSingleTabStopNavigation(refObject);\n    return (\n      <button\n        data-itemid={itemId}\n        aria-pressed={visible}\n        aria-current={isHighlighted}\n        className={clsx(testClasses.item, styles.item, {\n          [styles[\"item--inactive\"]]: !visible,\n          [testClasses[\"hidden-item\"]]: !visible,\n          [styles[\"item--dimmed\"]]: someHighlighted && !isHighlighted,\n          [testClasses[\"dimmed-item\"]]: someHighlighted && !isHighlighted,\n        })}\n        ref={mergedRef}\n        tabIndex={tabIndex}\n        onClick={onClick}\n        onMouseEnter={onMouseEnter}\n        onMouseLeave={onMouseLeave}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        onKeyDown={onKeyDown}\n      >\n        {marker}\n        <span className={styles[\"item-label\"]}>{label}</span>\n      </button>\n    );\n  },\n);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-legend/index.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\n\nimport { forwardRef, Ref, useEffect, useMemo, useRef, useState } from \"react\";\nimport clsx from \"clsx\";\n\nimport {\n  circleIndex,\n  handleKey,\n  KeyCode,\n  SingleTabStopNavigationAPI,\n  SingleTabStopNavigationProvider,\n  useMergeRefs,\n  useSingleTabStopNavigation,\n} from \"@cloudscape-design/component-toolkit/internal\";\nimport Box from \"@cloudscape-design/components/box\";\nimport { InternalChartTooltip } from \"@cloudscape-design/components/internal/do-not-use/chart-tooltip\";\n\nimport { CoreChartProps } from \"../../../core/interfaces\";\nimport { DebouncedCall } from \"../../utils/utils\";\nimport { GetLegendTooltipContentProps, LegendItem, LegendTooltipContent } from \"../interfaces\";\n\nimport styles from \"./styles.css.js\";\nimport testClasses from \"./test-classes/styles.css.js\";\n\nconst TOOLTIP_BLUR_DELAY = 50;\nconst HIGHLIGHT_LOST_DELAY = 50;\nconst SCROLL_DELAY = 100;\n\nexport interface ChartLegendProps {\n  items: readonly LegendItem[];\n  legendTitle?: string;\n  ariaLabel?: string;\n  actions?: React.ReactNode;\n  position: \"bottom\" | \"side\";\n  horizontalAlignment: CoreChartProps.LegendOptionsHorizontalAlignment;\n  onItemHighlightEnter: (item: LegendItem) => void;\n  onItemHighlightExit: () => void;\n  onItemVisibilityChange: (hiddenItems: string[]) => void;\n  getTooltipContent: (props: GetLegendTooltipContentProps) => null | LegendTooltipContent;\n}\n\nexport const ChartLegend = ({\n  items,\n  legendTitle,\n  ariaLabel,\n  actions,\n  position,\n  onItemVisibilityChange,\n  onItemHighlightEnter,\n  onItemHighlightExit,\n  getTooltipContent,\n  horizontalAlignment,\n}: ChartLegendProps) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const elementsByIndexRef = useRef<Record<number, HTMLElement>>([]);\n  const elementsByIdRef = useRef<Record<string, HTMLElement>>({});\n  const tooltipRef = useRef<HTMLElement>(null);\n  const highlightControl = useMemo(() => new DebouncedCall(), []);\n  const scrollIntoViewControl = useMemo(() => new DebouncedCall(), []);\n  const [selectedIndex, setSelectedIndex] = useState<number>(0);\n  const [tooltipItemId, setTooltipItemId] = useState<string | null>(null);\n  const { showTooltip, hideTooltip } = useMemo(() => {\n    const control = new DebouncedCall();\n    return {\n      showTooltip(itemId: string) {\n        control.call(() => setTooltipItemId(itemId));\n      },\n      hideTooltip(lock = false) {\n        control.call(() => setTooltipItemId(null), TOOLTIP_BLUR_DELAY);\n        if (lock) {\n          control.lock(TOOLTIP_BLUR_DELAY);\n        }\n      },\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!tooltipItemId) {\n      return;\n    }\n    const onDocumentKeyDown = (event: KeyboardEvent) => {\n      if (event.keyCode === KeyCode.escape) {\n        hideTooltip(true);\n        elementsByIdRef.current[tooltipItemId]?.focus();\n      }\n    };\n    document.addEventListener(\"keydown\", onDocumentKeyDown, true);\n    return () => {\n      document.removeEventListener(\"keydown\", onDocumentKeyDown, true);\n    };\n  }, [items, tooltipItemId, hideTooltip]);\n  const isMouseInContainer = useRef<boolean>(false);\n\n  // Scrolling to the highlighted legend item.\n  useEffect(() => {\n    const highlightedIndex = items.findIndex((item) => item.highlighted);\n    if (highlightedIndex === -1) {\n      return;\n    }\n    scrollIntoViewControl.call(() => {\n      if (isMouseInContainer.current) {\n        return;\n      }\n      const container = containerRef.current;\n      const element = elementsByIndexRef.current?.[highlightedIndex];\n      if (!container || !element) {\n        return;\n      }\n      const elementRect = element.getBoundingClientRect();\n      const containerRect = container.getBoundingClientRect();\n      const isVisible = elementRect.top >= containerRect.top && elementRect.bottom <= containerRect.bottom;\n      if (!isVisible) {\n        const elementCenter = elementRect.top + elementRect.height / 2;\n        const containerCenter = containerRect.top + containerRect.height / 2;\n        const top = container.scrollTop + (elementCenter - containerCenter);\n        container.scrollTo({ top, behavior: \"smooth\" });\n      }\n    }, SCROLL_DELAY);\n  }, [items, scrollIntoViewControl]);\n\n  const showHighlight = (itemId: string) => {\n    const item = items.find((item) => item.id === itemId);\n    if (item?.visible) {\n      highlightControl.cancelPrevious();\n      onItemHighlightEnter(item);\n    }\n  };\n  const clearHighlight = () => {\n    highlightControl.call(onItemHighlightExit, HIGHLIGHT_LOST_DELAY);\n  };\n\n  const navigationAPI = useRef<SingleTabStopNavigationAPI>(null);\n\n  function onFocus(index: number, itemId: string) {\n    setSelectedIndex(index);\n    navigationAPI.current!.updateFocusTarget();\n    showHighlight(itemId);\n    showTooltip(itemId);\n  }\n\n  function onBlur(event: React.FocusEvent) {\n    navigationAPI.current!.updateFocusTarget();\n\n    // Hide tooltip and clear highlight unless focus moves inside tooltip;\n    if (tooltipRef.current && event.relatedTarget && !tooltipRef.current.contains(event.relatedTarget)) {\n      clearHighlight();\n      hideTooltip();\n    }\n  }\n\n  function focusElement(index: number) {\n    elementsByIndexRef.current[index]?.focus();\n  }\n\n  function onKeyDown(event: React.KeyboardEvent<HTMLElement>) {\n    if (\n      event.keyCode === KeyCode.right ||\n      event.keyCode === KeyCode.left ||\n      event.keyCode === KeyCode.up ||\n      event.keyCode === KeyCode.down ||\n      event.keyCode === KeyCode.home ||\n      event.keyCode === KeyCode.end ||\n      event.keyCode === KeyCode.escape\n    ) {\n      // Preventing default fixes an issue in Safari+VO when VO additionally interprets arrow keys as its commands.\n      event.preventDefault();\n\n      const range = [0, items.length - 1] as [number, number];\n\n      handleKey(event, {\n        onInlineStart: () => focusElement(circleIndex(selectedIndex - 1, range)),\n        onInlineEnd: () => focusElement(circleIndex(selectedIndex + 1, range)),\n        onBlockStart: () => focusElement(circleIndex(selectedIndex - 1, range)),\n        onBlockEnd: () => focusElement(circleIndex(selectedIndex + 1, range)),\n        onHome: () => focusElement(0),\n        onEnd: () => focusElement(items.length - 1),\n        onEscape: () => onItemHighlightExit(),\n      });\n    }\n  }\n\n  function getNextFocusTarget(): null | HTMLElement {\n    if (containerRef.current) {\n      const buttons: HTMLButtonElement[] = Array.from(containerRef.current.querySelectorAll(`.${styles.item}`));\n      return buttons[selectedIndex] ?? null;\n    }\n    return null;\n  }\n\n  function onUnregisterActive(\n    focusableElement: HTMLElement,\n    navigationAPI: React.RefObject<{ getFocusTarget: () => HTMLElement | null }>,\n  ) {\n    const target = navigationAPI.current?.getFocusTarget();\n\n    if (target && target.dataset.itemid !== focusableElement.dataset.itemid) {\n      target.focus();\n    }\n  }\n\n  useEffect(() => {\n    navigationAPI.current!.updateFocusTarget();\n  });\n\n  const toggleItem = (itemId: string) => {\n    const visibleItems = items.filter((i) => i.visible).map((i) => i.id);\n    if (visibleItems.includes(itemId)) {\n      onItemVisibilityChange(visibleItems.filter((visibleItemId) => visibleItemId !== itemId));\n    } else {\n      onItemVisibilityChange([...visibleItems, itemId]);\n    }\n    // Needed for touch devices.\n    onItemHighlightExit();\n  };\n\n  const selectItem = (itemId: string) => {\n    const visibleItems = items.filter((i) => i.visible).map((i) => i.id);\n    if (visibleItems.length === 1 && visibleItems[0] === itemId) {\n      onItemVisibilityChange(items.map((i) => i.id));\n    } else {\n      onItemVisibilityChange([itemId]);\n    }\n    // Needed for touch devices.\n    onItemHighlightExit();\n  };\n\n  const tooltipTrack = useRef<null | HTMLElement>(null);\n  const tooltipTarget = items.find((item) => item.id === tooltipItemId) ?? null;\n  tooltipTrack.current = tooltipItemId ? elementsByIdRef.current[tooltipItemId] : null;\n  const tooltipContent = tooltipTarget && getTooltipContent({ legendItem: tooltipTarget });\n  const tooltipPosition = position === \"bottom\" ? \"bottom\" : \"left\";\n\n  return (\n    <SingleTabStopNavigationProvider\n      ref={navigationAPI}\n      navigationActive={true}\n      getNextFocusTarget={() => getNextFocusTarget()}\n      onUnregisterActive={(element: HTMLElement) => onUnregisterActive(element, navigationAPI)}\n    >\n      <div\n        ref={containerRef}\n        role=\"toolbar\"\n        aria-label={legendTitle || ariaLabel}\n        className={clsx(testClasses.root, styles.root, {\n          [styles[\"root-side\"]]: position === \"side\",\n        })}\n        onMouseEnter={() => (isMouseInContainer.current = true)}\n        onMouseLeave={() => (isMouseInContainer.current = false)}\n      >\n        {legendTitle && (\n          <Box\n            fontWeight=\"bold\"\n            className={clsx(testClasses.title, {\n              [styles[`legend-title-${horizontalAlignment}`]]: position === \"bottom\",\n            })}\n          >\n            {legendTitle}\n          </Box>\n        )}\n\n        <div\n          // The list element is not focusable. However, the focus lands on it regardless, when testing in Firefox.\n          // Setting the tab index to -1 does fix the problem.\n          tabIndex={-1}\n          className={clsx(styles.list, {\n            [styles[`list-bottom-${horizontalAlignment}`]]: position === \"bottom\",\n            [styles[\"list-bottom\"]]: position === \"bottom\",\n            [styles[\"list-side\"]]: position === \"side\",\n          })}\n        >\n          {actions && (\n            <>\n              <div\n                className={clsx(testClasses.actions, styles.actions, {\n                  [styles[\"actions-bottom\"]]: position === \"bottom\",\n                  [styles[\"actions-side\"]]: position === \"side\",\n                })}\n              >\n                {actions}\n                <div\n                  className={clsx(styles[\"actions-divider\"], {\n                    [styles[\"actions-divider-bottom\"]]: position === \"bottom\",\n                    [styles[\"actions-divider-side\"]]: position === \"side\",\n                  })}\n                />\n              </div>\n            </>\n          )}\n          <div\n            className={clsx({\n              [styles[`legend-bottom-${horizontalAlignment}`]]: position === \"bottom\",\n              [styles[\"legend-bottom\"]]: position === \"bottom\",\n              [styles[\"legend-side\"]]: position === \"side\",\n            })}\n          >\n            {items.map((item, index) => {\n              const handlers = {\n                onMouseEnter: () => {\n                  showHighlight(item.id);\n                  showTooltip(item.id);\n                },\n                onMouseLeave: () => {\n                  clearHighlight();\n                  hideTooltip();\n                },\n                onFocus: () => {\n                  onFocus(index, item.id);\n                },\n                onBlur: (event: React.FocusEvent) => {\n                  onBlur(event);\n                },\n                onKeyDown,\n              };\n              const thisTriggerRef = (elem: null | HTMLElement) => {\n                if (elem) {\n                  elementsByIndexRef.current[index] = elem;\n                  elementsByIdRef.current[item.id] = elem;\n                } else {\n                  delete elementsByIndexRef.current[index];\n                  delete elementsByIdRef.current[index];\n                }\n              };\n              return (\n                <LegendItemTrigger\n                  key={index}\n                  {...handlers}\n                  ref={thisTriggerRef}\n                  onClick={(event) => {\n                    if (event.metaKey || event.ctrlKey) {\n                      toggleItem(item.id);\n                    } else {\n                      selectItem(item.id);\n                    }\n                  }}\n                  isHighlighted={item.highlighted}\n                  someHighlighted={items.some((item) => item.highlighted)}\n                  itemId={item.id}\n                  label={item.name}\n                  visible={item.visible}\n                  marker={item.marker}\n                />\n              );\n            })}\n          </div>\n        </div>\n        {tooltipContent && (\n          <InternalChartTooltip\n            trackRef={tooltipTrack}\n            trackKey={tooltipTarget.id}\n            container={null}\n            dismissButton={false}\n            onDismiss={() => {}}\n            position={tooltipPosition}\n            title={tooltipContent.header}\n            onMouseEnter={() => showTooltip(tooltipTarget.id)}\n            onMouseLeave={() => hideTooltip()}\n            onBlur={() => hideTooltip()}\n            footer={\n              tooltipContent.footer && (\n                <>\n                  <hr aria-hidden={true} />\n                  {tooltipContent.footer}\n                </>\n              )\n            }\n          >\n            {tooltipContent.body}\n          </InternalChartTooltip>\n        )}\n      </div>\n    </SingleTabStopNavigationProvider>\n  );\n};\n\nconst LegendItemTrigger = forwardRef(\n  (\n    {\n      isHighlighted,\n      someHighlighted,\n      itemId,\n      label,\n      marker,\n      visible,\n      onClick,\n      triggerRef,\n      onMouseEnter,\n      onMouseLeave,\n      onFocus,\n      onBlur,\n      onKeyDown,\n    }: {\n      isHighlighted?: boolean;\n      someHighlighted?: boolean;\n      itemId: string;\n      label: string;\n      marker?: React.ReactNode;\n      visible: boolean;\n      onClick: (event: React.MouseEvent) => void;\n      onMarkerClick?: () => void;\n      triggerRef?: Ref<HTMLElement>;\n      onMouseEnter?: () => void;\n      onMouseLeave?: () => void;\n      onFocus?: () => void;\n      onBlur?: (event: React.FocusEvent) => void;\n      onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;\n    },\n    ref: Ref<HTMLButtonElement>,\n  ) => {\n    const refObject = useRef<HTMLDivElement>(null);\n    const mergedRef = useMergeRefs(ref, triggerRef, refObject);\n    const { tabIndex } = useSingleTabStopNavigation(refObject);\n    return (\n      <button\n        data-itemid={itemId}\n        aria-pressed={visible}\n        aria-current={isHighlighted}\n        className={clsx(testClasses.item, styles.item, {\n          [styles[\"item--inactive\"]]: !visible,\n          [testClasses[\"hidden-item\"]]: !visible,\n          [styles[\"item--dimmed\"]]: someHighlighted && !isHighlighted,\n          [testClasses[\"dimmed-item\"]]: someHighlighted && !isHighlighted,\n        })}\n        ref={mergedRef}\n        tabIndex={tabIndex}\n        onClick={onClick}\n        onMouseEnter={onMouseEnter}\n        onMouseLeave={onMouseLeave}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        onKeyDown={onKeyDown}\n      >\n        {marker}\n        <span className={styles[\"item-label\"]}>{label}</span>\n      </button>\n    );\n  },\n);\n"]}

package/internal/components/chart-legend/styles.css.js

@@ -1,22 +1,28 @@
 
     import './styles.scoped.css';
     export default {
-  "focus-outline": "awsui_focus-outline_1kjc7_ordh1_15",
-  "item": "awsui_item_1kjc7_ordh1_27",
-  "root": "awsui_root_1kjc7_ordh1_41",
-  "root-side": "awsui_root-side_1kjc7_ordh1_81",
-  "list": "awsui_list_1kjc7_ordh1_86",
-  "list-bottom": "awsui_list-bottom_1kjc7_ordh1_96",
-  "list-side": "awsui_list-side_1kjc7_ordh1_101",
-  "legend-bottom": "awsui_legend-bottom_1kjc7_ordh1_106",
-  "legend-side": "awsui_legend-side_1kjc7_ordh1_115",
-  "item--inactive": "awsui_item--inactive_1kjc7_ordh1_186",
-  "item--dimmed": "awsui_item--dimmed_1kjc7_ordh1_192",
-  "item-label": "awsui_item-label_1kjc7_ordh1_196",
-  "actions": "awsui_actions_1kjc7_ordh1_206",
-  "actions-bottom": "awsui_actions-bottom_1kjc7_ordh1_211",
-  "actions-side": "awsui_actions-side_1kjc7_ordh1_215",
-  "actions-divider-bottom": "awsui_actions-divider-bottom_1kjc7_ordh1_220",
-  "actions-divider-side": "awsui_actions-divider-side_1kjc7_ordh1_227"
+  "focus-outline": "awsui_focus-outline_1kjc7_oede3_15",
+  "item": "awsui_item_1kjc7_oede3_27",
+  "root": "awsui_root_1kjc7_oede3_41",
+  "root-side": "awsui_root-side_1kjc7_oede3_81",
+  "list": "awsui_list_1kjc7_oede3_86",
+  "list-bottom": "awsui_list-bottom_1kjc7_oede3_96",
+  "list-bottom-start": "awsui_list-bottom-start_1kjc7_oede3_99",
+  "list-bottom-center": "awsui_list-bottom-center_1kjc7_oede3_102",
+  "list-side": "awsui_list-side_1kjc7_oede3_106",
+  "legend-bottom": "awsui_legend-bottom_1kjc7_oede3_111",
+  "legend-bottom-start": "awsui_legend-bottom-start_1kjc7_oede3_118",
+  "legend-bottom-center": "awsui_legend-bottom-center_1kjc7_oede3_121",
+  "legend-title-start": "awsui_legend-title-start_1kjc7_oede3_125",
+  "legend-title-center": "awsui_legend-title-center_1kjc7_oede3_129",
+  "legend-side": "awsui_legend-side_1kjc7_oede3_133",
+  "item--inactive": "awsui_item--inactive_1kjc7_oede3_204",
+  "item--dimmed": "awsui_item--dimmed_1kjc7_oede3_210",
+  "item-label": "awsui_item-label_1kjc7_oede3_214",
+  "actions": "awsui_actions_1kjc7_oede3_224",
+  "actions-bottom": "awsui_actions-bottom_1kjc7_oede3_229",
+  "actions-side": "awsui_actions-side_1kjc7_oede3_233",
+  "actions-divider-bottom": "awsui_actions-divider-bottom_1kjc7_oede3_238",
+  "actions-divider-side": "awsui_actions-divider-side_1kjc7_oede3_245"
 };
   

package/internal/components/chart-legend/styles.scoped.css

@@ -12,7 +12,7 @@
 */
 /* stylelint-disable @cloudscape-design/no-motion-outside-of-mixin, selector-combinator-disallowed-list, selector-pseudo-class-no-unknown, selector-class-pattern */
 /* stylelint-enable @cloudscape-design/no-motion-outside-of-mixin, selector-combinator-disallowed-list, selector-pseudo-class-no-unknown, selector-class-pattern */
-body[data-awsui-focus-visible=true] .awsui_focus-outline_1kjc7_ordh1_15:not(#\9) {
+body[data-awsui-focus-visible=true] .awsui_focus-outline_1kjc7_oede3_15:not(#\9) {
   stroke: var(--color-border-item-focused-uk47pl, #006ce0);
 }
 
@@ -24,21 +24,21 @@ body[data-awsui-focus-visible=true] .awsui_focus-outline_1kjc7_ordh1_15:not(#\9)
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_item_1kjc7_ordh1_27:not(#\9) {
+.awsui_item_1kjc7_oede3_27:not(#\9) {
   transition: opacity 90ms linear;
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_item_1kjc7_ordh1_27:not(#\9) {
+  .awsui_item_1kjc7_oede3_27:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_item_1kjc7_ordh1_27:not(#\9), .awsui-mode-entering .awsui_item_1kjc7_ordh1_27:not(#\9) {
+.awsui-motion-disabled .awsui_item_1kjc7_oede3_27:not(#\9), .awsui-mode-entering .awsui_item_1kjc7_oede3_27:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_root_1kjc7_ordh1_41:not(#\9) {
+.awsui_root_1kjc7_oede3_41:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -74,16 +74,16 @@ body[data-awsui-focus-visible=true] .awsui_focus-outline_1kjc7_ordh1_15:not(#\9)
   overflow: auto;
   max-height: inherit;
 }
-.awsui_root_1kjc7_ordh1_41:not(#\9):focus {
+.awsui_root_1kjc7_oede3_41:not(#\9):focus {
   outline: none;
 }
 
-.awsui_root-side_1kjc7_ordh1_81:not(#\9) {
+.awsui_root-side_1kjc7_oede3_81:not(#\9) {
   display: flex;
   flex-direction: column;
 }
 
-.awsui_list_1kjc7_ordh1_86:not(#\9) {
+.awsui_list_1kjc7_oede3_86:not(#\9) {
   display: flex;
   list-style: none;
   margin-block: 0;
@@ -93,33 +93,51 @@ body[data-awsui-focus-visible=true] .awsui_focus-outline_1kjc7_ordh1_15:not(#\9)
   padding-block-start: var(--space-scaled-xs-xwoogq, 8px);
 }
 
-.awsui_list-bottom_1kjc7_ordh1_96:not(#\9) {
+.awsui_list-bottom_1kjc7_oede3_96:not(#\9) {
   flex-wrap: wrap;
-  justify-content: space-between;
+}
+.awsui_list-bottom_1kjc7_oede3_96.awsui_list-bottom-start_1kjc7_oede3_99:not(#\9) {
+  justify-content: start;
+}
+.awsui_list-bottom_1kjc7_oede3_96.awsui_list-bottom-center_1kjc7_oede3_102:not(#\9) {
+  justify-content: center;
 }
 
-.awsui_list-side_1kjc7_ordh1_101:not(#\9) {
+.awsui_list-side_1kjc7_oede3_106:not(#\9) {
   flex-wrap: nowrap;
   flex-direction: column;
 }
 
-.awsui_legend-bottom_1kjc7_ordh1_106:not(#\9) {
-  flex: 1;
+.awsui_legend-bottom_1kjc7_oede3_111:not(#\9) {
   display: flex;
   flex-wrap: wrap;
   flex-direction: row;
   max-inline-size: 100%;
   gap: var(--space-scaled-xxs-pfm1nx, 4px) var(--space-static-m-m6qboo, 16px);
 }
+.awsui_legend-bottom_1kjc7_oede3_111.awsui_legend-bottom-start_1kjc7_oede3_118:not(#\9) {
+  justify-content: start;
+}
+.awsui_legend-bottom_1kjc7_oede3_111.awsui_legend-bottom-center_1kjc7_oede3_121:not(#\9) {
+  justify-content: center;
+}
+
+.awsui_legend-title-start_1kjc7_oede3_125:not(#\9) {
+  text-align: start;
+}
+
+.awsui_legend-title-center_1kjc7_oede3_129:not(#\9) {
+  text-align: center;
+}
 
-.awsui_legend-side_1kjc7_ordh1_115:not(#\9) {
+.awsui_legend-side_1kjc7_oede3_133:not(#\9) {
   display: flex;
   flex-wrap: wrap;
   flex-direction: column;
   gap: var(--space-scaled-xxs-pfm1nx, 4px) var(--space-static-m-m6qboo, 16px);
 }
 
-.awsui_item_1kjc7_ordh1_27:not(#\9) {
+.awsui_item_1kjc7_oede3_27:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -162,16 +180,16 @@ body[data-awsui-focus-visible=true] .awsui_focus-outline_1kjc7_ordh1_15:not(#\9)
   opacity: 1;
   max-inline-size: 100%;
 }
-.awsui_item_1kjc7_ordh1_27:not(#\9):focus {
+.awsui_item_1kjc7_oede3_27:not(#\9):focus {
   outline: none;
 }
-body[data-awsui-focus-visible=true] .awsui_item_1kjc7_ordh1_27:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_item_1kjc7_oede3_27:not(#\9):focus {
   position: relative;
   box-sizing: border-box;
   outline: 2px dotted transparent;
   outline-offset: 1px;
 }
-body[data-awsui-focus-visible=true] .awsui_item_1kjc7_ordh1_27:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_item_1kjc7_oede3_27:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -183,17 +201,17 @@ body[data-awsui-focus-visible=true] .awsui_item_1kjc7_ordh1_27:not(#\9):focus::b
   border-radius: var(--border-radius-control-default-focus-ring-1uabki, 4px);
   border: 2px solid var(--color-border-item-focused-uk47pl, #006ce0);
 }
-.awsui_item_1kjc7_ordh1_27.awsui_item--inactive_1kjc7_ordh1_186:not(#\9) {
+.awsui_item_1kjc7_oede3_27.awsui_item--inactive_1kjc7_oede3_204:not(#\9) {
   color: var(--color-text-interactive-default-ugh9wp, #424650);
   text-decoration: line-through;
   text-decoration-thickness: 2px;
   text-decoration-color: var(--color-text-interactive-default-ugh9wp, #424650);
 }
-.awsui_item_1kjc7_ordh1_27.awsui_item--dimmed_1kjc7_ordh1_192:not(#\9) {
+.awsui_item_1kjc7_oede3_27.awsui_item--dimmed_1kjc7_oede3_210:not(#\9) {
   opacity: 0.35;
 }
 
-.awsui_item-label_1kjc7_ordh1_196:not(#\9) {
+.awsui_item-label_1kjc7_oede3_214:not(#\9) {
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
@@ -203,28 +221,28 @@ body[data-awsui-focus-visible=true] .awsui_item_1kjc7_ordh1_27:not(#\9):focus::b
   -webkit-box-orient: vertical;
 }
 
-.awsui_actions_1kjc7_ordh1_206:not(#\9) {
+.awsui_actions_1kjc7_oede3_224:not(#\9) {
   display: flex;
   align-items: center;
 }
 
-.awsui_actions-bottom_1kjc7_ordh1_211:not(#\9) {
+.awsui_actions-bottom_1kjc7_oede3_229:not(#\9) {
   flex-direction: row;
 }
 
-.awsui_actions-side_1kjc7_ordh1_215:not(#\9) {
+.awsui_actions-side_1kjc7_oede3_233:not(#\9) {
   flex-direction: column;
   align-items: flex-start;
 }
 
-.awsui_actions-divider-bottom_1kjc7_ordh1_220:not(#\9) {
+.awsui_actions-divider-bottom_1kjc7_oede3_238:not(#\9) {
   inline-size: 1px;
   block-size: 80%;
   margin-inline: var(--space-scaled-xs-xwoogq, 8px);
   background: var(--color-border-divider-default-nr68jt, #c6c6cd);
 }
 
-.awsui_actions-divider-side_1kjc7_ordh1_227:not(#\9) {
+.awsui_actions-divider-side_1kjc7_oede3_245:not(#\9) {
   inline-size: 80%;
   block-size: 1px;
   margin-block-end: var(--space-scaled-xs-xwoogq, 8px);

package/internal/components/chart-legend/styles.selectors.js

@@ -2,22 +2,28 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "focus-outline": "awsui_focus-outline_1kjc7_ordh1_15",
-  "item": "awsui_item_1kjc7_ordh1_27",
-  "root": "awsui_root_1kjc7_ordh1_41",
-  "root-side": "awsui_root-side_1kjc7_ordh1_81",
-  "list": "awsui_list_1kjc7_ordh1_86",
-  "list-bottom": "awsui_list-bottom_1kjc7_ordh1_96",
-  "list-side": "awsui_list-side_1kjc7_ordh1_101",
-  "legend-bottom": "awsui_legend-bottom_1kjc7_ordh1_106",
-  "legend-side": "awsui_legend-side_1kjc7_ordh1_115",
-  "item--inactive": "awsui_item--inactive_1kjc7_ordh1_186",
-  "item--dimmed": "awsui_item--dimmed_1kjc7_ordh1_192",
-  "item-label": "awsui_item-label_1kjc7_ordh1_196",
-  "actions": "awsui_actions_1kjc7_ordh1_206",
-  "actions-bottom": "awsui_actions-bottom_1kjc7_ordh1_211",
-  "actions-side": "awsui_actions-side_1kjc7_ordh1_215",
-  "actions-divider-bottom": "awsui_actions-divider-bottom_1kjc7_ordh1_220",
-  "actions-divider-side": "awsui_actions-divider-side_1kjc7_ordh1_227"
+  "focus-outline": "awsui_focus-outline_1kjc7_oede3_15",
+  "item": "awsui_item_1kjc7_oede3_27",
+  "root": "awsui_root_1kjc7_oede3_41",
+  "root-side": "awsui_root-side_1kjc7_oede3_81",
+  "list": "awsui_list_1kjc7_oede3_86",
+  "list-bottom": "awsui_list-bottom_1kjc7_oede3_96",
+  "list-bottom-start": "awsui_list-bottom-start_1kjc7_oede3_99",
+  "list-bottom-center": "awsui_list-bottom-center_1kjc7_oede3_102",
+  "list-side": "awsui_list-side_1kjc7_oede3_106",
+  "legend-bottom": "awsui_legend-bottom_1kjc7_oede3_111",
+  "legend-bottom-start": "awsui_legend-bottom-start_1kjc7_oede3_118",
+  "legend-bottom-center": "awsui_legend-bottom-center_1kjc7_oede3_121",
+  "legend-title-start": "awsui_legend-title-start_1kjc7_oede3_125",
+  "legend-title-center": "awsui_legend-title-center_1kjc7_oede3_129",
+  "legend-side": "awsui_legend-side_1kjc7_oede3_133",
+  "item--inactive": "awsui_item--inactive_1kjc7_oede3_204",
+  "item--dimmed": "awsui_item--dimmed_1kjc7_oede3_210",
+  "item-label": "awsui_item-label_1kjc7_oede3_214",
+  "actions": "awsui_actions_1kjc7_oede3_224",
+  "actions-bottom": "awsui_actions-bottom_1kjc7_oede3_229",
+  "actions-side": "awsui_actions-side_1kjc7_oede3_233",
+  "actions-divider-bottom": "awsui_actions-divider-bottom_1kjc7_oede3_238",
+  "actions-divider-side": "awsui_actions-divider-side_1kjc7_oede3_245"
 };
   

package/internal/environment.js

@@ -1,5 +1,5 @@
 export var PACKAGE_SOURCE = "chart-components";
-export var PACKAGE_VERSION = "1.0.0 (116234a9)";
+export var PACKAGE_VERSION = "1.0.0 (5a521628)";
 export var THEME = "open-source-visual-refresh";
 export var ALWAYS_VISUAL_REFRESH = true;
 export var SYSTEM = "console";

package/internal/environment.json

@@ -1,6 +1,6 @@
 {
   "PACKAGE_SOURCE": "chart-components",
-  "PACKAGE_VERSION": "1.0.0 (116234a9)",
+  "PACKAGE_VERSION": "1.0.0 (5a521628)",
   "THEME": "open-source-visual-refresh",
   "ALWAYS_VISUAL_REFRESH": true,
   "SYSTEM": "console"

package/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "116234a9664d7074743c085519df60a1cba3b7e8"
+  "commit": "5a5216280e083d41852a08e3ea4a9454f4d23bbb"
 }

package/internal-do-not-use/core-legend/index.d.ts

@@ -1,2 +1,2 @@
 import { CoreLegendProps } from "../../core/interfaces";
-export declare const CoreLegend: ({ items, title, actions, ariaLabel, alignment, onItemHighlight, onClearHighlight, onVisibleItemsChange, getLegendTooltipContent, }: CoreLegendProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const CoreLegend: ({ items, title, actions, ariaLabel, alignment, onItemHighlight, onClearHighlight, onVisibleItemsChange, getLegendTooltipContent, horizontalAlignment, }: CoreLegendProps) => import("react/jsx-runtime").JSX.Element | null;

package/internal-do-not-use/core-legend/index.js

@@ -1,11 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { ChartLegend as ChartLegendComponent } from "../../internal/components/chart-legend";
 import { fireNonCancelableEvent } from "../../internal/events";
-export const CoreLegend = ({ items, title, actions, ariaLabel, alignment = "horizontal", onItemHighlight, onClearHighlight, onVisibleItemsChange, getLegendTooltipContent, }) => {
+export const CoreLegend = ({ items, title, actions, ariaLabel, alignment = "horizontal", onItemHighlight, onClearHighlight, onVisibleItemsChange, getLegendTooltipContent, horizontalAlignment = "start", }) => {
     const position = alignment === "horizontal" ? "bottom" : "side";
     if (items.length === 0) {
         return null;
     }
-    return (_jsx(ChartLegendComponent, { items: items, actions: actions, legendTitle: title, position: position, ariaLabel: ariaLabel, getTooltipContent: (props) => { var _a; return (_a = getLegendTooltipContent === null || getLegendTooltipContent === void 0 ? void 0 : getLegendTooltipContent(props)) !== null && _a !== void 0 ? _a : null; }, onItemHighlightExit: () => fireNonCancelableEvent(onClearHighlight), onItemHighlightEnter: (item) => fireNonCancelableEvent(onItemHighlight, { item }), onItemVisibilityChange: (items) => fireNonCancelableEvent(onVisibleItemsChange, { items }) }));
+    return (_jsx(ChartLegendComponent, { items: items, actions: actions, legendTitle: title, position: position, horizontalAlignment: horizontalAlignment, ariaLabel: ariaLabel, getTooltipContent: (props) => { var _a; return (_a = getLegendTooltipContent === null || getLegendTooltipContent === void 0 ? void 0 : getLegendTooltipContent(props)) !== null && _a !== void 0 ? _a : null; }, onItemHighlightExit: () => fireNonCancelableEvent(onClearHighlight), onItemHighlightEnter: (item) => fireNonCancelableEvent(onItemHighlight, { item }), onItemVisibilityChange: (items) => fireNonCancelableEvent(onVisibleItemsChange, { items }) }));
 };
 //# sourceMappingURL=index.js.map

package/internal-do-not-use/core-legend/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal-do-not-use/core-legend/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,wCAAwC,CAAC;AAC7F,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAE/D,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,KAAK,EACL,KAAK,EACL,OAAO,EACP,SAAS,EACT,SAAS,GAAG,YAAY,EACxB,eAAe,EACf,gBAAgB,EAChB,oBAAoB,EACpB,uBAAuB,GACP,EAAE,EAAE;IACpB,MAAM,QAAQ,GAAG,SAAS,KAAK,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC;IAEhE,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;QACtB,OAAO,IAAI,CAAC;KACb;IAED,OAAO,CACL,KAAC,oBAAoB,IACnB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,KAAK,EAClB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,iBAAiB,EAAE,CAAC,KAAK,EAAE,EAAE,WAAC,OAAA,MAAA,uBAAuB,aAAvB,uBAAuB,uBAAvB,uBAAuB,CAAG,KAAK,CAAC,mCAAI,IAAI,CAAA,EAAA,EACtE,mBAAmB,EAAE,GAAG,EAAE,CAAC,sBAAsB,CAAC,gBAAgB,CAAC,EACnE,oBAAoB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,sBAAsB,CAAC,eAAe,EAAE,EAAE,IAAI,EAAE,CAAC,EACjF,sBAAsB,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,sBAAsB,CAAC,oBAAoB,EAAE,EAAE,KAAK,EAAE,CAAC,GAC1F,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { CoreLegendProps } from \"../../core/interfaces\";\nimport { ChartLegend as ChartLegendComponent } from \"../../internal/components/chart-legend\";\nimport { fireNonCancelableEvent } from \"../../internal/events\";\n\nexport const CoreLegend = ({\n  items,\n  title,\n  actions,\n  ariaLabel,\n  alignment = \"horizontal\",\n  onItemHighlight,\n  onClearHighlight,\n  onVisibleItemsChange,\n  getLegendTooltipContent,\n}: CoreLegendProps) => {\n  const position = alignment === \"horizontal\" ? \"bottom\" : \"side\";\n\n  if (items.length === 0) {\n    return null;\n  }\n\n  return (\n    <ChartLegendComponent\n      items={items}\n      actions={actions}\n      legendTitle={title}\n      position={position}\n      ariaLabel={ariaLabel}\n      getTooltipContent={(props) => getLegendTooltipContent?.(props) ?? null}\n      onItemHighlightExit={() => fireNonCancelableEvent(onClearHighlight)}\n      onItemHighlightEnter={(item) => fireNonCancelableEvent(onItemHighlight, { item })}\n      onItemVisibilityChange={(items) => fireNonCancelableEvent(onVisibleItemsChange, { items })}\n    />\n  );\n};\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/internal-do-not-use/core-legend/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,WAAW,IAAI,oBAAoB,EAAE,MAAM,wCAAwC,CAAC;AAC7F,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAE/D,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,KAAK,EACL,KAAK,EACL,OAAO,EACP,SAAS,EACT,SAAS,GAAG,YAAY,EACxB,eAAe,EACf,gBAAgB,EAChB,oBAAoB,EACpB,uBAAuB,EACvB,mBAAmB,GAAG,OAAO,GACb,EAAE,EAAE;IACpB,MAAM,QAAQ,GAAG,SAAS,KAAK,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC;IAEhE,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;QACtB,OAAO,IAAI,CAAC;KACb;IAED,OAAO,CACL,KAAC,oBAAoB,IACnB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,KAAK,EAClB,QAAQ,EAAE,QAAQ,EAClB,mBAAmB,EAAE,mBAAmB,EACxC,SAAS,EAAE,SAAS,EACpB,iBAAiB,EAAE,CAAC,KAAK,EAAE,EAAE,WAAC,OAAA,MAAA,uBAAuB,aAAvB,uBAAuB,uBAAvB,uBAAuB,CAAG,KAAK,CAAC,mCAAI,IAAI,CAAA,EAAA,EACtE,mBAAmB,EAAE,GAAG,EAAE,CAAC,sBAAsB,CAAC,gBAAgB,CAAC,EACnE,oBAAoB,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,sBAAsB,CAAC,eAAe,EAAE,EAAE,IAAI,EAAE,CAAC,EACjF,sBAAsB,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,sBAAsB,CAAC,oBAAoB,EAAE,EAAE,KAAK,EAAE,CAAC,GAC1F,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { CoreLegendProps } from \"../../core/interfaces\";\nimport { ChartLegend as ChartLegendComponent } from \"../../internal/components/chart-legend\";\nimport { fireNonCancelableEvent } from \"../../internal/events\";\n\nexport const CoreLegend = ({\n  items,\n  title,\n  actions,\n  ariaLabel,\n  alignment = \"horizontal\",\n  onItemHighlight,\n  onClearHighlight,\n  onVisibleItemsChange,\n  getLegendTooltipContent,\n  horizontalAlignment = \"start\",\n}: CoreLegendProps) => {\n  const position = alignment === \"horizontal\" ? \"bottom\" : \"side\";\n\n  if (items.length === 0) {\n    return null;\n  }\n\n  return (\n    <ChartLegendComponent\n      items={items}\n      actions={actions}\n      legendTitle={title}\n      position={position}\n      horizontalAlignment={horizontalAlignment}\n      ariaLabel={ariaLabel}\n      getTooltipContent={(props) => getLegendTooltipContent?.(props) ?? null}\n      onItemHighlightExit={() => fireNonCancelableEvent(onClearHighlight)}\n      onItemHighlightEnter={(item) => fireNonCancelableEvent(onItemHighlight, { item })}\n      onItemVisibilityChange={(items) => fireNonCancelableEvent(onVisibleItemsChange, { items })}\n    />\n  );\n};\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudscape-design/chart-components",
-  "version": "1.0.17",
+  "version": "1.0.18",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/cloudscape-design/chart-components.git"