@cloudscape-design/components-themeable 3.0.852 → 3.0.854

package/lib/internal/template/pie-chart/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/pie-chart/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { ReactNode } from 'react';\n\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { PopoverProps } from '../popover/interfaces';\n\nexport interface SeriesInfo {\n  label: string;\n  color: string;\n  index: number;\n  markerType: 'line' | 'rectangle';\n}\n\nexport interface ChartDetailPair {\n  key: ReactNode;\n  value: ReactNode;\n}\n\nexport interface PieChartProps<T extends PieChartProps.Datum = PieChartProps.Datum> extends BaseComponentProps {\n  /**\n   * An array that represents the source of data for the displayed segments.\n   * Each element can have the following properties:\n   *\n   * * `title` (string) - A human-readable title for this data point.\n   * * `value` (number) - Numeric value that determines the segment size.\n   *                        A segment with a value of zero (0) or lower (negative number) won't have a segment.\n   * * `color`: (string) - (Optional) Color value for this segment that takes priority over the automatically assigned color.\n   *                        Can be any valid CSS color identifier.\n   *\n   * As long as your data object implements the properties above, you can also define additional properties\n   * that are relevant to your data visualization.\n   * The full data object will be passed down to events and properties like `detailPopoverContent`.\n   */\n  data: ReadonlyArray<T>;\n\n  /**\n   * Specifies the size of the pie or donut chart.\n   * When used with `fitHeight`, this property defines the minimum size of the chart area.\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * Visual variant of the pie chart. Currently supports the default `pie` variant and the `donut` variant.\n   * The donut variant provides a slot in the center of the chart that can contain additional information.\n   * For more information, see `innerContent`.\n   */\n  variant?: 'pie' | 'donut';\n\n  /**\n   * A function that determines the details that are displayed in the popover when hovering over a segment.\n   * The function is called with the data of the target segment and is expected to return an array of detail pairs.\n   * By default, each segment displays two detail pairs: count and percentage.\n   *\n   * Each pair has the following properties:\n   * * `key` (ReactNode) - Name of the detail or metric.\n   * * `value` (ReactNode) - The value of this detail for the target segment.\n   */\n  detailPopoverContent?: PieChartProps.DetailPopoverContentFunction<T>;\n\n  /**\n   * Additional content that is displayed at the bottom of the detail popover.\n   */\n  detailPopoverFooter?: PieChartProps.DetailPopoverFooter<T>;\n\n  /**\n   * A function that determines the description of a segment that is displayed on the chart, unless `hideDescriptions` is set to `true`.\n   * This is an optional description that explains the segment and is displayed underneath the label.\n   * The function is called with the data object of each segment and is expected to return the description as a string.\n   */\n  segmentDescription?: PieChartProps.SegmentDescriptionFunction<T>;\n\n  /**\n   * Determines the maximum width of the popover.\n   */\n  detailPopoverSize?: PopoverProps.Size;\n\n  /**\n   * Hides legend beneath the chart when set to `true`.\n   * We highly recommend that you leave this unspecified or set to `false`.\n   */\n  hideLegend?: boolean;\n\n  /**\n   * Hides label titles next to the chart segments when set to `true`.\n   * We highly recommend that you leave this unspecified or set to `false`.\n   */\n  hideTitles?: boolean;\n\n  /**\n   * Hides the label descriptions next to the chart segments when set to `true`.\n   */\n  hideDescriptions?: boolean;\n\n  /**\n   * Hides the default filtering dropdown when set to `true`.\n   * You can still display additional filters with the `additionalFilters` slot.\n   */\n  hideFilter?: boolean;\n\n  /**\n   * Additional metric number that's displayed in the center of the chart if `variant` is set to `donut`.\n   */\n  innerMetricValue?: string;\n\n  /**\n   * Additional description that's displayed in the center of the chart below `innerMetricValue` if `variant` is set to `donut`.\n   * This is usually the unit of the `innerMetricValue`.\n   */\n  innerMetricDescription?: string;\n\n  /**\n   * Title for the legend.\n   */\n  legendTitle?: string;\n\n  /**\n   * Additional filters that you can add above the chart component.\n   * Make sure you update the `data` property when any of your custom filters change the data that's displayed.\n   */\n  additionalFilters?: React.ReactNode;\n\n  /**\n   * Specifies the currently highlighted data segment. Highlighting is typically the result of\n   * a user hovering over or selecting a segment in the chart or the legend.\n   * A value of `null` means no segment is being highlighted.\n   *\n   * - If you don't set this property, segments are highlighted automatically when a user hovers over or selects one of the triggers (that is, uncontrolled behavior).\n   * - If you explicitly set this property, you must set an `onHighlightChange` listener to update this property when a segment should be highlighted (that is, controlled behavior).\n   */\n  highlightedSegment?: T | null;\n\n  /**\n   * An array of data segment objects that determines which data segments are currently visible (that is, not filtered out).\n   *\n   * - If you don't set this property, segments are filtered automatically when using the default filtering of the component (that is, uncontrolled behavior).\n   * - If you explicitly set this property, you must set an `onFilterChange` listener to update this property when the list of filtered segments changes (that is, controlled behavior).\n   */\n  visibleSegments?: ReadonlyArray<T>;\n\n  /**\n   * Specifies the current status of loading data.\n   * * `loading` - Indicates that data fetching is in progress.\n   * * `finished` - Indicates that data has loaded successfully.\n   * * `error` - Indicates that an error occurred during fetch. You should provide an option to enable the user to recover.\n   **/\n  statusType?: 'loading' | 'finished' | 'error';\n\n  /**\n   * Content that's displayed when the data passed to the component is empty.\n   */\n  empty?: React.ReactNode;\n\n  /**\n   * Content that's displayed when there is no data to display because it doesn't match the specified filter.\n   */\n  noMatch?: React.ReactNode;\n\n  /**\n   * Text that's displayed when the chart is loading (that is, when `statusType` is set to `loading`).\n   * @i18n\n   */\n  loadingText?: string;\n\n  /**\n   * Text that's displayed when the chart is in error state (that is, when `statusType` is set to `error`).\n   * @i18n\n   */\n  errorText?: string;\n\n  /**\n   * Text for the recovery button that's displayed next to the error text.\n   * @i18n\n   **/\n  recoveryText?: string;\n\n  /**\n   * Called when the user clicks the recovery button that appears when there is an error state.\n   * Use this to enable the user to retry a failed request or provide another option for the user\n   * to recover from the error.\n   */\n  onRecoveryClick?: NonCancelableEventHandler;\n\n  /**\n   * Called when the highlighted segmented changes because of a user interaction.\n   */\n  onHighlightChange?: NonCancelableEventHandler<PieChartProps.HighlightChangeDetail<T>>;\n\n  /**\n   * Called when the values of the internal filter component changes.\n   * This isn't called for any custom filter components you've defined in `additionalFilters`.\n   */\n  onFilterChange?: NonCancelableEventHandler<PieChartProps.FilterChangeDetail<T>>;\n\n  /**\n   * ARIA label that's assigned to the chart. It should match the visible label on the page\n   * (for example, in the container header). Use either `ariaLabel` or `ariaLabelledby` (you can't use both).\n   */\n  ariaLabel?: string;\n\n  /**\n   * Sets `aria-labelledby` on the chart. If there is a visible label for the chart on the page\n   * (for example, in the container header), set this property to the ID of that header element.\n   * Use either `ariaLabel` or `ariaLabelledby` (you can't use both).\n   */\n  ariaLabelledby?: string;\n\n  /**\n   * A description of the chart that assistive technologies can use (through `aria-describedby` and `<title>`).\n   * Provide a concise summary of the data visualized in the chart.\n   */\n  ariaDescription?: string;\n\n  /**\n   * An object that contains all of the localized strings required by the component.\n   * @i18n\n   */\n  i18nStrings?: PieChartProps.I18nStrings;\n\n  /**\n   * Enable this property to make the chart fit into the available height of the parent container.\n   */\n  fitHeight?: boolean;\n}\n\nexport namespace PieChartProps {\n  export interface Datum {\n    title: string;\n    value: number;\n    color?: string;\n  }\n\n  export type PieChartData = ReadonlyArray<Datum>;\n\n  export interface DetailPopoverContentFunction<T = Datum> {\n    (segment: T, visibleDataSum: number): ReadonlyArray<ChartDetailPair>;\n  }\n\n  export interface DetailPopoverFooter<T> {\n    (segment: T): React.ReactNode;\n  }\n\n  export interface SegmentDescriptionFunction<T = Datum> {\n    (segment: T, visibleDataSum: number): string;\n  }\n\n  export interface HighlightChangeDetail<T> {\n    highlightedSegment: T | null;\n  }\n\n  export interface FilterChangeDetail<T> {\n    visibleSegments: ReadonlyArray<T>;\n  }\n\n  export interface I18nStrings {\n    /** Name of the \"Value\" key that is displayed in the details popover by default */\n    detailsValue?: string;\n\n    /** Name of the \"Percentage\" key that is displayed in the details popover by default */\n    detailsPercentage?: string;\n\n    /** Visible label of the default filter */\n    filterLabel?: string;\n\n    /** Placeholder text of the default filter */\n    filterPlaceholder?: string;\n\n    /** ARIA label for the default filter which is appended to any option that is selected */\n    filterSelectedAriaLabel?: string;\n\n    /** ARIA label that is associated with the legend in case there is no visible `legendTitle` defined */\n    legendAriaLabel?: string;\n\n    /** ARIA label for details popover dismiss button */\n    detailPopoverDismissAriaLabel?: string;\n\n    /** Name of the ARIA role description of the chart, e.g. \"pie chart\" */\n    chartAriaRoleDescription?: string;\n\n    /** Name of the ARIA role description of each segment, e.g. \"segment\" */\n    segmentAriaRoleDescription?: string;\n  }\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/pie-chart/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { ReactNode } from 'react';\n\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { PopoverProps } from '../popover/interfaces';\n\nexport interface SeriesInfo {\n  label: string;\n  color: string;\n  index: number;\n  markerType: 'line' | 'rectangle';\n}\n\ninterface ChartDetailPair {\n  key: ReactNode;\n  value: ReactNode;\n}\n\nexport interface PieChartProps<T extends PieChartProps.Datum = PieChartProps.Datum> extends BaseComponentProps {\n  /**\n   * An array that represents the source of data for the displayed segments.\n   * Each element can have the following properties:\n   *\n   * * `title` (string) - A human-readable title for this data point.\n   * * `value` (number) - Numeric value that determines the segment size.\n   *                        A segment with a value of zero (0) or lower (negative number) won't have a segment.\n   * * `color`: (string) - (Optional) Color value for this segment that takes priority over the automatically assigned color.\n   *                        Can be any valid CSS color identifier.\n   *\n   * As long as your data object implements the properties above, you can also define additional properties\n   * that are relevant to your data visualization.\n   * The full data object will be passed down to events and properties like `detailPopoverContent`.\n   */\n  data: ReadonlyArray<T>;\n\n  /**\n   * Specifies the size of the pie or donut chart.\n   * When used with `fitHeight`, this property defines the minimum size of the chart area.\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * Visual variant of the pie chart. Currently supports the default `pie` variant and the `donut` variant.\n   * The donut variant provides a slot in the center of the chart that can contain additional information.\n   * For more information, see `innerContent`.\n   */\n  variant?: 'pie' | 'donut';\n\n  /**\n   * A function that determines the details that are displayed in the popover when hovering over a segment.\n   * The function is called with the data of the target segment and is expected to return an array of detail pairs.\n   * By default, each segment displays two detail pairs: count and percentage.\n   *\n   * Each pair has the following properties:\n   * * `key` (ReactNode) - Name of the detail or metric.\n   * * `value` (ReactNode) - The value of this detail for the target segment.\n   */\n  detailPopoverContent?: PieChartProps.DetailPopoverContentFunction<T>;\n\n  /**\n   * Additional content that is displayed at the bottom of the detail popover.\n   */\n  detailPopoverFooter?: PieChartProps.DetailPopoverFooter<T>;\n\n  /**\n   * A function that determines the description of a segment that is displayed on the chart, unless `hideDescriptions` is set to `true`.\n   * This is an optional description that explains the segment and is displayed underneath the label.\n   * The function is called with the data object of each segment and is expected to return the description as a string.\n   */\n  segmentDescription?: PieChartProps.SegmentDescriptionFunction<T>;\n\n  /**\n   * Determines the maximum width of the popover.\n   */\n  detailPopoverSize?: PopoverProps.Size;\n\n  /**\n   * Hides legend beneath the chart when set to `true`.\n   * We highly recommend that you leave this unspecified or set to `false`.\n   */\n  hideLegend?: boolean;\n\n  /**\n   * Hides label titles next to the chart segments when set to `true`.\n   * We highly recommend that you leave this unspecified or set to `false`.\n   */\n  hideTitles?: boolean;\n\n  /**\n   * Hides the label descriptions next to the chart segments when set to `true`.\n   */\n  hideDescriptions?: boolean;\n\n  /**\n   * Hides the default filtering dropdown when set to `true`.\n   * You can still display additional filters with the `additionalFilters` slot.\n   */\n  hideFilter?: boolean;\n\n  /**\n   * Additional metric number that's displayed in the center of the chart if `variant` is set to `donut`.\n   */\n  innerMetricValue?: string;\n\n  /**\n   * Additional description that's displayed in the center of the chart below `innerMetricValue` if `variant` is set to `donut`.\n   * This is usually the unit of the `innerMetricValue`.\n   */\n  innerMetricDescription?: string;\n\n  /**\n   * Title for the legend.\n   */\n  legendTitle?: string;\n\n  /**\n   * Additional filters that you can add above the chart component.\n   * Make sure you update the `data` property when any of your custom filters change the data that's displayed.\n   */\n  additionalFilters?: React.ReactNode;\n\n  /**\n   * Specifies the currently highlighted data segment. Highlighting is typically the result of\n   * a user hovering over or selecting a segment in the chart or the legend.\n   * A value of `null` means no segment is being highlighted.\n   *\n   * - If you don't set this property, segments are highlighted automatically when a user hovers over or selects one of the triggers (that is, uncontrolled behavior).\n   * - If you explicitly set this property, you must set an `onHighlightChange` listener to update this property when a segment should be highlighted (that is, controlled behavior).\n   */\n  highlightedSegment?: T | null;\n\n  /**\n   * An array of data segment objects that determines which data segments are currently visible (that is, not filtered out).\n   *\n   * - If you don't set this property, segments are filtered automatically when using the default filtering of the component (that is, uncontrolled behavior).\n   * - If you explicitly set this property, you must set an `onFilterChange` listener to update this property when the list of filtered segments changes (that is, controlled behavior).\n   */\n  visibleSegments?: ReadonlyArray<T>;\n\n  /**\n   * Specifies the current status of loading data.\n   * * `loading` - Indicates that data fetching is in progress.\n   * * `finished` - Indicates that data has loaded successfully.\n   * * `error` - Indicates that an error occurred during fetch. You should provide an option to enable the user to recover.\n   **/\n  statusType?: 'loading' | 'finished' | 'error';\n\n  /**\n   * Content that's displayed when the data passed to the component is empty.\n   */\n  empty?: React.ReactNode;\n\n  /**\n   * Content that's displayed when there is no data to display because it doesn't match the specified filter.\n   */\n  noMatch?: React.ReactNode;\n\n  /**\n   * Text that's displayed when the chart is loading (that is, when `statusType` is set to `loading`).\n   * @i18n\n   */\n  loadingText?: string;\n\n  /**\n   * Text that's displayed when the chart is in error state (that is, when `statusType` is set to `error`).\n   * @i18n\n   */\n  errorText?: string;\n\n  /**\n   * Text for the recovery button that's displayed next to the error text.\n   * @i18n\n   **/\n  recoveryText?: string;\n\n  /**\n   * Called when the user clicks the recovery button that appears when there is an error state.\n   * Use this to enable the user to retry a failed request or provide another option for the user\n   * to recover from the error.\n   */\n  onRecoveryClick?: NonCancelableEventHandler;\n\n  /**\n   * Called when the highlighted segmented changes because of a user interaction.\n   */\n  onHighlightChange?: NonCancelableEventHandler<PieChartProps.HighlightChangeDetail<T>>;\n\n  /**\n   * Called when the values of the internal filter component changes.\n   * This isn't called for any custom filter components you've defined in `additionalFilters`.\n   */\n  onFilterChange?: NonCancelableEventHandler<PieChartProps.FilterChangeDetail<T>>;\n\n  /**\n   * ARIA label that's assigned to the chart. It should match the visible label on the page\n   * (for example, in the container header). Use either `ariaLabel` or `ariaLabelledby` (you can't use both).\n   */\n  ariaLabel?: string;\n\n  /**\n   * Sets `aria-labelledby` on the chart. If there is a visible label for the chart on the page\n   * (for example, in the container header), set this property to the ID of that header element.\n   * Use either `ariaLabel` or `ariaLabelledby` (you can't use both).\n   */\n  ariaLabelledby?: string;\n\n  /**\n   * A description of the chart that assistive technologies can use (through `aria-describedby` and `<title>`).\n   * Provide a concise summary of the data visualized in the chart.\n   */\n  ariaDescription?: string;\n\n  /**\n   * An object that contains all of the localized strings required by the component.\n   * @i18n\n   */\n  i18nStrings?: PieChartProps.I18nStrings;\n\n  /**\n   * Enable this property to make the chart fit into the available height of the parent container.\n   */\n  fitHeight?: boolean;\n}\n\nexport namespace PieChartProps {\n  export interface Datum {\n    title: string;\n    value: number;\n    color?: string;\n  }\n\n  export type PieChartData = ReadonlyArray<Datum>;\n\n  export interface DetailPopoverContentFunction<T = Datum> {\n    (segment: T, visibleDataSum: number): ReadonlyArray<ChartDetailPair>;\n  }\n\n  export interface DetailPopoverFooter<T> {\n    (segment: T): React.ReactNode;\n  }\n\n  export interface SegmentDescriptionFunction<T = Datum> {\n    (segment: T, visibleDataSum: number): string;\n  }\n\n  export interface HighlightChangeDetail<T> {\n    highlightedSegment: T | null;\n  }\n\n  export interface FilterChangeDetail<T> {\n    visibleSegments: ReadonlyArray<T>;\n  }\n\n  export interface I18nStrings {\n    /** Name of the \"Value\" key that is displayed in the details popover by default */\n    detailsValue?: string;\n\n    /** Name of the \"Percentage\" key that is displayed in the details popover by default */\n    detailsPercentage?: string;\n\n    /** Visible label of the default filter */\n    filterLabel?: string;\n\n    /** Placeholder text of the default filter */\n    filterPlaceholder?: string;\n\n    /** ARIA label for the default filter which is appended to any option that is selected */\n    filterSelectedAriaLabel?: string;\n\n    /** ARIA label that is associated with the legend in case there is no visible `legendTitle` defined */\n    legendAriaLabel?: string;\n\n    /** ARIA label for details popover dismiss button */\n    detailPopoverDismissAriaLabel?: string;\n\n    /** Name of the ARIA role description of the chart, e.g. \"pie chart\" */\n    chartAriaRoleDescription?: string;\n\n    /** Name of the ARIA role description of each segment, e.g. \"segment\" */\n    segmentAriaRoleDescription?: string;\n  }\n}\n"]}

package/lib/internal/template/pie-chart/labels.d.ts

@@ -3,7 +3,7 @@ import { PieArcDatum } from 'd3-shape';
 import { PieChartProps } from './interfaces';
 import { InternalChartDatum } from './pie-chart';
 import { Dimension } from './utils';
-export interface LabelsProps<T> {
+interface LabelsProps<T> {
     pieData: PieArcDatum<InternalChartDatum<T>>[];
     visibleDataSum: number;
     dimensions: Dimension;

package/lib/internal/template/pie-chart/labels.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"labels.d.ts","sourceRoot":"","sources":["../../../src/pie-chart/labels.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAE1E,OAAO,EAAO,WAAW,EAAE,MAAM,UAAU,CAAC;AAI5C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEjD,OAAO,EAAwC,SAAS,EAAE,MAAM,SAAS,CAAC;AAI1E,MAAM,WAAW,WAAW,CAAC,CAAC;IAC5B,OAAO,EAAE,WAAW,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9C,cAAc,EAAE,MAAM,CAAC;IACvB,UAAU,EAAE,SAAS,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,kBAAkB,EAAE,aAAa,CAAC,KAAK,GAAG,IAAI,CAAC;IAC/C,kBAAkB,CAAC,EAAE,aAAa,CAAC,0BAA0B,CAAC,CAAC,CAAC,CAAC;IACjE,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;CAC/C;;AA6CD,wBAuGE"}
+{"version":3,"file":"labels.d.ts","sourceRoot":"","sources":["../../../src/pie-chart/labels.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAE1E,OAAO,EAAO,WAAW,EAAE,MAAM,UAAU,CAAC;AAI5C,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEjD,OAAO,EAAwC,SAAS,EAAE,MAAM,SAAS,CAAC;AAI1E,UAAU,WAAW,CAAC,CAAC;IACrB,OAAO,EAAE,WAAW,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9C,cAAc,EAAE,MAAM,CAAC;IACvB,UAAU,EAAE,SAAS,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,kBAAkB,EAAE,aAAa,CAAC,KAAK,GAAG,IAAI,CAAC;IAC/C,kBAAkB,CAAC,EAAE,aAAa,CAAC,0BAA0B,CAAC,CAAC,CAAC,CAAC;IACjE,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;CAC/C;;AA6CD,wBAuGE"}

package/lib/internal/template/pie-chart/labels.js.map

@@ -1 +1 @@
-{"version":3,"file":"labels.js","sourceRoot":"","sources":["../../../src/pie-chart/labels.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,eAAe,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,GAAG,EAAe,MAAM,UAAU,CAAC;AAE5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAIlF,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAa,MAAM,SAAS,CAAC;AAE1E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAwBrC,SAAS,YAAY,CAAC,EACpB,CAAC,EACD,CAAC,EACD,UAAU,EACV,gBAAgB,EAChB,SAAS,EACT,KAAK,EACL,WAAW,EACX,mBAAmB,GACD;IAClB,OAAO,CACL,2BAAG,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,EAAE,SAAS,EAAC,EAAE,YAAS,CAAC,YAAU,CAAC;QAClE,CAAC,UAAU,IAAI,CACd,oBAAC,cAAc,IAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,mBAAmB,EAAE,mBAAmB,IACvF,KAAK,CACS,CAClB;QACA,CAAC,gBAAgB,IAAI,WAAW,IAAI,CACnC,oBAAC,cAAc,IACb,CAAC,EAAE,CAAC,EACJ,CAAC,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,EAC5B,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,MAAM,CAAC,kBAAkB,EACpC,mBAAmB,EAAE,mBAAmB,IAEvC,WAAW,CACG,CAClB,CACC,CACL,CAAC;AACJ,CAAC;AAED,eAAe,CAAgC,EAC7C,OAAO,EACP,UAAU,EACV,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,UAAU,EACV,gBAAgB,EAChB,YAAY,GACG,EAAE,EAAE;IACnB,MAAM,mBAAmB,GAAG,oBAAoB,CAAC,YAAY,CAAC,CAAC;IAC/D,MAAM,oBAAoB,GACxB,mBAAmB,CAAC,KAAK,GAAG,mBAAmB,CAAC,IAAI,GAAG,CAAC,UAAU,CAAC,WAAW,GAAG,UAAU,CAAC,iBAAiB,CAAC,GAAG,CAAC;QAClH,GAAG,CAAC;IACN,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,iBAAiB,EAAE,GAAG,UAAU,CAAC;QAE9D,+CAA+C;QAC/C,MAAM,cAAc,GAAG,GAAG,EAAoB;aAC3C,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC;aACvB,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAE3B,MAAM,cAAc,GAAG,GAAG,EAAoB;aAC3C,WAAW,CAAC,MAAM,GAAG,iBAAiB,CAAC;aACvC,WAAW,CAAC,MAAM,GAAG,iBAAiB,CAAC,CAAC;QAE3C,OAAO,OAAO,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;YAC9B,MAAM,UAAU,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;YAC9B,MAAM,UAAU,GAAG,iBAAiB,CAAC,UAAU,CAAC,UAAU,EAAE,UAAU,CAAC,QAAQ,EAAE,oBAAoB,CAAC,CAAC;YAEvG,yFAAyF;YACzF,MAAM,aAAa,GAAG,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC,GAAG,GAAG,CAAC;YAC3D,cAAc,CAAC,WAAW,CAAC,MAAM,GAAG,EAAE,GAAG,aAAa,CAAC,CAAC;YACxD,cAAc,CAAC,WAAW,CAAC,MAAM,GAAG,EAAE,GAAG,aAAa,CAAC,CAAC;YACxD,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,cAAc,CAAC,QAAQ,iCAAM,KAAK,KAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,IAAG,CAAC;YAC7G,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,cAAc,CAAC,QAAQ,iCAAM,KAAK,KAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,IAAG,CAAC;YAE7G,MAAM,SAAS,GAAG,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC;YACvC,MAAM,IAAI,GAAG,oBAAoB,CAAC,CAAC,CAAC,MAAM,GAAG,EAAE,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,EAAE,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAC9G,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAE9C,OAAO;gBACL,MAAM;gBACN,MAAM;gBACN,MAAM;gBACN,MAAM;gBACN,IAAI;gBACJ,IAAI,EAAE,MAAM;gBACZ,KAAK;gBACL,KAAK,EAAE,MAAM;gBACb,SAAS;gBACT,KAAK;aACN,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,OAAO,EAAE,UAAU,EAAE,oBAAoB,CAAC,CAAC,CAAC;IAEhD,MAAM,OAAO,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAE1C,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;YACpB,OAAO;SACR;QAED,oCAAoC;QACpC,MAAM,UAAU,GAAG,OAAO,CAAC,OAAO,CAAC,gBAAgB,CAAc,IAAI,MAAM,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;QAC7F,iBAAiB,CAAC,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,CAAC,WAAW,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;QACrG,iBAAiB,CAAC,UAAU,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,CAAC,WAAW,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IACtG,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC;IAEnC,OAAO,CACL,2BAAG,SAAS,EAAE,MAAM,CAAC,OAAO,iBAAc,MAAM,EAAC,GAAG,EAAE,OAAO,IAC1D,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE;QAC9F,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC;QACjC,MAAM,WAAW,GAAG,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAG,OAAO,EAAE,cAAc,CAAC,CAAC;QAClE,IAAI,CAAC,UAAU,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,gBAAgB,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACxE,OAAO,IAAI,CAAC;SACb;QACD,OAAO,CACL,2BACE,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,KAAK,EACrB,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE;gBAC5B,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,kBAAkB,KAAK,OAAO;gBAC9D,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,kBAAkB,KAAK,IAAI,IAAI,kBAAkB,KAAK,OAAO;gBACxF,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,CAAC,SAAS;aAC3C,CAAC;YAEF,8BAAM,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,GAAI;YACxD,8BAAM,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,GAAI;YACrF,oBAAC,YAAY,IACX,CAAC,EAAE,KAAK,EACR,CAAC,EAAE,KAAK,EACR,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,OAAO,CAAC,KAAK,EACpB,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,gBAAgB,EAAE,gBAAgB,EAClC,mBAAmB,EAAE,mBAAmB,GACxC,CACA,CACL,CAAC;IACJ,CAAC,CAAC,CACA,CACL,CAAC;AACJ,CAAC,CAAC;AAEF,SAAS,oBAAoB,CAAC,GAAiC;IAC7D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;IAC1D,iBAAiB,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE;QAC7B,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,qBAAqB,EAAE,CAAC;QACzD,QAAQ,CAAC,EAAE,IAAI,EAAE,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC;IACjE,CAAC,CAAC,CAAC;IACH,OAAO,KAAK,CAAC;AACf,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { arc, PieArcDatum } from 'd3-shape';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { PieChartProps } from './interfaces';\nimport { InternalChartDatum } from './pie-chart';\nimport ResponsiveText from './responsive-text';\nimport { balanceLabelNodes, computeSmartAngle, Dimension } from './utils';\n\nimport styles from './styles.css.js';\n\nexport interface LabelsProps<T> {\n  pieData: PieArcDatum<InternalChartDatum<T>>[];\n  visibleDataSum: number;\n  dimensions: Dimension;\n  hideTitles: boolean;\n  hideDescriptions: boolean;\n  highlightedSegment: PieChartProps.Datum | null;\n  segmentDescription?: PieChartProps.SegmentDescriptionFunction<T>;\n  containerRef: React.RefObject<HTMLDivElement>;\n}\n\ninterface LabelElementProps {\n  x: number;\n  y: number;\n  rightSide: boolean;\n  hideTitles: boolean;\n  hideDescriptions: boolean;\n  title: PieChartProps.Datum['title'];\n  description?: string;\n  containerBoundaries: null | { left: number; right: number };\n}\n\nfunction LabelElement({\n  x,\n  y,\n  hideTitles,\n  hideDescriptions,\n  rightSide,\n  title,\n  description,\n  containerBoundaries,\n}: LabelElementProps) {\n  return (\n    <g className={styles['label-text']} transform=\"\" data-x={x} data-y={y}>\n      {!hideTitles && (\n        <ResponsiveText x={x} y={y} rightSide={rightSide} containerBoundaries={containerBoundaries}>\n          {title}\n        </ResponsiveText>\n      )}\n      {!hideDescriptions && description && (\n        <ResponsiveText\n          x={x}\n          y={y + (hideTitles ? 0 : 18)}\n          rightSide={rightSide}\n          className={styles.label__description}\n          containerBoundaries={containerBoundaries}\n        >\n          {description}\n        </ResponsiveText>\n      )}\n    </g>\n  );\n}\n\nexport default <T extends PieChartProps.Datum>({\n  pieData,\n  dimensions,\n  highlightedSegment,\n  segmentDescription,\n  visibleDataSum,\n  hideTitles,\n  hideDescriptions,\n  containerRef,\n}: LabelsProps<T>) => {\n  const containerBoundaries = useElementBoundaries(containerRef);\n  const shouldOptimizeLabels =\n    containerBoundaries.right - containerBoundaries.left - (dimensions.outerRadius + dimensions.innerLabelPadding) * 2 <\n    300;\n  const markers = useMemo(() => {\n    const { outerRadius: radius, innerLabelPadding } = dimensions;\n\n    // More arc factories for the label positioning\n    const arcMarkerStart = arc<PieArcDatum<any>>()\n      .innerRadius(radius - 1)\n      .outerRadius(radius - 1);\n\n    const arcMarkerBreak = arc<PieArcDatum<any>>()\n      .innerRadius(radius + innerLabelPadding)\n      .outerRadius(radius + innerLabelPadding);\n\n    return pieData.map((datum, i) => {\n      const labelDatum = pieData[i];\n      const smartAngle = computeSmartAngle(labelDatum.startAngle, labelDatum.endAngle, shouldOptimizeLabels);\n\n      // Make the marker line longer if the segment is closer to the top or bottom of the chart\n      const lineExtension = 0.5 * Math.cos(2 * smartAngle) + 0.5;\n      arcMarkerBreak.outerRadius(radius + 20 * lineExtension);\n      arcMarkerBreak.innerRadius(radius + 20 * lineExtension);\n      const [startX, startY] = arcMarkerStart.centroid({ ...datum, startAngle: smartAngle, endAngle: smartAngle });\n      const [breakX, breakY] = arcMarkerBreak.centroid({ ...datum, startAngle: smartAngle, endAngle: smartAngle });\n\n      const rightSide = smartAngle < Math.PI;\n      const endX = shouldOptimizeLabels ? breakX + 20 * (rightSide ? 1 : -1) : (radius + 20) * (rightSide ? 1 : -1);\n      const textX = endX + 5 * (rightSide ? 1 : -1);\n\n      return {\n        startX,\n        startY,\n        breakX,\n        breakY,\n        endX,\n        endY: breakY,\n        textX,\n        textY: breakY,\n        rightSide,\n        datum,\n      };\n    });\n  }, [pieData, dimensions, shouldOptimizeLabels]);\n\n  const rootRef = useRef<SVGGElement>(null);\n\n  useLayoutEffect(() => {\n    if (!rootRef.current) {\n      return;\n    }\n\n    // Relax labels that are overlapping\n    const labelNodes = rootRef.current.querySelectorAll<SVGGElement>(`.${styles['label-text']}`);\n    balanceLabelNodes(labelNodes, markers, false, dimensions.outerRadius + dimensions.innerLabelPadding);\n    balanceLabelNodes(labelNodes, markers, true, dimensions.outerRadius + dimensions.innerLabelPadding);\n  }, [markers, pieData, dimensions]);\n\n  return (\n    <g className={styles.markers} aria-hidden=\"true\" ref={rootRef}>\n      {markers.map(({ startX, startY, breakX, breakY, endX, endY, textX, textY, rightSide, datum }) => {\n        const segment = datum.data.datum;\n        const description = segmentDescription?.(segment, visibleDataSum);\n        if ((hideTitles && !description) || (hideDescriptions && !segment.title)) {\n          return null;\n        }\n        return (\n          <g\n            key={datum.data.index}\n            className={clsx(styles.label, {\n              [styles['label--highlighted']]: highlightedSegment === segment,\n              [styles['label--dimmed']]: highlightedSegment !== null && highlightedSegment !== segment,\n              [styles['label--align-right']]: !rightSide,\n            })}\n          >\n            <line x1={startX} y1={startY} x2={breakX} y2={breakY} />\n            <line x1={breakX} y1={breakY} x2={endX} y2={endY} className={styles['label-line']} />\n            <LabelElement\n              x={textX}\n              y={textY}\n              rightSide={rightSide}\n              title={segment.title}\n              description={description}\n              hideTitles={hideTitles}\n              hideDescriptions={hideDescriptions}\n              containerBoundaries={containerBoundaries}\n            />\n          </g>\n        );\n      })}\n    </g>\n  );\n};\n\nfunction useElementBoundaries(ref: React.RefObject<HTMLElement>): { left: number; right: number } {\n  const [state, setState] = useState({ left: 0, right: 0 });\n  useResizeObserver(ref, entry => {\n    const elementRect = entry.target.getBoundingClientRect();\n    setState({ left: elementRect.left, right: elementRect.right });\n  });\n  return state;\n}\n"]}
+{"version":3,"file":"labels.js","sourceRoot":"","sources":["../../../src/pie-chart/labels.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,eAAe,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,GAAG,EAAe,MAAM,UAAU,CAAC;AAE5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAIlF,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAa,MAAM,SAAS,CAAC;AAE1E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAwBrC,SAAS,YAAY,CAAC,EACpB,CAAC,EACD,CAAC,EACD,UAAU,EACV,gBAAgB,EAChB,SAAS,EACT,KAAK,EACL,WAAW,EACX,mBAAmB,GACD;IAClB,OAAO,CACL,2BAAG,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,EAAE,SAAS,EAAC,EAAE,YAAS,CAAC,YAAU,CAAC;QAClE,CAAC,UAAU,IAAI,CACd,oBAAC,cAAc,IAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,mBAAmB,EAAE,mBAAmB,IACvF,KAAK,CACS,CAClB;QACA,CAAC,gBAAgB,IAAI,WAAW,IAAI,CACnC,oBAAC,cAAc,IACb,CAAC,EAAE,CAAC,EACJ,CAAC,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,EAC5B,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,MAAM,CAAC,kBAAkB,EACpC,mBAAmB,EAAE,mBAAmB,IAEvC,WAAW,CACG,CAClB,CACC,CACL,CAAC;AACJ,CAAC;AAED,eAAe,CAAgC,EAC7C,OAAO,EACP,UAAU,EACV,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,UAAU,EACV,gBAAgB,EAChB,YAAY,GACG,EAAE,EAAE;IACnB,MAAM,mBAAmB,GAAG,oBAAoB,CAAC,YAAY,CAAC,CAAC;IAC/D,MAAM,oBAAoB,GACxB,mBAAmB,CAAC,KAAK,GAAG,mBAAmB,CAAC,IAAI,GAAG,CAAC,UAAU,CAAC,WAAW,GAAG,UAAU,CAAC,iBAAiB,CAAC,GAAG,CAAC;QAClH,GAAG,CAAC;IACN,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,iBAAiB,EAAE,GAAG,UAAU,CAAC;QAE9D,+CAA+C;QAC/C,MAAM,cAAc,GAAG,GAAG,EAAoB;aAC3C,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC;aACvB,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAE3B,MAAM,cAAc,GAAG,GAAG,EAAoB;aAC3C,WAAW,CAAC,MAAM,GAAG,iBAAiB,CAAC;aACvC,WAAW,CAAC,MAAM,GAAG,iBAAiB,CAAC,CAAC;QAE3C,OAAO,OAAO,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;YAC9B,MAAM,UAAU,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;YAC9B,MAAM,UAAU,GAAG,iBAAiB,CAAC,UAAU,CAAC,UAAU,EAAE,UAAU,CAAC,QAAQ,EAAE,oBAAoB,CAAC,CAAC;YAEvG,yFAAyF;YACzF,MAAM,aAAa,GAAG,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC,GAAG,GAAG,CAAC;YAC3D,cAAc,CAAC,WAAW,CAAC,MAAM,GAAG,EAAE,GAAG,aAAa,CAAC,CAAC;YACxD,cAAc,CAAC,WAAW,CAAC,MAAM,GAAG,EAAE,GAAG,aAAa,CAAC,CAAC;YACxD,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,cAAc,CAAC,QAAQ,iCAAM,KAAK,KAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,IAAG,CAAC;YAC7G,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,cAAc,CAAC,QAAQ,iCAAM,KAAK,KAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,IAAG,CAAC;YAE7G,MAAM,SAAS,GAAG,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC;YACvC,MAAM,IAAI,GAAG,oBAAoB,CAAC,CAAC,CAAC,MAAM,GAAG,EAAE,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,EAAE,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAC9G,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAE9C,OAAO;gBACL,MAAM;gBACN,MAAM;gBACN,MAAM;gBACN,MAAM;gBACN,IAAI;gBACJ,IAAI,EAAE,MAAM;gBACZ,KAAK;gBACL,KAAK,EAAE,MAAM;gBACb,SAAS;gBACT,KAAK;aACN,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,OAAO,EAAE,UAAU,EAAE,oBAAoB,CAAC,CAAC,CAAC;IAEhD,MAAM,OAAO,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAE1C,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;YACpB,OAAO;SACR;QAED,oCAAoC;QACpC,MAAM,UAAU,GAAG,OAAO,CAAC,OAAO,CAAC,gBAAgB,CAAc,IAAI,MAAM,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;QAC7F,iBAAiB,CAAC,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,CAAC,WAAW,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;QACrG,iBAAiB,CAAC,UAAU,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,CAAC,WAAW,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IACtG,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC;IAEnC,OAAO,CACL,2BAAG,SAAS,EAAE,MAAM,CAAC,OAAO,iBAAc,MAAM,EAAC,GAAG,EAAE,OAAO,IAC1D,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE;QAC9F,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC;QACjC,MAAM,WAAW,GAAG,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAG,OAAO,EAAE,cAAc,CAAC,CAAC;QAClE,IAAI,CAAC,UAAU,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,gBAAgB,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACxE,OAAO,IAAI,CAAC;SACb;QACD,OAAO,CACL,2BACE,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,KAAK,EACrB,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE;gBAC5B,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,kBAAkB,KAAK,OAAO;gBAC9D,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,kBAAkB,KAAK,IAAI,IAAI,kBAAkB,KAAK,OAAO;gBACxF,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC,EAAE,CAAC,SAAS;aAC3C,CAAC;YAEF,8BAAM,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,GAAI;YACxD,8BAAM,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,GAAI;YACrF,oBAAC,YAAY,IACX,CAAC,EAAE,KAAK,EACR,CAAC,EAAE,KAAK,EACR,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,OAAO,CAAC,KAAK,EACpB,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,gBAAgB,EAAE,gBAAgB,EAClC,mBAAmB,EAAE,mBAAmB,GACxC,CACA,CACL,CAAC;IACJ,CAAC,CAAC,CACA,CACL,CAAC;AACJ,CAAC,CAAC;AAEF,SAAS,oBAAoB,CAAC,GAAiC;IAC7D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;IAC1D,iBAAiB,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE;QAC7B,MAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,qBAAqB,EAAE,CAAC;QACzD,QAAQ,CAAC,EAAE,IAAI,EAAE,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC;IACjE,CAAC,CAAC,CAAC;IACH,OAAO,KAAK,CAAC;AACf,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { arc, PieArcDatum } from 'd3-shape';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { PieChartProps } from './interfaces';\nimport { InternalChartDatum } from './pie-chart';\nimport ResponsiveText from './responsive-text';\nimport { balanceLabelNodes, computeSmartAngle, Dimension } from './utils';\n\nimport styles from './styles.css.js';\n\ninterface LabelsProps<T> {\n  pieData: PieArcDatum<InternalChartDatum<T>>[];\n  visibleDataSum: number;\n  dimensions: Dimension;\n  hideTitles: boolean;\n  hideDescriptions: boolean;\n  highlightedSegment: PieChartProps.Datum | null;\n  segmentDescription?: PieChartProps.SegmentDescriptionFunction<T>;\n  containerRef: React.RefObject<HTMLDivElement>;\n}\n\ninterface LabelElementProps {\n  x: number;\n  y: number;\n  rightSide: boolean;\n  hideTitles: boolean;\n  hideDescriptions: boolean;\n  title: PieChartProps.Datum['title'];\n  description?: string;\n  containerBoundaries: null | { left: number; right: number };\n}\n\nfunction LabelElement({\n  x,\n  y,\n  hideTitles,\n  hideDescriptions,\n  rightSide,\n  title,\n  description,\n  containerBoundaries,\n}: LabelElementProps) {\n  return (\n    <g className={styles['label-text']} transform=\"\" data-x={x} data-y={y}>\n      {!hideTitles && (\n        <ResponsiveText x={x} y={y} rightSide={rightSide} containerBoundaries={containerBoundaries}>\n          {title}\n        </ResponsiveText>\n      )}\n      {!hideDescriptions && description && (\n        <ResponsiveText\n          x={x}\n          y={y + (hideTitles ? 0 : 18)}\n          rightSide={rightSide}\n          className={styles.label__description}\n          containerBoundaries={containerBoundaries}\n        >\n          {description}\n        </ResponsiveText>\n      )}\n    </g>\n  );\n}\n\nexport default <T extends PieChartProps.Datum>({\n  pieData,\n  dimensions,\n  highlightedSegment,\n  segmentDescription,\n  visibleDataSum,\n  hideTitles,\n  hideDescriptions,\n  containerRef,\n}: LabelsProps<T>) => {\n  const containerBoundaries = useElementBoundaries(containerRef);\n  const shouldOptimizeLabels =\n    containerBoundaries.right - containerBoundaries.left - (dimensions.outerRadius + dimensions.innerLabelPadding) * 2 <\n    300;\n  const markers = useMemo(() => {\n    const { outerRadius: radius, innerLabelPadding } = dimensions;\n\n    // More arc factories for the label positioning\n    const arcMarkerStart = arc<PieArcDatum<any>>()\n      .innerRadius(radius - 1)\n      .outerRadius(radius - 1);\n\n    const arcMarkerBreak = arc<PieArcDatum<any>>()\n      .innerRadius(radius + innerLabelPadding)\n      .outerRadius(radius + innerLabelPadding);\n\n    return pieData.map((datum, i) => {\n      const labelDatum = pieData[i];\n      const smartAngle = computeSmartAngle(labelDatum.startAngle, labelDatum.endAngle, shouldOptimizeLabels);\n\n      // Make the marker line longer if the segment is closer to the top or bottom of the chart\n      const lineExtension = 0.5 * Math.cos(2 * smartAngle) + 0.5;\n      arcMarkerBreak.outerRadius(radius + 20 * lineExtension);\n      arcMarkerBreak.innerRadius(radius + 20 * lineExtension);\n      const [startX, startY] = arcMarkerStart.centroid({ ...datum, startAngle: smartAngle, endAngle: smartAngle });\n      const [breakX, breakY] = arcMarkerBreak.centroid({ ...datum, startAngle: smartAngle, endAngle: smartAngle });\n\n      const rightSide = smartAngle < Math.PI;\n      const endX = shouldOptimizeLabels ? breakX + 20 * (rightSide ? 1 : -1) : (radius + 20) * (rightSide ? 1 : -1);\n      const textX = endX + 5 * (rightSide ? 1 : -1);\n\n      return {\n        startX,\n        startY,\n        breakX,\n        breakY,\n        endX,\n        endY: breakY,\n        textX,\n        textY: breakY,\n        rightSide,\n        datum,\n      };\n    });\n  }, [pieData, dimensions, shouldOptimizeLabels]);\n\n  const rootRef = useRef<SVGGElement>(null);\n\n  useLayoutEffect(() => {\n    if (!rootRef.current) {\n      return;\n    }\n\n    // Relax labels that are overlapping\n    const labelNodes = rootRef.current.querySelectorAll<SVGGElement>(`.${styles['label-text']}`);\n    balanceLabelNodes(labelNodes, markers, false, dimensions.outerRadius + dimensions.innerLabelPadding);\n    balanceLabelNodes(labelNodes, markers, true, dimensions.outerRadius + dimensions.innerLabelPadding);\n  }, [markers, pieData, dimensions]);\n\n  return (\n    <g className={styles.markers} aria-hidden=\"true\" ref={rootRef}>\n      {markers.map(({ startX, startY, breakX, breakY, endX, endY, textX, textY, rightSide, datum }) => {\n        const segment = datum.data.datum;\n        const description = segmentDescription?.(segment, visibleDataSum);\n        if ((hideTitles && !description) || (hideDescriptions && !segment.title)) {\n          return null;\n        }\n        return (\n          <g\n            key={datum.data.index}\n            className={clsx(styles.label, {\n              [styles['label--highlighted']]: highlightedSegment === segment,\n              [styles['label--dimmed']]: highlightedSegment !== null && highlightedSegment !== segment,\n              [styles['label--align-right']]: !rightSide,\n            })}\n          >\n            <line x1={startX} y1={startY} x2={breakX} y2={breakY} />\n            <line x1={breakX} y1={breakY} x2={endX} y2={endY} className={styles['label-line']} />\n            <LabelElement\n              x={textX}\n              y={textY}\n              rightSide={rightSide}\n              title={segment.title}\n              description={description}\n              hideTitles={hideTitles}\n              hideDescriptions={hideDescriptions}\n              containerBoundaries={containerBoundaries}\n            />\n          </g>\n        );\n      })}\n    </g>\n  );\n};\n\nfunction useElementBoundaries(ref: React.RefObject<HTMLElement>): { left: number; right: number } {\n  const [state, setState] = useState({ left: 0, right: 0 });\n  useResizeObserver(ref, entry => {\n    const elementRect = entry.target.getBoundingClientRect();\n    setState({ left: elementRect.left, right: elementRect.right });\n  });\n  return state;\n}\n"]}

package/lib/internal/template/pie-chart/pie-chart.d.ts

@@ -1,7 +1,7 @@
-import React from 'react';
+/// <reference types="react" />
 import { PieArcDatum } from 'd3-shape';
 import { SomeRequired } from '../internal/types';
-import { PieChartProps, SeriesInfo } from './interfaces';
+import { PieChartProps } from './interfaces';
 export interface InternalChartDatum<T> {
     index: number;
     color: string;
@@ -16,11 +16,6 @@ interface InternalPieChartProps<T extends PieChartProps.Datum> extends SomeRequi
     pieData: PieArcDatum<InternalChartDatum<T>>[];
     dataSum: number;
 }
-export interface PopoverData<T> {
-    datum: T;
-    trackRef: React.RefObject<SVGElement>;
-    series: SeriesInfo;
-}
 declare const _default: <T extends PieChartProps.Datum>({ fitHeight, height: explicitHeight, variant, size, width, i18nStrings, ariaLabel, ariaLabelledby, ariaDescription, innerMetricValue, innerMetricDescription, hideTitles, hideDescriptions, detailPopoverContent, detailPopoverSize, detailPopoverFooter, segmentDescription, highlightedSegment, onHighlightChange, legendSegment, pieData, dataSum, }: InternalPieChartProps<T>) => JSX.Element;
 export default _default;
 //# sourceMappingURL=pie-chart.d.ts.map

package/lib/internal/template/pie-chart/pie-chart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pie-chart.d.ts","sourceRoot":"","sources":["../../../src/pie-chart/pie-chart.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAEjF,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAevC,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAGjD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAOzD,MAAM,WAAW,kBAAkB,CAAC,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;CACpB;AAED,UAAU,qBAAqB,CAAC,CAAC,SAAS,aAAa,CAAC,KAAK,CAC3D,SAAQ,YAAY,CAClB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,mBAAmB,GAAG,YAAY,CAAC,EAC1D,SAAS,GAAG,MAAM,GAAG,aAAa,GAAG,YAAY,GAAG,kBAAkB,CACvE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IAEf,kBAAkB,EAAE,CAAC,GAAG,IAAI,CAAC;IAC7B,iBAAiB,EAAE,CAAC,OAAO,EAAE,IAAI,GAAG,CAAC,KAAK,IAAI,CAAC;IAE/C,aAAa,EAAE,CAAC,GAAG,IAAI,CAAC;IAExB,OAAO,EAAE,WAAW,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9C,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,WAAW,CAAC,CAAC;IAC5B,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IACtC,MAAM,EAAE,UAAU,CAAC;CACpB;;AAED,wBAuVE"}
+{"version":3,"file":"pie-chart.d.ts","sourceRoot":"","sources":["../../../src/pie-chart/pie-chart.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAevC,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAGjD,OAAO,EAAE,aAAa,EAAc,MAAM,cAAc,CAAC;AAOzD,MAAM,WAAW,kBAAkB,CAAC,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;CACpB;AAED,UAAU,qBAAqB,CAAC,CAAC,SAAS,aAAa,CAAC,KAAK,CAC3D,SAAQ,YAAY,CAClB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,mBAAmB,GAAG,YAAY,CAAC,EAC1D,SAAS,GAAG,MAAM,GAAG,aAAa,GAAG,YAAY,GAAG,kBAAkB,CACvE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IAEf,kBAAkB,EAAE,CAAC,GAAG,IAAI,CAAC;IAC7B,iBAAiB,EAAE,CAAC,OAAO,EAAE,IAAI,GAAG,CAAC,KAAK,IAAI,CAAC;IAE/C,aAAa,EAAE,CAAC,GAAG,IAAI,CAAC;IAExB,OAAO,EAAE,WAAW,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC9C,OAAO,EAAE,MAAM,CAAC;CACjB;;AAQD,wBAuVE"}

package/lib/internal/template/pie-chart/pie-chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"pie-chart.js","sourceRoot":"","sources":["../../../src/pie-chart/pie-chart.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, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { PieArcDatum } from 'd3-shape';\n\nimport { nodeContains } from '@cloudscape-design/component-toolkit/dom';\n\nimport InternalBox from '../box/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport ChartPlot, { ChartPlotRef } from '../internal/components/chart-plot';\nimport ChartPopover from '../internal/components/chart-popover';\nimport ChartPopoverFooter from '../internal/components/chart-popover-footer';\nimport SeriesDetails from '../internal/components/chart-series-details';\nimport SeriesMarker from '../internal/components/chart-series-marker';\nimport { useHeightMeasure } from '../internal/hooks/container-queries/use-height-measure';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { KeyCode } from '../internal/keycode';\nimport { SomeRequired } from '../internal/types';\nimport { nodeBelongs } from '../internal/utils/node-belongs';\nimport InternalLiveRegion from '../live-region/internal';\nimport { PieChartProps, SeriesInfo } from './interfaces';\nimport Labels from './labels';\nimport Segments from './segments';\nimport { defaultDetails, getDimensionsBySize } from './utils';\n\nimport styles from './styles.css.js';\n\nexport interface InternalChartDatum<T> {\n  index: number;\n  color: string;\n  datum: Readonly<T>;\n}\n\ninterface InternalPieChartProps<T extends PieChartProps.Datum>\n  extends SomeRequired<\n    Omit<PieChartProps<T>, 'onHighlightChange' | 'statusType'>,\n    'variant' | 'size' | 'i18nStrings' | 'hideTitles' | 'hideDescriptions'\n  > {\n  width: number;\n  height: number;\n\n  highlightedSegment: T | null;\n  onHighlightChange: (segment: null | T) => void;\n\n  legendSegment: T | null;\n\n  pieData: PieArcDatum<InternalChartDatum<T>>[];\n  dataSum: number;\n}\n\nexport interface PopoverData<T> {\n  datum: T;\n  trackRef: React.RefObject<SVGElement>;\n  series: SeriesInfo;\n}\n\nexport default <T extends PieChartProps.Datum>({\n  fitHeight,\n  height: explicitHeight,\n  variant,\n  size,\n  width,\n  i18nStrings,\n  ariaLabel,\n  ariaLabelledby,\n  ariaDescription,\n  innerMetricValue,\n  innerMetricDescription,\n  hideTitles,\n  hideDescriptions,\n  detailPopoverContent,\n  detailPopoverSize,\n  detailPopoverFooter,\n  segmentDescription,\n  highlightedSegment,\n  onHighlightChange,\n  legendSegment,\n  pieData,\n  dataSum,\n}: InternalPieChartProps<T>) => {\n  const [pinnedSegment, setPinnedSegment] = useState<T | null>(null);\n  const plotRef = useRef<ChartPlotRef>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const focusedSegmentRef = useRef<SVGGElement>(null);\n  const popoverTrackRef = useRef<SVGCircleElement>(null);\n  const popoverRef = useRef<HTMLElement | null>(null);\n\n  const hasLabels = !(hideTitles && hideDescriptions);\n  const isRefresh = useVisualRefresh();\n\n  const height = useHeightMeasure(() => plotRef.current?.svg ?? null, !fitHeight) ?? explicitHeight;\n\n  const dimensions = useMemo(\n    () =>\n      getDimensionsBySize({ size: fitHeight ? Math.min(height, width) : size, hasLabels, visualRefresh: isRefresh }),\n    [fitHeight, height, width, size, hasLabels, isRefresh]\n  );\n\n  // Inner content is only available for donut charts and the inner description is not displayed for small charts\n  const hasInnerContent =\n    variant === 'donut' && (innerMetricValue || (innerMetricDescription && dimensions.size !== 'small'));\n\n  const innerMetricId = useUniqueId('awsui-pie-chart__inner');\n\n  const [isPopoverOpen, setPopoverOpen] = useState<boolean>(false);\n  const [popoverData, setPopoverData] = useState<PopoverData<T>>();\n\n  const highlightedSegmentIndex = useMemo(() => {\n    for (let index = 0; index < pieData.length; index++) {\n      if (pieData[index].data.datum === highlightedSegment) {\n        return index;\n      }\n    }\n    return null;\n  }, [pieData, highlightedSegment]);\n\n  const detailPopoverFooterContent = useMemo(\n    () => (detailPopoverFooter && highlightedSegment ? detailPopoverFooter(highlightedSegment) : null),\n    [detailPopoverFooter, highlightedSegment]\n  );\n\n  const i18n = useInternalI18n('pie-chart');\n  const detailFunction = detailPopoverContent || defaultDetails(i18n, i18nStrings);\n  const details = popoverData ? detailFunction(popoverData.datum, dataSum) : [];\n  const popoverContentRef = useRef<HTMLDivElement | null>(null);\n  const popoverContent = popoverData && <SeriesDetails details={details} compactList={true} ref={popoverContentRef} />;\n\n  const popoverDismissedRecently = useRef(false);\n  const escapePressed = useRef(false);\n  const duringTouch = useRef(false);\n\n  const highlightSegment = useCallback(\n    (internalDatum: InternalChartDatum<T>) => {\n      const segment = internalDatum.datum;\n      if (segment !== highlightedSegment) {\n        onHighlightChange(segment);\n      }\n\n      if (popoverTrackRef.current) {\n        setPopoverData({\n          datum: internalDatum.datum,\n          series: {\n            color: internalDatum.color,\n            index: internalDatum.index,\n            label: internalDatum.datum.title,\n            markerType: 'rectangle',\n          },\n          trackRef: popoverTrackRef,\n        });\n        setPopoverOpen(true);\n      }\n    },\n    [highlightedSegment, setPopoverOpen, onHighlightChange]\n  );\n\n  const clearHighlightedSegment = useCallback(() => {\n    setPopoverOpen(false);\n    onHighlightChange(null);\n  }, [onHighlightChange, setPopoverOpen]);\n\n  const checkMouseLeave = (event: React.MouseEvent) => {\n    if (pinnedSegment !== null) {\n      return;\n    }\n\n    if (\n      nodeContains(popoverRef.current, event.relatedTarget) ||\n      nodeContains(focusedSegmentRef.current, event.relatedTarget)\n    ) {\n      return;\n    }\n\n    clearHighlightedSegment();\n  };\n\n  useEffect(() => {\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === 'Escape') {\n        clearHighlightedSegment();\n        escapePressed.current = true;\n      }\n    };\n    document.addEventListener('keydown', onKeyDown);\n    return () => document.removeEventListener('keydown', onKeyDown);\n  }, [clearHighlightedSegment]);\n\n  const onMouseDown = useCallback(\n    (internalDatum: InternalChartDatum<T>) => {\n      if (pinnedSegment === internalDatum.datum) {\n        setPinnedSegment(null);\n        clearHighlightedSegment();\n      } else {\n        setPinnedSegment(internalDatum.datum);\n        highlightSegment(internalDatum);\n      }\n    },\n    [pinnedSegment, clearHighlightedSegment, setPinnedSegment, highlightSegment]\n  );\n  const onMouseOver = useCallback(\n    (internalDatum: InternalChartDatum<T>) => {\n      if (escapePressed.current) {\n        escapePressed.current = false;\n        return;\n      }\n      if (duringTouch.current) {\n        duringTouch.current = false;\n        return;\n      }\n      if (pinnedSegment !== null) {\n        return;\n      }\n      highlightSegment(internalDatum);\n    },\n    [pinnedSegment, highlightSegment]\n  );\n  const onTouchStart = useCallback(() => {\n    duringTouch.current = true;\n  }, []);\n\n  const onKeyDown = useCallback(\n    (event: React.KeyboardEvent) => {\n      const keyCode = event.keyCode;\n      if (\n        keyCode !== KeyCode.right &&\n        keyCode !== KeyCode.left &&\n        keyCode !== KeyCode.enter &&\n        keyCode !== KeyCode.space\n      ) {\n        return;\n      }\n\n      event.preventDefault();\n\n      let nextIndex = highlightedSegmentIndex || 0;\n      const MAX = pieData.length - 1;\n      if (keyCode === KeyCode.right) {\n        nextIndex++;\n        if (nextIndex > MAX) {\n          nextIndex = 0;\n        }\n      } else if (keyCode === KeyCode.left) {\n        nextIndex--;\n        if (nextIndex < 0) {\n          nextIndex = MAX;\n        }\n      }\n      if (keyCode === KeyCode.enter || keyCode === KeyCode.space) {\n        setPinnedSegment(pieData[nextIndex].data.datum);\n      }\n      highlightSegment(pieData[nextIndex].data);\n    },\n    [setPinnedSegment, highlightSegment, pieData, highlightedSegmentIndex]\n  );\n  const onApplicationFocus = useCallback(\n    (_event: any, target: 'keyboard' | 'mouse') => {\n      if (pinnedSegment !== null || popoverDismissedRecently.current || target === 'mouse') {\n        return;\n      }\n\n      const segment = highlightedSegment || legendSegment || pieData[0].data.datum;\n      const matched = pieData.filter(d => d.data.datum === segment);\n      highlightSegment(matched[0].data);\n    },\n    [pinnedSegment, pieData, highlightSegment, highlightedSegment, legendSegment]\n  );\n\n  const onApplicationBlur = useCallback(\n    (event: React.FocusEvent) => {\n      const blurTarget = event.relatedTarget || event.target;\n      if (blurTarget === null || !(blurTarget instanceof Element) || !nodeBelongs(containerRef.current, blurTarget)) {\n        // We only need to close the popover and remove the pinned segment so that we keep track of the current\n        // highlighted legendSeries. using clearHighlightedSegment() would set the legendSeries to null, in that case\n        // using Keyboard Tab will always highlight the first legend item in the legend component.\n        setPopoverOpen(false);\n        setPinnedSegment(null);\n      }\n    },\n    [setPinnedSegment]\n  );\n  const onPopoverDismiss = (outsideClick?: boolean) => {\n    setPopoverOpen(false);\n    setPinnedSegment(null);\n\n    if (!outsideClick) {\n      // The delay is needed to bypass focus events caused by click or keypress needed to unpin the popover.\n      setTimeout(() => {\n        popoverDismissedRecently.current = true;\n        plotRef.current!.focusApplication();\n        popoverDismissedRecently.current = false;\n      }, 0);\n    } else {\n      onHighlightChange(null);\n    }\n  };\n\n  return (\n    <div\n      className={clsx(styles['chart-container'], fitHeight && styles['chart-container--fit-height'])}\n      ref={containerRef}\n    >\n      <div\n        className={clsx(\n          styles['chart-container-chart-plot'],\n          fitHeight && styles['chart-container-chart-plot--fit-height']\n        )}\n      >\n        <ChartPlot\n          ref={plotRef}\n          width=\"100%\"\n          height={fitHeight ? '100%' : height}\n          transform={`translate(${width / 2} ${height / 2})`}\n          isPrecise={true}\n          isClickable={!isPopoverOpen}\n          ariaLabel={ariaLabel}\n          ariaLabelledby={ariaLabelledby}\n          ariaDescription={ariaDescription}\n          ariaDescribedby={hasInnerContent ? innerMetricId : undefined}\n          ariaRoleDescription={i18nStrings?.chartAriaRoleDescription}\n          activeElementRef={focusedSegmentRef}\n          activeElementKey={highlightedSegmentIndex?.toString()}\n          onApplicationFocus={onApplicationFocus}\n          onApplicationBlur={onApplicationBlur}\n          onKeyDown={onKeyDown}\n          onMouseOut={checkMouseLeave}\n        >\n          <Segments\n            pieData={pieData}\n            dimensions={dimensions}\n            variant={variant}\n            focusedSegmentRef={focusedSegmentRef}\n            popoverTrackRef={popoverTrackRef}\n            highlightedSegment={highlightedSegment}\n            segmentAriaRoleDescription={i18nStrings?.segmentAriaRoleDescription}\n            onMouseDown={onMouseDown}\n            onMouseOver={onMouseOver}\n            onTouchStart={onTouchStart}\n          />\n          {hasLabels && (\n            <Labels\n              pieData={pieData}\n              dimensions={dimensions}\n              segmentDescription={segmentDescription}\n              visibleDataSum={dataSum}\n              hideTitles={hideTitles}\n              hideDescriptions={hideDescriptions}\n              highlightedSegment={highlightedSegment}\n              containerRef={containerRef}\n            />\n          )}\n        </ChartPlot>\n      </div>\n\n      {hasInnerContent && (\n        <div className={styles['inner-content']} id={innerMetricId}>\n          {innerMetricValue && (\n            <InternalBox\n              variant={dimensions.size === 'small' ? 'h3' : 'h1'}\n              tagOverride=\"div\"\n              color=\"inherit\"\n              padding=\"n\"\n            >\n              {innerMetricValue}\n            </InternalBox>\n          )}\n          {innerMetricDescription && dimensions.size !== 'small' && (\n            <InternalBox variant=\"h3\" color=\"text-body-secondary\" tagOverride=\"div\" padding=\"n\">\n              {innerMetricDescription}\n            </InternalBox>\n          )}\n        </div>\n      )}\n      {isPopoverOpen && popoverData && (\n        <ChartPopover\n          ref={popoverRef}\n          title={\n            popoverData.series && (\n              <InternalBox className={styles['popover-header']} variant=\"strong\">\n                <SeriesMarker color={popoverData.series.color} type={popoverData.series.markerType} />{' '}\n                {popoverData.series.label}\n              </InternalBox>\n            )\n          }\n          trackRef={popoverData.trackRef}\n          trackKey={popoverData.series.index}\n          dismissButton={pinnedSegment !== null}\n          dismissAriaLabel={i18nStrings.detailPopoverDismissAriaLabel}\n          onDismiss={onPopoverDismiss}\n          container={plotRef.current?.svg || null}\n          size={detailPopoverSize}\n          onMouseLeave={checkMouseLeave}\n          onBlur={onApplicationBlur}\n        >\n          {popoverContent}\n          {detailPopoverFooterContent && <ChartPopoverFooter>{detailPopoverFooterContent}</ChartPopoverFooter>}\n        </ChartPopover>\n      )}\n      <InternalLiveRegion sources={[popoverContentRef]} />\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"pie-chart.js","sourceRoot":"","sources":["../../../src/pie-chart/pie-chart.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, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { PieArcDatum } from 'd3-shape';\n\nimport { nodeContains } from '@cloudscape-design/component-toolkit/dom';\n\nimport InternalBox from '../box/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport ChartPlot, { ChartPlotRef } from '../internal/components/chart-plot';\nimport ChartPopover from '../internal/components/chart-popover';\nimport ChartPopoverFooter from '../internal/components/chart-popover-footer';\nimport SeriesDetails from '../internal/components/chart-series-details';\nimport SeriesMarker from '../internal/components/chart-series-marker';\nimport { useHeightMeasure } from '../internal/hooks/container-queries/use-height-measure';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { KeyCode } from '../internal/keycode';\nimport { SomeRequired } from '../internal/types';\nimport { nodeBelongs } from '../internal/utils/node-belongs';\nimport InternalLiveRegion from '../live-region/internal';\nimport { PieChartProps, SeriesInfo } from './interfaces';\nimport Labels from './labels';\nimport Segments from './segments';\nimport { defaultDetails, getDimensionsBySize } from './utils';\n\nimport styles from './styles.css.js';\n\nexport interface InternalChartDatum<T> {\n  index: number;\n  color: string;\n  datum: Readonly<T>;\n}\n\ninterface InternalPieChartProps<T extends PieChartProps.Datum>\n  extends SomeRequired<\n    Omit<PieChartProps<T>, 'onHighlightChange' | 'statusType'>,\n    'variant' | 'size' | 'i18nStrings' | 'hideTitles' | 'hideDescriptions'\n  > {\n  width: number;\n  height: number;\n\n  highlightedSegment: T | null;\n  onHighlightChange: (segment: null | T) => void;\n\n  legendSegment: T | null;\n\n  pieData: PieArcDatum<InternalChartDatum<T>>[];\n  dataSum: number;\n}\n\ninterface PopoverData<T> {\n  datum: T;\n  trackRef: React.RefObject<SVGElement>;\n  series: SeriesInfo;\n}\n\nexport default <T extends PieChartProps.Datum>({\n  fitHeight,\n  height: explicitHeight,\n  variant,\n  size,\n  width,\n  i18nStrings,\n  ariaLabel,\n  ariaLabelledby,\n  ariaDescription,\n  innerMetricValue,\n  innerMetricDescription,\n  hideTitles,\n  hideDescriptions,\n  detailPopoverContent,\n  detailPopoverSize,\n  detailPopoverFooter,\n  segmentDescription,\n  highlightedSegment,\n  onHighlightChange,\n  legendSegment,\n  pieData,\n  dataSum,\n}: InternalPieChartProps<T>) => {\n  const [pinnedSegment, setPinnedSegment] = useState<T | null>(null);\n  const plotRef = useRef<ChartPlotRef>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const focusedSegmentRef = useRef<SVGGElement>(null);\n  const popoverTrackRef = useRef<SVGCircleElement>(null);\n  const popoverRef = useRef<HTMLElement | null>(null);\n\n  const hasLabels = !(hideTitles && hideDescriptions);\n  const isRefresh = useVisualRefresh();\n\n  const height = useHeightMeasure(() => plotRef.current?.svg ?? null, !fitHeight) ?? explicitHeight;\n\n  const dimensions = useMemo(\n    () =>\n      getDimensionsBySize({ size: fitHeight ? Math.min(height, width) : size, hasLabels, visualRefresh: isRefresh }),\n    [fitHeight, height, width, size, hasLabels, isRefresh]\n  );\n\n  // Inner content is only available for donut charts and the inner description is not displayed for small charts\n  const hasInnerContent =\n    variant === 'donut' && (innerMetricValue || (innerMetricDescription && dimensions.size !== 'small'));\n\n  const innerMetricId = useUniqueId('awsui-pie-chart__inner');\n\n  const [isPopoverOpen, setPopoverOpen] = useState<boolean>(false);\n  const [popoverData, setPopoverData] = useState<PopoverData<T>>();\n\n  const highlightedSegmentIndex = useMemo(() => {\n    for (let index = 0; index < pieData.length; index++) {\n      if (pieData[index].data.datum === highlightedSegment) {\n        return index;\n      }\n    }\n    return null;\n  }, [pieData, highlightedSegment]);\n\n  const detailPopoverFooterContent = useMemo(\n    () => (detailPopoverFooter && highlightedSegment ? detailPopoverFooter(highlightedSegment) : null),\n    [detailPopoverFooter, highlightedSegment]\n  );\n\n  const i18n = useInternalI18n('pie-chart');\n  const detailFunction = detailPopoverContent || defaultDetails(i18n, i18nStrings);\n  const details = popoverData ? detailFunction(popoverData.datum, dataSum) : [];\n  const popoverContentRef = useRef<HTMLDivElement | null>(null);\n  const popoverContent = popoverData && <SeriesDetails details={details} compactList={true} ref={popoverContentRef} />;\n\n  const popoverDismissedRecently = useRef(false);\n  const escapePressed = useRef(false);\n  const duringTouch = useRef(false);\n\n  const highlightSegment = useCallback(\n    (internalDatum: InternalChartDatum<T>) => {\n      const segment = internalDatum.datum;\n      if (segment !== highlightedSegment) {\n        onHighlightChange(segment);\n      }\n\n      if (popoverTrackRef.current) {\n        setPopoverData({\n          datum: internalDatum.datum,\n          series: {\n            color: internalDatum.color,\n            index: internalDatum.index,\n            label: internalDatum.datum.title,\n            markerType: 'rectangle',\n          },\n          trackRef: popoverTrackRef,\n        });\n        setPopoverOpen(true);\n      }\n    },\n    [highlightedSegment, setPopoverOpen, onHighlightChange]\n  );\n\n  const clearHighlightedSegment = useCallback(() => {\n    setPopoverOpen(false);\n    onHighlightChange(null);\n  }, [onHighlightChange, setPopoverOpen]);\n\n  const checkMouseLeave = (event: React.MouseEvent) => {\n    if (pinnedSegment !== null) {\n      return;\n    }\n\n    if (\n      nodeContains(popoverRef.current, event.relatedTarget) ||\n      nodeContains(focusedSegmentRef.current, event.relatedTarget)\n    ) {\n      return;\n    }\n\n    clearHighlightedSegment();\n  };\n\n  useEffect(() => {\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === 'Escape') {\n        clearHighlightedSegment();\n        escapePressed.current = true;\n      }\n    };\n    document.addEventListener('keydown', onKeyDown);\n    return () => document.removeEventListener('keydown', onKeyDown);\n  }, [clearHighlightedSegment]);\n\n  const onMouseDown = useCallback(\n    (internalDatum: InternalChartDatum<T>) => {\n      if (pinnedSegment === internalDatum.datum) {\n        setPinnedSegment(null);\n        clearHighlightedSegment();\n      } else {\n        setPinnedSegment(internalDatum.datum);\n        highlightSegment(internalDatum);\n      }\n    },\n    [pinnedSegment, clearHighlightedSegment, setPinnedSegment, highlightSegment]\n  );\n  const onMouseOver = useCallback(\n    (internalDatum: InternalChartDatum<T>) => {\n      if (escapePressed.current) {\n        escapePressed.current = false;\n        return;\n      }\n      if (duringTouch.current) {\n        duringTouch.current = false;\n        return;\n      }\n      if (pinnedSegment !== null) {\n        return;\n      }\n      highlightSegment(internalDatum);\n    },\n    [pinnedSegment, highlightSegment]\n  );\n  const onTouchStart = useCallback(() => {\n    duringTouch.current = true;\n  }, []);\n\n  const onKeyDown = useCallback(\n    (event: React.KeyboardEvent) => {\n      const keyCode = event.keyCode;\n      if (\n        keyCode !== KeyCode.right &&\n        keyCode !== KeyCode.left &&\n        keyCode !== KeyCode.enter &&\n        keyCode !== KeyCode.space\n      ) {\n        return;\n      }\n\n      event.preventDefault();\n\n      let nextIndex = highlightedSegmentIndex || 0;\n      const MAX = pieData.length - 1;\n      if (keyCode === KeyCode.right) {\n        nextIndex++;\n        if (nextIndex > MAX) {\n          nextIndex = 0;\n        }\n      } else if (keyCode === KeyCode.left) {\n        nextIndex--;\n        if (nextIndex < 0) {\n          nextIndex = MAX;\n        }\n      }\n      if (keyCode === KeyCode.enter || keyCode === KeyCode.space) {\n        setPinnedSegment(pieData[nextIndex].data.datum);\n      }\n      highlightSegment(pieData[nextIndex].data);\n    },\n    [setPinnedSegment, highlightSegment, pieData, highlightedSegmentIndex]\n  );\n  const onApplicationFocus = useCallback(\n    (_event: any, target: 'keyboard' | 'mouse') => {\n      if (pinnedSegment !== null || popoverDismissedRecently.current || target === 'mouse') {\n        return;\n      }\n\n      const segment = highlightedSegment || legendSegment || pieData[0].data.datum;\n      const matched = pieData.filter(d => d.data.datum === segment);\n      highlightSegment(matched[0].data);\n    },\n    [pinnedSegment, pieData, highlightSegment, highlightedSegment, legendSegment]\n  );\n\n  const onApplicationBlur = useCallback(\n    (event: React.FocusEvent) => {\n      const blurTarget = event.relatedTarget || event.target;\n      if (blurTarget === null || !(blurTarget instanceof Element) || !nodeBelongs(containerRef.current, blurTarget)) {\n        // We only need to close the popover and remove the pinned segment so that we keep track of the current\n        // highlighted legendSeries. using clearHighlightedSegment() would set the legendSeries to null, in that case\n        // using Keyboard Tab will always highlight the first legend item in the legend component.\n        setPopoverOpen(false);\n        setPinnedSegment(null);\n      }\n    },\n    [setPinnedSegment]\n  );\n  const onPopoverDismiss = (outsideClick?: boolean) => {\n    setPopoverOpen(false);\n    setPinnedSegment(null);\n\n    if (!outsideClick) {\n      // The delay is needed to bypass focus events caused by click or keypress needed to unpin the popover.\n      setTimeout(() => {\n        popoverDismissedRecently.current = true;\n        plotRef.current!.focusApplication();\n        popoverDismissedRecently.current = false;\n      }, 0);\n    } else {\n      onHighlightChange(null);\n    }\n  };\n\n  return (\n    <div\n      className={clsx(styles['chart-container'], fitHeight && styles['chart-container--fit-height'])}\n      ref={containerRef}\n    >\n      <div\n        className={clsx(\n          styles['chart-container-chart-plot'],\n          fitHeight && styles['chart-container-chart-plot--fit-height']\n        )}\n      >\n        <ChartPlot\n          ref={plotRef}\n          width=\"100%\"\n          height={fitHeight ? '100%' : height}\n          transform={`translate(${width / 2} ${height / 2})`}\n          isPrecise={true}\n          isClickable={!isPopoverOpen}\n          ariaLabel={ariaLabel}\n          ariaLabelledby={ariaLabelledby}\n          ariaDescription={ariaDescription}\n          ariaDescribedby={hasInnerContent ? innerMetricId : undefined}\n          ariaRoleDescription={i18nStrings?.chartAriaRoleDescription}\n          activeElementRef={focusedSegmentRef}\n          activeElementKey={highlightedSegmentIndex?.toString()}\n          onApplicationFocus={onApplicationFocus}\n          onApplicationBlur={onApplicationBlur}\n          onKeyDown={onKeyDown}\n          onMouseOut={checkMouseLeave}\n        >\n          <Segments\n            pieData={pieData}\n            dimensions={dimensions}\n            variant={variant}\n            focusedSegmentRef={focusedSegmentRef}\n            popoverTrackRef={popoverTrackRef}\n            highlightedSegment={highlightedSegment}\n            segmentAriaRoleDescription={i18nStrings?.segmentAriaRoleDescription}\n            onMouseDown={onMouseDown}\n            onMouseOver={onMouseOver}\n            onTouchStart={onTouchStart}\n          />\n          {hasLabels && (\n            <Labels\n              pieData={pieData}\n              dimensions={dimensions}\n              segmentDescription={segmentDescription}\n              visibleDataSum={dataSum}\n              hideTitles={hideTitles}\n              hideDescriptions={hideDescriptions}\n              highlightedSegment={highlightedSegment}\n              containerRef={containerRef}\n            />\n          )}\n        </ChartPlot>\n      </div>\n\n      {hasInnerContent && (\n        <div className={styles['inner-content']} id={innerMetricId}>\n          {innerMetricValue && (\n            <InternalBox\n              variant={dimensions.size === 'small' ? 'h3' : 'h1'}\n              tagOverride=\"div\"\n              color=\"inherit\"\n              padding=\"n\"\n            >\n              {innerMetricValue}\n            </InternalBox>\n          )}\n          {innerMetricDescription && dimensions.size !== 'small' && (\n            <InternalBox variant=\"h3\" color=\"text-body-secondary\" tagOverride=\"div\" padding=\"n\">\n              {innerMetricDescription}\n            </InternalBox>\n          )}\n        </div>\n      )}\n      {isPopoverOpen && popoverData && (\n        <ChartPopover\n          ref={popoverRef}\n          title={\n            popoverData.series && (\n              <InternalBox className={styles['popover-header']} variant=\"strong\">\n                <SeriesMarker color={popoverData.series.color} type={popoverData.series.markerType} />{' '}\n                {popoverData.series.label}\n              </InternalBox>\n            )\n          }\n          trackRef={popoverData.trackRef}\n          trackKey={popoverData.series.index}\n          dismissButton={pinnedSegment !== null}\n          dismissAriaLabel={i18nStrings.detailPopoverDismissAriaLabel}\n          onDismiss={onPopoverDismiss}\n          container={plotRef.current?.svg || null}\n          size={detailPopoverSize}\n          onMouseLeave={checkMouseLeave}\n          onBlur={onApplicationBlur}\n        >\n          {popoverContent}\n          {detailPopoverFooterContent && <ChartPopoverFooter>{detailPopoverFooterContent}</ChartPopoverFooter>}\n        </ChartPopover>\n      )}\n      <InternalLiveRegion sources={[popoverContentRef]} />\n    </div>\n  );\n};\n"]}

package/lib/internal/template/pie-chart/styles.css.js

@@ -1,32 +1,32 @@
 
     import './styles.scoped.css';
     export default {
-  "segment__path": "awsui_segment__path_1edmh_1xy8k_157",
-  "segment": "awsui_segment_1edmh_1xy8k_157",
-  "segment__hover": "awsui_segment__hover_1edmh_1xy8k_184",
-  "label": "awsui_label_1edmh_1xy8k_198",
-  "root": "awsui_root_1edmh_1xy8k_212",
-  "content": "awsui_content_1edmh_1xy8k_216",
-  "content--small": "awsui_content--small_1edmh_1xy8k_216",
-  "content--fit-height": "awsui_content--fit-height_1edmh_1xy8k_219",
-  "content--without-labels": "awsui_content--without-labels_1edmh_1xy8k_222",
-  "content--medium": "awsui_content--medium_1edmh_1xy8k_228",
-  "content--large": "awsui_content--large_1edmh_1xy8k_240",
-  "status-container": "awsui_status-container_1edmh_1xy8k_257",
-  "chart-container": "awsui_chart-container_1edmh_1xy8k_261",
-  "chart-container--fit-height": "awsui_chart-container--fit-height_1edmh_1xy8k_265",
-  "chart-container-chart-plot": "awsui_chart-container-chart-plot_1edmh_1xy8k_270",
-  "chart-container-chart-plot--fit-height": "awsui_chart-container-chart-plot--fit-height_1edmh_1xy8k_273",
-  "inner-content": "awsui_inner-content_1edmh_1xy8k_279",
-  "segment__highlight": "awsui_segment__highlight_1edmh_1xy8k_290",
-  "segment--dimmed": "awsui_segment--dimmed_1edmh_1xy8k_305",
-  "segment--highlighted": "awsui_segment--highlighted_1edmh_1xy8k_308",
-  "label--dimmed": "awsui_label--dimmed_1edmh_1xy8k_325",
-  "label--align-right": "awsui_label--align-right_1edmh_1xy8k_328",
-  "label-text": "awsui_label-text_1edmh_1xy8k_336",
-  "label__description": "awsui_label__description_1edmh_1xy8k_344",
-  "label-line": "awsui_label-line_1edmh_1xy8k_351",
-  "label--highlighted": "awsui_label--highlighted_1edmh_1xy8k_355",
-  "popover-header": "awsui_popover-header_1edmh_1xy8k_359"
+  "segment__path": "awsui_segment__path_1edmh_1kvqz_161",
+  "segment": "awsui_segment_1edmh_1kvqz_161",
+  "segment__hover": "awsui_segment__hover_1edmh_1kvqz_188",
+  "label": "awsui_label_1edmh_1kvqz_202",
+  "root": "awsui_root_1edmh_1kvqz_216",
+  "content": "awsui_content_1edmh_1kvqz_220",
+  "content--small": "awsui_content--small_1edmh_1kvqz_220",
+  "content--fit-height": "awsui_content--fit-height_1edmh_1kvqz_223",
+  "content--without-labels": "awsui_content--without-labels_1edmh_1kvqz_226",
+  "content--medium": "awsui_content--medium_1edmh_1kvqz_232",
+  "content--large": "awsui_content--large_1edmh_1kvqz_244",
+  "status-container": "awsui_status-container_1edmh_1kvqz_261",
+  "chart-container": "awsui_chart-container_1edmh_1kvqz_265",
+  "chart-container--fit-height": "awsui_chart-container--fit-height_1edmh_1kvqz_269",
+  "chart-container-chart-plot": "awsui_chart-container-chart-plot_1edmh_1kvqz_274",
+  "chart-container-chart-plot--fit-height": "awsui_chart-container-chart-plot--fit-height_1edmh_1kvqz_277",
+  "inner-content": "awsui_inner-content_1edmh_1kvqz_283",
+  "segment__highlight": "awsui_segment__highlight_1edmh_1kvqz_294",
+  "segment--dimmed": "awsui_segment--dimmed_1edmh_1kvqz_309",
+  "segment--highlighted": "awsui_segment--highlighted_1edmh_1kvqz_312",
+  "label--dimmed": "awsui_label--dimmed_1edmh_1kvqz_329",
+  "label--align-right": "awsui_label--align-right_1edmh_1kvqz_332",
+  "label-text": "awsui_label-text_1edmh_1kvqz_340",
+  "label__description": "awsui_label__description_1edmh_1kvqz_348",
+  "label-line": "awsui_label-line_1edmh_1kvqz_355",
+  "label--highlighted": "awsui_label--highlighted_1edmh_1kvqz_359",
+  "popover-header": "awsui_popover-header_1edmh_1kvqz_363"
 };
   

package/lib/internal/template/pie-chart/styles.scoped.css

@@ -136,6 +136,10 @@
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
 /* 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 */
 /*
@@ -154,129 +158,129 @@ 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_segment__path_1edmh_1xy8k_157:not(#\9) {
+.awsui_segment__path_1edmh_1kvqz_161:not(#\9) {
   transition: opacity var(--motion-duration-transition-quick-1ym1ir, 90ms) var(--motion-easing-transition-quick-c2tqbv, linear);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_segment__path_1edmh_1xy8k_157:not(#\9) {
+  .awsui_segment__path_1edmh_1kvqz_161:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_segment__path_1edmh_1xy8k_157:not(#\9), .awsui-mode-entering .awsui_segment__path_1edmh_1xy8k_157:not(#\9) {
+.awsui-motion-disabled .awsui_segment__path_1edmh_1kvqz_161:not(#\9), .awsui-mode-entering .awsui_segment__path_1edmh_1kvqz_161:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_segment_1edmh_1xy8k_157:not(#\9) {
+.awsui_segment_1edmh_1kvqz_161:not(#\9) {
   transition: opacity var(--motion-duration-transition-quick-1ym1ir, 90ms) var(--motion-easing-transition-quick-c2tqbv, linear);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_segment_1edmh_1xy8k_157:not(#\9) {
+  .awsui_segment_1edmh_1kvqz_161:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_segment_1edmh_1xy8k_157:not(#\9), .awsui-mode-entering .awsui_segment_1edmh_1xy8k_157:not(#\9) {
+.awsui-motion-disabled .awsui_segment_1edmh_1kvqz_161:not(#\9), .awsui-mode-entering .awsui_segment_1edmh_1kvqz_161:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_segment_1edmh_1xy8k_157 > .awsui_segment__hover_1edmh_1xy8k_184:not(#\9) {
+.awsui_segment_1edmh_1kvqz_161 > .awsui_segment__hover_1edmh_1kvqz_188:not(#\9) {
   transition: opacity var(--motion-duration-transition-quick-1ym1ir, 90ms) var(--motion-easing-transition-quick-c2tqbv, linear);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_segment_1edmh_1xy8k_157 > .awsui_segment__hover_1edmh_1xy8k_184:not(#\9) {
+  .awsui_segment_1edmh_1kvqz_161 > .awsui_segment__hover_1edmh_1kvqz_188:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_segment_1edmh_1xy8k_157 > .awsui_segment__hover_1edmh_1xy8k_184:not(#\9), .awsui-mode-entering .awsui_segment_1edmh_1xy8k_157 > .awsui_segment__hover_1edmh_1xy8k_184:not(#\9) {
+.awsui-motion-disabled .awsui_segment_1edmh_1kvqz_161 > .awsui_segment__hover_1edmh_1kvqz_188:not(#\9), .awsui-mode-entering .awsui_segment_1edmh_1kvqz_161 > .awsui_segment__hover_1edmh_1kvqz_188:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_label_1edmh_1xy8k_198:not(#\9) {
+.awsui_label_1edmh_1kvqz_202:not(#\9) {
   transition: opacity var(--motion-duration-transition-quick-1ym1ir, 90ms) var(--motion-easing-transition-quick-c2tqbv, linear);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_label_1edmh_1xy8k_198:not(#\9) {
+  .awsui_label_1edmh_1kvqz_202:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_label_1edmh_1xy8k_198:not(#\9), .awsui-mode-entering .awsui_label_1edmh_1xy8k_198:not(#\9) {
+.awsui-motion-disabled .awsui_label_1edmh_1kvqz_202:not(#\9), .awsui-mode-entering .awsui_label_1edmh_1kvqz_202:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_root_1edmh_1xy8k_212:not(#\9) {
+.awsui_root_1edmh_1kvqz_216:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_content_1edmh_1xy8k_216.awsui_content--small_1edmh_1xy8k_216:not(#\9) {
+.awsui_content_1edmh_1kvqz_220.awsui_content--small_1edmh_1kvqz_220:not(#\9) {
   min-block-size: calc(2 * (50px + var(--space-xs-6dgkww, 8px) + calc(2 * var(--line-height-body-m-gw0130, 22px))));
 }
-.awsui_content_1edmh_1xy8k_216.awsui_content--small_1edmh_1xy8k_216.awsui_content--fit-height_1edmh_1xy8k_219:not(#\9) {
+.awsui_content_1edmh_1kvqz_220.awsui_content--small_1edmh_1kvqz_220.awsui_content--fit-height_1edmh_1kvqz_223:not(#\9) {
   min-block-size: calc(2 * (30px + calc(2 * var(--line-height-body-m-gw0130, 22px))));
 }
-.awsui_content_1edmh_1xy8k_216.awsui_content--small_1edmh_1xy8k_216.awsui_content--without-labels_1edmh_1xy8k_222:not(#\9) {
+.awsui_content_1edmh_1kvqz_220.awsui_content--small_1edmh_1kvqz_220.awsui_content--without-labels_1edmh_1kvqz_226:not(#\9) {
   min-block-size: calc(2 * (50px + var(--space-xs-6dgkww, 8px)));
 }
-.awsui_content_1edmh_1xy8k_216.awsui_content--small_1edmh_1xy8k_216.awsui_content--without-labels_1edmh_1xy8k_222.awsui_content--fit-height_1edmh_1xy8k_219:not(#\9) {
+.awsui_content_1edmh_1kvqz_220.awsui_content--small_1edmh_1kvqz_220.awsui_content--without-labels_1edmh_1kvqz_226.awsui_content--fit-height_1edmh_1kvqz_223:not(#\9) {
   min-block-size: calc(2 * (30px));
 }
-.awsui_content_1edmh_1xy8k_216.awsui_content--medium_1edmh_1xy8k_228:not(#\9) {
+.awsui_content_1edmh_1kvqz_220.awsui_content--medium_1edmh_1kvqz_232:not(#\9) {
   min-block-size: calc(2 * (100px + var(--space-s-vmutj3, 12px) + calc(2 * var(--line-height-body-m-gw0130, 22px))));
 }
-.awsui_content_1edmh_1xy8k_216.awsui_content--medium_1edmh_1xy8k_228.awsui_content--fit-height_1edmh_1xy8k_219:not(#\9) {
+.awsui_content_1edmh_1kvqz_220.awsui_content--medium_1edmh_1kvqz_232.awsui_content--fit-height_1edmh_1kvqz_223:not(#\9) {
   min-block-size: calc(2 * (100px + calc(2 * var(--line-height-body-m-gw0130, 22px))));
 }
-.awsui_content_1edmh_1xy8k_216.awsui_content--medium_1edmh_1xy8k_228.awsui_content--without-labels_1edmh_1xy8k_222:not(#\9) {
+.awsui_content_1edmh_1kvqz_220.awsui_content--medium_1edmh_1kvqz_232.awsui_content--without-labels_1edmh_1kvqz_226:not(#\9) {
   min-block-size: calc(2 * (100px + var(--space-s-vmutj3, 12px)));
 }
-.awsui_content_1edmh_1xy8k_216.awsui_content--medium_1edmh_1xy8k_228.awsui_content--without-labels_1edmh_1xy8k_222.awsui_content--fit-height_1edmh_1xy8k_219:not(#\9) {
+.awsui_content_1edmh_1kvqz_220.awsui_content--medium_1edmh_1kvqz_232.awsui_content--without-labels_1edmh_1kvqz_226.awsui_content--fit-height_1edmh_1kvqz_223:not(#\9) {
   min-block-size: calc(2 * (100px));
 }
-.awsui_content_1edmh_1xy8k_216.awsui_content--large_1edmh_1xy8k_240:not(#\9) {
+.awsui_content_1edmh_1kvqz_220.awsui_content--large_1edmh_1kvqz_244:not(#\9) {
   min-block-size: calc(2 * (140px + var(--space-s-vmutj3, 12px) + calc(2 * var(--line-height-body-m-gw0130, 22px))));
 }
-.awsui_content_1edmh_1xy8k_216.awsui_content--large_1edmh_1xy8k_240.awsui_content--fit-height_1edmh_1xy8k_219:not(#\9) {
+.awsui_content_1edmh_1kvqz_220.awsui_content--large_1edmh_1kvqz_244.awsui_content--fit-height_1edmh_1kvqz_223:not(#\9) {
   min-block-size: calc(2 * (140px + calc(2 * var(--line-height-body-m-gw0130, 22px))));
 }
-.awsui_content_1edmh_1xy8k_216.awsui_content--large_1edmh_1xy8k_240.awsui_content--without-labels_1edmh_1xy8k_222:not(#\9) {
+.awsui_content_1edmh_1kvqz_220.awsui_content--large_1edmh_1kvqz_244.awsui_content--without-labels_1edmh_1kvqz_226:not(#\9) {
   min-block-size: calc(2 * (140px + var(--space-s-vmutj3, 12px)));
 }
-.awsui_content_1edmh_1xy8k_216.awsui_content--large_1edmh_1xy8k_240.awsui_content--without-labels_1edmh_1xy8k_222.awsui_content--fit-height_1edmh_1xy8k_219:not(#\9) {
+.awsui_content_1edmh_1kvqz_220.awsui_content--large_1edmh_1kvqz_244.awsui_content--without-labels_1edmh_1kvqz_226.awsui_content--fit-height_1edmh_1kvqz_223:not(#\9) {
   min-block-size: calc(2 * (140px));
 }
 
-.awsui_content--fit-height_1edmh_1xy8k_219:not(#\9) {
+.awsui_content--fit-height_1edmh_1kvqz_223:not(#\9) {
   flex: 1;
 }
 
-.awsui_status-container_1edmh_1xy8k_257:not(#\9) {
+.awsui_status-container_1edmh_1kvqz_261:not(#\9) {
   /* used in test utils */
 }
 
-.awsui_chart-container_1edmh_1xy8k_261:not(#\9) {
+.awsui_chart-container_1edmh_1kvqz_265:not(#\9) {
   display: flex;
   flex: 1;
 }
-.awsui_chart-container--fit-height_1edmh_1xy8k_265:not(#\9) {
+.awsui_chart-container--fit-height_1edmh_1kvqz_269:not(#\9) {
   block-size: 100%;
   min-block-size: inherit;
 }
 
-.awsui_chart-container-chart-plot_1edmh_1xy8k_270:not(#\9) {
+.awsui_chart-container-chart-plot_1edmh_1kvqz_274:not(#\9) {
   display: contents;
 }
-.awsui_chart-container-chart-plot--fit-height_1edmh_1xy8k_273:not(#\9) {
+.awsui_chart-container-chart-plot--fit-height_1edmh_1kvqz_277:not(#\9) {
   display: block;
   position: absolute;
   inset: 0;
 }
 
-.awsui_inner-content_1edmh_1xy8k_279:not(#\9) {
+.awsui_inner-content_1edmh_1kvqz_283:not(#\9) {
   display: flex;
   position: absolute;
   flex-direction: column;
@@ -287,53 +291,53 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   pointer-events: none;
 }
 
-.awsui_segment__highlight_1edmh_1xy8k_290:not(#\9) {
+.awsui_segment__highlight_1edmh_1kvqz_294:not(#\9) {
   stroke: none;
   opacity: 0;
 }
 
-.awsui_segment_1edmh_1xy8k_157:not(#\9) {
+.awsui_segment_1edmh_1kvqz_161:not(#\9) {
   stroke: var(--color-background-container-content-myy7cn, #ffffff);
   stroke-width: 2px;
   stroke-linejoin: round;
   opacity: 1;
   cursor: pointer;
 }
-.awsui_segment_1edmh_1xy8k_157:not(#\9):focus {
+.awsui_segment_1edmh_1kvqz_161:not(#\9):focus {
   outline: none;
 }
-.awsui_segment_1edmh_1xy8k_157.awsui_segment--dimmed_1edmh_1xy8k_305:not(#\9) {
+.awsui_segment_1edmh_1kvqz_161.awsui_segment--dimmed_1edmh_1kvqz_309:not(#\9) {
   opacity: 0.35;
 }
-.awsui_segment_1edmh_1xy8k_157.awsui_segment--highlighted_1edmh_1xy8k_308 > .awsui_segment__highlight_1edmh_1xy8k_290:not(#\9), .awsui_segment_1edmh_1xy8k_157:not(#\9):hover:not(.awsui_segment--dimmed_1edmh_1xy8k_305) > .awsui_segment__highlight_1edmh_1xy8k_290 {
+.awsui_segment_1edmh_1kvqz_161.awsui_segment--highlighted_1edmh_1kvqz_312 > .awsui_segment__highlight_1edmh_1kvqz_294:not(#\9), .awsui_segment_1edmh_1kvqz_161:not(#\9):hover:not(.awsui_segment--dimmed_1edmh_1kvqz_309) > .awsui_segment__highlight_1edmh_1kvqz_294 {
   opacity: 1;
 }
 
-.awsui_label_1edmh_1xy8k_198:not(#\9) {
+.awsui_label_1edmh_1kvqz_202:not(#\9) {
   color: var(--color-text-heading-default-8wpkvf, #16191f);
   opacity: 1;
   /* stylelint-disable-next-line selector-max-type */
   /* stylelint-disable-next-line selector-max-type */
 }
-.awsui_label_1edmh_1xy8k_198 > line:not(#\9) {
+.awsui_label_1edmh_1kvqz_202 > line:not(#\9) {
   stroke: var(--color-stroke-chart-line-z8sxxc, #879596);
   stroke-width: var(--border-divider-section-width-iueskx, 1px);
 }
-.awsui_label_1edmh_1xy8k_198 > div:not(#\9) {
+.awsui_label_1edmh_1kvqz_202 > div:not(#\9) {
   margin-block-start: -0.75em;
 }
-.awsui_label_1edmh_1xy8k_198.awsui_label--dimmed_1edmh_1xy8k_325:not(#\9) {
+.awsui_label_1edmh_1kvqz_202.awsui_label--dimmed_1edmh_1kvqz_329:not(#\9) {
   opacity: 0.35;
 }
-.awsui_label_1edmh_1xy8k_198.awsui_label--align-right_1edmh_1xy8k_328:not(#\9) {
+.awsui_label_1edmh_1kvqz_202.awsui_label--align-right_1edmh_1kvqz_332:not(#\9) {
   /* stylelint-disable-next-line selector-max-type */
 }
-.awsui_label_1edmh_1xy8k_198.awsui_label--align-right_1edmh_1xy8k_328 > div:not(#\9) {
+.awsui_label_1edmh_1kvqz_202.awsui_label--align-right_1edmh_1kvqz_332 > div:not(#\9) {
   text-align: end;
 }
 
 /* stylelint-disable-next-line selector-max-type */
-.awsui_label-text_1edmh_1xy8k_336 > text:not(#\9) {
+.awsui_label-text_1edmh_1kvqz_340 > text:not(#\9) {
   font-size: var(--font-size-body-m-6wxxs5, 14px);
   line-height: var(--line-height-body-m-gw0130, 22px);
   font-weight: var(--font-display-label-weight-5p8eav, 400);
@@ -341,22 +345,22 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   dominant-baseline: middle;
 }
 
-text.awsui_label__description_1edmh_1xy8k_344:not(#\9) {
+text.awsui_label__description_1edmh_1kvqz_348:not(#\9) {
   font-size: var(--font-chart-detail-size-z60lhi, 14px);
   font-weight: 400;
   color: var(--color-text-group-label-eorpbe, #545b64);
   fill: var(--color-text-group-label-eorpbe, #545b64);
 }
 
-.awsui_label-line_1edmh_1xy8k_351:not(#\9) {
+.awsui_label-line_1edmh_1kvqz_355:not(#\9) {
   /* used in component code */
 }
 
-.awsui_label--highlighted_1edmh_1xy8k_355:not(#\9) {
+.awsui_label--highlighted_1edmh_1kvqz_359:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_popover-header_1edmh_1xy8k_359:not(#\9) {
+.awsui_popover-header_1edmh_1kvqz_363:not(#\9) {
   display: inline-flex;
   align-items: flex-start;
 }