@cloudscape-design/chart-components 1.0.0

package/cartesian-chart/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/cartesian-chart/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { forwardRef } from \"react\";\n\nimport { warnOnce } from \"@cloudscape-design/component-toolkit/internal\";\n\nimport { PointDataItemType, RangeDataItemOptions } from \"../core/interfaces\";\nimport { getDataAttributes } from \"../internal/base-component/get-data-attributes\";\nimport useBaseComponent from \"../internal/base-component/use-base-component\";\nimport { applyDisplayName } from \"../internal/utils/apply-display-name\";\nimport { SomeRequired } from \"../internal/utils/utils\";\nimport { InternalCartesianChart } from \"./chart-cartesian-internal\";\nimport { CartesianChartProps } from \"./interfaces\";\n\nexport type { CartesianChartProps };\n\nconst CartesianChart = forwardRef(\n  (\n    {\n      fitHeight = false,\n      inverted = false,\n      stacking = undefined,\n      emphasizeBaseline = true,\n      verticalAxisTitlePlacement = \"top\",\n      ...props\n    }: CartesianChartProps,\n    ref: React.Ref<CartesianChartProps.Ref>,\n  ) => {\n    // We transform options before propagating them to the internal chart to ensure only those\n    // defined in the component's contract can be propagated down to the underlying Highcharts.\n    // Additionally, we assign all default options, including the nested ones.\n    const series = transformSeries(props.series, stacking);\n    const xAxis = transformXAxisOptions(props.xAxis);\n    const yAxis = transformYAxisOptions(props.yAxis);\n    const tooltip = transformTooltip(props.tooltip);\n    const legend = transformLegend(props.legend);\n\n    const baseComponentProps = useBaseComponent(\"CartesianChart\", {\n      props: { fitHeight, inverted, stacking, emphasizeBaseline, verticalAxisTitlePlacement },\n      metadata: {},\n    });\n\n    return (\n      <InternalCartesianChart\n        ref={ref}\n        {...props}\n        fitHeight={fitHeight}\n        inverted={inverted}\n        stacking={stacking}\n        emphasizeBaseline={emphasizeBaseline}\n        verticalAxisTitlePlacement={verticalAxisTitlePlacement}\n        series={series}\n        xAxis={xAxis}\n        yAxis={yAxis}\n        tooltip={tooltip}\n        legend={legend}\n        {...getDataAttributes(props)}\n        {...baseComponentProps}\n      />\n    );\n  },\n);\n\napplyDisplayName(CartesianChart, \"CartesianChart\");\n\nexport default CartesianChart;\n\nfunction transformSeries(\n  untransformedSeries: readonly CartesianChartProps.SeriesOptions[],\n  stacking?: \"normal\",\n): CartesianChartProps.SeriesOptions[] {\n  const transformedSeries: CartesianChartProps.SeriesOptions[] = [];\n  function transformSingleSeries(s: CartesianChartProps.SeriesOptions): null | CartesianChartProps.SeriesOptions {\n    switch (s.type) {\n      case \"area\":\n      case \"areaspline\":\n      case \"line\":\n      case \"spline\":\n        return transformLineLikeSeries(s);\n      case \"column\":\n        return transformColumnSeries(s);\n      case \"scatter\":\n        return transformScatterSeries(s);\n      case \"errorbar\":\n        return transformErrorBarSeries(s, untransformedSeries, stacking);\n      case \"x-threshold\":\n      case \"y-threshold\":\n        return transformThresholdSeries(s);\n      default:\n        return null;\n    }\n  }\n  for (const series of untransformedSeries) {\n    const transformed = transformSingleSeries(series);\n    if (transformed) {\n      transformedSeries.push(transformed);\n    }\n  }\n  return transformedSeries;\n}\n\nfunction transformLineLikeSeries<\n  S extends\n    | CartesianChartProps.AreaSeriesOptions\n    | CartesianChartProps.AreaSplineSeriesOptions\n    | CartesianChartProps.LineSeriesOptions\n    | CartesianChartProps.SplineSeriesOptions,\n>(s: S): null | S {\n  const data = transformPointData(s.data);\n  return { type: s.type, id: s.id, name: s.name, color: s.color, data } as S;\n}\n\nfunction transformColumnSeries<S extends CartesianChartProps.ColumnSeriesOptions>(s: S): null | S {\n  const data = transformPointData(s.data);\n  return { type: s.type, id: s.id, name: s.name, color: s.color, data } as S;\n}\n\nfunction transformScatterSeries<S extends CartesianChartProps.ScatterSeriesOptions>(s: S): null | S {\n  const data = transformPointData(s.data);\n  const marker = s.marker ?? {};\n  return { type: s.type, id: s.id, name: s.name, color: s.color, data, marker } as S;\n}\n\nfunction transformThresholdSeries<\n  S extends CartesianChartProps.XThresholdSeriesOptions | CartesianChartProps.YThresholdSeriesOptions,\n>(s: S): null | S {\n  return { type: s.type, id: s.id, name: s.name, color: s.color, value: s.value } as S;\n}\n\nfunction transformErrorBarSeries(\n  series: CartesianChartProps.ErrorBarSeriesOptions,\n  allSeries: readonly CartesianChartProps.SeriesOptions[],\n  stacking?: \"normal\",\n): null | CartesianChartProps.ErrorBarSeriesOptions {\n  // Highcharts only supports error bars for non-stacked series.\n  // See: https://github.com/highcharts/highcharts/issues/23080.\n  if (stacking) {\n    warnOnce(\"CartesianChart\", \"Error bars are not supported for stacked series.\");\n    return null;\n  }\n  // We only support error bars that are linked to some other series. It is only possible to link it\n  // using series ID (but not name), or by using \":previous\" pseudo-selector.\n  // See: https://api.highcharts.com/highcharts/series.errorbar.linkedTo.\n  const linkedSeries =\n    series.linkedTo === \":previous\"\n      ? allSeries[allSeries.indexOf(series) - 1]\n      : allSeries.find(({ id }) => id === series.linkedTo);\n  // The non-linked error bars are not supported: those will not appear in our custom legend and tooltip,\n  // so we remove them from the series array. We also do not support linking them to other error bars,\n  // or our custom threshold series.\n  if (!linkedSeries || [\"errorbar\", \"x-threshold\", \"y-threshold\"].includes(linkedSeries.type)) {\n    warnOnce(\n      \"CartesianChart\",\n      'The `linkedTo` property of \"errorbar\" series points to a missing, or unsupported series.',\n    );\n    return null;\n  }\n  const data = transformRangeData(series.data);\n  return { type: series.type, id: series.id, name: series.name, color: series.color, linkedTo: series.linkedTo, data };\n}\n\nfunction transformPointData(data: readonly PointDataItemType[]): readonly PointDataItemType[] {\n  return data.map((d) => (d && typeof d === \"object\" ? { x: d.x, y: d.y } : d));\n}\n\nfunction transformRangeData(data: readonly RangeDataItemOptions[]): readonly RangeDataItemOptions[] {\n  return data.map((d) => ({ x: d.x, low: d.low, high: d.high }));\n}\n\nfunction transformXAxisOptions(axis?: CartesianChartProps.XAxisOptions): CartesianChartProps.XAxisOptions {\n  return transformAxisOptions(axis);\n}\n\nfunction transformYAxisOptions(axis?: CartesianChartProps.YAxisOptions): CartesianChartProps.YAxisOptions {\n  return { ...transformAxisOptions(axis), reversedStacks: axis?.reversedStacks };\n}\n\nfunction transformAxisOptions<O extends CartesianChartProps.XAxisOptions | CartesianChartProps.YAxisOptions>(\n  axis?: O,\n): O {\n  return {\n    type: axis?.type,\n    title: axis?.title,\n    min: axis?.min,\n    max: axis?.max,\n    tickInterval: axis?.tickInterval,\n    categories: axis?.categories,\n    valueFormatter: axis?.valueFormatter,\n  } as O;\n}\n\nfunction transformTooltip(\n  tooltip?: CartesianChartProps.TooltipOptions,\n): SomeRequired<CartesianChartProps.TooltipOptions, \"enabled\" | \"placement\" | \"size\"> {\n  return {\n    ...tooltip,\n    enabled: tooltip?.enabled ?? true,\n    placement: tooltip?.placement ?? \"middle\",\n    size: tooltip?.size ?? \"medium\",\n  };\n}\n\nfunction transformLegend(\n  legend?: CartesianChartProps.LegendOptions,\n): SomeRequired<CartesianChartProps.LegendOptions, \"enabled\"> {\n  return { ...legend, enabled: legend?.enabled ?? true };\n}\n"]}

