@cloudscape-design/components-themeable 3.0.961 → 3.0.963

package/lib/internal/template/internal/components/cartesian-chart/styles.scoped.css

@@ -6,147 +6,147 @@
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_axis_f0fot_16pfq_9:not(#\9),
-.awsui_vertical-marker_f0fot_16pfq_10:not(#\9) {
-  stroke: var(--color-charts-line-axis-lfw0ld, #d5dbdb);
+.awsui_axis_f0fot_1ps4e_9:not(#\9),
+.awsui_vertical-marker_f0fot_1ps4e_10:not(#\9) {
+  stroke: var(--color-charts-line-axis-itbyj0, #d5dbdb);
   stroke-width: 1px;
 }
 
-.awsui_axis--emphasized_f0fot_16pfq_15:not(#\9) {
+.awsui_axis--emphasized_f0fot_1ps4e_15:not(#\9) {
   stroke-width: 2px;
 }
 
-.awsui_axis-label_f0fot_16pfq_19:not(#\9) {
+.awsui_axis-label_f0fot_1ps4e_19:not(#\9) {
   font-weight: bold;
-  fill: var(--color-text-body-default-agk00h, #16191f);
+  fill: var(--color-text-body-default-1tki40, #16191f);
 }
 
-.awsui_axis-label--x_f0fot_16pfq_24:not(#\9),
-.awsui_axis-label--y_f0fot_16pfq_25:not(#\9) {
+.awsui_axis-label--x_f0fot_1ps4e_24:not(#\9),
+.awsui_axis-label--y_f0fot_1ps4e_25:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_grid_f0fot_16pfq_29:not(#\9) {
-  stroke: var(--color-charts-line-grid-z7yjnd, #d5dbdb);
+.awsui_grid_f0fot_1ps4e_29:not(#\9) {
+  stroke: var(--color-charts-line-grid-6wlgqa, #d5dbdb);
   stroke-width: 1px;
 }
 
-.awsui_ticks__line_f0fot_16pfq_34:not(#\9) {
-  stroke: var(--color-charts-line-tick-kpqd8n, #d5dbdb);
+.awsui_ticks__line_f0fot_1ps4e_34:not(#\9) {
+  stroke: var(--color-charts-line-tick-36hawu, #d5dbdb);
   stroke-width: 1px;
 }
 
-.awsui_ticks__text_f0fot_16pfq_39:not(#\9) {
-  font-size: var(--font-chart-detail-size-z60lhi, 14px);
-  fill: var(--color-text-body-secondary-z2wo4i, #545b64);
+.awsui_ticks__text_f0fot_1ps4e_39:not(#\9) {
+  font-size: var(--font-chart-detail-size-drm2a6, 14px);
+  fill: var(--color-text-body-secondary-0m40yy, #545b64);
 }
 
-.awsui_ticks--y_f0fot_16pfq_44:not(#\9),
-.awsui_ticks--x_f0fot_16pfq_45:not(#\9) {
+.awsui_ticks--y_f0fot_1ps4e_44:not(#\9),
+.awsui_ticks--x_f0fot_1ps4e_45:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_ticks--bottom_f0fot_16pfq_49 > .awsui_ticks__text_f0fot_16pfq_39:not(#\9) {
+.awsui_ticks--bottom_f0fot_1ps4e_49 > .awsui_ticks__text_f0fot_1ps4e_39:not(#\9) {
   text-anchor: middle;
   dominant-baseline: hanging;
 }
 
-.awsui_labels-inline-start_f0fot_16pfq_54 > .awsui_ticks_f0fot_16pfq_34 > .awsui_ticks__text_f0fot_16pfq_39:not(#\9) {
+.awsui_labels-inline-start_f0fot_1ps4e_54 > .awsui_ticks_f0fot_1ps4e_34 > .awsui_ticks__text_f0fot_1ps4e_39:not(#\9) {
   text-anchor: end;
   dominant-baseline: central;
 }
 
-.awsui_labels-inline-start_f0fot_16pfq_54:not(#\9) {
+.awsui_labels-inline-start_f0fot_1ps4e_54:not(#\9) {
   position: relative;
   margin-inline-end: 12px;
 }
-.awsui_labels-inline-start_f0fot_16pfq_54 > .awsui_axis-label_f0fot_16pfq_19:not(#\9) {
+.awsui_labels-inline-start_f0fot_1ps4e_54 > .awsui_axis-label_f0fot_1ps4e_19:not(#\9) {
   position: absolute;
   visibility: visible;
   white-space: nowrap;
 }
 
-.awsui_labels-inline-start__label_f0fot_16pfq_69:not(#\9) {
+.awsui_labels-inline-start__label_f0fot_1ps4e_69:not(#\9) {
   position: absolute;
 }
 
-.awsui_labels-inline-start--hidden_f0fot_16pfq_73:not(#\9) {
+.awsui_labels-inline-start--hidden_f0fot_1ps4e_73:not(#\9) {
   visibility: hidden;
 }
-.awsui_labels-inline-start--hidden_f0fot_16pfq_73 > .awsui_labels-inline-start__label_f0fot_16pfq_69:not(#\9) {
+.awsui_labels-inline-start--hidden_f0fot_1ps4e_73 > .awsui_labels-inline-start__label_f0fot_1ps4e_69:not(#\9) {
   position: relative;
   white-space: nowrap;
 }
 
-.awsui_labels-block-end_f0fot_16pfq_81:not(#\9) {
+.awsui_labels-block-end_f0fot_1ps4e_81:not(#\9) {
   position: relative;
   display: block;
   inline-size: 100%;
   overflow: visible;
 }
 
-.awsui_vertical-marker_f0fot_16pfq_10:not(#\9) {
+.awsui_vertical-marker_f0fot_1ps4e_10:not(#\9) {
   pointer-events: none;
 }
 
-.awsui_vertical-marker-circle_f0fot_16pfq_92:not(#\9) {
-  fill: var(--color-background-container-content-myy7cn, #ffffff);
+.awsui_vertical-marker-circle_f0fot_1ps4e_92:not(#\9) {
+  fill: var(--color-background-container-content-mvmryi, #ffffff);
   pointer-events: none;
-  stroke-width: var(--border-line-chart-width-fcce6g, 2px);
+  stroke-width: var(--border-line-chart-width-aeswqs, 2px);
 }
 
-.awsui_vertical-marker-circle-active_f0fot_16pfq_98:not(#\9) {
+.awsui_vertical-marker-circle-active_f0fot_1ps4e_98:not(#\9) {
   cursor: pointer;
-  stroke-width: var(--border-line-chart-width-fcce6g, 2px);
+  stroke-width: var(--border-line-chart-width-aeswqs, 2px);
 }
 
-.awsui_focus-outline_f0fot_16pfq_103:not(#\9) {
+.awsui_focus-outline_f0fot_1ps4e_103:not(#\9) {
   outline: none;
   pointer-events: none;
   fill: none;
-  stroke: var(--color-border-item-focused-q68bgg, #0073bb);
+  stroke: var(--color-border-item-focused-vx5mpq, #0073bb);
   stroke-width: 2px;
 }
 
-.awsui_chart-container_f0fot_16pfq_111:not(#\9) {
+.awsui_chart-container_f0fot_1ps4e_111:not(#\9) {
   display: flex;
   inline-size: 100%;
   flex-direction: column;
 }
-.awsui_chart-container_f0fot_16pfq_111.awsui_fit-height_f0fot_16pfq_116:not(#\9) {
+.awsui_chart-container_f0fot_1ps4e_111.awsui_fit-height_f0fot_1ps4e_116:not(#\9) {
   block-size: 100%;
   min-block-size: inherit;
 }
 
-.awsui_chart-container-outer_f0fot_16pfq_121:not(#\9) {
+.awsui_chart-container-outer_f0fot_1ps4e_121:not(#\9) {
   display: flex;
 }
-.awsui_chart-container-outer_f0fot_16pfq_121.awsui_fit-height_f0fot_16pfq_116:not(#\9) {
+.awsui_chart-container-outer_f0fot_1ps4e_121.awsui_fit-height_f0fot_1ps4e_116:not(#\9) {
   flex: 1;
 }
-.awsui_chart-container-outer_f0fot_16pfq_121.awsui_fit-height_f0fot_16pfq_116:not(#\9):not(.awsui_axis-label_f0fot_16pfq_19 + .awsui_chart-container-outer_f0fot_16pfq_121.awsui_fit-height_f0fot_16pfq_116, .awsui_chart-container-outer_f0fot_16pfq_121.awsui_fit-height_f0fot_16pfq_116.awsui_has-filters_f0fot_16pfq_127) {
-  margin-block-start: calc(0.5 * var(--font-chart-detail-size-z60lhi, 14px));
+.awsui_chart-container-outer_f0fot_1ps4e_121.awsui_fit-height_f0fot_1ps4e_116:not(#\9):not(.awsui_axis-label_f0fot_1ps4e_19 + .awsui_chart-container-outer_f0fot_1ps4e_121.awsui_fit-height_f0fot_1ps4e_116, .awsui_chart-container-outer_f0fot_1ps4e_121.awsui_fit-height_f0fot_1ps4e_116.awsui_has-filters_f0fot_1ps4e_127) {
+  margin-block-start: calc(0.5 * var(--font-chart-detail-size-drm2a6, 14px));
 }
 
-.awsui_chart-container-inner_f0fot_16pfq_131:not(#\9) {
+.awsui_chart-container-inner_f0fot_1ps4e_131:not(#\9) {
   position: relative;
   display: flex;
   flex-direction: column;
   inline-size: 100%;
 }
 
-.awsui_chart-container-plot-wrapper_f0fot_16pfq_138.awsui_fit-height_f0fot_16pfq_116:not(#\9) {
+.awsui_chart-container-plot-wrapper_f0fot_1ps4e_138.awsui_fit-height_f0fot_1ps4e_116:not(#\9) {
   display: block;
   position: relative;
   flex: 1;
 }
 
-.awsui_chart-container-plot_f0fot_16pfq_138.awsui_fit-height_f0fot_16pfq_116:not(#\9) {
+.awsui_chart-container-plot_f0fot_1ps4e_138.awsui_fit-height_f0fot_1ps4e_116:not(#\9) {
   display: block;
   position: absolute;
   inset: 0;
 }
 
-.awsui_chart-container-bottom-labels_f0fot_16pfq_150.awsui_fit-height_f0fot_16pfq_116:not(#\9) {
+.awsui_chart-container-bottom-labels_f0fot_1ps4e_150.awsui_fit-height_f0fot_1ps4e_116:not(#\9) {
   display: block;
 }

package/lib/internal/template/internal/components/cartesian-chart/styles.selectors.js

@@ -2,33 +2,33 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "axis": "awsui_axis_f0fot_16pfq_9",
-  "vertical-marker": "awsui_vertical-marker_f0fot_16pfq_10",
-  "axis--emphasized": "awsui_axis--emphasized_f0fot_16pfq_15",
-  "axis-label": "awsui_axis-label_f0fot_16pfq_19",
-  "axis-label--x": "awsui_axis-label--x_f0fot_16pfq_24",
-  "axis-label--y": "awsui_axis-label--y_f0fot_16pfq_25",
-  "grid": "awsui_grid_f0fot_16pfq_29",
-  "ticks__line": "awsui_ticks__line_f0fot_16pfq_34",
-  "ticks__text": "awsui_ticks__text_f0fot_16pfq_39",
-  "ticks--y": "awsui_ticks--y_f0fot_16pfq_44",
-  "ticks--x": "awsui_ticks--x_f0fot_16pfq_45",
-  "ticks--bottom": "awsui_ticks--bottom_f0fot_16pfq_49",
-  "labels-inline-start": "awsui_labels-inline-start_f0fot_16pfq_54",
-  "ticks": "awsui_ticks_f0fot_16pfq_34",
-  "labels-inline-start__label": "awsui_labels-inline-start__label_f0fot_16pfq_69",
-  "labels-inline-start--hidden": "awsui_labels-inline-start--hidden_f0fot_16pfq_73",
-  "labels-block-end": "awsui_labels-block-end_f0fot_16pfq_81",
-  "vertical-marker-circle": "awsui_vertical-marker-circle_f0fot_16pfq_92",
-  "vertical-marker-circle-active": "awsui_vertical-marker-circle-active_f0fot_16pfq_98",
-  "focus-outline": "awsui_focus-outline_f0fot_16pfq_103",
-  "chart-container": "awsui_chart-container_f0fot_16pfq_111",
-  "fit-height": "awsui_fit-height_f0fot_16pfq_116",
-  "chart-container-outer": "awsui_chart-container-outer_f0fot_16pfq_121",
-  "has-filters": "awsui_has-filters_f0fot_16pfq_127",
-  "chart-container-inner": "awsui_chart-container-inner_f0fot_16pfq_131",
-  "chart-container-plot-wrapper": "awsui_chart-container-plot-wrapper_f0fot_16pfq_138",
-  "chart-container-plot": "awsui_chart-container-plot_f0fot_16pfq_138",
-  "chart-container-bottom-labels": "awsui_chart-container-bottom-labels_f0fot_16pfq_150"
+  "axis": "awsui_axis_f0fot_1ps4e_9",
+  "vertical-marker": "awsui_vertical-marker_f0fot_1ps4e_10",
+  "axis--emphasized": "awsui_axis--emphasized_f0fot_1ps4e_15",
+  "axis-label": "awsui_axis-label_f0fot_1ps4e_19",
+  "axis-label--x": "awsui_axis-label--x_f0fot_1ps4e_24",
+  "axis-label--y": "awsui_axis-label--y_f0fot_1ps4e_25",
+  "grid": "awsui_grid_f0fot_1ps4e_29",
+  "ticks__line": "awsui_ticks__line_f0fot_1ps4e_34",
+  "ticks__text": "awsui_ticks__text_f0fot_1ps4e_39",
+  "ticks--y": "awsui_ticks--y_f0fot_1ps4e_44",
+  "ticks--x": "awsui_ticks--x_f0fot_1ps4e_45",
+  "ticks--bottom": "awsui_ticks--bottom_f0fot_1ps4e_49",
+  "labels-inline-start": "awsui_labels-inline-start_f0fot_1ps4e_54",
+  "ticks": "awsui_ticks_f0fot_1ps4e_34",
+  "labels-inline-start__label": "awsui_labels-inline-start__label_f0fot_1ps4e_69",
+  "labels-inline-start--hidden": "awsui_labels-inline-start--hidden_f0fot_1ps4e_73",
+  "labels-block-end": "awsui_labels-block-end_f0fot_1ps4e_81",
+  "vertical-marker-circle": "awsui_vertical-marker-circle_f0fot_1ps4e_92",
+  "vertical-marker-circle-active": "awsui_vertical-marker-circle-active_f0fot_1ps4e_98",
+  "focus-outline": "awsui_focus-outline_f0fot_1ps4e_103",
+  "chart-container": "awsui_chart-container_f0fot_1ps4e_111",
+  "fit-height": "awsui_fit-height_f0fot_1ps4e_116",
+  "chart-container-outer": "awsui_chart-container-outer_f0fot_1ps4e_121",
+  "has-filters": "awsui_has-filters_f0fot_1ps4e_127",
+  "chart-container-inner": "awsui_chart-container-inner_f0fot_1ps4e_131",
+  "chart-container-plot-wrapper": "awsui_chart-container-plot-wrapper_f0fot_1ps4e_138",
+  "chart-container-plot": "awsui_chart-container-plot_f0fot_1ps4e_138",
+  "chart-container-bottom-labels": "awsui_chart-container-bottom-labels_f0fot_1ps4e_150"
 };
   

package/lib/internal/template/internal/components/chart-filter/index.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
+import React from 'react';
 import { BaseComponentProps } from '../../base-component';
-import { ChartSeriesMarkerType } from '../chart-series-marker';
 interface I18nStrings {
     filterLabel?: string;
     filterPlaceholder?: string;
@@ -8,8 +7,7 @@ interface I18nStrings {
 }
 interface ChartFilterItem<T> {
     label: string;
-    color: string;
-    type: ChartSeriesMarkerType;
+    marker: React.ReactNode;
     datum: T;
 }
 export interface ChartFilterProps<T> extends BaseComponentProps {

package/lib/internal/template/internal/components/chart-filter/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/chart-filter/index.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,kBAAkB,EAAgB,MAAM,sBAAsB,CAAC;AAExE,OAAqB,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAI7E,UAAU,WAAW;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC;AAED,UAAU,eAAe,CAAC,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,qBAAqB,CAAC;IAC5B,KAAK,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC,CAAE,SAAQ,kBAAkB;IAC7D,MAAM,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1C,cAAc,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAClC,QAAQ,EAAE,CAAC,cAAc,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACrD,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;;AAED,wBAAuD;AAEvD,iBAAS,WAAW,CAAC,CAAC,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,EAAE,gBAAgB,CAAC,CAAC,CAAC,eAgD3G"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/chart-filter/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAOjD,OAAO,EAAE,kBAAkB,EAAgB,MAAM,sBAAsB,CAAC;AAKxE,UAAU,WAAW;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC;AAED,UAAU,eAAe,CAAC,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,KAAK,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC,CAAE,SAAQ,kBAAkB;IAC7D,MAAM,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1C,cAAc,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAClC,QAAQ,EAAE,CAAC,cAAc,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IACrD,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B;;AAED,wBAAuD;AAEvD,iBAAS,WAAW,CAAC,CAAC,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,EAAE,gBAAgB,CAAC,CAAC,CAAC,eA4C3G"}

package/lib/internal/template/internal/components/chart-filter/index.js

@@ -7,7 +7,6 @@ import InternalFormField from '../../../form-field/internal';
 import { useInternalI18n } from '../../../i18n/context';
 import InternalMultiselect from '../../../multiselect/internal';
 import { getBaseProps } from '../../base-component';
-import SeriesMarker from '../chart-series-marker';
 import styles from './styles.css.js';
 export default memo(ChartFilter);
 function ChartFilter(_a) {
@@ -19,8 +18,7 @@ function ChartFilter(_a) {
         label: d.label,
         value: '' + i,
         datum: d.datum,
-        __customIcon: (React.createElement("span", { className: styles['custom-icon-wrapper'] },
-            React.createElement(SeriesMarker, { color: d.color, type: d.type }))),
+        __customIcon: React.createElement("span", { className: styles['custom-icon-wrapper'] }, d.marker),
     }));
     const selectedOptions = defaultOptions.filter(option => (selectedSeries === null || selectedSeries === void 0 ? void 0 : selectedSeries.indexOf(option.datum)) !== -1);
     const updateSelection = useCallback(({ detail: { selectedOptions } }) => {

package/lib/internal/template/internal/components/chart-filter/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-filter/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,iBAAiB,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAExD,OAAO,mBAAmB,MAAM,+BAA+B,CAAC;AAChE,OAAO,EAAsB,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAExE,OAAO,YAAuC,MAAM,wBAAwB,CAAC;AAE7E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAsBrC,eAAe,IAAI,CAAC,WAAW,CAAuB,CAAC;AAEvD,SAAS,WAAW,CAAI,EAAoF;QAApF,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,OAAqC,EAAhC,SAAS,cAA7D,uDAA+D,CAAF;IACnF,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;IACzD,MAAM,IAAI,GAAG,eAAe,CAAC,UAAU,CAAC,CAAC;IAEzC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC;QAC3C,KAAK,EAAE,CAAC,CAAC,KAAK;QACd,KAAK,EAAE,EAAE,GAAG,CAAC;QACb,KAAK,EAAE,CAAC,CAAC,KAAK;QACd,YAAY,EAAE,CACZ,8BAAM,SAAS,EAAE,MAAM,CAAC,qBAAqB,CAAC;YAC5C,oBAAC,YAAY,IAAC,KAAK,EAAE,CAAC,CAAC,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,GAAI,CACzC,CACR;KACF,CAAC,CAAC,CAAC;IAEJ,MAAM,eAAe,GAAG,cAAc,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,MAAK,CAAC,CAAC,CAAC,CAAC;IAEtG,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,EAAE,MAAM,EAAE,EAAE,eAAe,EAAE,EAAE,EAAE,EAAE;QAClC,MAAM,cAAc,GAAG,cAAc;aAClC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,eAAe,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;aACxD,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC/B,QAAQ,CAAC,cAAc,CAAC,CAAC;IAC3B,CAAC,EACD,CAAC,QAAQ,EAAE,cAAc,CAAC,CAC3B,CAAC;IAEF,OAAO,CACL,oBAAC,iBAAiB,oBACZ,SAAS,IACb,KAAK,EAAE,IAAI,CAAC,yBAAyB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,CAAC,EAChE,SAAS,EAAE,SAAS;QAEpB,oBAAC,mBAAmB,IAClB,WAAW,EAAE,IAAI,CAAC,+BAA+B,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,iBAAiB,CAAC,EAClF,OAAO,EAAE,cAAc,EACvB,eAAe,EAAE,eAAe,EAChC,QAAQ,EAAE,eAAe,EACzB,SAAS,EAAE,MAAM,CAAC,cAAc,CAAC,EACjC,iBAAiB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,uBAAuB,EACvD,aAAa,EAAC,MAAM,EACpB,UAAU,EAAC,UAAU,EACrB,QAAQ,EAAE,IAAI,EACd,UAAU,EAAE,IAAI,GAChB,CACgB,CACrB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo, useCallback } from 'react';\nimport clsx from 'clsx';\n\nimport InternalFormField from '../../../form-field/internal';\nimport { useInternalI18n } from '../../../i18n/context';\nimport { MultiselectProps } from '../../../multiselect/interfaces';\nimport InternalMultiselect from '../../../multiselect/internal';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport { NonCancelableEventHandler } from '../../events';\nimport SeriesMarker, { ChartSeriesMarkerType } from '../chart-series-marker';\n\nimport styles from './styles.css.js';\n\ninterface I18nStrings {\n  filterLabel?: string;\n  filterPlaceholder?: string;\n  filterSelectedAriaLabel?: string;\n}\n\ninterface ChartFilterItem<T> {\n  label: string;\n  color: string;\n  type: ChartSeriesMarkerType;\n  datum: T;\n}\n\nexport interface ChartFilterProps<T> extends BaseComponentProps {\n  series: ReadonlyArray<ChartFilterItem<T>>;\n  selectedSeries?: ReadonlyArray<T>;\n  onChange: (selectedSeries: ReadonlyArray<T>) => void;\n  i18nStrings?: I18nStrings;\n}\n\nexport default memo(ChartFilter) as typeof ChartFilter;\n\nfunction ChartFilter<T>({ series, i18nStrings, selectedSeries, onChange, ...restProps }: ChartFilterProps<T>) {\n  const baseProps = getBaseProps(restProps);\n  const className = clsx(baseProps.className, styles.root);\n  const i18n = useInternalI18n('[charts]');\n\n  const defaultOptions = series.map((d, i) => ({\n    label: d.label,\n    value: '' + i,\n    datum: d.datum,\n    __customIcon: (\n      <span className={styles['custom-icon-wrapper']}>\n        <SeriesMarker color={d.color} type={d.type} />\n      </span>\n    ),\n  }));\n\n  const selectedOptions = defaultOptions.filter(option => selectedSeries?.indexOf(option.datum) !== -1);\n\n  const updateSelection = useCallback<NonCancelableEventHandler<MultiselectProps.MultiselectChangeDetail>>(\n    ({ detail: { selectedOptions } }) => {\n      const selectedSeries = defaultOptions\n        .filter(option => selectedOptions.indexOf(option) !== -1)\n        .map(option => option.datum);\n      onChange(selectedSeries);\n    },\n    [onChange, defaultOptions]\n  );\n\n  return (\n    <InternalFormField\n      {...baseProps}\n      label={i18n('i18nStrings.filterLabel', i18nStrings?.filterLabel)}\n      className={className}\n    >\n      <InternalMultiselect\n        placeholder={i18n('i18nStrings.filterPlaceholder', i18nStrings?.filterPlaceholder)}\n        options={defaultOptions}\n        selectedOptions={selectedOptions}\n        onChange={updateSelection}\n        className={styles['chart-filter']}\n        selectedAriaLabel={i18nStrings?.filterSelectedAriaLabel}\n        filteringType=\"none\"\n        statusType=\"finished\"\n        keepOpen={true}\n        hideTokens={true}\n      />\n    </InternalFormField>\n  );\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/chart-filter/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,iBAAiB,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAExD,OAAO,mBAAmB,MAAM,+BAA+B,CAAC;AAChE,OAAO,EAAsB,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAGxE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAqBrC,eAAe,IAAI,CAAC,WAAW,CAAuB,CAAC;AAEvD,SAAS,WAAW,CAAI,EAAoF;QAApF,EAAE,MAAM,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,OAAqC,EAAhC,SAAS,cAA7D,uDAA+D,CAAF;IACnF,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;IACzD,MAAM,IAAI,GAAG,eAAe,CAAC,UAAU,CAAC,CAAC;IAEzC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC;QAC3C,KAAK,EAAE,CAAC,CAAC,KAAK;QACd,KAAK,EAAE,EAAE,GAAG,CAAC;QACb,KAAK,EAAE,CAAC,CAAC,KAAK;QACd,YAAY,EAAE,8BAAM,SAAS,EAAE,MAAM,CAAC,qBAAqB,CAAC,IAAG,CAAC,CAAC,MAAM,CAAQ;KAChF,CAAC,CAAC,CAAC;IAEJ,MAAM,eAAe,GAAG,cAAc,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,MAAK,CAAC,CAAC,CAAC,CAAC;IAEtG,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,EAAE,MAAM,EAAE,EAAE,eAAe,EAAE,EAAE,EAAE,EAAE;QAClC,MAAM,cAAc,GAAG,cAAc;aAClC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,eAAe,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;aACxD,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC/B,QAAQ,CAAC,cAAc,CAAC,CAAC;IAC3B,CAAC,EACD,CAAC,QAAQ,EAAE,cAAc,CAAC,CAC3B,CAAC;IAEF,OAAO,CACL,oBAAC,iBAAiB,oBACZ,SAAS,IACb,KAAK,EAAE,IAAI,CAAC,yBAAyB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,WAAW,CAAC,EAChE,SAAS,EAAE,SAAS;QAEpB,oBAAC,mBAAmB,IAClB,WAAW,EAAE,IAAI,CAAC,+BAA+B,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,iBAAiB,CAAC,EAClF,OAAO,EAAE,cAAc,EACvB,eAAe,EAAE,eAAe,EAChC,QAAQ,EAAE,eAAe,EACzB,SAAS,EAAE,MAAM,CAAC,cAAc,CAAC,EACjC,iBAAiB,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,uBAAuB,EACvD,aAAa,EAAC,MAAM,EACpB,UAAU,EAAC,UAAU,EACrB,QAAQ,EAAE,IAAI,EACd,UAAU,EAAE,IAAI,GAChB,CACgB,CACrB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { memo, useCallback } from 'react';\nimport clsx from 'clsx';\n\nimport InternalFormField from '../../../form-field/internal';\nimport { useInternalI18n } from '../../../i18n/context';\nimport { MultiselectProps } from '../../../multiselect/interfaces';\nimport InternalMultiselect from '../../../multiselect/internal';\nimport { BaseComponentProps, getBaseProps } from '../../base-component';\nimport { NonCancelableEventHandler } from '../../events';\n\nimport styles from './styles.css.js';\n\ninterface I18nStrings {\n  filterLabel?: string;\n  filterPlaceholder?: string;\n  filterSelectedAriaLabel?: string;\n}\n\ninterface ChartFilterItem<T> {\n  label: string;\n  marker: React.ReactNode;\n  datum: T;\n}\n\nexport interface ChartFilterProps<T> extends BaseComponentProps {\n  series: ReadonlyArray<ChartFilterItem<T>>;\n  selectedSeries?: ReadonlyArray<T>;\n  onChange: (selectedSeries: ReadonlyArray<T>) => void;\n  i18nStrings?: I18nStrings;\n}\n\nexport default memo(ChartFilter) as typeof ChartFilter;\n\nfunction ChartFilter<T>({ series, i18nStrings, selectedSeries, onChange, ...restProps }: ChartFilterProps<T>) {\n  const baseProps = getBaseProps(restProps);\n  const className = clsx(baseProps.className, styles.root);\n  const i18n = useInternalI18n('[charts]');\n\n  const defaultOptions = series.map((d, i) => ({\n    label: d.label,\n    value: '' + i,\n    datum: d.datum,\n    __customIcon: <span className={styles['custom-icon-wrapper']}>{d.marker}</span>,\n  }));\n\n  const selectedOptions = defaultOptions.filter(option => selectedSeries?.indexOf(option.datum) !== -1);\n\n  const updateSelection = useCallback<NonCancelableEventHandler<MultiselectProps.MultiselectChangeDetail>>(\n    ({ detail: { selectedOptions } }) => {\n      const selectedSeries = defaultOptions\n        .filter(option => selectedOptions.indexOf(option) !== -1)\n        .map(option => option.datum);\n      onChange(selectedSeries);\n    },\n    [onChange, defaultOptions]\n  );\n\n  return (\n    <InternalFormField\n      {...baseProps}\n      label={i18n('i18nStrings.filterLabel', i18nStrings?.filterLabel)}\n      className={className}\n    >\n      <InternalMultiselect\n        placeholder={i18n('i18nStrings.filterPlaceholder', i18nStrings?.filterPlaceholder)}\n        options={defaultOptions}\n        selectedOptions={selectedOptions}\n        onChange={updateSelection}\n        className={styles['chart-filter']}\n        selectedAriaLabel={i18nStrings?.filterSelectedAriaLabel}\n        filteringType=\"none\"\n        statusType=\"finished\"\n        keepOpen={true}\n        hideTokens={true}\n      />\n    </InternalFormField>\n  );\n}\n"]}

package/lib/internal/template/internal/components/chart-filter/styles.css.js

@@ -1,8 +1,8 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_1px7g_3m0pm_145",
-  "chart-filter": "awsui_chart-filter_1px7g_3m0pm_177",
-  "custom-icon-wrapper": "awsui_custom-icon-wrapper_1px7g_3m0pm_181"
+  "root": "awsui_root_1px7g_amipj_145",
+  "chart-filter": "awsui_chart-filter_1px7g_amipj_177",
+  "custom-icon-wrapper": "awsui_custom-icon-wrapper_1px7g_amipj_181"
 };
   

package/lib/internal/template/internal/components/chart-filter/styles.scoped.css

@@ -142,7 +142,7 @@
 */
 /* Style used for links in slots/components that are text heavy, to help links stand out among
 surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
-.awsui_root_1px7g_3m0pm_145:not(#\9) {
+.awsui_root_1px7g_amipj_145:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -166,20 +166,20 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   visibility: visible;
   white-space: normal;
   word-spacing: normal;
-  font-size: var(--font-size-body-m-6wxxs5, 14px);
-  line-height: var(--line-height-body-m-gw0130, 22px);
-  color: var(--color-text-body-default-agk00h, #16191f);
+  font-size: var(--font-size-body-m-vv54cm, 14px);
+  line-height: var(--line-height-body-m-bedeoh, 22px);
+  color: var(--color-text-body-default-1tki40, #16191f);
   font-weight: 400;
-  font-family: var(--font-family-base-pxn2ad, "Noto Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
+  font-family: var(--font-family-base-8x5ngf, "Noto Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
   -webkit-font-smoothing: auto;
   -moz-osx-font-smoothing: auto;
 }
 
-.awsui_chart-filter_1px7g_3m0pm_177:not(#\9) {
+.awsui_chart-filter_1px7g_amipj_177:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_custom-icon-wrapper_1px7g_3m0pm_181:not(#\9) {
+.awsui_custom-icon-wrapper_1px7g_amipj_181:not(#\9) {
   display: flex;
   align-items: flex-start;
   align-self: stretch;

package/lib/internal/template/internal/components/chart-filter/styles.selectors.js

@@ -2,8 +2,8 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_1px7g_3m0pm_145",
-  "chart-filter": "awsui_chart-filter_1px7g_3m0pm_177",
-  "custom-icon-wrapper": "awsui_custom-icon-wrapper_1px7g_3m0pm_181"
+  "root": "awsui_root_1px7g_amipj_145",
+  "chart-filter": "awsui_chart-filter_1px7g_amipj_177",
+  "custom-icon-wrapper": "awsui_custom-icon-wrapper_1px7g_amipj_181"
 };
   

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

@@ -1,9 +1,7 @@
 import React from 'react';
-import { ChartSeriesMarkerType } from '../chart-series-marker';
 interface ChartLegendItem<T> {
     label: string;
-    color: string;
-    type: ChartSeriesMarkerType;
+    marker: React.ReactNode;
     datum: T;
 }
 export interface ChartLegendProps<T> {

package/lib/internal/template/internal/components/chart-legend/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/chart-legend/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAuB,MAAM,OAAO,CAAC;AAO5C,OAAqB,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAI7E,UAAU,eAAe,CAAC,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,qBAAqB,CAAC;IAC5B,KAAK,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC;IACjC,MAAM,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1C,iBAAiB,EAAE,CAAC,GAAG,IAAI,CAAC;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IACnD,iBAAiB,EAAE,CAAC,MAAM,EAAE,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC;CAC/C;;AAED,wBAAuD;AAEvD,iBAAS,WAAW,CAAC,CAAC,EAAE,EACtB,MAAM,EACN,iBAAiB,EACjB,iBAAiB,EACjB,WAAW,EACX,SAAS,EACT,gBAAgB,GACjB,EAAE,gBAAgB,CAAC,CAAC,CAAC,eAkHrB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/chart-legend/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAuB,MAAM,OAAO,CAAC;AAU5C,UAAU,eAAe,CAAC,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,KAAK,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC;IACjC,MAAM,EAAE,aAAa,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1C,iBAAiB,EAAE,CAAC,GAAG,IAAI,CAAC;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IACnD,iBAAiB,EAAE,CAAC,MAAM,EAAE,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC;CAC/C;;AAED,wBAAuD;AAEvD,iBAAS,WAAW,CAAC,CAAC,EAAE,EACtB,MAAM,EACN,iBAAiB,EACjB,iBAAiB,EACjB,WAAW,EACX,SAAS,EACT,gBAAgB,GACjB,EAAE,gBAAgB,CAAC,CAAC,CAAC,eAkHrB"}

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

@@ -6,7 +6,6 @@ import InternalBox from '../../../box/internal';
 import { useInternalI18n } from '../../../i18n/context';
 import { KeyCode } from '../../keycode';
 import handleKey from '../../utils/handle-key';
-import SeriesMarker from '../chart-series-marker';
 import styles from './styles.css.js';
 export default memo(ChartLegend);
 function ChartLegend({ series, onHighlightChange, highlightedSeries, legendTitle, ariaLabel, plotContainerRef, }) {
@@ -79,7 +78,7 @@ function ChartLegend({ series, onHighlightChange, highlightedSeries, legendTitle
                             delete segmentsRef.current[index];
                         }
                     }, tabIndex: index === highlightedSeriesIndex || (highlightedSeriesIndex === undefined && index === 0) ? 0 : -1, onFocus: () => handleSelection(index), onClick: () => handleSelection(index), onMouseOver: () => handleMouseOver(s.datum), onMouseLeave: handleMouseLeave },
-                    React.createElement(SeriesMarker, { color: s.color, type: s.type }),
+                    s.marker,
                     " ",
                     s.label));
             })))));

package/lib/internal/template/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\nimport React, { memo, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport InternalBox from '../../../box/internal';\nimport { useInternalI18n } from '../../../i18n/context';\nimport { KeyCode } from '../../keycode';\nimport handleKey from '../../utils/handle-key';\nimport SeriesMarker, { ChartSeriesMarkerType } from '../chart-series-marker';\n\nimport styles from './styles.css.js';\n\ninterface ChartLegendItem<T> {\n  label: string;\n  color: string;\n  type: ChartSeriesMarkerType;\n  datum: T;\n}\n\nexport interface ChartLegendProps<T> {\n  series: ReadonlyArray<ChartLegendItem<T>>;\n  highlightedSeries: T | null;\n  legendTitle?: string;\n  ariaLabel?: string;\n  plotContainerRef?: React.RefObject<HTMLDivElement>;\n  onHighlightChange: (series: T | null) => void;\n}\n\nexport default memo(ChartLegend) as typeof ChartLegend;\n\nfunction ChartLegend<T>({\n  series,\n  onHighlightChange,\n  highlightedSeries,\n  legendTitle,\n  ariaLabel,\n  plotContainerRef,\n}: ChartLegendProps<T>) {\n  const i18n = useInternalI18n('[charts]');\n  const containerRef = useRef<HTMLDivElement>(null);\n  const segmentsRef = useRef<Record<number, HTMLElement>>([]);\n\n  const highlightedSeriesIndex = findSeriesIndex(series, highlightedSeries);\n\n  const highlightInlineStart = () => {\n    const currentIndex = highlightedSeriesIndex ?? 0;\n    const nextIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : series.length - 1;\n    segmentsRef.current[nextIndex]?.focus();\n  };\n\n  const highlightInlineEnd = () => {\n    const currentIndex = highlightedSeriesIndex ?? 0;\n    const nextIndex = currentIndex + 1 < series.length ? currentIndex + 1 : 0;\n    segmentsRef.current[nextIndex]?.focus();\n  };\n\n  const handleKeyPress = (event: React.KeyboardEvent<HTMLElement>) => {\n    if (event.keyCode === KeyCode.right || event.keyCode === KeyCode.left) {\n      // Preventing default fixes an issue in Safari+VO when VO additionally interprets arrow keys as its commands.\n      event.preventDefault();\n\n      handleKey(event, {\n        onInlineStart: () => highlightInlineStart(),\n        onInlineEnd: () => highlightInlineEnd(),\n      });\n    }\n  };\n\n  const handleSelection = (index: number) => {\n    if (series[index].datum !== highlightedSeries) {\n      onHighlightChange(series[index].datum);\n    }\n  };\n\n  const handleBlur = (event: React.FocusEvent<Element>) => {\n    // We need to check if the next element to be focused inside the plot container or not\n    // so we don't clear the selected legend in case we are still focusing elements ( legend elements )\n    // inside the plot container\n    if (\n      event.relatedTarget === null ||\n      (containerRef.current &&\n        !containerRef.current.contains(event.relatedTarget) &&\n        !plotContainerRef?.current?.contains(event.relatedTarget))\n    ) {\n      onHighlightChange(null);\n    }\n  };\n\n  const handleMouseOver = (s: T) => {\n    if (s !== highlightedSeries) {\n      onHighlightChange(s);\n    }\n  };\n\n  const handleMouseLeave = () => {\n    onHighlightChange(null);\n  };\n\n  return (\n    <>\n      <div\n        ref={containerRef}\n        role=\"toolbar\"\n        aria-label={legendTitle || i18n('i18nStrings.legendAriaLabel', ariaLabel)}\n        className={styles.root}\n        onKeyDown={handleKeyPress}\n        onBlur={handleBlur}\n      >\n        {legendTitle && (\n          <InternalBox fontWeight=\"bold\" className={styles.title}>\n            {legendTitle}\n          </InternalBox>\n        )}\n\n        <div className={styles.list}>\n          {series.map((s, index) => {\n            const someHighlighted = highlightedSeries !== null;\n            const isHighlighted = highlightedSeries === s.datum;\n            const isDimmed = someHighlighted && !isHighlighted;\n            return (\n              <div\n                role=\"button\"\n                key={index}\n                aria-pressed={isHighlighted}\n                className={clsx(styles.marker, {\n                  [styles['marker--dimmed']]: isDimmed,\n                  [styles['marker--highlighted']]: isHighlighted,\n                })}\n                ref={elem => {\n                  if (elem) {\n                    segmentsRef.current[index] = elem;\n                  } else {\n                    delete segmentsRef.current[index];\n                  }\n                }}\n                tabIndex={\n                  index === highlightedSeriesIndex || (highlightedSeriesIndex === undefined && index === 0) ? 0 : -1\n                }\n                onFocus={() => handleSelection(index)}\n                onClick={() => handleSelection(index)}\n                onMouseOver={() => handleMouseOver(s.datum)}\n                onMouseLeave={handleMouseLeave}\n              >\n                <SeriesMarker color={s.color} type={s.type} /> {s.label}\n              </div>\n            );\n          })}\n        </div>\n      </div>\n    </>\n  );\n}\n\nfunction findSeriesIndex<T>(series: ReadonlyArray<ChartLegendItem<T>>, targetSeries: null | T): undefined | number {\n  for (let index = 0; index < series.length; index++) {\n    if (series[index].datum === targetSeries) {\n      return index;\n    }\n  }\n  return undefined;\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\nimport React, { memo, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport InternalBox from '../../../box/internal';\nimport { useInternalI18n } from '../../../i18n/context';\nimport { KeyCode } from '../../keycode';\nimport handleKey from '../../utils/handle-key';\n\nimport styles from './styles.css.js';\n\ninterface ChartLegendItem<T> {\n  label: string;\n  marker: React.ReactNode;\n  datum: T;\n}\n\nexport interface ChartLegendProps<T> {\n  series: ReadonlyArray<ChartLegendItem<T>>;\n  highlightedSeries: T | null;\n  legendTitle?: string;\n  ariaLabel?: string;\n  plotContainerRef?: React.RefObject<HTMLDivElement>;\n  onHighlightChange: (series: T | null) => void;\n}\n\nexport default memo(ChartLegend) as typeof ChartLegend;\n\nfunction ChartLegend<T>({\n  series,\n  onHighlightChange,\n  highlightedSeries,\n  legendTitle,\n  ariaLabel,\n  plotContainerRef,\n}: ChartLegendProps<T>) {\n  const i18n = useInternalI18n('[charts]');\n  const containerRef = useRef<HTMLDivElement>(null);\n  const segmentsRef = useRef<Record<number, HTMLElement>>([]);\n\n  const highlightedSeriesIndex = findSeriesIndex(series, highlightedSeries);\n\n  const highlightInlineStart = () => {\n    const currentIndex = highlightedSeriesIndex ?? 0;\n    const nextIndex = currentIndex - 1 >= 0 ? currentIndex - 1 : series.length - 1;\n    segmentsRef.current[nextIndex]?.focus();\n  };\n\n  const highlightInlineEnd = () => {\n    const currentIndex = highlightedSeriesIndex ?? 0;\n    const nextIndex = currentIndex + 1 < series.length ? currentIndex + 1 : 0;\n    segmentsRef.current[nextIndex]?.focus();\n  };\n\n  const handleKeyPress = (event: React.KeyboardEvent<HTMLElement>) => {\n    if (event.keyCode === KeyCode.right || event.keyCode === KeyCode.left) {\n      // Preventing default fixes an issue in Safari+VO when VO additionally interprets arrow keys as its commands.\n      event.preventDefault();\n\n      handleKey(event, {\n        onInlineStart: () => highlightInlineStart(),\n        onInlineEnd: () => highlightInlineEnd(),\n      });\n    }\n  };\n\n  const handleSelection = (index: number) => {\n    if (series[index].datum !== highlightedSeries) {\n      onHighlightChange(series[index].datum);\n    }\n  };\n\n  const handleBlur = (event: React.FocusEvent<Element>) => {\n    // We need to check if the next element to be focused inside the plot container or not\n    // so we don't clear the selected legend in case we are still focusing elements ( legend elements )\n    // inside the plot container\n    if (\n      event.relatedTarget === null ||\n      (containerRef.current &&\n        !containerRef.current.contains(event.relatedTarget) &&\n        !plotContainerRef?.current?.contains(event.relatedTarget))\n    ) {\n      onHighlightChange(null);\n    }\n  };\n\n  const handleMouseOver = (s: T) => {\n    if (s !== highlightedSeries) {\n      onHighlightChange(s);\n    }\n  };\n\n  const handleMouseLeave = () => {\n    onHighlightChange(null);\n  };\n\n  return (\n    <>\n      <div\n        ref={containerRef}\n        role=\"toolbar\"\n        aria-label={legendTitle || i18n('i18nStrings.legendAriaLabel', ariaLabel)}\n        className={styles.root}\n        onKeyDown={handleKeyPress}\n        onBlur={handleBlur}\n      >\n        {legendTitle && (\n          <InternalBox fontWeight=\"bold\" className={styles.title}>\n            {legendTitle}\n          </InternalBox>\n        )}\n\n        <div className={styles.list}>\n          {series.map((s, index) => {\n            const someHighlighted = highlightedSeries !== null;\n            const isHighlighted = highlightedSeries === s.datum;\n            const isDimmed = someHighlighted && !isHighlighted;\n            return (\n              <div\n                role=\"button\"\n                key={index}\n                aria-pressed={isHighlighted}\n                className={clsx(styles.marker, {\n                  [styles['marker--dimmed']]: isDimmed,\n                  [styles['marker--highlighted']]: isHighlighted,\n                })}\n                ref={elem => {\n                  if (elem) {\n                    segmentsRef.current[index] = elem;\n                  } else {\n                    delete segmentsRef.current[index];\n                  }\n                }}\n                tabIndex={\n                  index === highlightedSeriesIndex || (highlightedSeriesIndex === undefined && index === 0) ? 0 : -1\n                }\n                onFocus={() => handleSelection(index)}\n                onClick={() => handleSelection(index)}\n                onMouseOver={() => handleMouseOver(s.datum)}\n                onMouseLeave={handleMouseLeave}\n              >\n                {s.marker} {s.label}\n              </div>\n            );\n          })}\n        </div>\n      </div>\n    </>\n  );\n}\n\nfunction findSeriesIndex<T>(series: ReadonlyArray<ChartLegendItem<T>>, targetSeries: null | T): undefined | number {\n  for (let index = 0; index < series.length; index++) {\n    if (series[index].datum === targetSeries) {\n      return index;\n    }\n  }\n  return undefined;\n}\n"]}

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

@@ -1,11 +1,11 @@
 
     import './styles.scoped.css';
     export default {
-  "marker": "awsui_marker_1kjc7_rmeoy_153",
-  "root": "awsui_root_1kjc7_rmeoy_167",
-  "title": "awsui_title_1kjc7_rmeoy_202",
-  "list": "awsui_list_1kjc7_rmeoy_206",
-  "marker--dimmed": "awsui_marker--dimmed_1kjc7_rmeoy_252",
-  "marker--highlighted": "awsui_marker--highlighted_1kjc7_rmeoy_255"
+  "marker": "awsui_marker_1kjc7_1ikbf_153",
+  "root": "awsui_root_1kjc7_1ikbf_167",
+  "title": "awsui_title_1kjc7_1ikbf_202",
+  "list": "awsui_list_1kjc7_1ikbf_206",
+  "marker--dimmed": "awsui_marker--dimmed_1kjc7_1ikbf_252",
+  "marker--highlighted": "awsui_marker--highlighted_1kjc7_1ikbf_255"
 };
   

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

@@ -150,21 +150,21 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_marker_1kjc7_rmeoy_153:not(#\9) {
-  transition: opacity var(--motion-duration-transition-quick-1ym1ir, 90ms) var(--motion-easing-transition-quick-c2tqbv, linear);
+.awsui_marker_1kjc7_1ikbf_153:not(#\9) {
+  transition: opacity var(--motion-duration-transition-quick-ucajl5, 90ms) var(--motion-easing-transition-quick-034duw, linear);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_marker_1kjc7_rmeoy_153:not(#\9) {
+  .awsui_marker_1kjc7_1ikbf_153:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_marker_1kjc7_rmeoy_153:not(#\9), .awsui-mode-entering .awsui_marker_1kjc7_rmeoy_153:not(#\9) {
+.awsui-motion-disabled .awsui_marker_1kjc7_1ikbf_153:not(#\9), .awsui-mode-entering .awsui_marker_1kjc7_1ikbf_153:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_root_1kjc7_rmeoy_167:not(#\9) {
+.awsui_root_1kjc7_1ikbf_167:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -188,23 +188,23 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   visibility: visible;
   white-space: normal;
   word-spacing: normal;
-  font-size: var(--font-size-body-m-6wxxs5, 14px);
-  line-height: var(--line-height-body-m-gw0130, 22px);
-  color: var(--color-text-body-default-agk00h, #16191f);
+  font-size: var(--font-size-body-m-vv54cm, 14px);
+  line-height: var(--line-height-body-m-bedeoh, 22px);
+  color: var(--color-text-body-default-1tki40, #16191f);
   font-weight: 400;
-  font-family: var(--font-family-base-pxn2ad, "Noto Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
+  font-family: var(--font-family-base-8x5ngf, "Noto Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
   -webkit-font-smoothing: auto;
   -moz-osx-font-smoothing: auto;
 }
-.awsui_root_1kjc7_rmeoy_167:not(#\9):focus {
+.awsui_root_1kjc7_1ikbf_167:not(#\9):focus {
   outline: none;
 }
 
-.awsui_title_1kjc7_rmeoy_202:not(#\9) {
+.awsui_title_1kjc7_1ikbf_202:not(#\9) {
   /* used in test utils */
 }
 
-.awsui_list_1kjc7_rmeoy_206:not(#\9) {
+.awsui_list_1kjc7_1ikbf_206:not(#\9) {
   display: flex;
   flex-wrap: wrap;
   list-style: none;
@@ -212,10 +212,10 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-inline: 0;
   padding-block: 0;
   padding-inline: 0;
-  gap: var(--space-scaled-xxs-krq5fq, 4px) var(--space-m-u91ipm, 16px);
+  gap: var(--space-scaled-xxs-jatbiv, 4px) var(--space-m-n2lypl, 16px);
 }
 
-.awsui_marker_1kjc7_rmeoy_153:not(#\9) {
+.awsui_marker_1kjc7_1ikbf_153:not(#\9) {
   display: inline-flex;
   align-items: flex-start;
   padding-block: 0;
@@ -226,17 +226,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   cursor: pointer;
   opacity: 1;
 }
-.awsui_marker_1kjc7_rmeoy_153:not(#\9):focus {
+.awsui_marker_1kjc7_1ikbf_153:not(#\9):focus {
   outline: none;
 }
-body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_rmeoy_153:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_1ikbf_153:not(#\9):focus {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_rmeoy_153:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_1ikbf_153:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(2px - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_rmeoy_153:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_1ikbf_153:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -244,15 +244,15 @@ body[data-awsui-focus-visible=true] .awsui_marker_1kjc7_rmeoy_153:not(#\9):focus
   inset-block-start: calc(-1 * 2px);
   inline-size: calc(100% + 2px + 2px);
   block-size: calc(100% + 2px + 2px);
-  border-start-start-radius: var(--border-radius-control-default-focus-ring-vy2hlh, 2px);
-  border-start-end-radius: var(--border-radius-control-default-focus-ring-vy2hlh, 2px);
-  border-end-start-radius: var(--border-radius-control-default-focus-ring-vy2hlh, 2px);
-  border-end-end-radius: var(--border-radius-control-default-focus-ring-vy2hlh, 2px);
-  box-shadow: 0 0 0 2px var(--color-border-item-focused-q68bgg, #0073bb);
+  border-start-start-radius: var(--border-radius-control-default-focus-ring-9xsko1, 2px);
+  border-start-end-radius: var(--border-radius-control-default-focus-ring-9xsko1, 2px);
+  border-end-start-radius: var(--border-radius-control-default-focus-ring-9xsko1, 2px);
+  border-end-end-radius: var(--border-radius-control-default-focus-ring-9xsko1, 2px);
+  box-shadow: 0 0 0 2px var(--color-border-item-focused-vx5mpq, #0073bb);
 }
-.awsui_marker_1kjc7_rmeoy_153.awsui_marker--dimmed_1kjc7_rmeoy_252:not(#\9) {
+.awsui_marker_1kjc7_1ikbf_153.awsui_marker--dimmed_1kjc7_1ikbf_252:not(#\9) {
   opacity: 0.35;
 }
-.awsui_marker_1kjc7_rmeoy_153.awsui_marker--highlighted_1kjc7_rmeoy_255:not(#\9) {
+.awsui_marker_1kjc7_1ikbf_153.awsui_marker--highlighted_1kjc7_1ikbf_255:not(#\9) {
   /* used in test utils */
 }