@dynatrace/strato-components 3.11.2 → 3.12.0

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/top-list/TopList.tsx"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport {\n  type ForwardedRef,\n  type ReactElement,\n  type RefAttributes,\n  forwardRef,\n  useCallback,\n  useMemo,\n  useRef,\n} from 'react';\n\nimport {\n  ROW_HEIGHT,\n  ROW_KEY,\n  SERIES_ID_KEY,\n  SERIES_NAME_KEY,\n  X_AXIS_ID,\n  Y_AXIS_ID,\n} from './constants.js';\nimport { scrollContainer } from './TopList.sty.js';\nimport type { TopListActionItem, TopListProps } from './types/top-list.js';\nimport { useBehavioralTrackingProps } from '../../core/hooks/useBehavioralTrackingProps.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport { ColorRule } from '../core/slots/ColorRule.js';\nimport type {\n  ChartColorPalette,\n  ChartDatapoint,\n} from '../core/types/chart-data.js';\nimport { isColoredRangeArray } from '../core/types/colored-range.js';\nimport type { CategoricalFormatter } from '../core/types/formatter.js';\nimport {\n  coerceSizeValue,\n  coerceSizeValueToPixels,\n} from '../core/utils/coerceSizeValue.js';\nimport { getColorPalette } from '../core/utils/get-color-palette.js';\nimport { getFormatter } from '../core/utils/get-formatter.js';\nimport {\n  DEFAULT_CHART_HEIGHT,\n  DEFAULT_COLOR_PALETTE,\n} from '../xy-chart/constants/defaults.js';\nimport type {\n  XYChartBarSeriesActionItem,\n  XYChartRef,\n} from '../xy-chart/types/xy-chart.js';\nimport { XYChart } from '../xy-chart/XYChartRoot.js';\n\nexport type { ChartColorPalette, TopListActionItem, TopListProps };\n\nconst COMPONENT_NAME_BEHAVIOURAL_TRACKING = 'TopList';\n\nfunction TopListRender<Data extends ChartDatapoint = ChartDatapoint>(\n  props: TopListProps<Data>,\n  forwardedRef: ForwardedRef<XYChartRef>,\n) {\n  const {\n    data,\n    labelAccessor,\n    valueAccessor,\n    valueFormatter,\n    comparator,\n    actions,\n    colorPaletteMode,\n    colorPalette,\n    children,\n    height = DEFAULT_CHART_HEIGHT,\n    width,\n    loading,\n    truncationMode,\n    className,\n    style,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    // @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.\n    'data-dt-component': componentName = COMPONENT_NAME_BEHAVIOURAL_TRACKING,\n  } = props;\n\n  const [behaviorTrackingProps] = useBehavioralTrackingProps(props);\n  const internalRef = useRef<XYChartRef>(null);\n  const mergedRef = useMergeRefs([internalRef, forwardedRef]);\n  const onScroll = useCallback(() => internalRef.current?.reset(), []);\n\n  const dataWithSyntheticFields = useMemo(() => {\n    const sortDescending = (a: ChartDatapoint, b: ChartDatapoint) =>\n      Number(b[valueAccessor]) - Number(a[valueAccessor]);\n\n    return data\n      .map((d, i) => ({\n        ...d,\n        [SERIES_ID_KEY]: 'series',\n        [SERIES_NAME_KEY]: 'Series',\n        [ROW_KEY]: String(i),\n      }))\n      .sort(comparator ?? sortDescending) as ChartDatapoint[];\n  }, [comparator, data, valueAccessor]);\n\n  const wrappedActions = useMemo(() => {\n    if (!actions) {\n      return undefined;\n    }\n\n    return (item: XYChartBarSeriesActionItem) => {\n      const rowKey = item.datapoint[ROW_KEY] as string;\n      return actions(data[Number(rowKey)]);\n    };\n  }, [actions, data]);\n\n  const yAxisFormatter = useMemo<CategoricalFormatter>(() => {\n    const numFormatter = getFormatter(valueFormatter);\n    return (_rowKey, record) => numFormatter(Number(record[valueAccessor]));\n  }, [valueFormatter, valueAccessor]);\n\n  const syntheticColorRules = useMemo(() => {\n    if (colorPaletteMode !== 'multi-color') {\n      return [];\n    }\n\n    const effectivePalette = colorPalette ?? DEFAULT_COLOR_PALETTE;\n\n    if (isColoredRangeArray(effectivePalette)) {\n      return [];\n    }\n\n    return dataWithSyntheticFields.map((item, i) => ({\n      valueAccessor: ROW_KEY,\n      comparator: 'equals' as const,\n      matchValue: String(item[ROW_KEY]),\n      color: getColorPalette(String(item[labelAccessor]), i, effectivePalette)\n        .Default,\n    }));\n  }, [colorPaletteMode, colorPalette, dataWithSyntheticFields, labelAccessor]);\n\n  const viewportPx = coerceSizeValueToPixels(height) ?? DEFAULT_CHART_HEIGHT;\n  const contentHeight = Math.max(viewportPx, data.length * ROW_HEIGHT);\n\n  return (\n    <div\n      className={clsx(scrollContainer, className)}\n      style={{ ...style, height: coerceSizeValue(height) }}\n      onScroll={onScroll}\n      data-dt-component={componentName}\n      data-dtrum-mask={dataDtrumMask}\n      data-dtrum-allow={dataDtrumAllow}\n      {...behaviorTrackingProps}\n    >\n      <XYChart\n        data={dataWithSyntheticFields}\n        height={contentHeight}\n        width={width}\n        loading={loading}\n        truncationMode={truncationMode}\n        colorPalette={colorPalette}\n        ref={mergedRef}\n      >\n        <XYChart.BarSeries\n          variant=\"single\"\n          y0Accessor={ROW_KEY}\n          x1Accessor={valueAccessor}\n          labelAccessor={labelAccessor}\n          seriesIdAccessor={SERIES_ID_KEY}\n          nameAccessor={SERIES_NAME_KEY}\n          yAxisId={Y_AXIS_ID}\n          xAxisId={X_AXIS_ID}\n          actions={wrappedActions}\n        />\n        <XYChart.XAxis\n          id={X_AXIS_ID}\n          type=\"numerical\"\n          position=\"bottom\"\n          hidden\n          disableZoom\n          disablePan\n          formatter={valueFormatter}\n        />\n        <XYChart.YAxis\n          id={Y_AXIS_ID}\n          type=\"categorical\"\n          position=\"left\"\n          formatter={yAxisFormatter}\n        />\n        <XYChart.Legend hidden />\n        {syntheticColorRules.map((rule) => (\n          <XYChart.ColorRule key={rule.matchValue} {...rule} />\n        ))}\n        {children}\n      </XYChart>\n    </div>\n  );\n}\n\nconst TopListRoot = forwardRef(TopListRender) as unknown as <\n  Data extends ChartDatapoint = ChartDatapoint,\n>(\n  props: TopListProps<Data> & RefAttributes<XYChartRef>,\n) => ReactElement | null;\n\n/**\n * A horizontal ranked-bar chart with labels inside bars and a hidden numerical\n * axis, implemented as a wrapper around XYChart. When the list has more items\n * than fit in `height`, the viewport becomes scrollable.\n *\n * Slots such as `<TopList.ColorRule>` can be passed as children to customize\n * bar colors per datapoint; they are forwarded to the internal `XYChart`.\n * @public\n */\nexport const TopList = Object.assign(TopListRoot, {\n  /**\n   * Apply a conditional color override to bars matching the rule. Same\n   * component reference as `XYChart.ColorRule` and `TimeseriesChart.ColorRule`.\n   */\n  ColorRule,\n});\n\n(TopList as typeof TopList & { displayName: string }).displayName = 'TopList';\n"],
-  "mappings": "AAgJM,SASE,KATF;AAhJN,OAAO,UAAU;AACjB;AAAA,EAIE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,uBAAuB;AAEhC,SAAS,kCAAkC;AAC3C,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB;AAK1B,SAAS,2BAA2B;AAEpC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,uBAAuB;AAChC,SAAS,oBAAoB;AAC7B;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAKP,SAAS,eAAe;AAIxB,MAAM,sCAAsC;AAE5C,SAAS,cACP,OACA,cACA;AACA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB;AAAA,IACnB,oBAAoB;AAAA;AAAA,IAEpB,qBAAqB,gBAAgB;AAAA,EACvC,IAAI;AAEJ,QAAM,CAAC,qBAAqB,IAAI,2BAA2B,KAAK;AAChE,QAAM,cAAc,OAAmB,IAAI;AAC3C,QAAM,YAAY,aAAa,CAAC,aAAa,YAAY,CAAC;AAC1D,QAAM,WAAW,YAAY,MAAM,YAAY,SAAS,MAAM,GAAG,CAAC,CAAC;AAEnE,QAAM,0BAA0B,QAAQ,MAAM;AAC5C,UAAM,iBAAiB,CAAC,GAAmB,MACzC,OAAO,EAAE,aAAa,CAAC,IAAI,OAAO,EAAE,aAAa,CAAC;AAEpD,WAAO,KACJ,IAAI,CAAC,GAAG,OAAO;AAAA,MACd,GAAG;AAAA,MACH,CAAC,aAAa,GAAG;AAAA,MACjB,CAAC,eAAe,GAAG;AAAA,MACnB,CAAC,OAAO,GAAG,OAAO,CAAC;AAAA,IACrB,EAAE,EACD,KAAK,cAAc,cAAc;AAAA,EACtC,GAAG,CAAC,YAAY,MAAM,aAAa,CAAC;AAEpC,QAAM,iBAAiB,QAAQ,MAAM;AACnC,QAAI,CAAC,SAAS;AACZ,aAAO;AAAA,IACT;AAEA,WAAO,CAAC,SAAqC;AAC3C,YAAM,SAAS,KAAK,UAAU,OAAO;AACrC,aAAO,QAAQ,KAAK,OAAO,MAAM,CAAC,CAAC;AAAA,IACrC;AAAA,EACF,GAAG,CAAC,SAAS,IAAI,CAAC;AAElB,QAAM,iBAAiB,QAA8B,MAAM;AACzD,UAAM,eAAe,aAAa,cAAc;AAChD,WAAO,CAAC,SAAS,WAAW,aAAa,OAAO,OAAO,aAAa,CAAC,CAAC;AAAA,EACxE,GAAG,CAAC,gBAAgB,aAAa,CAAC;AAElC,QAAM,sBAAsB,QAAQ,MAAM;AACxC,QAAI,qBAAqB,eAAe;AACtC,aAAO,CAAC;AAAA,IACV;AAEA,UAAM,mBAAmB,gBAAgB;AAEzC,QAAI,oBAAoB,gBAAgB,GAAG;AACzC,aAAO,CAAC;AAAA,IACV;AAEA,WAAO,wBAAwB,IAAI,CAAC,MAAM,OAAO;AAAA,MAC/C,eAAe;AAAA,MACf,YAAY;AAAA,MACZ,YAAY,OAAO,KAAK,OAAO,CAAC;AAAA,MAChC,OAAO,gBAAgB,OAAO,KAAK,aAAa,CAAC,GAAG,GAAG,gBAAgB,EACpE;AAAA,IACL,EAAE;AAAA,EACJ,GAAG,CAAC,kBAAkB,cAAc,yBAAyB,aAAa,CAAC;AAE3E,QAAM,aAAa,wBAAwB,MAAM,KAAK;AACtD,QAAM,gBAAgB,KAAK,IAAI,YAAY,KAAK,SAAS,UAAU;AAEnE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,KAAK,iBAAiB,SAAS;AAAA,MAC1C,OAAO,EAAE,GAAG,OAAO,QAAQ,gBAAgB,MAAM,EAAE;AAAA,MACnD;AAAA,MACA,qBAAmB;AAAA,MACnB,mBAAiB;AAAA,MACjB,oBAAkB;AAAA,MACjB,GAAG;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,QAAQ;AAAA,UACR;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,KAAK;AAAA,UAEL;AAAA;AAAA,cAAC,QAAQ;AAAA,cAAR;AAAA,gBACC,SAAQ;AAAA,gBACR,YAAY;AAAA,gBACZ,YAAY;AAAA,gBACZ;AAAA,gBACA,kBAAkB;AAAA,gBAClB,cAAc;AAAA,gBACd,SAAS;AAAA,gBACT,SAAS;AAAA,gBACT,SAAS;AAAA;AAAA,YACX;AAAA,YACA;AAAA,cAAC,QAAQ;AAAA,cAAR;AAAA,gBACC,IAAI;AAAA,gBACJ,MAAK;AAAA,gBACL,UAAS;AAAA,gBACT,QAAM;AAAA,gBACN,aAAW;AAAA,gBACX,YAAU;AAAA,gBACV,WAAW;AAAA;AAAA,YACb;AAAA,YACA;AAAA,cAAC,QAAQ;AAAA,cAAR;AAAA,gBACC,IAAI;AAAA,gBACJ,MAAK;AAAA,gBACL,UAAS;AAAA,gBACT,WAAW;AAAA;AAAA,YACb;AAAA,YACA,oBAAC,QAAQ,QAAR,EAAe,QAAM,MAAC;AAAA,YACtB,oBAAoB,IAAI,CAAC,SACxB,oBAAC,QAAQ,WAAR,EAAyC,GAAG,QAArB,KAAK,UAAsB,CACpD;AAAA,YACA;AAAA;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;AAEA,MAAM,cAAc,WAAW,aAAa;AAerC,MAAM,UAAU,OAAO,OAAO,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA,EAKhD;AACF,CAAC;AAEA,QAAqD,cAAc;",
+  "sourcesContent": ["import clsx from 'clsx';\nimport {\n  type ForwardedRef,\n  type ReactElement,\n  type RefAttributes,\n  forwardRef,\n  useCallback,\n  useMemo,\n  useRef,\n} from 'react';\n\nimport {\n  ROW_HEIGHT,\n  ROW_KEY,\n  SERIES_ID_KEY,\n  SERIES_NAME_KEY,\n  TOP_LIST_ARIA_LABEL,\n  X_AXIS_ID,\n  Y_AXIS_ID,\n} from './constants.js';\nimport { scrollContainer } from './TopList.sty.js';\nimport type { TopListActionItem, TopListProps } from './types/top-list.js';\nimport { useBehavioralTrackingProps } from '../../core/hooks/useBehavioralTrackingProps.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport { downloadCSV, escapeForCSV } from '../../core/utils/download.js';\nimport { CSS_DOWNLOAD_FILENAME } from '../core/constants.js';\nimport { ColorRule } from '../core/slots/ColorRule.js';\nimport type {\n  ChartColorPalette,\n  ChartDatapoint,\n} from '../core/types/chart-data.js';\nimport { isColoredRangeArray } from '../core/types/colored-range.js';\nimport type { CategoricalFormatter } from '../core/types/formatter.js';\nimport {\n  coerceSizeValue,\n  coerceSizeValueToPixels,\n} from '../core/utils/coerceSizeValue.js';\nimport { getColorPalette } from '../core/utils/get-color-palette.js';\nimport { getFormatter } from '../core/utils/get-formatter.js';\nimport {\n  DEFAULT_CHART_HEIGHT,\n  DEFAULT_COLOR_PALETTE,\n} from '../xy-chart/constants/defaults.js';\nimport type {\n  XYChartBarSeriesActionItem,\n  XYChartRef,\n} from '../xy-chart/types/xy-chart.js';\nimport { XYChart } from '../xy-chart/XYChartRoot.js';\n\nexport type { ChartColorPalette, TopListActionItem, TopListProps };\n\nconst COMPONENT_NAME_BEHAVIOURAL_TRACKING = 'TopList';\n\nfunction TopListRender<Data extends ChartDatapoint = ChartDatapoint>(\n  props: TopListProps<Data>,\n  forwardedRef: ForwardedRef<XYChartRef>,\n) {\n  const {\n    data,\n    labelAccessor,\n    valueAccessor,\n    valueFormatter,\n    comparator,\n    actions,\n    colorPaletteMode,\n    colorPalette,\n    children,\n    height = DEFAULT_CHART_HEIGHT,\n    width,\n    loading,\n    truncationMode,\n    className,\n    style,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    // @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.\n    'data-dt-component': componentName = COMPONENT_NAME_BEHAVIOURAL_TRACKING,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-details': ariaDetails,\n  } = props;\n\n  const [behaviorTrackingProps] = useBehavioralTrackingProps(props);\n  const internalRef = useRef<XYChartRef>(null);\n  const mergedRef = useMergeRefs([internalRef, forwardedRef]);\n  const onScroll = useCallback(() => internalRef.current?.reset(), []);\n\n  const dataWithSyntheticFields = useMemo(() => {\n    const sortDescending = (a: ChartDatapoint, b: ChartDatapoint) =>\n      Number(b[valueAccessor]) - Number(a[valueAccessor]);\n\n    return data\n      .map((d, i) => ({\n        ...d,\n        [SERIES_ID_KEY]: 'series',\n        [SERIES_NAME_KEY]: 'Series',\n        [ROW_KEY]: String(i),\n      }))\n      .sort(comparator ?? sortDescending) as ChartDatapoint[];\n  }, [comparator, data, valueAccessor]);\n\n  const wrappedActions = useMemo(() => {\n    if (!actions) {\n      return undefined;\n    }\n\n    return (item: XYChartBarSeriesActionItem) => {\n      const rowKey = item.datapoint[ROW_KEY] as string;\n      return actions(data[Number(rowKey)]);\n    };\n  }, [actions, data]);\n\n  const yAxisFormatter = useMemo<CategoricalFormatter>(() => {\n    const numFormatter = getFormatter(valueFormatter);\n    return (_rowKey, record) => numFormatter(Number(record[valueAccessor]));\n  }, [valueFormatter, valueAccessor]);\n\n  const downloadDataCallback = useCallback(() => {\n    const rows = dataWithSyntheticFields\n      .map((d) => {\n        const label = escapeForCSV(d[labelAccessor]);\n        const value = escapeForCSV(d[valueAccessor]);\n        return `${label},${value}`;\n      })\n      .join('\\n');\n    const csvContent = rows ? `Label,Value\\n${rows}\\n` : 'Label,Value\\n';\n    downloadCSV(csvContent, CSS_DOWNLOAD_FILENAME);\n  }, [dataWithSyntheticFields, labelAccessor, valueAccessor]);\n\n  const syntheticColorRules = useMemo(() => {\n    if (colorPaletteMode !== 'multi-color') {\n      return [];\n    }\n\n    const effectivePalette = colorPalette ?? DEFAULT_COLOR_PALETTE;\n\n    if (isColoredRangeArray(effectivePalette)) {\n      return [];\n    }\n\n    return dataWithSyntheticFields.map((item, i) => ({\n      valueAccessor: ROW_KEY,\n      comparator: 'equals' as const,\n      matchValue: String(item[ROW_KEY]),\n      color: getColorPalette(String(item[labelAccessor]), i, effectivePalette)\n        .Default,\n    }));\n  }, [colorPaletteMode, colorPalette, dataWithSyntheticFields, labelAccessor]);\n\n  const viewportPx = coerceSizeValueToPixels(height) ?? DEFAULT_CHART_HEIGHT;\n  const contentHeight = Math.max(viewportPx, data.length * ROW_HEIGHT);\n\n  return (\n    <div\n      className={clsx(scrollContainer, className)}\n      style={{ ...style, height: coerceSizeValue(height) }}\n      onScroll={onScroll}\n      data-dt-component={componentName}\n      data-dtrum-mask={dataDtrumMask}\n      data-dtrum-allow={dataDtrumAllow}\n      {...behaviorTrackingProps}\n    >\n      <XYChart\n        data={dataWithSyntheticFields}\n        height={contentHeight}\n        width={width}\n        loading={loading}\n        truncationMode={truncationMode}\n        colorPalette={colorPalette}\n        aria-label={ariaLabel ?? TOP_LIST_ARIA_LABEL}\n        aria-labelledby={ariaLabelledBy}\n        aria-describedby={ariaDescribedBy}\n        aria-details={ariaDetails}\n        ref={mergedRef}\n        __downloadDataCallback={downloadDataCallback}\n      >\n        <XYChart.BarSeries\n          variant=\"single\"\n          y0Accessor={ROW_KEY}\n          x1Accessor={valueAccessor}\n          labelAccessor={labelAccessor}\n          seriesIdAccessor={SERIES_ID_KEY}\n          nameAccessor={SERIES_NAME_KEY}\n          yAxisId={Y_AXIS_ID}\n          xAxisId={X_AXIS_ID}\n          actions={wrappedActions}\n        />\n        <XYChart.XAxis\n          id={X_AXIS_ID}\n          type=\"numerical\"\n          position=\"bottom\"\n          hidden\n          hideCrosshair\n          disableZoom\n          disablePan\n          formatter={valueFormatter}\n        />\n        <XYChart.YAxis\n          id={Y_AXIS_ID}\n          type=\"categorical\"\n          position=\"left\"\n          formatter={yAxisFormatter}\n          hideCrosshair\n        />\n        <XYChart.Legend hidden />\n        {syntheticColorRules.map((rule) => (\n          <XYChart.ColorRule key={rule.matchValue} {...rule} />\n        ))}\n        {children}\n        <XYChart.Select disabled />\n      </XYChart>\n    </div>\n  );\n}\n\nconst TopListRoot = forwardRef(TopListRender) as unknown as <\n  Data extends ChartDatapoint = ChartDatapoint,\n>(\n  props: TopListProps<Data> & RefAttributes<XYChartRef>,\n) => ReactElement | null;\n\n/**\n * A horizontal ranked-bar chart with labels inside bars and a hidden numerical\n * axis, implemented as a wrapper around XYChart. When the list has more items\n * than fit in `height`, the viewport becomes scrollable.\n *\n * Slots such as `<TopList.ColorRule>` can be passed as children to customize\n * bar colors per datapoint; they are forwarded to the internal `XYChart`.\n * @public\n */\nexport const TopList = Object.assign(TopListRoot, {\n  /**\n   * Apply a conditional color override to bars matching the rule. Same\n   * component reference as `XYChart.ColorRule` and `TimeseriesChart.ColorRule`.\n   */\n  ColorRule,\n});\n\n(TopList as typeof TopList & { displayName: string }).displayName = 'TopList';\n"],
+  "mappings": "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",
   "names": []
 }

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