package/cartesian-chart/interfaces.d.ts

@@ -0,0 +1,166 @@
+/// <reference types="react" />
+import * as CoreTypes from "../core/interfaces";
+import { NonCancelableEventHandler } from "../internal/events";
+export interface CartesianChartProps extends CoreTypes.BaseChartOptions, CoreTypes.CoreCartesianOptions, CoreTypes.WithCartesianI18nStrings {
+    /**
+     * Inverts X and Y axes. Use it to show horizontal columns (bars).
+     * This property corresponds to [chart.inverted](https://api.highcharts.com/highcharts/chart.inverted).
+     */
+    inverted?: boolean;
+    /**
+     * Enables series stacking behavior. Use it for column- or area- series.
+     * This property corresponds to "normal" stacking type in Highcharts ([plotOptions.series.stacking](https://api.highcharts.com/highcharts/plotOptions.series.stacking)).
+     */
+    stacking?: "normal";
+    /**
+     * Defines series options of the chart.
+     * This property corresponds to [series](https://api.highcharts.com/highcharts/series), and extends it
+     * with two additional series types: "x-threshold", and "y-threshold".
+     *
+     * Supported types:
+     * * [area](https://api.highcharts.com/highcharts/series.area).
+     * * [areaspline](https://api.highcharts.com/highcharts/series.areaspline).
+     * * [column](https://api.highcharts.com/highcharts/series.column).
+     * * [errorbar](https://api.highcharts.com/highcharts/series.errorbar) - requires "highcharts/highcharts-more" module.
+     * * [line](https://api.highcharts.com/highcharts/series.line).
+     * * [scatter](https://api.highcharts.com/highcharts/series.scatter).
+     * * [spline](https://api.highcharts.com/highcharts/series.spline).
+     * * x-threshold - The line-like series to represent x-axis threshold (vertical, when `inverted=false`).
+     * * y-threshold - The line-like series to represent y-axis threshold (horizontal, when `inverted=false`).
+     */
+    series: readonly CartesianChartProps.SeriesOptions[];
+    /**
+     * Defines tooltip options of the chart, including:
+     * * `enabled` - (optional, boolean) - Hides the tooltip when set to false.
+     * * `size` - (optional, "small" | "medium" | "large") - Specifies max tooltip size.
+     * * `placement` - (optional, "middle" | "outside") - Specifies preferred tooltip placement.
+     * * `point` - (optional, function) - Customizes tooltip series point rendering.
+     * * `header` - (optional, function) - Renders a custom tooltip header.
+     * * `body` - (optional, function) - Renders a custom tooltip body.
+     * * `footer` - (optional, function) - Renders a custom tooltip footer.
+     */
+    tooltip?: CartesianChartProps.TooltipOptions;
+    /**
+     * Defines options of the chart's x axis.
+     * This property corresponds to [xAxis](https://api.highcharts.com/highcharts/xAxis), and extends it
+     * with a custom value formatter.
+     *
+     * Supported options:
+     * * `title` (optional, string) - Axis title.
+     * * `type` (optional, "linear" | "datetime" | "category" | "logarithmic") - Axis type.
+     * * * "linear" - Uses continuous proportional values scale.
+     * * * "datetime" - Similar to linear, but takes epoch time as values.
+     * * * "category" - Uses discrete scale, requires `categories` to be set.
+     * * * "logarithmic" - Uses continuous logarithmic values scale.
+     * * `min` (optional, number) - Axis min value boundary.
+     * * `max` (optional, number) - Axis max value boundary.
+     * * `tickInterval` (optional, number) - Distance between axis ticks.
+     * * `categories` (optional, Array<string>) - Predefined list of values, used for categorical axis type.
+     * * `valueFormatter` (optional, function) - Takes axis tick as input and returns a formatted string. This formatter also
+     * applies to the tooltip header.
+     */
+    xAxis?: CartesianChartProps.XAxisOptions;
+    /**
+     * Defines options of the chart's y axis.
+     * This property corresponds to [xAxis](https://api.highcharts.com/highcharts/yAxis), and extends it
+     * with a custom value formatter.
+     *
+     * Supported options:
+     * * `title` (optional, string) - Axis title.
+     * * `type` (optional, "linear" | "datetime" | "category" | "logarithmic") - Axis type.
+     * * * "linear" - Uses continuous proportional values scale.
+     * * * "datetime" - Similar to linear, but takes epoch time as values.
+     * * * "category" - Uses discrete scale, requires `categories` to be set.
+     * * * "logarithmic" - Uses continuous logarithmic values scale.
+     * * `min` (optional, number) - Axis min value boundary.
+     * * `max` (optional, number) - Axis max value boundary.
+     * * `tickInterval` (optional, number) - Distance between axis ticks.
+     * * `categories` (optional, Array<string>) - Predefined list of values, used for categorical axis type.
+     * * `reversedStacks` (optional, boolean) - Reverts series order in stacked series.
+     * * `valueFormatter` (optional, function) - Takes axis tick as input and returns a formatted string. This formatter also
+     * applies to the tooltip points values.
+     */
+    yAxis?: CartesianChartProps.YAxisOptions;
+    /**
+     * Specifies which series to show using their IDs. By default, all series are visible and managed by the component.
+     * If a series doesn't have an ID, its name is used. When using this property, manage state updates with `onVisibleSeriesChange`.
+     */
+    visibleSeries?: readonly string[];
+    /**
+     * A callback function, triggered when series visibility changes as a result of user interaction with the legend or filter.
+     */
+    onVisibleSeriesChange?: NonCancelableEventHandler<{
+        visibleSeries: string[];
+    }>;
+}
+export declare namespace CartesianChartProps {
+    export interface Ref {
+        /**
+         * Controls series visibility and works with both controlled and uncontrolled visibility modes.
+         */
+        setVisibleSeries(visibleSeries: readonly string[]): void;
+        /**
+         * Functions similarly to `setVisibleSeries`, but applies to all series and doesn't require series IDs as input.
+         * Use this when implementing clear-filter actions in no-match states.
+         */
+        showAllSeries(): void;
+    }
+    export type SeriesOptions = AreaSeriesOptions | AreaSplineSeriesOptions | ColumnSeriesOptions | ErrorBarSeriesOptions | LineSeriesOptions | ScatterSeriesOptions | SplineSeriesOptions | XThresholdSeriesOptions | YThresholdSeriesOptions;
+    export type AreaSeriesOptions = CoreTypes.AreaSeriesOptions;
+    export type AreaSplineSeriesOptions = CoreTypes.AreaSplineSeriesOptions;
+    export type ColumnSeriesOptions = CoreTypes.ColumnSeriesOptions;
+    export type ErrorBarSeriesOptions = CoreTypes.ErrorBarSeriesOptions;
+    export type LineSeriesOptions = CoreTypes.LineSeriesOptions;
+    export type ScatterSeriesOptions = CoreTypes.ScatterSeriesOptions;
+    export type SplineSeriesOptions = CoreTypes.SplineSeriesOptions;
+    export type XThresholdSeriesOptions = CoreTypes.XThresholdSeriesOptions;
+    export type YThresholdSeriesOptions = CoreTypes.YThresholdSeriesOptions;
+    interface AxisOptions {
+        title?: string;
+        type?: "linear" | "datetime" | "category" | "logarithmic";
+        min?: number;
+        max?: number;
+        tickInterval?: number;
+        categories?: string[];
+        valueFormatter?: (value: null | number) => string;
+    }
+    export type XAxisOptions = AxisOptions;
+    export interface YAxisOptions extends AxisOptions {
+        reversedStacks?: boolean;
+    }
+    export interface TooltipOptions {
+        enabled?: boolean;
+        placement?: "middle" | "outside";
+        size?: "small" | "medium" | "large";
+        point?: (props: TooltipPointRenderProps) => TooltipPointFormatted;
+        header?: (props: TooltipHeaderRenderProps) => React.ReactNode;
+        body?: (props: TooltipBodyRenderProps) => React.ReactNode;
+        footer?: (props: TooltipFooterRenderProps) => React.ReactNode;
+    }
+    export type TooltipHeaderRenderProps = TooltipSlotRenderProps;
+    export type TooltipBodyRenderProps = TooltipSlotRenderProps;
+    export type TooltipFooterRenderProps = TooltipSlotRenderProps;
+    export interface TooltipSlotRenderProps {
+        x: number;
+        items: TooltipPointItem[];
+    }
+    export interface TooltipPointRenderProps {
+        item: TooltipPointItem;
+    }
+    export interface TooltipPointItem {
+        x: number;
+        y: number | null;
+        errorRanges: {
+            low: number;
+            high: number;
+            series: CartesianChartProps.ErrorBarSeriesOptions;
+        }[];
+        series: NonErrorBarSeriesOptions;
+    }
+    export type TooltipPointFormatted = CoreTypes.BaseTooltipPointFormatted;
+    export type LegendOptions = CoreTypes.BaseLegendOptions;
+    export type FilterOptions = CoreTypes.BaseFilterOptions;
+    export type NoDataOptions = CoreTypes.BaseNoDataOptions;
+    export {};
+}
+export type NonErrorBarSeriesOptions = Exclude<CartesianChartProps.SeriesOptions, CartesianChartProps.ErrorBarSeriesOptions>;

