@dynatrace/strato-components 3.11.3 → 3.12.0

package/esm/charts/single-value/SingleValue.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/single-value/SingleValue.css.ts"],
-  "sourcesContent": ["import './SingleValue.css';\nexport var container = '_1sfgzlg0-3-11-3';"],
+  "sourcesContent": ["import './SingleValue.css';\nexport var container = '_1sfgzlg0-3-12-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,YAAY;",
   "names": []
 }

package/esm/charts/single-value-grid/SingleValueGrid.css

@@ -1,7 +1,7 @@
-._1mx9zjb0-3-11-3 {
+._1mx9zjb0-3-12-0 {
   height: 100%;
   width: 100%;
 }
-._1mx9zjb0-3-11-3 > div {
+._1mx9zjb0-3-12-0 > div {
   overflow: hidden;
 }

package/esm/charts/single-value-grid/SingleValueGrid.js

@@ -36,7 +36,9 @@ const SingleValueGridRoot = (props) => {
     "data-dtrum-allow": dataDtrumAllow,
     "data-testid": dataTestId,
     "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
     "aria-describedby": ariaDescribedBy,
+    "aria-details": ariaDetails,
     seriesActions: individualSeriesActions,
     ...gridConfig
   } = props;
@@ -120,7 +122,9 @@ const SingleValueGridRoot = (props) => {
                     },
                     role: "img",
                     "aria-label": ariaLabel ?? SINGLE_VALUE_GRID_ARIA_LABEL,
+                    "aria-labelledby": ariaLabelledBy,
                     "aria-describedby": ariaDescribedBy,
+                    "aria-details": ariaDetails,
                     children: [
                       gridItems.map((record, index) => /* @__PURE__ */ jsx(
                         SingleValueDisplay,

package/esm/charts/single-value-grid/SingleValueGrid.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/single-value-grid/SingleValueGrid.tsx"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport { type PropsWithChildren } from 'react';\n\nimport { GlobalFontSizeVariables } from './components/GlobalFontSizeVariables.js';\nimport { SingleValueDisplay } from './components/SingleValueDisplay.js';\nimport { DISPLAY_NAME, SINGLE_VALUE_GRID_ARIA_LABEL } from './defaults.js';\nimport { useLabelCount } from './hooks/use-label-count.js';\nimport { GlobalFontSizeProvider } from './providers/global-font-size-provider.js';\nimport { gridRows } from './SingleValueGrid.sty.js';\nimport { Sparkline } from './slots/Sparkline.js';\nimport { SingleValueGridToolbarSlot } from './slots/Toolbar.js';\nimport { Trend } from './slots/Trend.js';\nimport { Value } from './slots/Value.js';\nimport type {\n  SingleValueGridAccessorsConfig,\n  SingleValueGridProps,\n} from './types/single-value-grid.js';\nimport { calculateGridLayout } from './utils/calculate-grid-layout.js';\nimport { iterateSlots } from './utils/iterate-slots.js';\nimport { useBehavioralTrackingProps } from '../../core/hooks/useBehavioralTrackingProps.js';\nimport { Intent } from '../../core/slots/Intent/Intent.js';\nimport { Flex } from '../../layouts/flex/Flex.js';\nimport { Grid } from '../../layouts/grid/Grid.js';\nimport { ChartStateHandler } from '../core/components/chart-states/ChartStateHandler.js';\nimport { SingleValueToolbar } from '../core/components/single-value-renderer/components/SingleValueToolbar.js';\nimport { useThrottledResizeObserver } from '../core/hooks/useThrottledResizeObserver.js';\nimport { ColorRule } from '../core/slots/ColorRule.js';\n\nconst COMPONENT_NAME = 'SingleValueGrid';\n\nconst SingleValueGridRoot = (\n  props: PropsWithChildren<SingleValueGridProps>,\n) => {\n  const {\n    loading,\n    data,\n    children,\n    colorAccessor,\n    labelAccessor,\n    prefixIconAccessor,\n    applyThresholdBackground,\n    style: consumerStyle,\n    className: consumerClassName,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    'data-testid': dataTestId,\n    'aria-label': ariaLabel,\n    'aria-describedby': ariaDescribedBy,\n    seriesActions: individualSeriesActions,\n    ...gridConfig\n  } = props;\n\n  const [behavioralTrackingProps] = useBehavioralTrackingProps(props);\n\n  const labelCount = useLabelCount(data, labelAccessor);\n\n  const { accessors: slotAccessors, ...slotsConfig } = iterateSlots(\n    children,\n    props,\n  );\n\n  const trendCount = slotsConfig.trend !== undefined ? data.length : 0;\n\n  const accessors: SingleValueGridAccessorsConfig = {\n    colorAccessor,\n    labelAccessor,\n    prefixIconAccessor,\n    ...slotAccessors,\n  };\n\n  const propsConfig = {\n    ...gridConfig,\n    ...slotsConfig,\n    applyThresholdBackground,\n  };\n\n  const { height = 0, width = 0, refCallback } = useThrottledResizeObserver();\n\n  const { rowCount, columnCount, lastRowColumnCount, gap } =\n    calculateGridLayout(width, height, data.length);\n\n  const gridItems = data.slice(0, data.length - lastRowColumnCount);\n  const lastRowItems = data.slice(-lastRowColumnCount);\n  const { intents, toolbar } = propsConfig;\n  const displayingGridToolbar = !intents.single;\n\n  return (\n    <div\n      {...behavioralTrackingProps}\n      ref={refCallback}\n      style={{\n        ...consumerStyle,\n      }}\n      className={clsx(gridRows)}\n    >\n      <ChartStateHandler\n        height={height}\n        isLoading={!!loading}\n        data-dtrum-mask={dataDtrumMask}\n        data-dtrum-allow={dataDtrumAllow}\n        style={consumerStyle}\n        className={consumerClassName}\n        empty={false}\n        emptyState={undefined}\n        errorState={undefined}\n      >\n        {/* Empty children as the loader overlay will be shown */}\n        <GlobalFontSizeProvider\n          valueCount={data.length}\n          labelCount={labelCount}\n          trendCount={trendCount}\n        >\n          <GlobalFontSizeVariables>\n            {displayingGridToolbar ? (\n              <SingleValueToolbar\n                parentHeight={height}\n                intents={displayingGridToolbar ? intents.grid : []}\n                placement={toolbar.placement}\n                hidden={toolbar.hidden}\n              />\n            ) : null}\n\n            <Grid\n              className={clsx(gridRows, consumerClassName)}\n              data-dtrum-mask={dataDtrumMask}\n              data-dtrum-allow={dataDtrumAllow}\n              data-testid={dataTestId}\n              data-dt-component={COMPONENT_NAME}\n              gridTemplateRows={`repeat(${rowCount}, 1fr)`}\n              gridTemplateColumns={`repeat(${columnCount}, 1fr)`}\n              style={{\n                ...consumerStyle,\n                // Explicitly set this one via the style, as the `gridGap` settable via the\n                // props on the `Grid` component needs to be a valid spacing token\n                gridGap: gap,\n                ...(displayingGridToolbar ? { pointerEvents: 'none' } : {}),\n              }}\n              // NOSONAR: Complex data visualization treated as single image for screen readers\n              role=\"img\"\n              aria-label={ariaLabel ?? SINGLE_VALUE_GRID_ARIA_LABEL}\n              aria-describedby={ariaDescribedBy}\n            >\n              {gridItems.map((record, index) => (\n                <SingleValueDisplay\n                  key={index}\n                  record={record}\n                  propsConfig={propsConfig}\n                  accessors={accessors}\n                />\n              ))}\n              <Flex\n                className={gridRows}\n                style={{\n                  // Explicitly set this one via the style, as the `gridGap` settable via the\n                  // props on the `Grid` component needs to be a valid spacing token\n                  columnGap: gap,\n                }}\n                gridColumn=\"1 / -1\"\n              >\n                {lastRowItems.map((record, index) => (\n                  <SingleValueDisplay\n                    key={index}\n                    record={record}\n                    propsConfig={propsConfig}\n                    accessors={accessors}\n                  />\n                ))}\n              </Flex>\n            </Grid>\n          </GlobalFontSizeVariables>\n        </GlobalFontSizeProvider>\n      </ChartStateHandler>\n    </div>\n  );\n};\n\nSingleValueGridRoot['displayName'] = DISPLAY_NAME;\n\n/**\n * The SingleValueGrid component\n * @public\n */\nexport const SingleValueGrid = Object.assign(SingleValueGridRoot, {\n  ColorRule,\n  Intent,\n  Sparkline,\n  Toolbar: SingleValueGridToolbarSlot,\n  Trend,\n  Value,\n});\n"],
-  "mappings": "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",
+  "sourcesContent": ["import clsx from 'clsx';\nimport { type PropsWithChildren } from 'react';\n\nimport { GlobalFontSizeVariables } from './components/GlobalFontSizeVariables.js';\nimport { SingleValueDisplay } from './components/SingleValueDisplay.js';\nimport { DISPLAY_NAME, SINGLE_VALUE_GRID_ARIA_LABEL } from './defaults.js';\nimport { useLabelCount } from './hooks/use-label-count.js';\nimport { GlobalFontSizeProvider } from './providers/global-font-size-provider.js';\nimport { gridRows } from './SingleValueGrid.sty.js';\nimport { Sparkline } from './slots/Sparkline.js';\nimport { SingleValueGridToolbarSlot } from './slots/Toolbar.js';\nimport { Trend } from './slots/Trend.js';\nimport { Value } from './slots/Value.js';\nimport type {\n  SingleValueGridAccessorsConfig,\n  SingleValueGridProps,\n} from './types/single-value-grid.js';\nimport { calculateGridLayout } from './utils/calculate-grid-layout.js';\nimport { iterateSlots } from './utils/iterate-slots.js';\nimport { useBehavioralTrackingProps } from '../../core/hooks/useBehavioralTrackingProps.js';\nimport { Intent } from '../../core/slots/Intent/Intent.js';\nimport { Flex } from '../../layouts/flex/Flex.js';\nimport { Grid } from '../../layouts/grid/Grid.js';\nimport { ChartStateHandler } from '../core/components/chart-states/ChartStateHandler.js';\nimport { SingleValueToolbar } from '../core/components/single-value-renderer/components/SingleValueToolbar.js';\nimport { useThrottledResizeObserver } from '../core/hooks/useThrottledResizeObserver.js';\nimport { ColorRule } from '../core/slots/ColorRule.js';\n\nconst COMPONENT_NAME = 'SingleValueGrid';\n\nconst SingleValueGridRoot = (\n  props: PropsWithChildren<SingleValueGridProps>,\n) => {\n  const {\n    loading,\n    data,\n    children,\n    colorAccessor,\n    labelAccessor,\n    prefixIconAccessor,\n    applyThresholdBackground,\n    style: consumerStyle,\n    className: consumerClassName,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    'data-testid': dataTestId,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-details': ariaDetails,\n    seriesActions: individualSeriesActions,\n    ...gridConfig\n  } = props;\n\n  const [behavioralTrackingProps] = useBehavioralTrackingProps(props);\n\n  const labelCount = useLabelCount(data, labelAccessor);\n\n  const { accessors: slotAccessors, ...slotsConfig } = iterateSlots(\n    children,\n    props,\n  );\n\n  const trendCount = slotsConfig.trend !== undefined ? data.length : 0;\n\n  const accessors: SingleValueGridAccessorsConfig = {\n    colorAccessor,\n    labelAccessor,\n    prefixIconAccessor,\n    ...slotAccessors,\n  };\n\n  const propsConfig = {\n    ...gridConfig,\n    ...slotsConfig,\n    applyThresholdBackground,\n  };\n\n  const { height = 0, width = 0, refCallback } = useThrottledResizeObserver();\n\n  const { rowCount, columnCount, lastRowColumnCount, gap } =\n    calculateGridLayout(width, height, data.length);\n\n  const gridItems = data.slice(0, data.length - lastRowColumnCount);\n  const lastRowItems = data.slice(-lastRowColumnCount);\n  const { intents, toolbar } = propsConfig;\n  const displayingGridToolbar = !intents.single;\n\n  return (\n    <div\n      {...behavioralTrackingProps}\n      ref={refCallback}\n      style={{\n        ...consumerStyle,\n      }}\n      className={clsx(gridRows)}\n    >\n      <ChartStateHandler\n        height={height}\n        isLoading={!!loading}\n        data-dtrum-mask={dataDtrumMask}\n        data-dtrum-allow={dataDtrumAllow}\n        style={consumerStyle}\n        className={consumerClassName}\n        empty={false}\n        emptyState={undefined}\n        errorState={undefined}\n      >\n        {/* Empty children as the loader overlay will be shown */}\n        <GlobalFontSizeProvider\n          valueCount={data.length}\n          labelCount={labelCount}\n          trendCount={trendCount}\n        >\n          <GlobalFontSizeVariables>\n            {displayingGridToolbar ? (\n              <SingleValueToolbar\n                parentHeight={height}\n                intents={displayingGridToolbar ? intents.grid : []}\n                placement={toolbar.placement}\n                hidden={toolbar.hidden}\n              />\n            ) : null}\n\n            <Grid\n              className={clsx(gridRows, consumerClassName)}\n              data-dtrum-mask={dataDtrumMask}\n              data-dtrum-allow={dataDtrumAllow}\n              data-testid={dataTestId}\n              data-dt-component={COMPONENT_NAME}\n              gridTemplateRows={`repeat(${rowCount}, 1fr)`}\n              gridTemplateColumns={`repeat(${columnCount}, 1fr)`}\n              style={{\n                ...consumerStyle,\n                // Explicitly set this one via the style, as the `gridGap` settable via the\n                // props on the `Grid` component needs to be a valid spacing token\n                gridGap: gap,\n                ...(displayingGridToolbar ? { pointerEvents: 'none' } : {}),\n              }}\n              // NOSONAR: Complex data visualization treated as single image for screen readers\n              role=\"img\"\n              aria-label={ariaLabel ?? SINGLE_VALUE_GRID_ARIA_LABEL}\n              aria-labelledby={ariaLabelledBy}\n              aria-describedby={ariaDescribedBy}\n              aria-details={ariaDetails}\n            >\n              {gridItems.map((record, index) => (\n                <SingleValueDisplay\n                  key={index}\n                  record={record}\n                  propsConfig={propsConfig}\n                  accessors={accessors}\n                />\n              ))}\n              <Flex\n                className={gridRows}\n                style={{\n                  // Explicitly set this one via the style, as the `gridGap` settable via the\n                  // props on the `Grid` component needs to be a valid spacing token\n                  columnGap: gap,\n                }}\n                gridColumn=\"1 / -1\"\n              >\n                {lastRowItems.map((record, index) => (\n                  <SingleValueDisplay\n                    key={index}\n                    record={record}\n                    propsConfig={propsConfig}\n                    accessors={accessors}\n                  />\n                ))}\n              </Flex>\n            </Grid>\n          </GlobalFontSizeVariables>\n        </GlobalFontSizeProvider>\n      </ChartStateHandler>\n    </div>\n  );\n};\n\nSingleValueGridRoot['displayName'] = DISPLAY_NAME;\n\n/**\n * The SingleValueGrid component\n * @public\n */\nexport const SingleValueGrid = Object.assign(SingleValueGridRoot, {\n  ColorRule,\n  Intent,\n  Sparkline,\n  Toolbar: SingleValueGridToolbarSlot,\n  Trend,\n  Value,\n});\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/charts/single-value-grid/SingleValueGrid.sty.js

@@ -1,5 +1,5 @@
 import "./SingleValueGrid.css";
-var gridRows = "_1mx9zjb0-3-11-3";
+var gridRows = "_1mx9zjb0-3-12-0";
 export {
   gridRows
 };

package/esm/charts/single-value-grid/SingleValueGrid.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/single-value-grid/SingleValueGrid.css.ts"],
-  "sourcesContent": ["import './SingleValueGrid.css';\nexport var gridRows = '_1mx9zjb0-3-11-3';"],
+  "sourcesContent": ["import './SingleValueGrid.css';\nexport var gridRows = '_1mx9zjb0-3-12-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,WAAW;",
   "names": []
 }

package/esm/charts/single-value-grid/components/GlobalFontSizeVariables.css

@@ -1,4 +1,4 @@
-._eom86z0-3-11-3 {
+._eom86z0-3-12-0 {
   position: relative;
   width: 100%;
   height: 100%;

package/esm/charts/single-value-grid/components/GlobalFontSizeVariables.sty.js

@@ -1,5 +1,5 @@
 import "./GlobalFontSizeVariables.css";
-var fontSizeWrapper = "_eom86z0-3-11-3";
+var fontSizeWrapper = "_eom86z0-3-12-0";
 export {
   fontSizeWrapper
 };

package/esm/charts/single-value-grid/components/GlobalFontSizeVariables.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/single-value-grid/components/GlobalFontSizeVariables.css.ts"],
-  "sourcesContent": ["import './GlobalFontSizeVariables.css';\nexport var fontSizeWrapper = '_eom86z0-3-11-3';"],
+  "sourcesContent": ["import './GlobalFontSizeVariables.css';\nexport var fontSizeWrapper = '_eom86z0-3-12-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,kBAAkB;",
   "names": []
 }

package/esm/charts/timeseries/TimeseriesChartInternal.js

@@ -35,6 +35,7 @@ import {
   BOTTOM_PADDING_ADJUSTMENT,
   OVERLAY_PADDING
 } from "../core/components/data-point/constants.js";
+import { useAriaLabelingContext } from "../core/context/AriaLabelingContext.js";
 function computeChartPadding(axisLeftConfig, axisRightConfig, unitsCount, isLegendHiddenOrVertical) {
   const singleUnit = unitsCount === 1 && isLegendHiddenOrVertical;
   const paddingRight = Boolean(
@@ -53,6 +54,12 @@ const timeseriesGridTemplateAreas = `
 `;
 const timeseriesGridTemplateColumns = "minmax(0, auto) auto minmax(60%, 1fr) auto minmax(0, auto)";
 const TimeseriesChartInternal = /* @__PURE__ */ forwardRef(({ config }, forwardedRef) => {
+  const {
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    "aria-details": ariaDetails
+  } = useAriaLabelingContext();
   const loading = useChartLayoutLoading();
   const annotations = useAnnotationsConfig();
   const tracksQuantity = annotations.tracks.length;
@@ -104,7 +111,10 @@ const TimeseriesChartInternal = /* @__PURE__ */ forwardRef(({ config }, forwarde
         paddingLeft: hasLeftPadding ? OVERLAY_PADDING : 0
       },
       className: defaultChartSize,
-      "aria-label": TIMESERIES_ARIA_LABEL,
+      "aria-label": ariaLabel ?? TIMESERIES_ARIA_LABEL,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-describedby": ariaDescribedBy,
+      "aria-details": ariaDetails,
       role: "img",
       children: /* @__PURE__ */ jsx(
         ChartGrid,

package/esm/charts/timeseries/TimeseriesChartInternal.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/timeseries/TimeseriesChartInternal.tsx"],
-  "sourcesContent": ["import { forwardRef, type PropsWithChildren, useRef } from 'react';\n\nimport { TimeseriesAnnotationsIndicators } from './components/annotations-timeseries/TimeseriesAnnotationsIndicators.js';\nimport { TimeseriesChartAnnotationsArea } from './components/annotations-timeseries/TimeseriesChartAnnotationsArea.js';\nimport { TimeseriesTimeBottomAxisArea } from './components/axes/TimeseriesTimeBottomAxisArea/TimeseriesTimeBottomAxisArea.js';\nimport { TimeseriesValueLeftAxisArea } from './components/axes/TimeseriesValueLeftAxisArea.js';\nimport { TimeseriesValueRightAxisArea } from './components/axes/TimeseriesValueRightAxisArea.js';\nimport { TimeseriesChartOverlays } from './components/overlays/TimeseriesChartOverlays.js';\nimport { ThresholdIndicators } from './components/thresholds/ThresholdIndicators.js';\nimport { TimeseriesThresholdArea } from './components/thresholds/TimeseriesThresholdArea.js';\nimport { DISPLAY_NAME, TIMESERIES_ARIA_LABEL } from './constants.js';\nimport { useAnnotationsConfig } from './hooks/useAnnotationsConfig.js';\nimport { useChartInteractions } from './hooks/useChartInteractions.js';\nimport { useTimeseriesFilteredData } from './hooks/useTimeseriesFilteredData.js';\nimport { useTimeseriesFilteredYAxis } from './hooks/useTimeseriesFilteredYAxis.js';\nimport { useTimeseriesLegend } from './hooks/useTimeseriesLegend.js';\nimport { TimeseriesChartPlot } from './layout/TimeseriesChartPlot.js';\nimport { TimeseriesChartImperativeHandler } from './providers/TimeseriesChartImperativeHandler.js';\nimport { TimeseriesChartProviders } from './providers/TimeseriesChartProviders.js';\nimport type { TimeseriesChartConfiguration } from './types/timeseries-config.js';\nimport { AREAS } from './types/timeseries-grid-area-rules.js';\nimport type { TimeseriesChartRef } from './types/timeseries-ref.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport { defaultChartSize } from '../../core/styles/defaultChartValues.sty.js';\nimport { SCROLLBAR_WIDTH } from '../core/components/annotations/constants.js';\nimport { getAnnotationsVisibleArea } from '../core/components/annotations/utils/get-annotations-visible-area.js';\nimport { ChartGrid } from '../core/components/chart-grid/ChartGridRoot.js';\nimport {\n  shouldShowAnnotations,\n  shouldShowAxes,\n} from '../core/components/chart-grid/constants.js';\nimport { useChartLayoutLoading } from '../core/components/chart-layout/hooks/useChartLayoutLoading.js';\nimport { useChartLayoutOrientation } from '../core/components/chart-layout/hooks/useChartLayoutOrientation.js';\nimport { useGraphSize } from '../core/components/chart-layout/hooks/useGraphSize.js';\nimport { ChartLoaderOverlay } from '../core/components/chart-loader-overlay/ChartLoaderOverlay.js';\nimport {\n  BOTTOM_PADDING_ADJUSTMENT,\n  OVERLAY_PADDING,\n} from '../core/components/data-point/constants.js';\n\nexport function computeChartPadding(\n  axisLeftConfig: unknown,\n  axisRightConfig: unknown,\n  unitsCount: number,\n  isLegendHiddenOrVertical: boolean,\n): { hasLeftPadding: boolean; hasRightPadding: boolean } {\n  const singleUnit = unitsCount === 1 && isLegendHiddenOrVertical;\n  const paddingRight = Boolean(\n    (!axisLeftConfig && !axisRightConfig && singleUnit) ||\n      (axisLeftConfig && axisRightConfig && singleUnit) ||\n      (axisLeftConfig && isLegendHiddenOrVertical),\n  );\n  const onlyRightAxis = !axisLeftConfig && Boolean(axisRightConfig);\n  return {\n    hasLeftPadding: onlyRightAxis,\n    hasRightPadding: onlyRightAxis || paddingRight,\n  };\n}\n\nconst timeseriesGridTemplateAreas = `\n  \"${AREAS.annotations} ${AREAS.annotations} ${AREAS.annotations} . .\"\n  \"${AREAS.leftAxis} ${AREAS.leftThreshold} plot ${AREAS.rightThreshold} ${AREAS.rightAxis}\"\n  \". . ${AREAS.bottomAxis} . .\"\n`;\nconst timeseriesGridTemplateColumns =\n  'minmax(0, auto) auto minmax(60%, 1fr) auto minmax(0, auto)';\n\nexport interface _TimeseriesChartProps {\n  config: TimeseriesChartConfiguration;\n}\n\nexport const TimeseriesChartInternal = /* @__PURE__ */ forwardRef<\n  TimeseriesChartRef,\n  PropsWithChildren<_TimeseriesChartProps>\n>(({ config }, forwardedRef) => {\n  const loading = useChartLayoutLoading();\n  const annotations = useAnnotationsConfig();\n  const tracksQuantity = annotations.tracks.length;\n  const numHiddenTracks = annotations.tracks.filter(\n    (value) => value.hidden,\n  ).length;\n\n  const chartRef = useRef<HTMLDivElement>(null);\n  const mergedRef = useMergeRefs<TimeseriesChartRef | HTMLDivElement>([\n    forwardedRef,\n    chartRef,\n  ]);\n\n  const { width, height } = useGraphSize();\n  const { orientation } = useChartLayoutOrientation();\n  const { right: axisRightConfig, left: axisLeftConfig } =\n    useTimeseriesFilteredYAxis();\n  const { units } = useTimeseriesFilteredData();\n  const { hidden: legendHidden } = useTimeseriesLegend();\n\n  const annotationsVisibleArea = getAnnotationsVisibleArea(\n    tracksQuantity,\n    annotations.visibleTracksLimit,\n    numHiddenTracks,\n  );\n\n  const availableWidth =\n    tracksQuantity && orientation === 'vertical'\n      ? width - SCROLLBAR_WIDTH\n      : width;\n\n  const isLegendHiddenOrVertical = orientation === 'vertical' || legendHidden;\n  const isLegendHiddenOrRight = orientation === 'horizontal' || legendHidden;\n\n  const { hasLeftPadding, hasRightPadding } = computeChartPadding(\n    axisLeftConfig,\n    axisRightConfig,\n    units.length,\n    isLegendHiddenOrVertical,\n  );\n\n  const chartGridHeight =\n    height -\n    (!tracksQuantity || isLegendHiddenOrRight\n      ? OVERLAY_PADDING + BOTTOM_PADDING_ADJUSTMENT\n      : 0);\n\n  const showAnnotations = shouldShowAnnotations(\n    chartGridHeight,\n    tracksQuantity,\n  );\n\n  const showAxes = shouldShowAxes(chartGridHeight);\n  const chartGridRenderHeight =\n    tracksQuantity && !isLegendHiddenOrRight && !showAnnotations\n      ? chartGridHeight - OVERLAY_PADDING\n      : chartGridHeight;\n\n  const annotationsRowHeight = showAnnotations ? annotationsVisibleArea : 0;\n\n  const timeseriesGridTemplateRows = showAxes\n    ? `minmax(0, ${annotationsRowHeight}px) minmax(60%, 1fr) minmax(0, auto)`\n    : '0px 1fr 1px';\n\n  useChartInteractions();\n\n  if (!height || !width) {\n    return null;\n  }\n\n  return (\n    <div\n      style={{\n        paddingTop: showAnnotations ? 0 : OVERLAY_PADDING,\n        paddingLeft: hasLeftPadding ? OVERLAY_PADDING : 0,\n      }}\n      className={defaultChartSize}\n      aria-label={TIMESERIES_ARIA_LABEL}\n      role=\"img\"\n    >\n      <ChartGrid\n        width={availableWidth - (hasRightPadding ? OVERLAY_PADDING : 0)}\n        height={chartGridRenderHeight}\n        gridTemplateAreas={timeseriesGridTemplateAreas}\n        gridTemplateColumns={timeseriesGridTemplateColumns}\n        gridTemplateRows={timeseriesGridTemplateRows}\n        ref={mergedRef}\n      >\n        <TimeseriesChartProviders>\n          <TimeseriesChartImperativeHandler\n            config={config}\n            forwardedRef={forwardedRef}\n            chartRef={chartRef}\n          >\n            {showAxes && <TimeseriesValueLeftAxisArea />}\n            {showAxes && <TimeseriesTimeBottomAxisArea />}\n\n            <ChartGrid.PlotArea>\n              <TimeseriesChartPlot />\n              {showAnnotations && <TimeseriesAnnotationsIndicators />}\n              <ChartLoaderOverlay\n                loading={!!loading}\n                zoomEnabled={!!config.interactions?.zoom?.enabled}\n              >\n                <TimeseriesChartOverlays />\n              </ChartLoaderOverlay>\n\n              <ThresholdIndicators indicatorType=\"line\" />\n            </ChartGrid.PlotArea>\n\n            {showAxes && <TimeseriesValueRightAxisArea />}\n            <TimeseriesThresholdArea />\n\n            {showAnnotations && <TimeseriesChartAnnotationsArea />}\n          </TimeseriesChartImperativeHandler>\n        </TimeseriesChartProviders>\n      </ChartGrid>\n    </div>\n  );\n});\n\n(\n  TimeseriesChartInternal as typeof TimeseriesChartInternal & {\n    displayName: string;\n  }\n).displayName = DISPLAY_NAME;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { forwardRef, type PropsWithChildren, useRef } from 'react';\n\nimport { TimeseriesAnnotationsIndicators } from './components/annotations-timeseries/TimeseriesAnnotationsIndicators.js';\nimport { TimeseriesChartAnnotationsArea } from './components/annotations-timeseries/TimeseriesChartAnnotationsArea.js';\nimport { TimeseriesTimeBottomAxisArea } from './components/axes/TimeseriesTimeBottomAxisArea/TimeseriesTimeBottomAxisArea.js';\nimport { TimeseriesValueLeftAxisArea } from './components/axes/TimeseriesValueLeftAxisArea.js';\nimport { TimeseriesValueRightAxisArea } from './components/axes/TimeseriesValueRightAxisArea.js';\nimport { TimeseriesChartOverlays } from './components/overlays/TimeseriesChartOverlays.js';\nimport { ThresholdIndicators } from './components/thresholds/ThresholdIndicators.js';\nimport { TimeseriesThresholdArea } from './components/thresholds/TimeseriesThresholdArea.js';\nimport { DISPLAY_NAME, TIMESERIES_ARIA_LABEL } from './constants.js';\nimport { useAnnotationsConfig } from './hooks/useAnnotationsConfig.js';\nimport { useChartInteractions } from './hooks/useChartInteractions.js';\nimport { useTimeseriesFilteredData } from './hooks/useTimeseriesFilteredData.js';\nimport { useTimeseriesFilteredYAxis } from './hooks/useTimeseriesFilteredYAxis.js';\nimport { useTimeseriesLegend } from './hooks/useTimeseriesLegend.js';\nimport { TimeseriesChartPlot } from './layout/TimeseriesChartPlot.js';\nimport { TimeseriesChartImperativeHandler } from './providers/TimeseriesChartImperativeHandler.js';\nimport { TimeseriesChartProviders } from './providers/TimeseriesChartProviders.js';\nimport type { TimeseriesChartConfiguration } from './types/timeseries-config.js';\nimport { AREAS } from './types/timeseries-grid-area-rules.js';\nimport type { TimeseriesChartRef } from './types/timeseries-ref.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport { defaultChartSize } from '../../core/styles/defaultChartValues.sty.js';\nimport { SCROLLBAR_WIDTH } from '../core/components/annotations/constants.js';\nimport { getAnnotationsVisibleArea } from '../core/components/annotations/utils/get-annotations-visible-area.js';\nimport { ChartGrid } from '../core/components/chart-grid/ChartGridRoot.js';\nimport {\n  shouldShowAnnotations,\n  shouldShowAxes,\n} from '../core/components/chart-grid/constants.js';\nimport { useChartLayoutLoading } from '../core/components/chart-layout/hooks/useChartLayoutLoading.js';\nimport { useChartLayoutOrientation } from '../core/components/chart-layout/hooks/useChartLayoutOrientation.js';\nimport { useGraphSize } from '../core/components/chart-layout/hooks/useGraphSize.js';\nimport { ChartLoaderOverlay } from '../core/components/chart-loader-overlay/ChartLoaderOverlay.js';\nimport {\n  BOTTOM_PADDING_ADJUSTMENT,\n  OVERLAY_PADDING,\n} from '../core/components/data-point/constants.js';\nimport { useAriaLabelingContext } from '../core/context/AriaLabelingContext.js';\n\nexport function computeChartPadding(\n  axisLeftConfig: unknown,\n  axisRightConfig: unknown,\n  unitsCount: number,\n  isLegendHiddenOrVertical: boolean,\n): { hasLeftPadding: boolean; hasRightPadding: boolean } {\n  const singleUnit = unitsCount === 1 && isLegendHiddenOrVertical;\n  const paddingRight = Boolean(\n    (!axisLeftConfig && !axisRightConfig && singleUnit) ||\n      (axisLeftConfig && axisRightConfig && singleUnit) ||\n      (axisLeftConfig && isLegendHiddenOrVertical),\n  );\n  const onlyRightAxis = !axisLeftConfig && Boolean(axisRightConfig);\n  return {\n    hasLeftPadding: onlyRightAxis,\n    hasRightPadding: onlyRightAxis || paddingRight,\n  };\n}\n\nconst timeseriesGridTemplateAreas = `\n  \"${AREAS.annotations} ${AREAS.annotations} ${AREAS.annotations} . .\"\n  \"${AREAS.leftAxis} ${AREAS.leftThreshold} plot ${AREAS.rightThreshold} ${AREAS.rightAxis}\"\n  \". . ${AREAS.bottomAxis} . .\"\n`;\nconst timeseriesGridTemplateColumns =\n  'minmax(0, auto) auto minmax(60%, 1fr) auto minmax(0, auto)';\n\nexport interface _TimeseriesChartProps {\n  config: TimeseriesChartConfiguration;\n}\n\nexport const TimeseriesChartInternal = /* @__PURE__ */ forwardRef<\n  TimeseriesChartRef,\n  PropsWithChildren<_TimeseriesChartProps>\n>(({ config }, forwardedRef) => {\n  const {\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-details': ariaDetails,\n  } = useAriaLabelingContext();\n  const loading = useChartLayoutLoading();\n  const annotations = useAnnotationsConfig();\n  const tracksQuantity = annotations.tracks.length;\n  const numHiddenTracks = annotations.tracks.filter(\n    (value) => value.hidden,\n  ).length;\n\n  const chartRef = useRef<HTMLDivElement>(null);\n  const mergedRef = useMergeRefs<TimeseriesChartRef | HTMLDivElement>([\n    forwardedRef,\n    chartRef,\n  ]);\n\n  const { width, height } = useGraphSize();\n  const { orientation } = useChartLayoutOrientation();\n  const { right: axisRightConfig, left: axisLeftConfig } =\n    useTimeseriesFilteredYAxis();\n  const { units } = useTimeseriesFilteredData();\n  const { hidden: legendHidden } = useTimeseriesLegend();\n\n  const annotationsVisibleArea = getAnnotationsVisibleArea(\n    tracksQuantity,\n    annotations.visibleTracksLimit,\n    numHiddenTracks,\n  );\n\n  const availableWidth =\n    tracksQuantity && orientation === 'vertical'\n      ? width - SCROLLBAR_WIDTH\n      : width;\n\n  const isLegendHiddenOrVertical = orientation === 'vertical' || legendHidden;\n  const isLegendHiddenOrRight = orientation === 'horizontal' || legendHidden;\n\n  const { hasLeftPadding, hasRightPadding } = computeChartPadding(\n    axisLeftConfig,\n    axisRightConfig,\n    units.length,\n    isLegendHiddenOrVertical,\n  );\n\n  const chartGridHeight =\n    height -\n    (!tracksQuantity || isLegendHiddenOrRight\n      ? OVERLAY_PADDING + BOTTOM_PADDING_ADJUSTMENT\n      : 0);\n\n  const showAnnotations = shouldShowAnnotations(\n    chartGridHeight,\n    tracksQuantity,\n  );\n\n  const showAxes = shouldShowAxes(chartGridHeight);\n  const chartGridRenderHeight =\n    tracksQuantity && !isLegendHiddenOrRight && !showAnnotations\n      ? chartGridHeight - OVERLAY_PADDING\n      : chartGridHeight;\n\n  const annotationsRowHeight = showAnnotations ? annotationsVisibleArea : 0;\n\n  const timeseriesGridTemplateRows = showAxes\n    ? `minmax(0, ${annotationsRowHeight}px) minmax(60%, 1fr) minmax(0, auto)`\n    : '0px 1fr 1px';\n\n  useChartInteractions();\n\n  if (!height || !width) {\n    return null;\n  }\n\n  return (\n    <div\n      style={{\n        paddingTop: showAnnotations ? 0 : OVERLAY_PADDING,\n        paddingLeft: hasLeftPadding ? OVERLAY_PADDING : 0,\n      }}\n      className={defaultChartSize}\n      aria-label={ariaLabel ?? TIMESERIES_ARIA_LABEL}\n      aria-labelledby={ariaLabelledBy}\n      aria-describedby={ariaDescribedBy}\n      aria-details={ariaDetails}\n      role=\"img\"\n    >\n      <ChartGrid\n        width={availableWidth - (hasRightPadding ? OVERLAY_PADDING : 0)}\n        height={chartGridRenderHeight}\n        gridTemplateAreas={timeseriesGridTemplateAreas}\n        gridTemplateColumns={timeseriesGridTemplateColumns}\n        gridTemplateRows={timeseriesGridTemplateRows}\n        ref={mergedRef}\n      >\n        <TimeseriesChartProviders>\n          <TimeseriesChartImperativeHandler\n            config={config}\n            forwardedRef={forwardedRef}\n            chartRef={chartRef}\n          >\n            {showAxes && <TimeseriesValueLeftAxisArea />}\n            {showAxes && <TimeseriesTimeBottomAxisArea />}\n\n            <ChartGrid.PlotArea>\n              <TimeseriesChartPlot />\n              {showAnnotations && <TimeseriesAnnotationsIndicators />}\n              <ChartLoaderOverlay\n                loading={!!loading}\n                zoomEnabled={!!config.interactions?.zoom?.enabled}\n              >\n                <TimeseriesChartOverlays />\n              </ChartLoaderOverlay>\n\n              <ThresholdIndicators indicatorType=\"line\" />\n            </ChartGrid.PlotArea>\n\n            {showAxes && <TimeseriesValueRightAxisArea />}\n            <TimeseriesThresholdArea />\n\n            {showAnnotations && <TimeseriesChartAnnotationsArea />}\n          </TimeseriesChartImperativeHandler>\n        </TimeseriesChartProviders>\n      </ChartGrid>\n    </div>\n  );\n});\n\n(\n  TimeseriesChartInternal as typeof TimeseriesChartInternal & {\n    displayName: string;\n  }\n).displayName = DISPLAY_NAME;\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/charts/timeseries/TimeseriesChartRoot.js

@@ -1,5 +1,8 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
+import {
+  forwardRef,
+  useMemo
+} from "react";
 import { TimeseriesChartLegend } from "./components/legend/TimeseriesChartLegend.js";
 import { TIMESERIES_CHART_DEFAULT_VARIANT } from "./constants.js";
 import { TimeseriesRawDataContext } from "./context/TimeseriesRawData.context.js";
@@ -22,6 +25,7 @@ import { getChartStatesTemplates } from "../core/components/chart-states/utils/g
 import { OverlayProvider } from "../core/components/overlay-tooltip/contexts/OverlayContext.js";
 import { TooltipProvider } from "../core/components/overlay-tooltip/contexts/TooltipContext.js";
 import { ChartSeriesActionContext } from "../core/components/series-action/ChartSeriesActionContext.js";
+import { AriaLabelingContext } from "../core/context/AriaLabelingContext.js";
 import { coerceSizeValue } from "../core/utils/coerceSizeValue.js";
 const TIMESERIES_CHART_DEFAULT_HEIGHT = 300;
 const COMPONENT_NAME_BEHAVIOURAL_TRACKING = "TimeseriesChart";
@@ -48,7 +52,11 @@ const TimeseriesChartRoot = forwardRef((props, forwardedRef) => {
     className,
     style,
     "data-dtrum-mask": dataDtrumMask,
-    "data-dtrum-allow": dataDtrumAllow
+    "data-dtrum-allow": dataDtrumAllow,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    "aria-details": ariaDetails
   } = props;
   const [behaviorTrackingProps] = useBehavioralTrackingProps(props);
   const chartHeight = coerceSizeValue(heightProp) || TIMESERIES_CHART_DEFAULT_HEIGHT;
@@ -82,7 +90,16 @@ const TimeseriesChartRoot = forwardRef((props, forwardedRef) => {
   } = config.legend;
   const legendRatio = initialRatio ?? ratio;
   const chartLayoutRef = useAutoLegendRefresh(data);
-  return /* @__PURE__ */ jsx(TimeseriesChartIdProvider, { children: /* @__PURE__ */ jsx(TimeseriesConfigProvider, { config, children: /* @__PURE__ */ jsx(TimeseriesRawDataContext.Provider, { value: rawDataPerVariant, children: /* @__PURE__ */ jsx(
+  const ariaLabelingValue = useMemo(
+    () => ({
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-describedby": ariaDescribedBy,
+      "aria-details": ariaDetails
+    }),
+    [ariaLabel, ariaLabelledBy, ariaDescribedBy, ariaDetails]
+  );
+  return /* @__PURE__ */ jsx(AriaLabelingContext.Provider, { value: ariaLabelingValue, children: /* @__PURE__ */ jsx(TimeseriesChartIdProvider, { children: /* @__PURE__ */ jsx(TimeseriesConfigProvider, { config, children: /* @__PURE__ */ jsx(TimeseriesRawDataContext.Provider, { value: rawDataPerVariant, children: /* @__PURE__ */ jsx(
     TimeseriesDataProvider,
     {
       data: dataPerVariant,
@@ -142,7 +159,7 @@ const TimeseriesChartRoot = forwardRef((props, forwardedRef) => {
         }
       ) })
     }
-  ) }) }) });
+  ) }) }) }) });
 });
 TimeseriesChartRoot.displayName = "TimeseriesChartRoot";
 export {

package/esm/charts/timeseries/TimeseriesChartRoot.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/timeseries/TimeseriesChartRoot.tsx"],
-  "sourcesContent": ["import { forwardRef, type PropsWithChildren, type ReactElement } from 'react';\n\nimport { TimeseriesChartLegend } from './components/legend/TimeseriesChartLegend.js';\nimport { TIMESERIES_CHART_DEFAULT_VARIANT } from './constants.js';\nimport { TimeseriesRawDataContext } from './context/TimeseriesRawData.context.js';\nimport { useTimeseriesChartConfig } from './hooks/useTimeseriesChartConfig.js';\nimport { StoreProvider } from './providers/StoreProvider.js';\nimport { TimeseriesChartIdProvider } from './providers/TimeseriesChartIdProvider.js';\nimport { TimeseriesConfigProvider } from './providers/TimeseriesConfigProviders.js';\nimport { TimeseriesDataProvider } from './providers/TimeseriesDataProvider.js';\nimport { TimeseriesFilteredDataProvider } from './providers/TimeseriesFilteredDataProvider.js';\nimport { TimeseriesMinMaxXAxisProvider } from './providers/TimeseriesMinMaxXAxisProvider.js';\nimport { TimeseriesChartInternal } from './TimeseriesChartInternal.js';\nimport { TimeseriesChartProps } from './types/timeseries-props.js';\nimport { TimeseriesChartRef } from './types/timeseries-ref.js';\nimport {\n  hasSeriesWithDatapoints,\n  splitTimeseriesPerVariant,\n} from './utils/timeseries.js';\nimport { useBehavioralTrackingProps } from '../../core/hooks/useBehavioralTrackingProps.js';\nimport { ChartLayout } from '../core/components/chart-layout/ChartLayout.js';\nimport { useAutoLegendRefresh } from '../core/components/chart-layout/hooks/useAutoLegendRefresh.js';\nimport { getChartStatesTemplates } from '../core/components/chart-states/utils/get-chart-states-template.js';\nimport { OverlayProvider } from '../core/components/overlay-tooltip/contexts/OverlayContext.js';\nimport { TooltipProvider } from '../core/components/overlay-tooltip/contexts/TooltipContext.js';\nimport { ChartSeriesActionContext } from '../core/components/series-action/ChartSeriesActionContext.js';\nimport { coerceSizeValue } from '../core/utils/coerceSizeValue.js';\n\n/**\n * The default max height used for the timeserieschart when no explicit\n * height is given\n */\nconst TIMESERIES_CHART_DEFAULT_HEIGHT = 300;\n\n/**\n * Component name used for data-dt-component in behavioural tracking\n */\nconst COMPONENT_NAME_BEHAVIOURAL_TRACKING = 'TimeseriesChart';\n\n/**\n * TimeseriesChart component\n */\nexport const TimeseriesChartRoot = forwardRef<\n  TimeseriesChartRef,\n  TimeseriesChartProps\n>((props, forwardedRef) => {\n  const {\n    children,\n    data,\n    gapPolicy,\n    pointsDisplay,\n    colorPalette,\n    truncationMode,\n    variant = TIMESERIES_CHART_DEFAULT_VARIANT,\n    valueRepresentation,\n    height: heightProp,\n    width,\n    seriesActions,\n    onMessage,\n    loading = false,\n    curve,\n    initialZoom,\n    currentZoom,\n    onZoomChange,\n    infiniteZoom,\n    className,\n    style,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n  } = props;\n  const [behaviorTrackingProps] = useBehavioralTrackingProps(props);\n\n  const chartHeight =\n    coerceSizeValue(heightProp) || TIMESERIES_CHART_DEFAULT_HEIGHT;\n  const dataPerVariant = splitTimeseriesPerVariant(\n    data ?? [],\n    children,\n    variant,\n  );\n  const config = useTimeseriesChartConfig(children, {\n    gapPolicy,\n    pointsDisplay,\n    valueRepresentation,\n    colorPalette,\n    truncationMode,\n    curve,\n    initialZoom,\n    currentZoom,\n    onZoomChange,\n    infiniteZoom,\n  });\n\n  const { emptyState, errorState } = getChartStatesTemplates(children);\n\n  const { shapePriority, ...rawDataPerVariant } = dataPerVariant;\n  const hasSeries = hasSeriesWithDatapoints(dataPerVariant);\n\n  const {\n    position: legendPosition,\n    onRatioChange,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    ratio,\n    initialRatio,\n    hidden: isLegendHidden,\n  } = config.legend;\n\n  const legendRatio = initialRatio ?? ratio;\n\n  const chartLayoutRef = useAutoLegendRefresh(data);\n\n  return (\n    <TimeseriesChartIdProvider>\n      <TimeseriesConfigProvider config={config}>\n        <TimeseriesRawDataContext.Provider value={rawDataPerVariant}>\n          <TimeseriesDataProvider\n            data={dataPerVariant}\n            valueRepresentation={config.valueRepresentation}\n            onMessage={onMessage}\n          >\n            <TimeseriesMinMaxXAxisProvider>\n              <ChartSeriesActionContext.Provider\n                value={{\n                  chartSeriesActions: seriesActions as (\n                    series: unknown,\n                    datapoint?: unknown,\n                  ) => ReactElement<PropsWithChildren>,\n                }}\n              >\n                <StoreProvider\n                  data={dataPerVariant}\n                  currentDomain={config.currentZoom}\n                  initialDomain={config.initialZoom}\n                  infiniteZoom={config.infiniteZoom}\n                >\n                  <TimeseriesFilteredDataProvider>\n                    <OverlayProvider>\n                      <TooltipProvider>\n                        <ChartLayout\n                          ref={chartLayoutRef}\n                          chartHeight={chartHeight}\n                          chartWidth={width}\n                          isEmpty={!hasSeries}\n                          emptyState={emptyState}\n                          errorState={errorState}\n                          showLoader={loading}\n                          className={className}\n                          style={style}\n                          {...behaviorTrackingProps}\n                          data-dtrum-mask={dataDtrumMask}\n                          data-dtrum-allow={dataDtrumAllow}\n                          data-dt-component={\n                            COMPONENT_NAME_BEHAVIOURAL_TRACKING\n                          }\n                        >\n                          <ChartLayout.Graph>\n                            <TimeseriesChartInternal\n                              ref={forwardedRef}\n                              config={config}\n                            />\n                          </ChartLayout.Graph>\n                          {!isLegendHidden && (\n                            <ChartLayout.Legend\n                              position={legendPosition}\n                              initialRatio={legendRatio}\n                              onResize={onRatioChange}\n                            >\n                              <TimeseriesChartLegend />\n                            </ChartLayout.Legend>\n                          )}\n                        </ChartLayout>\n                      </TooltipProvider>\n                    </OverlayProvider>\n                  </TimeseriesFilteredDataProvider>\n                </StoreProvider>\n              </ChartSeriesActionContext.Provider>\n            </TimeseriesMinMaxXAxisProvider>\n          </TimeseriesDataProvider>\n        </TimeseriesRawDataContext.Provider>\n      </TimeseriesConfigProvider>\n    </TimeseriesChartIdProvider>\n  );\n});\n\n(\n  TimeseriesChartRoot as typeof TimeseriesChartRoot & { displayName: string }\n).displayName = 'TimeseriesChartRoot';\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n  forwardRef,\n  type PropsWithChildren,\n  type ReactElement,\n  useMemo,\n} from 'react';\n\nimport { TimeseriesChartLegend } from './components/legend/TimeseriesChartLegend.js';\nimport { TIMESERIES_CHART_DEFAULT_VARIANT } from './constants.js';\nimport { TimeseriesRawDataContext } from './context/TimeseriesRawData.context.js';\nimport { useTimeseriesChartConfig } from './hooks/useTimeseriesChartConfig.js';\nimport { StoreProvider } from './providers/StoreProvider.js';\nimport { TimeseriesChartIdProvider } from './providers/TimeseriesChartIdProvider.js';\nimport { TimeseriesConfigProvider } from './providers/TimeseriesConfigProviders.js';\nimport { TimeseriesDataProvider } from './providers/TimeseriesDataProvider.js';\nimport { TimeseriesFilteredDataProvider } from './providers/TimeseriesFilteredDataProvider.js';\nimport { TimeseriesMinMaxXAxisProvider } from './providers/TimeseriesMinMaxXAxisProvider.js';\nimport { TimeseriesChartInternal } from './TimeseriesChartInternal.js';\nimport { TimeseriesChartProps } from './types/timeseries-props.js';\nimport { TimeseriesChartRef } from './types/timeseries-ref.js';\nimport {\n  hasSeriesWithDatapoints,\n  splitTimeseriesPerVariant,\n} from './utils/timeseries.js';\nimport { useBehavioralTrackingProps } from '../../core/hooks/useBehavioralTrackingProps.js';\nimport { ChartLayout } from '../core/components/chart-layout/ChartLayout.js';\nimport { useAutoLegendRefresh } from '../core/components/chart-layout/hooks/useAutoLegendRefresh.js';\nimport { getChartStatesTemplates } from '../core/components/chart-states/utils/get-chart-states-template.js';\nimport { OverlayProvider } from '../core/components/overlay-tooltip/contexts/OverlayContext.js';\nimport { TooltipProvider } from '../core/components/overlay-tooltip/contexts/TooltipContext.js';\nimport { ChartSeriesActionContext } from '../core/components/series-action/ChartSeriesActionContext.js';\nimport { AriaLabelingContext } from '../core/context/AriaLabelingContext.js';\nimport { coerceSizeValue } from '../core/utils/coerceSizeValue.js';\n\n/**\n * The default max height used for the timeserieschart when no explicit\n * height is given\n */\nconst TIMESERIES_CHART_DEFAULT_HEIGHT = 300;\n\n/**\n * Component name used for data-dt-component in behavioural tracking\n */\nconst COMPONENT_NAME_BEHAVIOURAL_TRACKING = 'TimeseriesChart';\n\n/**\n * TimeseriesChart component\n */\nexport const TimeseriesChartRoot = forwardRef<\n  TimeseriesChartRef,\n  TimeseriesChartProps\n>((props, forwardedRef) => {\n  const {\n    children,\n    data,\n    gapPolicy,\n    pointsDisplay,\n    colorPalette,\n    truncationMode,\n    variant = TIMESERIES_CHART_DEFAULT_VARIANT,\n    valueRepresentation,\n    height: heightProp,\n    width,\n    seriesActions,\n    onMessage,\n    loading = false,\n    curve,\n    initialZoom,\n    currentZoom,\n    onZoomChange,\n    infiniteZoom,\n    className,\n    style,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-details': ariaDetails,\n  } = props;\n  const [behaviorTrackingProps] = useBehavioralTrackingProps(props);\n\n  const chartHeight =\n    coerceSizeValue(heightProp) || TIMESERIES_CHART_DEFAULT_HEIGHT;\n  const dataPerVariant = splitTimeseriesPerVariant(\n    data ?? [],\n    children,\n    variant,\n  );\n  const config = useTimeseriesChartConfig(children, {\n    gapPolicy,\n    pointsDisplay,\n    valueRepresentation,\n    colorPalette,\n    truncationMode,\n    curve,\n    initialZoom,\n    currentZoom,\n    onZoomChange,\n    infiniteZoom,\n  });\n\n  const { emptyState, errorState } = getChartStatesTemplates(children);\n\n  const { shapePriority, ...rawDataPerVariant } = dataPerVariant;\n  const hasSeries = hasSeriesWithDatapoints(dataPerVariant);\n\n  const {\n    position: legendPosition,\n    onRatioChange,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    ratio,\n    initialRatio,\n    hidden: isLegendHidden,\n  } = config.legend;\n\n  const legendRatio = initialRatio ?? ratio;\n\n  const chartLayoutRef = useAutoLegendRefresh(data);\n  const ariaLabelingValue = useMemo(\n    () => ({\n      'aria-label': ariaLabel,\n      'aria-labelledby': ariaLabelledBy,\n      'aria-describedby': ariaDescribedBy,\n      'aria-details': ariaDetails,\n    }),\n    [ariaLabel, ariaLabelledBy, ariaDescribedBy, ariaDetails],\n  );\n\n  return (\n    <AriaLabelingContext.Provider value={ariaLabelingValue}>\n      <TimeseriesChartIdProvider>\n        <TimeseriesConfigProvider config={config}>\n          <TimeseriesRawDataContext.Provider value={rawDataPerVariant}>\n            <TimeseriesDataProvider\n              data={dataPerVariant}\n              valueRepresentation={config.valueRepresentation}\n              onMessage={onMessage}\n            >\n              <TimeseriesMinMaxXAxisProvider>\n                <ChartSeriesActionContext.Provider\n                  value={{\n                    chartSeriesActions: seriesActions as (\n                      series: unknown,\n                      datapoint?: unknown,\n                    ) => ReactElement<PropsWithChildren>,\n                  }}\n                >\n                  <StoreProvider\n                    data={dataPerVariant}\n                    currentDomain={config.currentZoom}\n                    initialDomain={config.initialZoom}\n                    infiniteZoom={config.infiniteZoom}\n                  >\n                    <TimeseriesFilteredDataProvider>\n                      <OverlayProvider>\n                        <TooltipProvider>\n                          <ChartLayout\n                            ref={chartLayoutRef}\n                            chartHeight={chartHeight}\n                            chartWidth={width}\n                            isEmpty={!hasSeries}\n                            emptyState={emptyState}\n                            errorState={errorState}\n                            showLoader={loading}\n                            className={className}\n                            style={style}\n                            {...behaviorTrackingProps}\n                            data-dtrum-mask={dataDtrumMask}\n                            data-dtrum-allow={dataDtrumAllow}\n                            data-dt-component={\n                              COMPONENT_NAME_BEHAVIOURAL_TRACKING\n                            }\n                          >\n                            <ChartLayout.Graph>\n                              <TimeseriesChartInternal\n                                ref={forwardedRef}\n                                config={config}\n                              />\n                            </ChartLayout.Graph>\n                            {!isLegendHidden && (\n                              <ChartLayout.Legend\n                                position={legendPosition}\n                                initialRatio={legendRatio}\n                                onResize={onRatioChange}\n                              >\n                                <TimeseriesChartLegend />\n                              </ChartLayout.Legend>\n                            )}\n                          </ChartLayout>\n                        </TooltipProvider>\n                      </OverlayProvider>\n                    </TimeseriesFilteredDataProvider>\n                  </StoreProvider>\n                </ChartSeriesActionContext.Provider>\n              </TimeseriesMinMaxXAxisProvider>\n            </TimeseriesDataProvider>\n          </TimeseriesRawDataContext.Provider>\n        </TimeseriesConfigProvider>\n      </TimeseriesChartIdProvider>\n    </AriaLabelingContext.Provider>\n  );\n});\n\n(\n  TimeseriesChartRoot as typeof TimeseriesChartRoot & { displayName: string }\n).displayName = 'TimeseriesChartRoot';\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/charts/timeseries/components/axes/TimeseriesTimeBottomAxisArea/TimeseriesTimeBottomAxisArea.css

@@ -1,6 +1,6 @@
-._19z0vdp0-3-11-3 {
+._19z0vdp0-3-12-0 {
   position: relative;
 }
-._19z0vdp1-3-11-3 {
+._19z0vdp1-3-12-0 {
   touch-action: none;
 }

package/esm/charts/timeseries/components/axes/TimeseriesTimeBottomAxisArea/TimeseriesTimeBottomAxisArea.sty.js

@@ -1,6 +1,6 @@
 import "./TimeseriesTimeBottomAxisArea.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var timeBottomAxisContainer = _7a468({ defaultClassName: "_19z0vdp0-3-11-3", variantClassNames: { isTouchableDevice: { true: "_19z0vdp1-3-11-3" } }, defaultVariants: {}, compoundVariants: [] });
+var timeBottomAxisContainer = _7a468({ defaultClassName: "_19z0vdp0-3-12-0", variantClassNames: { isTouchableDevice: { true: "_19z0vdp1-3-12-0" } }, defaultVariants: {}, compoundVariants: [] });
 export {
   timeBottomAxisContainer
 };

package/esm/charts/timeseries/components/axes/TimeseriesTimeBottomAxisArea/TimeseriesTimeBottomAxisArea.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/timeseries/components/axes/TimeseriesTimeBottomAxisArea/TimeseriesTimeBottomAxisArea.css.ts"],
-  "sourcesContent": ["import './TimeseriesTimeBottomAxisArea.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var timeBottomAxisContainer = _7a468({defaultClassName:'_19z0vdp0-3-11-3',variantClassNames:{isTouchableDevice:{true:'_19z0vdp1-3-11-3'}},defaultVariants:{},compoundVariants:[]});"],
+  "sourcesContent": ["import './TimeseriesTimeBottomAxisArea.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var timeBottomAxisContainer = _7a468({defaultClassName:'_19z0vdp0-3-12-0',variantClassNames:{isTouchableDevice:{true:'_19z0vdp1-3-12-0'}},defaultVariants:{},compoundVariants:[]});"],
   "mappings": "AAAA,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,0BAA0B,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,mBAAkB,EAAC,MAAK,mBAAkB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;",
   "names": []
 }

package/esm/charts/timeseries/components/overlays/TimeseriesOverlays.css

@@ -1,8 +1,8 @@
-._17fdb110-3-11-3 {
+._17fdb110-3-12-0 {
   z-index: 1;
   pointer-events: none;
 }
-._17fdb111-3-11-3 {
+._17fdb111-3-12-0 {
   top: -3.5px;
   left: -3.5px;
   width: calc(100% + 7px);
@@ -10,7 +10,7 @@
   z-index: 1;
   pointer-events: none;
 }
-._17fdb112-3-11-3 {
+._17fdb112-3-12-0 {
   top: -7px;
   left: -7px;
   width: calc(100% + 14px);
@@ -18,7 +18,7 @@
   z-index: 2;
   pointer-events: none;
 }
-._17fdb113-3-11-3 {
+._17fdb113-3-12-0 {
   cursor: crosshair;
   overflow: visible;
   pointer-events: none;

package/esm/charts/timeseries/components/overlays/TimeseriesOverlays.sty.js

@@ -1,9 +1,9 @@
 import "../../../core/components/chart-grid/ChartGrid.css";
 import "./TimeseriesOverlays.css";
-var canvasPlot = "_17fdb110-3-11-3 _13lzg4k0-3-11-3";
-var crosshairLayout = "_17fdb113-3-11-3 _13lzg4k0-3-11-3";
-var datapointCanvasPlot = "_17fdb111-3-11-3 _13lzg4k0-3-11-3";
-var datapointIndicatorLayout = "_17fdb112-3-11-3 _13lzg4k0-3-11-3";
+var canvasPlot = "_17fdb110-3-12-0 _13lzg4k0-3-12-0";
+var crosshairLayout = "_17fdb113-3-12-0 _13lzg4k0-3-12-0";
+var datapointCanvasPlot = "_17fdb111-3-12-0 _13lzg4k0-3-12-0";
+var datapointIndicatorLayout = "_17fdb112-3-12-0 _13lzg4k0-3-12-0";
 export {
   canvasPlot,
   crosshairLayout,

package/esm/charts/timeseries/components/overlays/TimeseriesOverlays.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/timeseries/components/overlays/TimeseriesOverlays.css.ts"],
-  "sourcesContent": ["import '../../../core/components/chart-grid/ChartGrid.css';\nimport './TimeseriesOverlays.css';\nexport var canvasPlot = '_17fdb110-3-11-3 _13lzg4k0-3-11-3';\nexport var crosshairLayout = '_17fdb113-3-11-3 _13lzg4k0-3-11-3';\nexport var datapointCanvasPlot = '_17fdb111-3-11-3 _13lzg4k0-3-11-3';\nexport var datapointIndicatorLayout = '_17fdb112-3-11-3 _13lzg4k0-3-11-3';"],
+  "sourcesContent": ["import '../../../core/components/chart-grid/ChartGrid.css';\nimport './TimeseriesOverlays.css';\nexport var canvasPlot = '_17fdb110-3-12-0 _13lzg4k0-3-12-0';\nexport var crosshairLayout = '_17fdb113-3-12-0 _13lzg4k0-3-12-0';\nexport var datapointCanvasPlot = '_17fdb111-3-12-0 _13lzg4k0-3-12-0';\nexport var datapointIndicatorLayout = '_17fdb112-3-12-0 _13lzg4k0-3-12-0';"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACA,IAAI,aAAa;AACjB,IAAI,kBAAkB;AACtB,IAAI,sBAAsB;AAC1B,IAAI,2BAA2B;",
   "names": []
 }

package/esm/charts/timeseries/components/thresholds/ThresholdIndicators.css

@@ -1,6 +1,6 @@
-._9p8qi20-3-11-3 {
+._9p8qi20-3-12-0 {
   z-index: 2;
 }
-._9p8qi21-3-11-3 {
+._9p8qi21-3-12-0 {
   z-index: 0;
 }

package/esm/charts/timeseries/components/thresholds/ThresholdIndicators.sty.js

@@ -1,7 +1,7 @@
 import "../../../core/components/chart-grid/ChartGrid.css";
 import "./ThresholdIndicators.css";
-var thresholdPlotLine = "_9p8qi20-3-11-3 _13lzg4k0-3-11-3";
-var thresholdPlotRange = "_9p8qi21-3-11-3 _13lzg4k0-3-11-3";
+var thresholdPlotLine = "_9p8qi20-3-12-0 _13lzg4k0-3-12-0";
+var thresholdPlotRange = "_9p8qi21-3-12-0 _13lzg4k0-3-12-0";
 export {
   thresholdPlotLine,
   thresholdPlotRange

package/esm/charts/timeseries/components/thresholds/ThresholdIndicators.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/timeseries/components/thresholds/ThresholdIndicators.css.ts"],
-  "sourcesContent": ["import '../../../core/components/chart-grid/ChartGrid.css';\nimport './ThresholdIndicators.css';\nexport var thresholdPlotLine = '_9p8qi20-3-11-3 _13lzg4k0-3-11-3';\nexport var thresholdPlotRange = '_9p8qi21-3-11-3 _13lzg4k0-3-11-3';"],
+  "sourcesContent": ["import '../../../core/components/chart-grid/ChartGrid.css';\nimport './ThresholdIndicators.css';\nexport var thresholdPlotLine = '_9p8qi20-3-12-0 _13lzg4k0-3-12-0';\nexport var thresholdPlotRange = '_9p8qi21-3-12-0 _13lzg4k0-3-12-0';"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACA,IAAI,oBAAoB;AACxB,IAAI,qBAAqB;",
   "names": []
 }

package/esm/charts/top-list/TopList.css

@@ -1,4 +1,4 @@
-._jwlby60-3-11-3 {
+._jwlby60-3-12-0 {
   width: 100%;
   overflow-y: auto;
 }

package/esm/charts/top-list/TopList.js

@@ -11,12 +11,15 @@ import {
   ROW_KEY,
   SERIES_ID_KEY,
   SERIES_NAME_KEY,
+  TOP_LIST_ARIA_LABEL,
   X_AXIS_ID,
   Y_AXIS_ID
 } from "./constants.js";
 import { scrollContainer } from "./TopList.sty.js";
 import { useBehavioralTrackingProps } from "../../core/hooks/useBehavioralTrackingProps.js";
 import { useMergeRefs } from "../../core/hooks/useMergeRefs.js";
+import { downloadCSV, escapeForCSV } from "../../core/utils/download.js";
+import { CSS_DOWNLOAD_FILENAME } from "../core/constants.js";
 import { ColorRule } from "../core/slots/ColorRule.js";
 import { isColoredRangeArray } from "../core/types/colored-range.js";
 import {
@@ -51,7 +54,11 @@ function TopListRender(props, forwardedRef) {
     "data-dtrum-mask": dataDtrumMask,
     "data-dtrum-allow": dataDtrumAllow,
     // @ts-expect-error - We want to allow overriding data-dt-component as we use the component internally in other Strato components, but it should not appear in the public API.
-    "data-dt-component": componentName = COMPONENT_NAME_BEHAVIOURAL_TRACKING
+    "data-dt-component": componentName = COMPONENT_NAME_BEHAVIOURAL_TRACKING,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    "aria-details": ariaDetails
   } = props;
   const [behaviorTrackingProps] = useBehavioralTrackingProps(props);
   const internalRef = useRef(null);
@@ -79,6 +86,17 @@ function TopListRender(props, forwardedRef) {
     const numFormatter = getFormatter(valueFormatter);
     return (_rowKey, record) => numFormatter(Number(record[valueAccessor]));
   }, [valueFormatter, valueAccessor]);
+  const downloadDataCallback = useCallback(() => {
+    const rows = dataWithSyntheticFields.map((d) => {
+      const label = escapeForCSV(d[labelAccessor]);
+      const value = escapeForCSV(d[valueAccessor]);
+      return `${label},${value}`;
+    }).join("\n");
+    const csvContent = rows ? `Label,Value
+${rows}
+` : "Label,Value\n";
+    downloadCSV(csvContent, CSS_DOWNLOAD_FILENAME);
+  }, [dataWithSyntheticFields, labelAccessor, valueAccessor]);
   const syntheticColorRules = useMemo(() => {
     if (colorPaletteMode !== "multi-color") {
       return [];
@@ -115,7 +133,12 @@ function TopListRender(props, forwardedRef) {
           loading,
           truncationMode,
           colorPalette,
+          "aria-label": ariaLabel ?? TOP_LIST_ARIA_LABEL,
+          "aria-labelledby": ariaLabelledBy,
+          "aria-describedby": ariaDescribedBy,
+          "aria-details": ariaDetails,
           ref: mergedRef,
+          __downloadDataCallback: downloadDataCallback,
           children: [
             /* @__PURE__ */ jsx(
               XYChart.BarSeries,
@@ -138,6 +161,7 @@ function TopListRender(props, forwardedRef) {
                 type: "numerical",
                 position: "bottom",
                 hidden: true,
+                hideCrosshair: true,
                 disableZoom: true,
                 disablePan: true,
                 formatter: valueFormatter
@@ -149,12 +173,14 @@ function TopListRender(props, forwardedRef) {
                 id: Y_AXIS_ID,
                 type: "categorical",
                 position: "left",
-                formatter: yAxisFormatter
+                formatter: yAxisFormatter,
+                hideCrosshair: true
               }
             ),
             /* @__PURE__ */ jsx(XYChart.Legend, { hidden: true }),
             syntheticColorRules.map((rule) => /* @__PURE__ */ jsx(XYChart.ColorRule, { ...rule }, rule.matchValue)),
-            children
+            children,
+            /* @__PURE__ */ jsx(XYChart.Select, { disabled: true })
           ]
         }
       )