@@ -1,5 +1,5 @@
 import "./TopList.css";
-var scrollContainer = "_jwlby60-3-11-2";
+var scrollContainer = "_jwlby60-3-12-0";
 export {
   scrollContainer
 };

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/top-list/TopList.css.ts"],
-  "sourcesContent": ["import './TopList.css';\nexport var scrollContainer = '_jwlby60-3-11-2';"],
+  "sourcesContent": ["import './TopList.css';\nexport var scrollContainer = '_jwlby60-3-12-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,kBAAkB;",
   "names": []
 }

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

@@ -5,11 +5,13 @@ const SERIES_NAME_KEY = "__toplist_series_name__";
 const ROW_KEY = "__toplist_row_key__";
 const X_AXIS_ID = "toplist-x";
 const Y_AXIS_ID = "toplist-y";
+const TOP_LIST_ARIA_LABEL = "Top List";
 export {
   ROW_HEIGHT,
   ROW_KEY,
   SERIES_ID_KEY,
   SERIES_NAME_KEY,
+  TOP_LIST_ARIA_LABEL,
   X_AXIS_ID,
   Y_AXIS_ID
 };

package/esm/charts/top-list/constants.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/top-list/constants.ts"],
-  "sourcesContent": ["import { MIN_LABELED_BAR_SIZE } from '../xy-chart/constants/defaults.js';\n\n/** @internal */\nexport const ROW_HEIGHT = MIN_LABELED_BAR_SIZE;\n\n/** @internal */\nexport const SERIES_ID_KEY = '__toplist_series_id__';\n\n/** @internal */\nexport const SERIES_NAME_KEY = '__toplist_series_name__';\n\n/** @internal */\nexport const ROW_KEY = '__toplist_row_key__';\n\n/** @internal */\nexport const X_AXIS_ID = 'toplist-x';\n\n/** @internal */\nexport const Y_AXIS_ID = 'toplist-y';\n"],
-  "mappings": "AAAA,SAAS,4BAA4B;AAG9B,MAAM,aAAa;AAGnB,MAAM,gBAAgB;AAGtB,MAAM,kBAAkB;AAGxB,MAAM,UAAU;AAGhB,MAAM,YAAY;AAGlB,MAAM,YAAY;",
+  "sourcesContent": ["import { MIN_LABELED_BAR_SIZE } from '../xy-chart/constants/defaults.js';\n\n/** @internal */\nexport const ROW_HEIGHT = MIN_LABELED_BAR_SIZE;\n\n/** @internal */\nexport const SERIES_ID_KEY = '__toplist_series_id__';\n\n/** @internal */\nexport const SERIES_NAME_KEY = '__toplist_series_name__';\n\n/** @internal */\nexport const ROW_KEY = '__toplist_row_key__';\n\n/** @internal */\nexport const X_AXIS_ID = 'toplist-x';\n\n/** @internal */\nexport const Y_AXIS_ID = 'toplist-y';\n\n/** @internal */\nexport const TOP_LIST_ARIA_LABEL = 'Top List';\n"],
+  "mappings": "AAAA,SAAS,4BAA4B;AAG9B,MAAM,aAAa;AAGnB,MAAM,gBAAgB;AAGtB,MAAM,kBAAkB;AAGxB,MAAM,UAAU;AAGhB,MAAM,YAAY;AAGlB,MAAM,YAAY;AAGlB,MAAM,sBAAsB;",
   "names": []
 }