package/cartesian-chart/interfaces.js

@@ -0,0 +1,4 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+export {};
+//# sourceMappingURL=interfaces.js.map

package/cartesian-chart/interfaces.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/cartesian-chart/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport * as CoreTypes from \"../core/interfaces\";\nimport { NonCancelableEventHandler } from \"../internal/events\";\n\n// CartesianChartProps is the type for CartesianChart React component properties. Unlike in Highcharts API,\n// we pass options directly to the component, instead of grouping them all into a single \"options\" property.\n// We do still organize related options in groups, e.g.: \"SeriesOptions\", \"TooltipOptions\".\nexport interface CartesianChartProps\n  extends CoreTypes.BaseChartOptions,\n    CoreTypes.CoreCartesianOptions,\n    CoreTypes.WithCartesianI18nStrings {\n  /**\n   * Inverts X and Y axes. Use it to show horizontal columns (bars).\n   * This property corresponds to [chart.inverted](https://api.highcharts.com/highcharts/chart.inverted).\n   */\n  inverted?: boolean;\n\n  /**\n   * Enables series stacking behavior. Use it for column- or area- series.\n   * This property corresponds to \"normal\" stacking type in Highcharts ([plotOptions.series.stacking](https://api.highcharts.com/highcharts/plotOptions.series.stacking)).\n   */\n  stacking?: \"normal\";\n\n  /**\n   * Defines series options of the chart.\n   * This property corresponds to [series](https://api.highcharts.com/highcharts/series), and extends it\n   * with two additional series types: \"x-threshold\", and \"y-threshold\".\n   *\n   * Supported types:\n   * * [area](https://api.highcharts.com/highcharts/series.area).\n   * * [areaspline](https://api.highcharts.com/highcharts/series.areaspline).\n   * * [column](https://api.highcharts.com/highcharts/series.column).\n   * * [errorbar](https://api.highcharts.com/highcharts/series.errorbar) - requires \"highcharts/highcharts-more\" module.\n   * * [line](https://api.highcharts.com/highcharts/series.line).\n   * * [scatter](https://api.highcharts.com/highcharts/series.scatter).\n   * * [spline](https://api.highcharts.com/highcharts/series.spline).\n   * * x-threshold - The line-like series to represent x-axis threshold (vertical, when `inverted=false`).\n   * * y-threshold - The line-like series to represent y-axis threshold (horizontal, when `inverted=false`).\n   */\n  series: readonly CartesianChartProps.SeriesOptions[];\n\n  /**\n   * Defines tooltip options of the chart, including:\n   * * `enabled` - (optional, boolean) - Hides the tooltip when set to false.\n   * * `size` - (optional, \"small\" | \"medium\" | \"large\") - Specifies max tooltip size.\n   * * `placement` - (optional, \"middle\" | \"outside\") - Specifies preferred tooltip placement.\n   * * `point` - (optional, function) - Customizes tooltip series point rendering.\n   * * `header` - (optional, function) - Renders a custom tooltip header.\n   * * `body` - (optional, function) - Renders a custom tooltip body.\n   * * `footer` - (optional, function) - Renders a custom tooltip footer.\n   */\n  tooltip?: CartesianChartProps.TooltipOptions;\n\n  /**\n   * Defines options of the chart's x axis.\n   * This property corresponds to [xAxis](https://api.highcharts.com/highcharts/xAxis), and extends it\n   * with a custom value formatter.\n   *\n   * Supported options:\n   * * `title` (optional, string) - Axis title.\n   * * `type` (optional, \"linear\" | \"datetime\" | \"category\" | \"logarithmic\") - Axis type.\n   * * * \"linear\" - Uses continuous proportional values scale.\n   * * * \"datetime\" - Similar to linear, but takes epoch time as values.\n   * * * \"category\" - Uses discrete scale, requires `categories` to be set.\n   * * * \"logarithmic\" - Uses continuous logarithmic values scale.\n   * * `min` (optional, number) - Axis min value boundary.\n   * * `max` (optional, number) - Axis max value boundary.\n   * * `tickInterval` (optional, number) - Distance between axis ticks.\n   * * `categories` (optional, Array<string>) - Predefined list of values, used for categorical axis type.\n   * * `valueFormatter` (optional, function) - Takes axis tick as input and returns a formatted string. This formatter also\n   * applies to the tooltip header.\n   */\n  xAxis?: CartesianChartProps.XAxisOptions;\n\n  /**\n   * Defines options of the chart's y axis.\n   * This property corresponds to [xAxis](https://api.highcharts.com/highcharts/yAxis), and extends it\n   * with a custom value formatter.\n   *\n   * Supported options:\n   * * `title` (optional, string) - Axis title.\n   * * `type` (optional, \"linear\" | \"datetime\" | \"category\" | \"logarithmic\") - Axis type.\n   * * * \"linear\" - Uses continuous proportional values scale.\n   * * * \"datetime\" - Similar to linear, but takes epoch time as values.\n   * * * \"category\" - Uses discrete scale, requires `categories` to be set.\n   * * * \"logarithmic\" - Uses continuous logarithmic values scale.\n   * * `min` (optional, number) - Axis min value boundary.\n   * * `max` (optional, number) - Axis max value boundary.\n   * * `tickInterval` (optional, number) - Distance between axis ticks.\n   * * `categories` (optional, Array<string>) - Predefined list of values, used for categorical axis type.\n   * * `reversedStacks` (optional, boolean) - Reverts series order in stacked series.\n   * * `valueFormatter` (optional, function) - Takes axis tick as input and returns a formatted string. This formatter also\n   * applies to the tooltip points values.\n   */\n  yAxis?: CartesianChartProps.YAxisOptions;\n\n  /**\n   * Specifies which series to show using their IDs. By default, all series are visible and managed by the component.\n   * If a series doesn't have an ID, its name is used. When using this property, manage state updates with `onVisibleSeriesChange`.\n   */\n  visibleSeries?: readonly string[];\n\n  /**\n   * A callback function, triggered when series visibility changes as a result of user interaction with the legend or filter.\n   */\n  onVisibleSeriesChange?: NonCancelableEventHandler<{ visibleSeries: string[] }>;\n}\n\nexport namespace CartesianChartProps {\n  export interface Ref {\n    /**\n     * Controls series visibility and works with both controlled and uncontrolled visibility modes.\n     */\n    setVisibleSeries(visibleSeries: readonly string[]): void;\n    /**\n     * Functions similarly to `setVisibleSeries`, but applies to all series and doesn't require series IDs as input.\n     * Use this when implementing clear-filter actions in no-match states.\n     */\n    showAllSeries(): void;\n  }\n\n  export type SeriesOptions =\n    | AreaSeriesOptions\n    | AreaSplineSeriesOptions\n    | ColumnSeriesOptions\n    | ErrorBarSeriesOptions\n    | LineSeriesOptions\n    | ScatterSeriesOptions\n    | SplineSeriesOptions\n    | XThresholdSeriesOptions\n    | YThresholdSeriesOptions;\n\n  export type AreaSeriesOptions = CoreTypes.AreaSeriesOptions;\n  export type AreaSplineSeriesOptions = CoreTypes.AreaSplineSeriesOptions;\n  export type ColumnSeriesOptions = CoreTypes.ColumnSeriesOptions;\n  export type ErrorBarSeriesOptions = CoreTypes.ErrorBarSeriesOptions;\n  export type LineSeriesOptions = CoreTypes.LineSeriesOptions;\n  export type ScatterSeriesOptions = CoreTypes.ScatterSeriesOptions;\n  export type SplineSeriesOptions = CoreTypes.SplineSeriesOptions;\n  export type XThresholdSeriesOptions = CoreTypes.XThresholdSeriesOptions;\n  export type YThresholdSeriesOptions = CoreTypes.YThresholdSeriesOptions;\n\n  interface AxisOptions {\n    title?: string;\n    type?: \"linear\" | \"datetime\" | \"category\" | \"logarithmic\";\n    min?: number;\n    max?: number;\n    tickInterval?: number;\n    categories?: string[];\n    valueFormatter?: (value: null | number) => string;\n  }\n\n  export type XAxisOptions = AxisOptions;\n\n  export interface YAxisOptions extends AxisOptions {\n    reversedStacks?: boolean;\n  }\n\n  export interface TooltipOptions {\n    enabled?: boolean;\n    placement?: \"middle\" | \"outside\";\n    size?: \"small\" | \"medium\" | \"large\";\n    point?: (props: TooltipPointRenderProps) => TooltipPointFormatted;\n    header?: (props: TooltipHeaderRenderProps) => React.ReactNode;\n    body?: (props: TooltipBodyRenderProps) => React.ReactNode;\n    footer?: (props: TooltipFooterRenderProps) => React.ReactNode;\n  }\n  export type TooltipHeaderRenderProps = TooltipSlotRenderProps;\n  export type TooltipBodyRenderProps = TooltipSlotRenderProps;\n  export type TooltipFooterRenderProps = TooltipSlotRenderProps;\n  export interface TooltipSlotRenderProps {\n    x: number;\n    items: TooltipPointItem[];\n  }\n  export interface TooltipPointRenderProps {\n    item: TooltipPointItem;\n  }\n  export interface TooltipPointItem {\n    x: number;\n    y: number | null;\n    errorRanges: { low: number; high: number; series: CartesianChartProps.ErrorBarSeriesOptions }[];\n    series: NonErrorBarSeriesOptions;\n  }\n  export type TooltipPointFormatted = CoreTypes.BaseTooltipPointFormatted;\n\n  export type LegendOptions = CoreTypes.BaseLegendOptions;\n\n  export type FilterOptions = CoreTypes.BaseFilterOptions;\n\n  export type NoDataOptions = CoreTypes.BaseNoDataOptions;\n}\n\n// Internal types\n\nexport type NonErrorBarSeriesOptions = Exclude<\n  CartesianChartProps.SeriesOptions,\n  CartesianChartProps.ErrorBarSeriesOptions\n>;\n"]}

package/cartesian-chart/test-classes/styles.css.js

@@ -0,0 +1,6 @@
+
+    import './styles.scoped.css';
+    export default {
+  "root": "awsui_root_1rzjv_im8v7_5"
+};
+  

package/cartesian-chart/test-classes/styles.scoped.css

@@ -0,0 +1,7 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+.awsui_root_1rzjv_im8v7_5:not(#\9) {
+  /* used in test-utils */
+}

package/cartesian-chart/test-classes/styles.selectors.js

@@ -0,0 +1,7 @@
+
+    // es-module interop with Babel and Typescript
+    Object.defineProperty(exports, "__esModule", { value: true });
+    module.exports.default = {
+  "root": "awsui_root_1rzjv_im8v7_5"
+};
+  

package/core/chart-api/chart-extra-axis-titles.d.ts

@@ -0,0 +1,10 @@
+import AsyncStore from "../../internal/utils/async-store";
+import { ChartExtraContext } from "./chart-extra-context";
+export interface ReactiveAxisTitlesState {
+    verticalAxesTitles: readonly string[];
+}
+export declare class ChartExtraAxisTitles extends AsyncStore<ReactiveAxisTitlesState> {
+    private context;
+    constructor(context: ChartExtraContext);
+    onChartRender: () => void;
+}