package/esm/charts/tree-map/components/TreeMapOverlay/TreeMapOverlay.css

@@ -1,4 +1,4 @@
-._1iqz50a0-3-11-2 {
+._1iqz50a0-3-12-0 {
   position: absolute;
   top: 0;
   left: 0;

package/esm/charts/tree-map/components/TreeMapOverlay/TreeMapOverlay.sty.js

@@ -1,5 +1,5 @@
 import "./TreeMapOverlay.css";
-var container = "_1iqz50a0-3-11-2";
+var container = "_1iqz50a0-3-12-0";
 export {
   container
 };

package/esm/charts/tree-map/components/TreeMapOverlay/TreeMapOverlay.sty.js.map

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

package/esm/charts/tree-map/providers/TreeMapInternalDataProvider.js

@@ -1,6 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { useContext } from "react";
-import { useMemo } from "react";
+import { useContext, useMemo } from "react";
 import { useColorRuleConfig } from "../../core/context/ColorRuleContext.js";
 import { NAME_ACCESSOR } from "../constants.js";
 import { useColorPalette } from "../context/ColorPaletteContext.js";

package/esm/charts/tree-map/providers/TreeMapInternalDataProvider.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/tree-map/providers/TreeMapInternalDataProvider.tsx"],
-  "sourcesContent": ["import { type PropsWithChildren, useContext } from 'react';\nimport { useMemo } from 'react';\n\nimport { useColorRuleConfig } from '../../core/context/ColorRuleContext.js';\nimport { NAME_ACCESSOR } from '../constants.js';\nimport { useColorPalette } from '../context/ColorPaletteContext.js';\nimport { FormatterContext } from '../context/FormatterContext.js';\nimport { useNameAccessor } from '../context/NameAccessorContext.js';\nimport { TreeMapInternalDataContext } from '../context/TreeMapInternalDataContext.js';\nimport { useTreeMapRawData } from '../context/TreeMapRawDataContext.js';\nimport { useMinMaxConfig } from '../hooks/useMinMaxConfig.js';\nimport { useSetState } from '../store/selectors.js';\nimport { getColoredInternalCategoricalData } from '../utils/get-colored-internal-categorical-data.js';\nimport { getColoredInternalRangeData } from '../utils/get-colored-internal-range-data.js';\nimport { getSortedTree } from '../utils/get-sorted-tree.js';\nimport { getTreeMapColorPalette } from '../utils/get-tree-map-color-palette.js';\nimport { mapToInternalTree } from '../utils/map-to-internal-tree.js';\n\nexport const TreeMapInternalDataProvider = ({\n  children,\n}: PropsWithChildren) => {\n  const colorPalette = useColorPalette();\n  const setState = useSetState();\n  const nameAccessor = useNameAccessor();\n  const { tree, unit } = useTreeMapRawData();\n  const { formatter } = useContext(FormatterContext);\n  const minMaxConfig = useMinMaxConfig();\n  const colorRules = useColorRuleConfig();\n\n  const data = useMemo(\n    () => getSortedTree(mapToInternalTree(tree, formatter, unit)),\n    [tree, formatter, unit],\n  );\n\n  const isRangeLegend = nameAccessor === NAME_ACCESSOR.Value;\n\n  const { rangeColorPalette, categoricalColorPalette } =\n    getTreeMapColorPalette(colorPalette);\n\n  const { data: internalData, legendColorMap } = useMemo(() => {\n    if (isRangeLegend) {\n      return getColoredInternalRangeData(\n        data,\n        rangeColorPalette,\n        minMaxConfig,\n        colorRules,\n        unit,\n      );\n    }\n\n    return getColoredInternalCategoricalData(\n      data,\n      categoricalColorPalette,\n      nameAccessor,\n      colorRules,\n      unit,\n    );\n  }, [\n    isRangeLegend,\n    data,\n    unit,\n    categoricalColorPalette,\n    nameAccessor,\n    rangeColorPalette,\n    minMaxConfig,\n    colorRules,\n  ]);\n\n  setState((prev) => ({\n    ...prev,\n    colorMap: legendColorMap,\n  }));\n\n  return (\n    <TreeMapInternalDataContext.Provider value={internalData}>\n      {children}\n    </TreeMapInternalDataContext.Provider>\n  );\n};\n\nTreeMapInternalDataProvider['displayName'] = 'TreeMapInternalDataProvider';\n"],
-  "mappings": "AA0EI;AA1EJ,SAAiC,kBAAkB;AACnD,SAAS,eAAe;AAExB,SAAS,0BAA0B;AACnC,SAAS,qBAAqB;AAC9B,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAChC,SAAS,kCAAkC;AAC3C,SAAS,yBAAyB;AAClC,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,yCAAyC;AAClD,SAAS,mCAAmC;AAC5C,SAAS,qBAAqB;AAC9B,SAAS,8BAA8B;AACvC,SAAS,yBAAyB;AAE3B,MAAM,8BAA8B,CAAC;AAAA,EAC1C;AACF,MAAyB;AACvB,QAAM,eAAe,gBAAgB;AACrC,QAAM,WAAW,YAAY;AAC7B,QAAM,eAAe,gBAAgB;AACrC,QAAM,EAAE,MAAM,KAAK,IAAI,kBAAkB;AACzC,QAAM,EAAE,UAAU,IAAI,WAAW,gBAAgB;AACjD,QAAM,eAAe,gBAAgB;AACrC,QAAM,aAAa,mBAAmB;AAEtC,QAAM,OAAO;AAAA,IACX,MAAM,cAAc,kBAAkB,MAAM,WAAW,IAAI,CAAC;AAAA,IAC5D,CAAC,MAAM,WAAW,IAAI;AAAA,EACxB;AAEA,QAAM,gBAAgB,iBAAiB,cAAc;AAErD,QAAM,EAAE,mBAAmB,wBAAwB,IACjD,uBAAuB,YAAY;AAErC,QAAM,EAAE,MAAM,cAAc,eAAe,IAAI,QAAQ,MAAM;AAC3D,QAAI,eAAe;AACjB,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAEA,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,WAAS,CAAC,UAAU;AAAA,IAClB,GAAG;AAAA,IACH,UAAU;AAAA,EACZ,EAAE;AAEF,SACE,oBAAC,2BAA2B,UAA3B,EAAoC,OAAO,cACzC,UACH;AAEJ;AAEA,4BAA4B,aAAa,IAAI;",
+  "sourcesContent": ["import { type PropsWithChildren, useContext, useMemo } from 'react';\n\nimport { useColorRuleConfig } from '../../core/context/ColorRuleContext.js';\nimport { NAME_ACCESSOR } from '../constants.js';\nimport { useColorPalette } from '../context/ColorPaletteContext.js';\nimport { FormatterContext } from '../context/FormatterContext.js';\nimport { useNameAccessor } from '../context/NameAccessorContext.js';\nimport { TreeMapInternalDataContext } from '../context/TreeMapInternalDataContext.js';\nimport { useTreeMapRawData } from '../context/TreeMapRawDataContext.js';\nimport { useMinMaxConfig } from '../hooks/useMinMaxConfig.js';\nimport { useSetState } from '../store/selectors.js';\nimport { getColoredInternalCategoricalData } from '../utils/get-colored-internal-categorical-data.js';\nimport { getColoredInternalRangeData } from '../utils/get-colored-internal-range-data.js';\nimport { getSortedTree } from '../utils/get-sorted-tree.js';\nimport { getTreeMapColorPalette } from '../utils/get-tree-map-color-palette.js';\nimport { mapToInternalTree } from '../utils/map-to-internal-tree.js';\n\nexport const TreeMapInternalDataProvider = ({\n  children,\n}: PropsWithChildren) => {\n  const colorPalette = useColorPalette();\n  const setState = useSetState();\n  const nameAccessor = useNameAccessor();\n  const { tree, unit } = useTreeMapRawData();\n  const { formatter } = useContext(FormatterContext);\n  const minMaxConfig = useMinMaxConfig();\n  const colorRules = useColorRuleConfig();\n\n  const data = useMemo(\n    () => getSortedTree(mapToInternalTree(tree, formatter, unit)),\n    [tree, formatter, unit],\n  );\n\n  const isRangeLegend = nameAccessor === NAME_ACCESSOR.Value;\n\n  const { rangeColorPalette, categoricalColorPalette } =\n    getTreeMapColorPalette(colorPalette);\n\n  const { data: internalData, legendColorMap } = useMemo(() => {\n    if (isRangeLegend) {\n      return getColoredInternalRangeData(\n        data,\n        rangeColorPalette,\n        minMaxConfig,\n        colorRules,\n        unit,\n      );\n    }\n\n    return getColoredInternalCategoricalData(\n      data,\n      categoricalColorPalette,\n      nameAccessor,\n      colorRules,\n      unit,\n    );\n  }, [\n    isRangeLegend,\n    data,\n    unit,\n    categoricalColorPalette,\n    nameAccessor,\n    rangeColorPalette,\n    minMaxConfig,\n    colorRules,\n  ]);\n\n  setState((prev) => ({\n    ...prev,\n    colorMap: legendColorMap,\n  }));\n\n  return (\n    <TreeMapInternalDataContext.Provider value={internalData}>\n      {children}\n    </TreeMapInternalDataContext.Provider>\n  );\n};\n\nTreeMapInternalDataProvider['displayName'] = 'TreeMapInternalDataProvider';\n"],
+  "mappings": "AAyEI;AAzEJ,SAAiC,YAAY,eAAe;AAE5D,SAAS,0BAA0B;AACnC,SAAS,qBAAqB;AAC9B,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAChC,SAAS,kCAAkC;AAC3C,SAAS,yBAAyB;AAClC,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,yCAAyC;AAClD,SAAS,mCAAmC;AAC5C,SAAS,qBAAqB;AAC9B,SAAS,8BAA8B;AACvC,SAAS,yBAAyB;AAE3B,MAAM,8BAA8B,CAAC;AAAA,EAC1C;AACF,MAAyB;AACvB,QAAM,eAAe,gBAAgB;AACrC,QAAM,WAAW,YAAY;AAC7B,QAAM,eAAe,gBAAgB;AACrC,QAAM,EAAE,MAAM,KAAK,IAAI,kBAAkB;AACzC,QAAM,EAAE,UAAU,IAAI,WAAW,gBAAgB;AACjD,QAAM,eAAe,gBAAgB;AACrC,QAAM,aAAa,mBAAmB;AAEtC,QAAM,OAAO;AAAA,IACX,MAAM,cAAc,kBAAkB,MAAM,WAAW,IAAI,CAAC;AAAA,IAC5D,CAAC,MAAM,WAAW,IAAI;AAAA,EACxB;AAEA,QAAM,gBAAgB,iBAAiB,cAAc;AAErD,QAAM,EAAE,mBAAmB,wBAAwB,IACjD,uBAAuB,YAAY;AAErC,QAAM,EAAE,MAAM,cAAc,eAAe,IAAI,QAAQ,MAAM;AAC3D,QAAI,eAAe;AACjB,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAEA,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,WAAS,CAAC,UAAU;AAAA,IAClB,GAAG;AAAA,IACH,UAAU;AAAA,EACZ,EAAE;AAEF,SACE,oBAAC,2BAA2B,UAA3B,EAAoC,OAAO,cACzC,UACH;AAEJ;AAEA,4BAA4B,aAAa,IAAI;",
   "names": []
 }

package/esm/charts/xy-chart/XYChart.js

@@ -40,8 +40,15 @@ import {
 import { useChartLayoutLoading } from "../core/components/chart-layout/hooks/useChartLayoutLoading.js";
 import { useGraphSize } from "../core/components/chart-layout/hooks/useGraphSize.js";
 import { ChartLoaderOverlay } from "../core/components/chart-loader-overlay/ChartLoaderOverlay.js";
+import { useAriaLabelingContext } from "../core/context/AriaLabelingContext.js";
 const XYChart = forwardRef(
   ({ config }, forwardedRef) => {
+    const {
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-describedby": ariaDescribedBy,
+      "aria-details": ariaDetails
+    } = useAriaLabelingContext();
     const loading = useChartLayoutLoading();
     const { width, height } = useGraphSize();
     const chartRef = useRef(null);
@@ -78,7 +85,7 @@ const XYChart = forwardRef(
       bottomAxisMaxSize,
       topAxisMaxSize,
       gridAnnotationsHeight
-    ) : "0px 0px 1fr 1px";
+    ) : "0px 0px 0px 1fr 0px 1px";
     return /* @__PURE__ */ jsx(
       "div",
       {
@@ -87,7 +94,10 @@ const XYChart = forwardRef(
           paddingTop: paddings.top,
           paddingLeft: paddings.left
         },
-        "aria-label": XY_CHART_ARIA_LABEL,
+        "aria-label": ariaLabel ?? XY_CHART_ARIA_LABEL,
+        "aria-labelledby": ariaLabelledBy,
+        "aria-describedby": ariaDescribedBy,
+        "aria-details": ariaDetails,
         role: "img",
         children: /* @__PURE__ */ jsx(
           ChartGrid,

package/esm/charts/xy-chart/XYChart.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/xy-chart/XYChart.tsx"],
-  "sourcesContent": ["import { forwardRef, type PropsWithChildren, useRef } from 'react';\n\nimport { XYChartImperativeHandlerBuilder } from './builders/XYChartImperativeHandlerBuilder.js';\nimport { XYChartAnnotationsArea } from './components/annotations/XYChartAnnotationsArea.js';\nimport { XYChartAnnotationsIndicators } from './components/annotations/XYChartAnnotationsIndicators.js';\nimport { XYChartBottomAxisArea } from './components/axes/XYChartBottomAxisArea.js';\nimport { XYChartLeftAxisArea } from './components/axes/XYChartLeftAxisArea.js';\nimport { XYChartRightAxisArea } from './components/axes/XYChartRightAxisArea.js';\nimport { XYChartTopAxisArea } from './components/axes/XYChartTopAxisArea.js';\nimport { BarLabelLayout } from './components/displays/BarDisplay/BarLabelLayout.js';\nimport { RectLabelLayout } from './components/displays/RectLabelLayout.js';\nimport { XYChartGridLayout } from './components/layout/XYChartGridLayout.js';\nimport { XYChartOverlay } from './components/overlay/XYChartOverlay.js';\nimport { XYChartThresholdArea } from './components/thresholds/XYChartThresholdArea.js';\nimport { XY_CHART_ARIA_LABEL } from './constants/defaults.js';\nimport { XYChartSelectConfigContext } from './context/XYChartSelectConfig.context.js';\nimport { XYChartTooltipContext } from './context/XYChartTooltip.context.js';\nimport { useVisibleAxesConfig } from './hooks/useVisibleAxesConfig.js';\nimport { useXYChartAnnotationsConfig } from './hooks/useXYChartAnnotationsConfig.js';\nimport { useXYChartAnnotationsData } from './hooks/useXYChartAnnotationsData.js';\nimport { useXYChartAnnotationsHiddenTracks } from './hooks/useXYChartAnnotationsHiddenTracks.js';\nimport { useXYChartData } from './hooks/useXYChartData.js';\nimport { XYChartAxisBorder } from './layout/XYChartAxisBorder.js';\nimport { XYChartLayout } from './layout/XYChartLayout.js';\nimport { XYChartProviders } from './providers/XYChartProviders.js';\nimport { XYChartRef } from './types/xy-chart.js';\nimport { getPaddingByAxes } from './utils/get-padding-by-axes.js';\nimport {\n  gridTemplateAreas,\n  gridTemplateColumns,\n  gridTemplateRows,\n} from './utils/grid-templates.js';\nimport type { XYChartConfig } from './utils/xy-chart-configuration.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport { defaultChartSize } from '../../core/styles/defaultChartValues.sty.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 { useGraphSize } from '../core/components/chart-layout/hooks/useGraphSize.js';\nimport { ChartLoaderOverlay } from '../core/components/chart-loader-overlay/ChartLoaderOverlay.js';\n\ninterface XYChartProps {\n  config: XYChartConfig;\n}\n\nexport const XYChart = forwardRef<XYChartRef, PropsWithChildren<XYChartProps>>(\n  ({ config }, forwardedRef) => {\n    const loading = useChartLayoutLoading();\n    const { width, height } = useGraphSize();\n    const chartRef = useRef<HTMLDivElement>(null);\n    const chartAndForwardedRef = useMergeRefs<XYChartRef | HTMLDivElement>([\n      forwardedRef,\n      chartRef,\n    ]);\n    const { top, bottom, left, right } = useVisibleAxesConfig();\n    const { axesMetadata } = useXYChartData();\n\n    const topAxisMaxSize = top?.tickLabelMaxSize;\n    const bottomAxisMaxSize = bottom?.tickLabelMaxSize;\n    const leftAxisMaxSize = left?.tickLabelMaxSize;\n    const rightAxisMaxSize = right?.tickLabelMaxSize;\n    const paddings = getPaddingByAxes({ top, bottom, left, right });\n    const chartGridHeight = height - paddings.vertical();\n    const chartGridWidth = width - paddings.horizontal();\n\n    const annotationsData = useXYChartAnnotationsData();\n    const annotationsConfig = useXYChartAnnotationsConfig();\n    const tracksQuantity = annotationsData?.size ?? 0;\n    const hiddenTracks = useXYChartAnnotationsHiddenTracks();\n\n    const annotationsVisibleArea = getAnnotationsVisibleArea(\n      tracksQuantity,\n      annotationsConfig?.fixedTracks,\n      hiddenTracks.length,\n    );\n\n    const annotationsAreaHeight = annotationsVisibleArea;\n\n    const showAnnotations = shouldShowAnnotations(\n      chartGridHeight,\n      tracksQuantity,\n    );\n\n    const showAxes = shouldShowAxes(chartGridHeight);\n\n    const gridAnnotationsHeight = showAnnotations ? annotationsAreaHeight : 0;\n    const computedGridTemplateRows = showAxes\n      ? gridTemplateRows(\n          bottomAxisMaxSize,\n          topAxisMaxSize,\n          gridAnnotationsHeight,\n        )\n      : '0px 0px 1fr 1px';\n\n    return (\n      <div\n        className={defaultChartSize}\n        style={{\n          paddingTop: paddings.top,\n          paddingLeft: paddings.left,\n        }}\n        aria-label={XY_CHART_ARIA_LABEL}\n        role=\"img\"\n      >\n        <ChartGrid\n          width={chartGridWidth}\n          height={chartGridHeight}\n          gridTemplateAreas={gridTemplateAreas}\n          gridTemplateColumns={gridTemplateColumns(\n            leftAxisMaxSize,\n            rightAxisMaxSize,\n          )}\n          gridTemplateRows={computedGridTemplateRows}\n          ref={chartAndForwardedRef}\n        >\n          <XYChartTooltipContext.Provider value={config.tooltip}>\n            <XYChartSelectConfigContext.Provider value={config.select}>\n              <XYChartProviders>\n                <XYChartImperativeHandlerBuilder\n                  chartRef={forwardedRef}\n                  containerRef={chartRef}\n                  config={config}\n                >\n                  {showAxes && <XYChartTopAxisArea />}\n                  {showAxes && <XYChartBottomAxisArea />}\n                  {showAxes && <XYChartLeftAxisArea />}\n                  {showAxes && <XYChartRightAxisArea />}\n\n                  {showAnnotations && <XYChartAnnotationsArea />}\n                  <ChartGrid.PlotArea>\n                    <XYChartGridLayout />\n                    <XYChartLayout />\n                    <BarLabelLayout />\n                    <RectLabelLayout />\n                    <XYChartAxisBorder />\n                    {showAnnotations && <XYChartAnnotationsIndicators />}\n                    <ChartLoaderOverlay\n                      loading={loading}\n                      zoomEnabled={axesMetadata.isZoomEnabled}\n                    >\n                      <XYChartOverlay />\n                    </ChartLoaderOverlay>\n                  </ChartGrid.PlotArea>\n                  <XYChartThresholdArea />\n                </XYChartImperativeHandlerBuilder>\n              </XYChartProviders>\n            </XYChartSelectConfigContext.Provider>\n          </XYChartTooltipContext.Provider>\n        </ChartGrid>\n      </div>\n    );\n  },\n);\n\n(XYChart as typeof XYChart & { displayName: string }).displayName = 'XYChart';\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { forwardRef, type PropsWithChildren, useRef } from 'react';\n\nimport { XYChartImperativeHandlerBuilder } from './builders/XYChartImperativeHandlerBuilder.js';\nimport { XYChartAnnotationsArea } from './components/annotations/XYChartAnnotationsArea.js';\nimport { XYChartAnnotationsIndicators } from './components/annotations/XYChartAnnotationsIndicators.js';\nimport { XYChartBottomAxisArea } from './components/axes/XYChartBottomAxisArea.js';\nimport { XYChartLeftAxisArea } from './components/axes/XYChartLeftAxisArea.js';\nimport { XYChartRightAxisArea } from './components/axes/XYChartRightAxisArea.js';\nimport { XYChartTopAxisArea } from './components/axes/XYChartTopAxisArea.js';\nimport { BarLabelLayout } from './components/displays/BarDisplay/BarLabelLayout.js';\nimport { RectLabelLayout } from './components/displays/RectLabelLayout.js';\nimport { XYChartGridLayout } from './components/layout/XYChartGridLayout.js';\nimport { XYChartOverlay } from './components/overlay/XYChartOverlay.js';\nimport { XYChartThresholdArea } from './components/thresholds/XYChartThresholdArea.js';\nimport { XY_CHART_ARIA_LABEL } from './constants/defaults.js';\nimport { XYChartSelectConfigContext } from './context/XYChartSelectConfig.context.js';\nimport { XYChartTooltipContext } from './context/XYChartTooltip.context.js';\nimport { useVisibleAxesConfig } from './hooks/useVisibleAxesConfig.js';\nimport { useXYChartAnnotationsConfig } from './hooks/useXYChartAnnotationsConfig.js';\nimport { useXYChartAnnotationsData } from './hooks/useXYChartAnnotationsData.js';\nimport { useXYChartAnnotationsHiddenTracks } from './hooks/useXYChartAnnotationsHiddenTracks.js';\nimport { useXYChartData } from './hooks/useXYChartData.js';\nimport { XYChartAxisBorder } from './layout/XYChartAxisBorder.js';\nimport { XYChartLayout } from './layout/XYChartLayout.js';\nimport { XYChartProviders } from './providers/XYChartProviders.js';\nimport { XYChartRef } from './types/xy-chart.js';\nimport { getPaddingByAxes } from './utils/get-padding-by-axes.js';\nimport {\n  gridTemplateAreas,\n  gridTemplateColumns,\n  gridTemplateRows,\n} from './utils/grid-templates.js';\nimport type { XYChartConfig } from './utils/xy-chart-configuration.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport { defaultChartSize } from '../../core/styles/defaultChartValues.sty.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 { useGraphSize } from '../core/components/chart-layout/hooks/useGraphSize.js';\nimport { ChartLoaderOverlay } from '../core/components/chart-loader-overlay/ChartLoaderOverlay.js';\nimport { useAriaLabelingContext } from '../core/context/AriaLabelingContext.js';\n\ninterface XYChartProps {\n  config: XYChartConfig;\n}\n\nexport const XYChart = forwardRef<XYChartRef, PropsWithChildren<XYChartProps>>(\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 { width, height } = useGraphSize();\n    const chartRef = useRef<HTMLDivElement>(null);\n    const chartAndForwardedRef = useMergeRefs<XYChartRef | HTMLDivElement>([\n      forwardedRef,\n      chartRef,\n    ]);\n    const { top, bottom, left, right } = useVisibleAxesConfig();\n    const { axesMetadata } = useXYChartData();\n\n    const topAxisMaxSize = top?.tickLabelMaxSize;\n    const bottomAxisMaxSize = bottom?.tickLabelMaxSize;\n    const leftAxisMaxSize = left?.tickLabelMaxSize;\n    const rightAxisMaxSize = right?.tickLabelMaxSize;\n    const paddings = getPaddingByAxes({ top, bottom, left, right });\n    const chartGridHeight = height - paddings.vertical();\n    const chartGridWidth = width - paddings.horizontal();\n\n    const annotationsData = useXYChartAnnotationsData();\n    const annotationsConfig = useXYChartAnnotationsConfig();\n    const tracksQuantity = annotationsData?.size ?? 0;\n    const hiddenTracks = useXYChartAnnotationsHiddenTracks();\n\n    const annotationsVisibleArea = getAnnotationsVisibleArea(\n      tracksQuantity,\n      annotationsConfig?.fixedTracks,\n      hiddenTracks.length,\n    );\n\n    const annotationsAreaHeight = annotationsVisibleArea;\n\n    const showAnnotations = shouldShowAnnotations(\n      chartGridHeight,\n      tracksQuantity,\n    );\n\n    const showAxes = shouldShowAxes(chartGridHeight);\n\n    const gridAnnotationsHeight = showAnnotations ? annotationsAreaHeight : 0;\n    const computedGridTemplateRows = showAxes\n      ? gridTemplateRows(\n          bottomAxisMaxSize,\n          topAxisMaxSize,\n          gridAnnotationsHeight,\n        )\n      : '0px 0px 0px 1fr 0px 1px';\n\n    return (\n      <div\n        className={defaultChartSize}\n        style={{\n          paddingTop: paddings.top,\n          paddingLeft: paddings.left,\n        }}\n        aria-label={ariaLabel ?? XY_CHART_ARIA_LABEL}\n        aria-labelledby={ariaLabelledBy}\n        aria-describedby={ariaDescribedBy}\n        aria-details={ariaDetails}\n        role=\"img\"\n      >\n        <ChartGrid\n          width={chartGridWidth}\n          height={chartGridHeight}\n          gridTemplateAreas={gridTemplateAreas}\n          gridTemplateColumns={gridTemplateColumns(\n            leftAxisMaxSize,\n            rightAxisMaxSize,\n          )}\n          gridTemplateRows={computedGridTemplateRows}\n          ref={chartAndForwardedRef}\n        >\n          <XYChartTooltipContext.Provider value={config.tooltip}>\n            <XYChartSelectConfigContext.Provider value={config.select}>\n              <XYChartProviders>\n                <XYChartImperativeHandlerBuilder\n                  chartRef={forwardedRef}\n                  containerRef={chartRef}\n                  config={config}\n                >\n                  {showAxes && <XYChartTopAxisArea />}\n                  {showAxes && <XYChartBottomAxisArea />}\n                  {showAxes && <XYChartLeftAxisArea />}\n                  {showAxes && <XYChartRightAxisArea />}\n\n                  {showAnnotations && <XYChartAnnotationsArea />}\n                  <ChartGrid.PlotArea>\n                    <XYChartGridLayout />\n                    <XYChartLayout />\n                    <BarLabelLayout />\n                    <RectLabelLayout />\n                    <XYChartAxisBorder />\n                    {showAnnotations && <XYChartAnnotationsIndicators />}\n                    <ChartLoaderOverlay\n                      loading={loading}\n                      zoomEnabled={axesMetadata.isZoomEnabled}\n                    >\n                      <XYChartOverlay />\n                    </ChartLoaderOverlay>\n                  </ChartGrid.PlotArea>\n                  <XYChartThresholdArea />\n                </XYChartImperativeHandlerBuilder>\n              </XYChartProviders>\n            </XYChartSelectConfigContext.Provider>\n          </XYChartTooltipContext.Provider>\n        </ChartGrid>\n      </div>\n    );\n  },\n);\n\n(XYChart as typeof XYChart & { displayName: string }).displayName = 'XYChart';\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/charts/xy-chart/XYChartRoot.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { forwardRef, useRef } from "react";
+import { forwardRef, useMemo, useRef } from "react";
 import { XYChartLegend } from "./components/legend/XYChartLegend.js";
 import {
   DEFAULT_CHART_HEIGHT,
@@ -50,7 +50,9 @@ import { ChartLayout } from "../core/components/chart-layout/ChartLayout.js";
 import { useAutoLegendRefresh } from "../core/components/chart-layout/hooks/useAutoLegendRefresh.js";
 import { getChartStatesTemplates } from "../core/components/chart-states/utils/get-chart-states-template.js";
 import { OverlayProvider } from "../core/components/overlay-tooltip/contexts/OverlayContext.js";
+import { PinCoordinationProvider } from "../core/components/overlay-tooltip/contexts/PinCoordinationContext.js";
 import { TooltipProvider } from "../core/components/overlay-tooltip/contexts/TooltipContext.js";
+import { AriaLabelingContext } from "../core/context/AriaLabelingContext.js";
 import { ColorRuleContext } from "../core/context/ColorRuleContext.js";
 import { EmptyStateSlot } from "../core/slots/chart-states/EmptyStateSlot.js";
 import { ErrorStateSlot } from "../core/slots/chart-states/ErrorStateSlot.js";
@@ -70,7 +72,11 @@ const XYChartRoot = /* @__PURE__ */ forwardRef((props, ref) => {
     "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 slots = iterateSlots(props.children);
@@ -93,7 +99,16 @@ const XYChartRoot = /* @__PURE__ */ forwardRef((props, ref) => {
   const chartHeight = coerceSizeValue(height ?? DEFAULT_CHART_HEIGHT);
   const internalConfig = buildInternalConfig(config, slots);
   const chartLayoutRef = useAutoLegendRefresh(data);
-  return /* @__PURE__ */ jsx(XYChartIdProvider, { children: /* @__PURE__ */ jsx(XYChartThresholdsContext.Provider, { value: internalConfig.thresholds, children: /* @__PURE__ */ jsx(XYChartAxesConfigContext.Provider, { value: internalConfig.axes, children: /* @__PURE__ */ jsx(XYChartColorPaletteContext.Provider, { value: config.colorPalette, 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(XYChartIdProvider, { children: /* @__PURE__ */ jsx(XYChartThresholdsContext.Provider, { value: internalConfig.thresholds, children: /* @__PURE__ */ jsx(XYChartAxesConfigContext.Provider, { value: internalConfig.axes, children: /* @__PURE__ */ jsx(XYChartColorPaletteContext.Provider, { value: config.colorPalette, children: /* @__PURE__ */ jsx(
     XYChartDownloadProvider,
     {
       downloadDataCallback,
@@ -114,7 +129,7 @@ const XYChartRoot = /* @__PURE__ */ forwardRef((props, ref) => {
                     {
                       data,
                       seriesVariantsProps: internalConfig.series,
-                      children: /* @__PURE__ */ jsx(XYChartStoreDomainSync, { children: /* @__PURE__ */ jsx(XYChartAnnotationsDataProvider, { children: /* @__PURE__ */ jsx(XYChartVisibleAxesProvider, { children: /* @__PURE__ */ jsx(XYChartColorScalesProvider, { children: /* @__PURE__ */ jsx(XYChartAnnotationsShownIndicatorsProvider, { children: /* @__PURE__ */ jsx(OverlayProvider, { children: /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsxs(
+                      children: /* @__PURE__ */ jsx(XYChartStoreDomainSync, { children: /* @__PURE__ */ jsx(XYChartAnnotationsDataProvider, { children: /* @__PURE__ */ jsx(XYChartVisibleAxesProvider, { children: /* @__PURE__ */ jsx(XYChartColorScalesProvider, { children: /* @__PURE__ */ jsx(XYChartAnnotationsShownIndicatorsProvider, { children: /* @__PURE__ */ jsx(PinCoordinationProvider, { children: /* @__PURE__ */ jsx(OverlayProvider, { children: /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsxs(
                         ChartLayout,
                         {
                           ref: chartLayoutRef,
@@ -152,7 +167,7 @@ const XYChartRoot = /* @__PURE__ */ forwardRef((props, ref) => {
                             )
                           ]
                         }
-                      ) }) }) }) }) }) }) })
+                      ) }) }) }) }) }) }) }) })
                     }
                   ) }) })
                 }
@@ -162,7 +177,7 @@ const XYChartRoot = /* @__PURE__ */ forwardRef((props, ref) => {
         }
       ) })
     }
-  ) }) }) }) });
+  ) }) }) }) }) });
 });
 const XYChart = Object.assign(XYChartRoot, {
   Annotations,

package/esm/charts/xy-chart/XYChartRoot.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/xy-chart/XYChartRoot.tsx"],
-  "sourcesContent": ["import { forwardRef, type PropsWithChildren, useRef } from 'react';\n\nimport { XYChartLegend } from './components/legend/XYChartLegend.js';\nimport {\n  DEFAULT_CHART_HEIGHT,\n  DEFAULT_LOADING_STATE,\n} from './constants/defaults.js';\nimport { XYChartAxesConfigContext } from './context/axes/XYChartAxesConfig.context.js';\nimport { XYChartAnnotationsConfig } from './context/XYChartAnnotationsConfig.context.js';\nimport { XYChartColorPaletteContext } from './context/XYChartColorPalette.context.js';\nimport { XYChartLegendHiddenContext } from './context/XYChartLegendHidden.context.js';\nimport { XYChartThresholdsContext } from './context/XYChartThresholds.context.js';\nimport { XYChartToolbarContext } from './context/XYChartToolbar.context.js';\nimport { XYChartTruncationModeContext } from './context/XYChartTruncationMode.context.js';\nimport { useXYChartConfig } from './hooks/useXYChartConfig.js';\nimport { XYChartAnnotationsDataProvider } from './providers/XYChartAnnotationsDataProvider.js';\nimport { XYChartAnnotationsShownIndicatorsProvider } from './providers/XYChartAnnotationsShownIndicatorsProvider.js';\nimport { XYChartColorScalesProvider } from './providers/XYChartColorScalesProvider.js';\nimport { XYChartChartDataProvider } from './providers/XYChartDataProvider.js';\nimport { XYChartDownloadProvider } from './providers/XYChartDownloadProvider.js';\nimport { XYChartIdProvider } from './providers/XYChartIdProvider.js';\nimport { XYChartStoreDomainSync } from './providers/XYChartStoreDomainSync.js';\nimport { XYChartStoreProvider } from './providers/XYChartStoreProvider.js';\nimport { XYChartVisibleAxesProvider } from './providers/XYChartVisibleAxesProvider.js';\nimport { Annotations } from './slots/Annotations/Annotations.js';\nimport { Marker } from './slots/Annotations/Marker.js';\nimport { AnnotationsTooltip } from './slots/Annotations/Tooltip.js';\nimport { Track } from './slots/Annotations/Track.js';\nimport { AreaSeries } from './slots/AreaSeries.js';\nimport { BarSeries } from './slots/BarSeries.js';\n// DEPRECATION: [APPDEV-17650] BREAKING-CHANGE: Remove CustomTooltip slot.\nimport { CustomTooltip } from './slots/CustomTooltip.js';\nimport { DotSeries } from './slots/DotSeries.js';\nimport { Legend } from './slots/Legend.js';\nimport { LineSeries } from './slots/LineSeries.js';\nimport { RectSeries } from './slots/RectSeries.js';\nimport { Select } from './slots/Select.js';\nimport { ThresholdIndicator } from './slots/ThresholdIndicator.js';\nimport { Toolbar } from './slots/Toolbar.js';\nimport { XYChartTooltipSlot as Tooltip } from './slots/Tooltip.js';\nimport { XAxis } from './slots/XAxis.js';\nimport { YAxis } from './slots/YAxis.js';\nimport type { XYChartProps } from './types/xy-chart-props.js';\nimport { XYChartRef } from './types/xy-chart.js';\nimport { isEmptyData } from './utils/is-empty-data.js';\nimport { iterateSlots } from './utils/iterate-slots.js';\nimport { buildInternalConfig } from './utils/xy-chart-configuration.js';\nimport { XYChart as XYChartInternal } from './XYChart.js';\nimport { useBehavioralTrackingProps } from '../../core/hooks/useBehavioralTrackingProps.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport { Intent } from '../../core/slots/Intent/Intent.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 { ColorRuleContext } from '../core/context/ColorRuleContext.js';\nimport { EmptyStateSlot } from '../core/slots/chart-states/EmptyStateSlot.js';\nimport { ErrorStateSlot } from '../core/slots/chart-states/ErrorStateSlot.js';\nimport { ColorRule } from '../core/slots/ColorRule.js';\nimport { coerceSizeValue } from '../core/utils/coerceSizeValue.js';\n\n/**\n * Component name used for data-dt-component in behavioural tracking\n */\nconst COMPONENT_NAME_BEHAVIOURAL_TRACKING = 'XYChart';\n\n/**\n * @internal\n */\nexport const XYChartRoot = /* @__PURE__ */ forwardRef<\n  XYChartRef,\n  PropsWithChildren<XYChartProps>\n>((props, ref) => {\n  const {\n    data,\n    children,\n    height,\n    width,\n    loading = DEFAULT_LOADING_STATE,\n    style,\n    className,\n    __downloadDataCallback: downloadDataCallback,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    // @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.\n    'data-dt-component': componentName = COMPONENT_NAME_BEHAVIOURAL_TRACKING,\n  } = props;\n  const [behaviorTrackingProps] = useBehavioralTrackingProps(props);\n  const slots = iterateSlots(props.children);\n  const config = useXYChartConfig(props, slots);\n  const { emptyState, errorState } = getChartStatesTemplates(props.children);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const rootRef = useMergeRefs<XYChartRef | HTMLDivElement>([\n    ref,\n    containerRef,\n  ]);\n\n  const {\n    hidden: legendHidden,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    ratio,\n    initialRatio,\n    onRatioChange,\n    position: legendPosition,\n  } = config.legend;\n\n  const legendRatio = initialRatio ?? ratio;\n\n  const chartHeight = coerceSizeValue(height ?? DEFAULT_CHART_HEIGHT);\n\n  const internalConfig = buildInternalConfig(config, slots);\n  const chartLayoutRef = useAutoLegendRefresh(data);\n\n  return (\n    <XYChartIdProvider>\n      <XYChartThresholdsContext.Provider value={internalConfig.thresholds}>\n        <XYChartAxesConfigContext.Provider value={internalConfig.axes}>\n          <XYChartColorPaletteContext.Provider value={config.colorPalette}>\n            <XYChartDownloadProvider\n              downloadDataCallback={downloadDataCallback}\n            >\n              <XYChartToolbarContext.Provider value={config.toolbar}>\n                <XYChartTruncationModeContext.Provider\n                  value={{ truncationMode: config.truncationMode }}\n                >\n                  <XYChartLegendHiddenContext.Provider\n                    value={Boolean(legendHidden)}\n                  >\n                    <XYChartAnnotationsConfig.Provider\n                      value={config.annotations}\n                    >\n                      <ColorRuleContext.Provider value={config.colorRules}>\n                        <XYChartStoreProvider>\n                          <XYChartChartDataProvider\n                            data={data}\n                            seriesVariantsProps={internalConfig.series}\n                          >\n                            <XYChartStoreDomainSync>\n                              <XYChartAnnotationsDataProvider>\n                                <XYChartVisibleAxesProvider>\n                                  <XYChartColorScalesProvider>\n                                    <XYChartAnnotationsShownIndicatorsProvider>\n                                      <OverlayProvider>\n                                        <TooltipProvider>\n                                          <ChartLayout\n                                            ref={chartLayoutRef}\n                                            chartHeight={chartHeight}\n                                            chartWidth={width}\n                                            className={className}\n                                            emptyState={emptyState}\n                                            errorState={errorState}\n                                            isEmpty={isEmptyData(\n                                              children,\n                                              data,\n                                            )}\n                                            showLoader={loading}\n                                            style={style}\n                                            data-dtrum-mask={dataDtrumMask}\n                                            data-dtrum-allow={dataDtrumAllow}\n                                            {...behaviorTrackingProps}\n                                            data-dt-component={componentName}\n                                          >\n                                            <ChartLayout.Graph>\n                                              <XYChartInternal\n                                                config={config}\n                                                ref={rootRef}\n                                              />\n                                            </ChartLayout.Graph>\n                                            {!legendHidden && (\n                                              <ChartLayout.Legend\n                                                position={legendPosition}\n                                                initialRatio={legendRatio}\n                                                onResize={onRatioChange}\n                                              >\n                                                <XYChartLegend />\n                                              </ChartLayout.Legend>\n                                            )}\n                                          </ChartLayout>\n                                        </TooltipProvider>\n                                      </OverlayProvider>\n                                    </XYChartAnnotationsShownIndicatorsProvider>\n                                  </XYChartColorScalesProvider>\n                                </XYChartVisibleAxesProvider>\n                              </XYChartAnnotationsDataProvider>\n                            </XYChartStoreDomainSync>\n                          </XYChartChartDataProvider>\n                        </XYChartStoreProvider>\n                      </ColorRuleContext.Provider>\n                    </XYChartAnnotationsConfig.Provider>\n                  </XYChartLegendHiddenContext.Provider>\n                </XYChartTruncationModeContext.Provider>\n              </XYChartToolbarContext.Provider>\n            </XYChartDownloadProvider>\n          </XYChartColorPaletteContext.Provider>\n        </XYChartAxesConfigContext.Provider>\n      </XYChartThresholdsContext.Provider>\n    </XYChartIdProvider>\n  );\n});\n\n/**\n * The `XYChart` encompasses various types of charts that utilize both x-axis and\n * y-axis for data representation, designed to visually display and analyze data\n * that involve two numerical variables.\n * @public\n */\nexport const XYChart = Object.assign(XYChartRoot, {\n  Annotations,\n  RectSeries,\n  DotSeries,\n  LineSeries,\n  BarSeries,\n  AreaSeries,\n  XAxis,\n  YAxis,\n  Legend,\n  Toolbar,\n  /** @deprecated Use `XYChart.Tooltip` instead. */\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  CustomTooltip,\n  Tooltip,\n  Intent,\n  Select,\n  ThresholdIndicator,\n  EmptyState: EmptyStateSlot,\n  ErrorState: ErrorStateSlot,\n  ColorRule,\n});\n\n(XYChart as typeof XYChart & { displayName: string }).displayName = 'XYChart';\n\n/**\n * XYAnnotations Slots\n * @public\n */\nexport const XYChartAnnotations = {\n  Marker,\n  Track,\n  Tooltip: AnnotationsTooltip,\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { forwardRef, type PropsWithChildren, useMemo, useRef } from 'react';\n\nimport { XYChartLegend } from './components/legend/XYChartLegend.js';\nimport {\n  DEFAULT_CHART_HEIGHT,\n  DEFAULT_LOADING_STATE,\n} from './constants/defaults.js';\nimport { XYChartAxesConfigContext } from './context/axes/XYChartAxesConfig.context.js';\nimport { XYChartAnnotationsConfig } from './context/XYChartAnnotationsConfig.context.js';\nimport { XYChartColorPaletteContext } from './context/XYChartColorPalette.context.js';\nimport { XYChartLegendHiddenContext } from './context/XYChartLegendHidden.context.js';\nimport { XYChartThresholdsContext } from './context/XYChartThresholds.context.js';\nimport { XYChartToolbarContext } from './context/XYChartToolbar.context.js';\nimport { XYChartTruncationModeContext } from './context/XYChartTruncationMode.context.js';\nimport { useXYChartConfig } from './hooks/useXYChartConfig.js';\nimport { XYChartAnnotationsDataProvider } from './providers/XYChartAnnotationsDataProvider.js';\nimport { XYChartAnnotationsShownIndicatorsProvider } from './providers/XYChartAnnotationsShownIndicatorsProvider.js';\nimport { XYChartColorScalesProvider } from './providers/XYChartColorScalesProvider.js';\nimport { XYChartChartDataProvider } from './providers/XYChartDataProvider.js';\nimport { XYChartDownloadProvider } from './providers/XYChartDownloadProvider.js';\nimport { XYChartIdProvider } from './providers/XYChartIdProvider.js';\nimport { XYChartStoreDomainSync } from './providers/XYChartStoreDomainSync.js';\nimport { XYChartStoreProvider } from './providers/XYChartStoreProvider.js';\nimport { XYChartVisibleAxesProvider } from './providers/XYChartVisibleAxesProvider.js';\nimport { Annotations } from './slots/Annotations/Annotations.js';\nimport { Marker } from './slots/Annotations/Marker.js';\nimport { AnnotationsTooltip } from './slots/Annotations/Tooltip.js';\nimport { Track } from './slots/Annotations/Track.js';\nimport { AreaSeries } from './slots/AreaSeries.js';\nimport { BarSeries } from './slots/BarSeries.js';\n// DEPRECATION: [APPDEV-17650] BREAKING-CHANGE: Remove CustomTooltip slot.\nimport { CustomTooltip } from './slots/CustomTooltip.js';\nimport { DotSeries } from './slots/DotSeries.js';\nimport { Legend } from './slots/Legend.js';\nimport { LineSeries } from './slots/LineSeries.js';\nimport { RectSeries } from './slots/RectSeries.js';\nimport { Select } from './slots/Select.js';\nimport { ThresholdIndicator } from './slots/ThresholdIndicator.js';\nimport { Toolbar } from './slots/Toolbar.js';\nimport { XYChartTooltipSlot as Tooltip } from './slots/Tooltip.js';\nimport { XAxis } from './slots/XAxis.js';\nimport { YAxis } from './slots/YAxis.js';\nimport type { XYChartProps } from './types/xy-chart-props.js';\nimport { XYChartRef } from './types/xy-chart.js';\nimport { isEmptyData } from './utils/is-empty-data.js';\nimport { iterateSlots } from './utils/iterate-slots.js';\nimport { buildInternalConfig } from './utils/xy-chart-configuration.js';\nimport { XYChart as XYChartInternal } from './XYChart.js';\nimport { useBehavioralTrackingProps } from '../../core/hooks/useBehavioralTrackingProps.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport { Intent } from '../../core/slots/Intent/Intent.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 { PinCoordinationProvider } from '../core/components/overlay-tooltip/contexts/PinCoordinationContext.js';\nimport { TooltipProvider } from '../core/components/overlay-tooltip/contexts/TooltipContext.js';\nimport { AriaLabelingContext } from '../core/context/AriaLabelingContext.js';\nimport { ColorRuleContext } from '../core/context/ColorRuleContext.js';\nimport { EmptyStateSlot } from '../core/slots/chart-states/EmptyStateSlot.js';\nimport { ErrorStateSlot } from '../core/slots/chart-states/ErrorStateSlot.js';\nimport { ColorRule } from '../core/slots/ColorRule.js';\nimport { coerceSizeValue } from '../core/utils/coerceSizeValue.js';\n\n/**\n * Component name used for data-dt-component in behavioural tracking\n */\nconst COMPONENT_NAME_BEHAVIOURAL_TRACKING = 'XYChart';\n\n/**\n * @internal\n */\nexport const XYChartRoot = /* @__PURE__ */ forwardRef<\n  XYChartRef,\n  PropsWithChildren<XYChartProps>\n>((props, ref) => {\n  const {\n    data,\n    children,\n    height,\n    width,\n    loading = DEFAULT_LOADING_STATE,\n    style,\n    className,\n    __downloadDataCallback: downloadDataCallback,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    // @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.\n    'data-dt-component': componentName = COMPONENT_NAME_BEHAVIOURAL_TRACKING,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-details': ariaDetails,\n  } = props;\n  const [behaviorTrackingProps] = useBehavioralTrackingProps(props);\n  const slots = iterateSlots(props.children);\n  const config = useXYChartConfig(props, slots);\n  const { emptyState, errorState } = getChartStatesTemplates(props.children);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const rootRef = useMergeRefs<XYChartRef | HTMLDivElement>([\n    ref,\n    containerRef,\n  ]);\n\n  const {\n    hidden: legendHidden,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    ratio,\n    initialRatio,\n    onRatioChange,\n    position: legendPosition,\n  } = config.legend;\n\n  const legendRatio = initialRatio ?? ratio;\n\n  const chartHeight = coerceSizeValue(height ?? DEFAULT_CHART_HEIGHT);\n\n  const internalConfig = buildInternalConfig(config, slots);\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      <XYChartIdProvider>\n        <XYChartThresholdsContext.Provider value={internalConfig.thresholds}>\n          <XYChartAxesConfigContext.Provider value={internalConfig.axes}>\n            <XYChartColorPaletteContext.Provider value={config.colorPalette}>\n              <XYChartDownloadProvider\n                downloadDataCallback={downloadDataCallback}\n              >\n                <XYChartToolbarContext.Provider value={config.toolbar}>\n                  <XYChartTruncationModeContext.Provider\n                    value={{ truncationMode: config.truncationMode }}\n                  >\n                    <XYChartLegendHiddenContext.Provider\n                      value={Boolean(legendHidden)}\n                    >\n                      <XYChartAnnotationsConfig.Provider\n                        value={config.annotations}\n                      >\n                        <ColorRuleContext.Provider value={config.colorRules}>\n                          <XYChartStoreProvider>\n                            <XYChartChartDataProvider\n                              data={data}\n                              seriesVariantsProps={internalConfig.series}\n                            >\n                              <XYChartStoreDomainSync>\n                                <XYChartAnnotationsDataProvider>\n                                  <XYChartVisibleAxesProvider>\n                                    <XYChartColorScalesProvider>\n                                      <XYChartAnnotationsShownIndicatorsProvider>\n                                        <PinCoordinationProvider>\n                                          <OverlayProvider>\n                                            <TooltipProvider>\n                                              <ChartLayout\n                                                ref={chartLayoutRef}\n                                                chartHeight={chartHeight}\n                                                chartWidth={width}\n                                                className={className}\n                                                emptyState={emptyState}\n                                                errorState={errorState}\n                                                isEmpty={isEmptyData(\n                                                  children,\n                                                  data,\n                                                )}\n                                                showLoader={loading}\n                                                style={style}\n                                                data-dtrum-mask={dataDtrumMask}\n                                                data-dtrum-allow={\n                                                  dataDtrumAllow\n                                                }\n                                                {...behaviorTrackingProps}\n                                                data-dt-component={\n                                                  componentName\n                                                }\n                                              >\n                                                <ChartLayout.Graph>\n                                                  <XYChartInternal\n                                                    config={config}\n                                                    ref={rootRef}\n                                                  />\n                                                </ChartLayout.Graph>\n                                                {!legendHidden && (\n                                                  <ChartLayout.Legend\n                                                    position={legendPosition}\n                                                    initialRatio={legendRatio}\n                                                    onResize={onRatioChange}\n                                                  >\n                                                    <XYChartLegend />\n                                                  </ChartLayout.Legend>\n                                                )}\n                                              </ChartLayout>\n                                            </TooltipProvider>\n                                          </OverlayProvider>\n                                        </PinCoordinationProvider>\n                                      </XYChartAnnotationsShownIndicatorsProvider>\n                                    </XYChartColorScalesProvider>\n                                  </XYChartVisibleAxesProvider>\n                                </XYChartAnnotationsDataProvider>\n                              </XYChartStoreDomainSync>\n                            </XYChartChartDataProvider>\n                          </XYChartStoreProvider>\n                        </ColorRuleContext.Provider>\n                      </XYChartAnnotationsConfig.Provider>\n                    </XYChartLegendHiddenContext.Provider>\n                  </XYChartTruncationModeContext.Provider>\n                </XYChartToolbarContext.Provider>\n              </XYChartDownloadProvider>\n            </XYChartColorPaletteContext.Provider>\n          </XYChartAxesConfigContext.Provider>\n        </XYChartThresholdsContext.Provider>\n      </XYChartIdProvider>\n    </AriaLabelingContext.Provider>\n  );\n});\n\n/**\n * The `XYChart` encompasses various types of charts that utilize both x-axis and\n * y-axis for data representation, designed to visually display and analyze data\n * that involve two numerical variables.\n * @public\n */\nexport const XYChart = Object.assign(XYChartRoot, {\n  Annotations,\n  RectSeries,\n  DotSeries,\n  LineSeries,\n  BarSeries,\n  AreaSeries,\n  XAxis,\n  YAxis,\n  Legend,\n  Toolbar,\n  /** @deprecated Use `XYChart.Tooltip` instead. */\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  CustomTooltip,\n  Tooltip,\n  Intent,\n  Select,\n  ThresholdIndicator,\n  EmptyState: EmptyStateSlot,\n  ErrorState: ErrorStateSlot,\n  ColorRule,\n});\n\n(XYChart as typeof XYChart & { displayName: string }).displayName = 'XYChart';\n\n/**\n * XYAnnotations Slots\n * @public\n */\nexport const XYChartAnnotations = {\n  Marker,\n  Track,\n  Tooltip: AnnotationsTooltip,\n};\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/charts/xy-chart/components/axes/AxisArea.css

@@ -1,3 +1,3 @@
-._bidc430-3-11-2 {
+._bidc430-3-12-0 {
   position: relative;
 }

package/esm/charts/xy-chart/components/axes/AxisArea.sty.js

@@ -1,5 +1,5 @@
 import "./AxisArea.css";
-var axisContainerStyle = "_bidc430-3-11-2";
+var axisContainerStyle = "_bidc430-3-12-0";
 export {
   axisContainerStyle
 };

package/esm/charts/xy-chart/components/axes/AxisArea.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/xy-chart/components/axes/AxisArea.css.ts"],
-  "sourcesContent": ["import './AxisArea.css';\nexport var axisContainerStyle = '_bidc430-3-11-2';"],
+  "sourcesContent": ["import './AxisArea.css';\nexport var axisContainerStyle = '_bidc430-3-12-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,qBAAqB;",
   "names": []
 }

package/esm/charts/xy-chart/components/axes/AxisTickWithTruncation.css

@@ -1,8 +1,8 @@
-._z2zz8y2-3-11-2 {
-  direction: var(--_z2zz8y0-3-11-2);
+._z2zz8y2-3-12-0 {
+  direction: var(--_z2zz8y0-3-12-0);
   display: inline-block;
   overflow: hidden;
   text-overflow: ellipsis;
   text-wrap: nowrap;
-  width: var(--_z2zz8y1-3-11-2);
+  width: var(--_z2zz8y1-3-12-0);
 }

package/esm/charts/xy-chart/components/axes/AxisTickWithTruncation.sty.js

@@ -1,7 +1,7 @@
 import "./AxisTickWithTruncation.css";
-var directionValue = "var(--_z2zz8y0-3-11-2)";
-var tickStyle = "_z2zz8y2-3-11-2";
-var widthContainer = "var(--_z2zz8y1-3-11-2)";
+var directionValue = "var(--_z2zz8y0-3-12-0)";
+var tickStyle = "_z2zz8y2-3-12-0";
+var widthContainer = "var(--_z2zz8y1-3-12-0)";
 export {
   directionValue,
   tickStyle,

package/esm/charts/xy-chart/components/axes/AxisTickWithTruncation.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/xy-chart/components/axes/AxisTickWithTruncation.css.ts"],
-  "sourcesContent": ["import './AxisTickWithTruncation.css';\nexport var directionValue = 'var(--_z2zz8y0-3-11-2)';\nexport var tickStyle = '_z2zz8y2-3-11-2';\nexport var widthContainer = 'var(--_z2zz8y1-3-11-2)';"],
+  "sourcesContent": ["import './AxisTickWithTruncation.css';\nexport var directionValue = 'var(--_z2zz8y0-3-12-0)';\nexport var tickStyle = '_z2zz8y2-3-12-0';\nexport var widthContainer = 'var(--_z2zz8y1-3-12-0)';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,iBAAiB;AACrB,IAAI,YAAY;AAChB,IAAI,iBAAiB;",
   "names": []
 }

package/esm/charts/xy-chart/components/displays/BarDisplay/BarLabelOverlay.css

@@ -1,19 +1,14 @@
-._b76tm80-3-11-2 {
+._b76tm80-3-12-0 {
   position: absolute;
   inset: 0;
   overflow: hidden;
   pointer-events: none;
 }
-._b76tm81-3-11-2 {
+._b76tm81-3-12-0 {
   position: absolute;
   white-space: nowrap;
   font-size: var(--dt-typography-text-small-default-size, 12px);
   font-family: var(--dt-typography-text-small-default-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
   font-weight: var(--dt-typography-text-small-default-weight, 400);
   line-height: 1;
-}
-._b76tm82-3-11-2 {
-  position: absolute;
-  overflow: hidden;
-  pointer-events: none;
 }

package/esm/charts/xy-chart/components/displays/BarDisplay/BarLabelOverlay.sty.js

@@ -1,9 +1,7 @@
 import "./BarLabelOverlay.css";
-var labelClipWrapper = "_b76tm82-3-11-2";
-var labelSpan = "_b76tm81-3-11-2";
-var overlayContainer = "_b76tm80-3-11-2";
+var labelSpan = "_b76tm81-3-12-0";
+var overlayContainer = "_b76tm80-3-12-0";
 export {
-  labelClipWrapper,
   labelSpan,
   overlayContainer
 };

package/esm/charts/xy-chart/components/displays/BarDisplay/BarLabelOverlay.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/xy-chart/components/displays/BarDisplay/BarLabelOverlay.css.ts"],
-  "sourcesContent": ["import './BarLabelOverlay.css';\nexport var labelClipWrapper = '_b76tm82-3-11-2';\nexport var labelSpan = '_b76tm81-3-11-2';\nexport var overlayContainer = '_b76tm80-3-11-2';"],
-  "mappings": "AAAA,OAAO;AACA,IAAI,mBAAmB;AACvB,IAAI,YAAY;AAChB,IAAI,mBAAmB;",
+  "sourcesContent": ["import './BarLabelOverlay.css';\nexport var labelSpan = '_b76tm81-3-12-0';\nexport var overlayContainer = '_b76tm80-3-12-0';"],
+  "mappings": "AAAA,OAAO;AACA,IAAI,YAAY;AAChB,IAAI,mBAAmB;",
   "names": []
 }

package/esm/charts/xy-chart/components/displays/BarDisplay/HorizontalBarLabel.js

@@ -1,6 +1,5 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { Fragment } from "react";
-import { labelClipWrapper, labelSpan } from "./BarLabelOverlay.sty.js";
+import { jsx } from "react/jsx-runtime";
+import { labelSpan } from "./BarLabelOverlay.sty.js";
 import { BAR_LABEL_MIN_SIZE, BAR_LABEL_PADDING } from "./label-utils.js";
 import { charsFontWidth12pixelsSize400Map } from "../../../../core/components/text-ellipsis/chars-font-width-map.js";
 import { truncateString } from "../../../../core/components/text-ellipsis/truncate-string.js";
@@ -30,31 +29,26 @@ function HorizontalBarLabel({
     charsFontWidth12pixelsSize400Map,
     truncationMode
   );
-  const anchor = isReversed ? { right: BAR_LABEL_PADDING, textAlign: "right" } : { left: x + BAR_LABEL_PADDING };
-  const outerStyle = {
-    ...anchor,
+  const insideExtent = Math.max(
+    0,
+    Math.min(availLength, barWidth - BAR_LABEL_PADDING)
+  );
+  const insidePercent = insideExtent / availLength * 100;
+  const gradient = isReversed ? `linear-gradient(to right, ${outsideColor} 0%, ${outsideColor} ${100 - insidePercent}%, ${insideColor} ${100 - insidePercent}%, ${insideColor} 100%)` : `linear-gradient(to right, ${insideColor} 0%, ${insideColor} ${insidePercent}%, ${outsideColor} ${insidePercent}%, ${outsideColor} 100%)`;
+  const style = {
+    ...isReversed ? {
+      right: canvasWidth - (x + barWidth) + BAR_LABEL_PADDING,
+      textAlign: "right"
+    } : { left: x + BAR_LABEL_PADDING },
     top: centerY,
     transform: "translateY(-50%)",
     width: availLength,
-    color: outsideColor
-  };
-  const wrapperStyle = {
-    left: x,
-    top: y,
-    width: barWidth,
-    height: barHeight
-  };
-  const innerStyle = {
-    ...isReversed ? anchor : { left: BAR_LABEL_PADDING },
-    top: barHeight / 2,
-    transform: "translateY(-50%)",
-    width: availLength,
-    color: insideColor
+    backgroundImage: gradient,
+    WebkitBackgroundClip: "text",
+    backgroundClip: "text",
+    color: "transparent"
   };
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("span", { className: labelSpan, style: outerStyle, children: truncated }),
-    /* @__PURE__ */ jsx("div", { className: labelClipWrapper, style: wrapperStyle, children: /* @__PURE__ */ jsx("span", { className: labelSpan, style: innerStyle, children: truncated }) })
-  ] });
+  return /* @__PURE__ */ jsx("span", { className: labelSpan, style, children: truncated });
 }
 HorizontalBarLabel["displayName"] = "HorizontalBarLabel";
 export {