package/core/chart-api/chart-extra-axis-titles.js

@@ -0,0 +1,42 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import AsyncStore from "../../internal/utils/async-store";
+import { getChartSeries } from "../../internal/utils/chart-series";
+import { castArray, isEqualArrays } from "../../internal/utils/utils";
+// Chart helper to fetch chart vertical axis labels for them to be rendered in a slot above the chart.
+// See: https://github.com/highcharts/highcharts/issues/23174.
+export class ChartExtraAxisTitles extends AsyncStore {
+    constructor(context) {
+        super({ verticalAxesTitles: [] });
+        this.onChartRender = () => {
+            const nextTitles = getVerticalAxesTitles(this.context.chart());
+            const currentTitles = this.get().verticalAxesTitles;
+            if (!isEqualArrays(currentTitles, nextTitles, (s1, s2) => s1 === s2)) {
+                this.set(() => ({ verticalAxesTitles: nextTitles }));
+            }
+        };
+        this.context = context;
+    }
+}
+function getVerticalAxesTitles(chart) {
+    var _a, _b, _c;
+    const isInverted = !!((_a = chart.options.chart) === null || _a === void 0 ? void 0 : _a.inverted);
+    const hasSeries = getChartSeries(chart.series).filter((s) => s.type !== "pie").length > 0;
+    // We extract multiple titles as there can be multiple axes. This supports up to 2 axes by
+    // using space-between placement of the labels in the corresponding component.
+    let titles = [];
+    if (hasSeries && isInverted) {
+        titles = ((_b = castArray(chart.options.xAxis)) !== null && _b !== void 0 ? _b : [])
+            .filter((axis) => axis.visible)
+            .map((axis) => { var _a, _b; return (_b = (_a = axis.title) === null || _a === void 0 ? void 0 : _a.text) !== null && _b !== void 0 ? _b : ""; })
+            .filter(Boolean);
+    }
+    if (hasSeries && !isInverted) {
+        titles = ((_c = castArray(chart.options.yAxis)) !== null && _c !== void 0 ? _c : [])
+            .filter((axis) => axis.visible)
+            .map((axis) => { var _a, _b; return (_b = (_a = axis.title) === null || _a === void 0 ? void 0 : _a.text) !== null && _b !== void 0 ? _b : ""; })
+            .filter(Boolean);
+    }
+    return titles;
+}
+//# sourceMappingURL=chart-extra-axis-titles.js.map

package/core/chart-api/chart-extra-axis-titles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-extra-axis-titles.js","sourceRoot":"","sources":["../../../../src/core/chart-api/chart-extra-axis-titles.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,UAAU,MAAM,kCAAkC,CAAC;AAC1D,OAAO,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAQtE,sGAAsG;AACtG,8DAA8D;AAC9D,MAAM,OAAO,oBAAqB,SAAQ,UAAmC;IAE3E,YAAY,OAA0B;QACpC,KAAK,CAAC,EAAE,kBAAkB,EAAE,EAAE,EAAE,CAAC,CAAC;QAI7B,kBAAa,GAAG,GAAG,EAAE;YAC1B,MAAM,UAAU,GAAG,qBAAqB,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC;YAC/D,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC;YACpD,IAAI,CAAC,aAAa,CAAC,aAAa,EAAE,UAAU,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE;gBACpE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,kBAAkB,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC;aACtD;QACH,CAAC,CAAC;QATA,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;IACzB,CAAC;CASF;AAED,SAAS,qBAAqB,CAAC,KAAuB;;IACpD,MAAM,UAAU,GAAG,CAAC,CAAC,CAAA,MAAA,KAAK,CAAC,OAAO,CAAC,KAAK,0CAAE,QAAQ,CAAA,CAAC;IACnD,MAAM,SAAS,GAAG,cAAc,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,KAAK,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IAE1F,0FAA0F;IAC1F,8EAA8E;IAC9E,IAAI,MAAM,GAAa,EAAE,CAAC;IAC1B,IAAI,SAAS,IAAI,UAAU,EAAE;QAC3B,MAAM,GAAG,CAAC,MAAA,SAAS,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,mCAAI,EAAE,CAAC;aAC5C,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC;aAC9B,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,eAAC,OAAA,MAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,IAAI,mCAAI,EAAE,CAAA,EAAA,CAAC;aACrC,MAAM,CAAC,OAAO,CAAC,CAAC;KACpB;IACD,IAAI,SAAS,IAAI,CAAC,UAAU,EAAE;QAC5B,MAAM,GAAG,CAAC,MAAA,SAAS,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,mCAAI,EAAE,CAAC;aAC5C,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC;aAC9B,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,eAAC,OAAA,MAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,IAAI,mCAAI,EAAE,CAAA,EAAA,CAAC;aACrC,MAAM,CAAC,OAAO,CAAC,CAAC;KACpB;IACD,OAAO,MAAM,CAAC;AAChB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport AsyncStore from \"../../internal/utils/async-store\";\nimport { getChartSeries } from \"../../internal/utils/chart-series\";\nimport { castArray, isEqualArrays } from \"../../internal/utils/utils\";\nimport { ChartExtraContext } from \"./chart-extra-context\";\n\n// The reactive state is used to propagate changes to the corresponding vertical axis titles React component.\nexport interface ReactiveAxisTitlesState {\n  verticalAxesTitles: readonly string[];\n}\n\n// Chart helper to fetch chart vertical axis labels for them to be rendered in a slot above the chart.\n// See: https://github.com/highcharts/highcharts/issues/23174.\nexport class ChartExtraAxisTitles extends AsyncStore<ReactiveAxisTitlesState> {\n  private context: ChartExtraContext;\n  constructor(context: ChartExtraContext) {\n    super({ verticalAxesTitles: [] });\n    this.context = context;\n  }\n\n  public onChartRender = () => {\n    const nextTitles = getVerticalAxesTitles(this.context.chart());\n    const currentTitles = this.get().verticalAxesTitles;\n    if (!isEqualArrays(currentTitles, nextTitles, (s1, s2) => s1 === s2)) {\n      this.set(() => ({ verticalAxesTitles: nextTitles }));\n    }\n  };\n}\n\nfunction getVerticalAxesTitles(chart: Highcharts.Chart) {\n  const isInverted = !!chart.options.chart?.inverted;\n  const hasSeries = getChartSeries(chart.series).filter((s) => s.type !== \"pie\").length > 0;\n\n  // We extract multiple titles as there can be multiple axes. This supports up to 2 axes by\n  // using space-between placement of the labels in the corresponding component.\n  let titles: string[] = [];\n  if (hasSeries && isInverted) {\n    titles = (castArray(chart.options.xAxis) ?? [])\n      .filter((axis) => axis.visible)\n      .map((axis) => axis.title?.text ?? \"\")\n      .filter(Boolean);\n  }\n  if (hasSeries && !isInverted) {\n    titles = (castArray(chart.options.yAxis) ?? [])\n      .filter((axis) => axis.visible)\n      .map((axis) => axis.title?.text ?? \"\")\n      .filter(Boolean);\n  }\n  return titles;\n}\n"]}

package/core/chart-api/chart-extra-context.d.ts

@@ -0,0 +1,41 @@
+import type Highcharts from "highcharts";
+import { NonCancelableEventHandler } from "../../internal/events";
+import { ChartLabels } from "../i18n-utils";
+import { CoreChartProps, Rect } from "../interfaces";
+export interface ChartExtraContext {
+    settings: ChartExtraContext.Settings;
+    handlers: ChartExtraContext.Handlers;
+    state: ChartExtraContext.State;
+    derived: ChartExtraContext.DerivedState;
+    chartOrNull: null | Highcharts.Chart;
+    chart: () => Highcharts.Chart;
+}
+export declare namespace ChartExtraContext {
+    interface Settings {
+        chartId: string;
+        noDataEnabled: boolean;
+        legendEnabled: boolean;
+        tooltipEnabled: boolean;
+        keyboardNavigationEnabled: boolean;
+        labels: ChartLabels;
+    }
+    interface Handlers {
+        onHighlight?: NonCancelableEventHandler<CoreChartProps.HighlightChangeDetail>;
+        onClearHighlight?: NonCancelableEventHandler<CoreChartProps.HighlightClearDetail>;
+        onVisibleItemsChange?: NonCancelableEventHandler<CoreChartProps.VisibleItemsChangeDetail>;
+    }
+    interface State {
+        visibleItems?: readonly string[];
+    }
+    interface DerivedState {
+        allX: number[];
+        getAllXInSeries: (series: Highcharts.Series) => number[];
+        getPointsByX: (x: number) => Highcharts.Point[];
+        groupRects: {
+            group: Highcharts.Point[];
+            rect: Rect;
+        }[];
+    }
+}
+export declare function createChartContext(): ChartExtraContext;
+export declare function updateChartContext(context: ChartExtraContext, chart: Highcharts.Chart): void;

package/core/chart-api/chart-extra-context.js

@@ -0,0 +1,93 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import { getChartSeries } from "../../internal/utils/chart-series";
+import { getSeriesData } from "../../internal/utils/series-data";
+import { getGroupRect, isSeriesStacked } from "../utils";
+// The context is created when the chart component is rendered for the first time.
+// On every subsequent render the settings and state are updated directly in the context object.
+export function createChartContext() {
+    return {
+        settings: {
+            chartId: "",
+            noDataEnabled: false,
+            legendEnabled: false,
+            tooltipEnabled: false,
+            keyboardNavigationEnabled: false,
+            labels: {},
+        },
+        handlers: {},
+        state: {},
+        chart: () => {
+            // Before the first chart render there is no chart instance, which is required for most of the utilities.
+            // Instead of doing null checks in each utility, an attempt to access the chart instance before it is ready
+            // will cause an exception, indicating an logical error in the code.
+            throw new Error("Invariant violation: using chart API before initialization.");
+        },
+        chartOrNull: null,
+        derived: { allX: [], getAllXInSeries: () => [], getPointsByX: () => [], groupRects: [] },
+    };
+}
+// The update method is called on every chart render, before any other initialization code.
+// This ensures the context state is up to date and can be used for subsequent computations.
+export function updateChartContext(context, chart) {
+    context.chart = () => chart;
+    context.chartOrNull = chart;
+    context.derived = computeDerivedState(chart);
+}
+function computeDerivedState(chart) {
+    const allXSet = new Set();
+    const allXInSeries = new WeakMap();
+    const pointsByX = new Map();
+    const getXPoints = (x) => { var _a; return (_a = pointsByX.get(x)) !== null && _a !== void 0 ? _a : []; };
+    const addPoint = (point) => {
+        const xPoints = getXPoints(point.x);
+        xPoints.push(point);
+        pointsByX.set(point.x, xPoints);
+    };
+    const compareX = (a, b) => a - b;
+    for (const s of getChartSeries(chart.series)) {
+        const seriesX = new Set();
+        if (s.visible) {
+            for (const d of getSeriesData(s.data)) {
+                // Points with y=null represent the absence of value, there is no need to include them and those
+                // should have no impact on computed rects or navigation.
+                // Although "d" can't be undefined according to Highcharts API, it does become undefined for chart containing more datapoints
+                // than the cropThreshold for that series (specific cases of re-rendering the chart with updated options listening to setExteme updates)
+                if (d.visible && d.y !== null) {
+                    seriesX.add(d.x);
+                    allXSet.add(d.x);
+                    addPoint(d);
+                }
+            }
+        }
+        allXInSeries.set(s, Array.from(seriesX).sort(compareX));
+    }
+    for (const [, points] of pointsByX) {
+        sortPoints(points);
+    }
+    const allX = Array.from(allXSet).sort(compareX);
+    return {
+        allX,
+        getAllXInSeries: (s) => { var _a; return (_a = allXInSeries.get(s)) !== null && _a !== void 0 ? _a : []; },
+        getPointsByX: (x) => { var _a; return (_a = pointsByX.get(x)) !== null && _a !== void 0 ? _a : []; },
+        // Group rects are computed for every available x coordinate, each including at least one point with matching x value.
+        // They enclose all matching points of the group and are used to match hover position and place the tooltip or focus outline.
+        groupRects: allX.map((x) => ({
+            group: getXPoints(x),
+            rect: getGroupRect(getXPoints(x)),
+        })),
+    };
+}
+// The points are sorted to ensure consistent navigation, including inverted chart orientation.
+// The order of series in grouped column charts is kept, while stacked series are sorted by their
+// respective positions in the plot.
+function sortPoints(group) {
+    var _a, _b;
+    const reversed = !!((_b = (_a = group[0]) === null || _a === void 0 ? void 0 : _a.series.yAxis) === null || _b === void 0 ? void 0 : _b.reversed);
+    group.sort((a, b) => {
+        const ay = a.plotY === undefined || (a.series.type === "column" && !isSeriesStacked(a.series)) ? 0 : a.plotY;
+        const by = b.plotY === undefined || (b.series.type === "column" && !isSeriesStacked(b.series)) ? 0 : b.plotY;
+        return !reversed ? ay - by : by - ay;
+    });
+}
+//# sourceMappingURL=chart-extra-context.js.map

package/core/chart-api/chart-extra-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-extra-context.js","sourceRoot":"","sources":["../../../../src/core/chart-api/chart-extra-context.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport type Highcharts from \"highcharts\";\n\nimport { NonCancelableEventHandler } from \"../../internal/events\";\nimport { getChartSeries } from \"../../internal/utils/chart-series\";\nimport { getSeriesData } from \"../../internal/utils/series-data\";\nimport { ChartLabels } from \"../i18n-utils\";\nimport { CoreChartProps, Rect } from \"../interfaces\";\nimport { getGroupRect, isSeriesStacked } from \"../utils\";\n\n// Chart API context is used for dependency injection for chart utilities.\n// It is initialized on chart render, and includes the chart instance, consumer\n// settings and state, and derived state, which is computed from the chart instance\n// on each render, and reused across utilities to avoid duplicate work.\n\nexport interface ChartExtraContext {\n  settings: ChartExtraContext.Settings;\n  handlers: ChartExtraContext.Handlers;\n  state: ChartExtraContext.State;\n  derived: ChartExtraContext.DerivedState;\n  chartOrNull: null | Highcharts.Chart;\n  chart: () => Highcharts.Chart;\n}\n\nexport namespace ChartExtraContext {\n  export interface Settings {\n    chartId: string;\n    noDataEnabled: boolean;\n    legendEnabled: boolean;\n    tooltipEnabled: boolean;\n    keyboardNavigationEnabled: boolean;\n    labels: ChartLabels;\n  }\n\n  export interface Handlers {\n    onHighlight?: NonCancelableEventHandler<CoreChartProps.HighlightChangeDetail>;\n    onClearHighlight?: NonCancelableEventHandler<CoreChartProps.HighlightClearDetail>;\n    onVisibleItemsChange?: NonCancelableEventHandler<CoreChartProps.VisibleItemsChangeDetail>;\n  }\n\n  export interface State {\n    visibleItems?: readonly string[];\n  }\n\n  export interface DerivedState {\n    allX: number[];\n    getAllXInSeries: (series: Highcharts.Series) => number[];\n    getPointsByX: (x: number) => Highcharts.Point[];\n    groupRects: { group: Highcharts.Point[]; rect: Rect }[];\n  }\n}\n\n// The context is created when the chart component is rendered for the first time.\n// On every subsequent render the settings and state are updated directly in the context object.\nexport function createChartContext(): ChartExtraContext {\n  return {\n    settings: {\n      chartId: \"\",\n      noDataEnabled: false,\n      legendEnabled: false,\n      tooltipEnabled: false,\n      keyboardNavigationEnabled: false,\n      labels: {},\n    },\n    handlers: {},\n    state: {},\n    chart: () => {\n      // Before the first chart render there is no chart instance, which is required for most of the utilities.\n      // Instead of doing null checks in each utility, an attempt to access the chart instance before it is ready\n      // will cause an exception, indicating an logical error in the code.\n      throw new Error(\"Invariant violation: using chart API before initialization.\");\n    },\n    chartOrNull: null,\n    derived: { allX: [], getAllXInSeries: () => [], getPointsByX: () => [], groupRects: [] },\n  };\n}\n\n// The update method is called on every chart render, before any other initialization code.\n// This ensures the context state is up to date and can be used for subsequent computations.\nexport function updateChartContext(context: ChartExtraContext, chart: Highcharts.Chart) {\n  context.chart = () => chart;\n  context.chartOrNull = chart;\n  context.derived = computeDerivedState(chart);\n}\n\nfunction computeDerivedState(chart: Highcharts.Chart): ChartExtraContext.DerivedState {\n  const allXSet = new Set<number>();\n  const allXInSeries = new WeakMap<Highcharts.Series, number[]>();\n  const pointsByX = new Map<number, Highcharts.Point[]>();\n  const getXPoints = (x: number) => pointsByX.get(x) ?? [];\n  const addPoint = (point: Highcharts.Point) => {\n    const xPoints = getXPoints(point.x);\n    xPoints.push(point);\n    pointsByX.set(point.x, xPoints);\n  };\n  const compareX = (a: number, b: number) => a - b;\n\n  for (const s of getChartSeries(chart.series)) {\n    const seriesX = new Set<number>();\n    if (s.visible) {\n      for (const d of getSeriesData(s.data)) {\n        // Points with y=null represent the absence of value, there is no need to include them and those\n        // should have no impact on computed rects or navigation.\n\n        // Although \"d\" can't be undefined according to Highcharts API, it does become undefined for chart containing more datapoints\n        // than the cropThreshold for that series (specific cases of re-rendering the chart with updated options listening to setExteme updates)\n        if (d.visible && d.y !== null) {\n          seriesX.add(d.x);\n          allXSet.add(d.x);\n          addPoint(d);\n        }\n      }\n    }\n    allXInSeries.set(s, Array.from(seriesX).sort(compareX));\n  }\n  for (const [, points] of pointsByX) {\n    sortPoints(points);\n  }\n  const allX = Array.from(allXSet).sort(compareX);\n  return {\n    allX,\n    getAllXInSeries: (s) => allXInSeries.get(s) ?? [],\n    getPointsByX: (x) => pointsByX.get(x) ?? [],\n    // Group rects are computed for every available x coordinate, each including at least one point with matching x value.\n    // They enclose all matching points of the group and are used to match hover position and place the tooltip or focus outline.\n    groupRects: allX.map((x) => ({\n      group: getXPoints(x),\n      rect: getGroupRect(getXPoints(x)),\n    })),\n  };\n}\n\n// The points are sorted to ensure consistent navigation, including inverted chart orientation.\n// The order of series in grouped column charts is kept, while stacked series are sorted by their\n// respective positions in the plot.\nfunction sortPoints(group: Highcharts.Point[]) {\n  const reversed = !!group[0]?.series.yAxis?.reversed;\n  group.sort((a, b) => {\n    const ay = a.plotY === undefined || (a.series.type === \"column\" && !isSeriesStacked(a.series)) ? 0 : a.plotY;\n    const by = b.plotY === undefined || (b.series.type === \"column\" && !isSeriesStacked(b.series)) ? 0 : b.plotY;\n    return !reversed ? ay - by : by - ay;\n  });\n}\n"]}

package/core/chart-api/chart-extra-highlight.d.ts

@@ -0,0 +1,20 @@
+import type Highcharts from "highcharts";
+import { ChartExtraContext } from "./chart-extra-context";
+export declare class ChartExtraHighlight {
+    private context;
+    constructor(context: ChartExtraContext);
+    private seriesState;
+    private pointState;
+    onChartRender(): void;
+    highlightChartItems: (itemIds: readonly string[]) => void;
+    highlightChartGroup: (points: readonly Highcharts.Point[]) => void;
+    highlightChartPoint: (point: Highcharts.Point) => void;
+    clearChartItemsHighlight: () => void;
+    private setSeriesState;
+    private setPointState;
+    private restoreHighlightState;
+    private updateStoredSeriesState;
+    private updateStoredPointState;
+    private getPointKey;
+    private overrideStateSetters;
+}