@dynatrace/strato-components 3.7.1 → 3.8.0

package/esm/charts/histogram/HistogramChart.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/histogram/HistogramChart.tsx"],
-  "sourcesContent": ["import { forwardRef, type PropsWithChildren } from 'react';\n\nimport { HistogramChartRoot } from './HistogramChartRoot.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 { HistogramChartDownloadCSVSlot } from './slots/DownloadCSV.js';\nimport { Legend } from './slots/Legend.js';\nimport { Pan } from './slots/Pan.js';\nimport { Select } from './slots/Select.js';\nimport { ThresholdIndicator } from './slots/ThresholdIndicator.js';\nimport { Toolbar } from './slots/Toolbar.js';\nimport { Tooltip } from './slots/Tooltip.js';\nimport { XAxis } from './slots/XAxis.js';\nimport { YAxis } from './slots/YAxis.js';\nimport { Zoom } from './slots/Zoom.js';\nimport type { HistogramChartProps } from './types/histogram-props.js';\nimport type { HistogramChartRef } from './types/histogram-ref.js';\nimport { Intent } from '../../core/slots/Intent/Intent.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 { isFeatureEnabled } from '../core/utils/is-feature-enabled.js';\nimport { HistogramToXY } from '../xy-chart-adoption/histogram/HistogramToXY.js';\nimport type { _XYChartAdoptionProps } from '../xy-chart-adoption/types/props.js';\n\nexport const HistogramChartSwitcher = forwardRef<\n  HistogramChartRef,\n  PropsWithChildren<HistogramChartProps & _XYChartAdoptionProps>\n>((props, forwardedRef) => {\n  const { __useXYAdoption, ...rest } = props;\n  if (__useXYAdoption ?? isFeatureEnabled('histogramToXY')) {\n    return <HistogramToXY {...rest} ref={forwardedRef} />;\n  }\n  return <HistogramChartRoot {...rest} ref={forwardedRef} />;\n});\n\n(\n  HistogramChartSwitcher as typeof HistogramChartSwitcher & {\n    displayName: string;\n  }\n).displayName = 'HistogramChart';\n/**\n * A `HistogramChart` is a type of graph that represents the distribution of numerical data.\n * It\u2019s constructed by dividing the entire range of values into a series of intervals\u2014known as bins\n * and then counting how many values fall into each interval.\n * The bins are typically of equal size and are adjacent to each other, with no gaps. Each bin is represented by a bar,\n * where the height of the bar reflects the frequency or count of data points within that interval\n * @public\n */\nexport const HistogramChart = Object.assign(HistogramChartSwitcher, {\n  XAxis,\n  YAxis,\n  Legend,\n  Tooltip,\n  EmptyState: EmptyStateSlot,\n  ErrorState: ErrorStateSlot,\n  Annotations,\n  ColorRule,\n  ThresholdIndicator,\n  Select,\n  Intent,\n  Toolbar,\n  DownloadCSV: HistogramChartDownloadCSVSlot,\n  Pan,\n  Zoom,\n});\n\n/**\n * Annotations Slots\n * @public\n */\nexport const HistogramAnnotations = Object.assign(\n  {},\n  {\n    Marker,\n    Track,\n    Tooltip: AnnotationsTooltip,\n  },\n);\n"],
-  "mappings": "AAiCW;AAjCX,SAAS,kBAA0C;AAEnD,SAAS,0BAA0B;AACnC,SAAS,mBAAmB;AAC5B,SAAS,cAAc;AACvB,SAAS,0BAA0B;AACnC,SAAS,aAAa;AACtB,SAAS,qCAAqC;AAC9C,SAAS,cAAc;AACvB,SAAS,WAAW;AACpB,SAAS,cAAc;AACvB,SAAS,0BAA0B;AACnC,SAAS,eAAe;AACxB,SAAS,eAAe;AACxB,SAAS,aAAa;AACtB,SAAS,aAAa;AACtB,SAAS,YAAY;AAGrB,SAAS,cAAc;AACvB,SAAS,sBAAsB;AAC/B,SAAS,sBAAsB;AAC/B,SAAS,iBAAiB;AAC1B,SAAS,wBAAwB;AACjC,SAAS,qBAAqB;AAGvB,MAAM,yBAAyB,WAGpC,CAAC,OAAO,iBAAiB;AACzB,QAAM,EAAE,iBAAiB,GAAG,KAAK,IAAI;AACrC,MAAI,mBAAmB,iBAAiB,eAAe,GAAG;AACxD,WAAO,oBAAC,iBAAe,GAAG,MAAM,KAAK,cAAc;AAAA,EACrD;AACA,SAAO,oBAAC,sBAAoB,GAAG,MAAM,KAAK,cAAc;AAC1D,CAAC;AAGC,uBAGA,cAAc;AAST,MAAM,iBAAiB,OAAO,OAAO,wBAAwB;AAAA,EAClE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AACF,CAAC;AAMM,MAAM,uBAAuB,OAAO;AAAA,EACzC,CAAC;AAAA,EACD;AAAA,IACE;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EACX;AACF;",
+  "sourcesContent": ["import { forwardRef, type PropsWithChildren } from 'react';\n\nimport { HistogramChartRoot } from './HistogramChartRoot.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 { HistogramChartDownloadCSVSlot } from './slots/DownloadCSV.js';\nimport { Legend } from './slots/Legend.js';\nimport { Pan } from './slots/Pan.js';\nimport { Select } from './slots/Select.js';\nimport { ThresholdIndicator } from './slots/ThresholdIndicator.js';\nimport { Toolbar } from './slots/Toolbar.js';\nimport { Tooltip } from './slots/Tooltip.js';\nimport { XAxis } from './slots/XAxis.js';\nimport { YAxis } from './slots/YAxis.js';\nimport { Zoom } from './slots/Zoom.js';\nimport type { HistogramChartProps } from './types/histogram-props.js';\nimport type { HistogramChartRef } from './types/histogram-ref.js';\nimport { Intent } from '../../core/slots/Intent/Intent.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 { HistogramToXY } from '../xy-chart-adoption/histogram/HistogramToXY.js';\nimport type { _XYChartLegacyProps } from '../xy-chart-adoption/shared/types/legacy-props.js';\n\nexport const HistogramChartSwitcher = forwardRef<\n  HistogramChartRef,\n  PropsWithChildren<HistogramChartProps & _XYChartLegacyProps>\n>((props, forwardedRef) => {\n  const { __useLegacy, ...rest } = props;\n  if (__useLegacy) {\n    return <HistogramChartRoot {...rest} ref={forwardedRef} />;\n  }\n  return <HistogramToXY {...rest} ref={forwardedRef} />;\n});\n\n(\n  HistogramChartSwitcher as typeof HistogramChartSwitcher & {\n    displayName: string;\n  }\n).displayName = 'HistogramChart';\n/**\n * A `HistogramChart` is a type of graph that represents the distribution of numerical data.\n * It\u2019s constructed by dividing the entire range of values into a series of intervals\u2014known as bins\n * and then counting how many values fall into each interval.\n * The bins are typically of equal size and are adjacent to each other, with no gaps. Each bin is represented by a bar,\n * where the height of the bar reflects the frequency or count of data points within that interval\n * @public\n */\nexport const HistogramChart = Object.assign(HistogramChartSwitcher, {\n  XAxis,\n  YAxis,\n  Legend,\n  Tooltip,\n  EmptyState: EmptyStateSlot,\n  ErrorState: ErrorStateSlot,\n  Annotations,\n  ColorRule,\n  ThresholdIndicator,\n  Select,\n  Intent,\n  Toolbar,\n  DownloadCSV: HistogramChartDownloadCSVSlot,\n  Pan,\n  Zoom,\n});\n\n/**\n * Annotations Slots\n * @public\n */\nexport const HistogramAnnotations = Object.assign(\n  {},\n  {\n    Marker,\n    Track,\n    Tooltip: AnnotationsTooltip,\n  },\n);\n"],
+  "mappings": "AAgCW;AAhCX,SAAS,kBAA0C;AAEnD,SAAS,0BAA0B;AACnC,SAAS,mBAAmB;AAC5B,SAAS,cAAc;AACvB,SAAS,0BAA0B;AACnC,SAAS,aAAa;AACtB,SAAS,qCAAqC;AAC9C,SAAS,cAAc;AACvB,SAAS,WAAW;AACpB,SAAS,cAAc;AACvB,SAAS,0BAA0B;AACnC,SAAS,eAAe;AACxB,SAAS,eAAe;AACxB,SAAS,aAAa;AACtB,SAAS,aAAa;AACtB,SAAS,YAAY;AAGrB,SAAS,cAAc;AACvB,SAAS,sBAAsB;AAC/B,SAAS,sBAAsB;AAC/B,SAAS,iBAAiB;AAC1B,SAAS,qBAAqB;AAGvB,MAAM,yBAAyB,WAGpC,CAAC,OAAO,iBAAiB;AACzB,QAAM,EAAE,aAAa,GAAG,KAAK,IAAI;AACjC,MAAI,aAAa;AACf,WAAO,oBAAC,sBAAoB,GAAG,MAAM,KAAK,cAAc;AAAA,EAC1D;AACA,SAAO,oBAAC,iBAAe,GAAG,MAAM,KAAK,cAAc;AACrD,CAAC;AAGC,uBAGA,cAAc;AAST,MAAM,iBAAiB,OAAO,OAAO,wBAAwB;AAAA,EAClE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AACF,CAAC;AAMM,MAAM,uBAAuB,OAAO;AAAA,EACzC,CAAC;AAAA,EACD;AAAA,IACE;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EACX;AACF;",
   "names": []
 }

package/esm/charts/histogram/HistogramChartInternal.js

@@ -31,6 +31,10 @@ import { defaultChartSize } from "../../core/styles/defaultChartValues.sty.js";
 import { SCROLLBAR_WIDTH } from "../core/components/annotations/constants.js";
 import { getAnnotationsVisibleArea } from "../core/components/annotations/utils/get-annotations-visible-area.js";
 import { ChartGrid } from "../core/components/chart-grid/ChartGridRoot.js";
+import {
+  shouldShowAnnotations,
+  shouldShowAxes
+} from "../core/components/chart-grid/constants.js";
 import { useChartLayoutLoading } from "../core/components/chart-layout/hooks/useChartLayoutLoading.js";
 import { useChartLayoutOrientation } from "../core/components/chart-layout/hooks/useChartLayoutOrientation.js";
 import { useGraphSize } from "../core/components/chart-layout/hooks/useGraphSize.js";
@@ -57,7 +61,6 @@ const HistogramChartInternal = forwardRef(({ config }, forwardedRef) => {
     annotations?.visibleTracksLimit,
     numHiddenTracks
   );
-  const histogramGridTemplateRows = `minmax(0, ${annotationsVisibleArea + (tracksQuantity ? ANNOTATIONS_PADDING_BOTTOM : 0)}px) minmax(60%, 1fr) minmax(0, auto)`;
   const { leftThreshold, rightThreshold } = useHistogramThresholds();
   const hasThresholds = !isEmpty(leftThreshold) || !isEmpty(rightThreshold);
   const { width, height } = useGraphSize();
@@ -76,11 +79,20 @@ const HistogramChartInternal = forwardRef(({ config }, forwardedRef) => {
   const noLegendBottom = legendHidden || orientation === "horizontal";
   const hasRightPadding = noAxisRight && noLegendRight;
   const chartGridHeight = height - (!tracksQuantity || noLegendBottom ? OVERLAY_PADDING + BOTTOM_PADDING_ADJUSTMENT : 0);
+  const showAnnotations = shouldShowAnnotations(
+    chartGridHeight,
+    tracksQuantity
+  );
+  const showAxes = shouldShowAxes(chartGridHeight);
+  const chartGridRenderHeight = tracksQuantity && !noLegendBottom && !showAnnotations ? chartGridHeight - OVERLAY_PADDING : chartGridHeight;
+  const annotationsPadding = tracksQuantity - numHiddenTracks > 0 ? ANNOTATIONS_PADDING_BOTTOM : 0;
+  const annotationsRowHeight = showAnnotations ? annotationsVisibleArea + annotationsPadding : 0;
+  const histogramGridTemplateRows = showAxes ? `minmax(0, ${annotationsRowHeight}px) minmax(60%, 1fr) minmax(0, auto)` : "0px 1fr 1px";
   return /* @__PURE__ */ jsx(
     "div",
     {
       style: {
-        paddingTop: !tracksQuantity ? OVERLAY_PADDING : 0,
+        paddingTop: showAnnotations ? 0 : OVERLAY_PADDING,
         paddingLeft: 0
       },
       className: defaultChartSize,
@@ -90,7 +102,7 @@ const HistogramChartInternal = forwardRef(({ config }, forwardedRef) => {
         ChartGrid,
         {
           width: availableWidth - (hasRightPadding ? OVERLAY_PADDING : 0),
-          height: chartGridHeight,
+          height: chartGridRenderHeight,
           gridTemplateAreas: histogramGridTemplateAreas,
           gridTemplateColumns: histogramGridTemplateColumns,
           gridTemplateRows: histogramGridTemplateRows,
@@ -103,13 +115,13 @@ const HistogramChartInternal = forwardRef(({ config }, forwardedRef) => {
               forwardedRef,
               chartRef,
               children: [
-                /* @__PURE__ */ jsx(HistogramValueLeftAxisArea, {}),
-                /* @__PURE__ */ jsx(HistogramValueBottomAxisArea, {}),
-                /* @__PURE__ */ jsx(HistogramValueRightAxisArea, {}),
-                !!tracksQuantity && /* @__PURE__ */ jsx(HistogramAnnotationsArea, {}),
+                showAxes && /* @__PURE__ */ jsx(HistogramValueLeftAxisArea, {}),
+                showAxes && /* @__PURE__ */ jsx(HistogramValueBottomAxisArea, {}),
+                showAxes && /* @__PURE__ */ jsx(HistogramValueRightAxisArea, {}),
+                showAnnotations && /* @__PURE__ */ jsx(HistogramAnnotationsArea, {}),
                 /* @__PURE__ */ jsxs(ChartGrid.PlotArea, { children: [
                   /* @__PURE__ */ jsx(HistogramChartPlot, {}),
-                  /* @__PURE__ */ jsx(HistogramAnnotationsIndicators, {}),
+                  showAnnotations && /* @__PURE__ */ jsx(HistogramAnnotationsIndicators, {}),
                   /* @__PURE__ */ jsx(ThresholdIndicators, {}),
                   /* @__PURE__ */ jsx(
                     ChartLoaderOverlay,

package/esm/charts/histogram/HistogramChartInternal.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/histogram/HistogramChartInternal.tsx"],
-  "sourcesContent": ["import { isEmpty } from 'lodash-es';\nimport { forwardRef, type PropsWithChildren, useRef } from 'react';\n\nimport { ANNOTATIONS_PADDING_BOTTOM } from './components/annotations-histogram/constants.js';\nimport { HistogramAnnotationsArea } from './components/annotations-histogram/HistogramAnnotationsArea.js';\nimport { HistogramAnnotationsIndicators } from './components/annotations-histogram/HistogramAnnotationsIndicators.js';\nimport { HistogramValueBottomAxisArea } from './components/axes/HistogramValueBottomAxisArea/HistogramValueBottomAxisArea.js';\nimport { HistogramValueLeftAxisArea } from './components/axes/HistogramValueLeftAxisArea.js';\nimport { HistogramValueRightAxisArea } from './components/axes/HistogramValueRightAxisArea.js';\nimport { HistogramChartPlot } from './components/layout/HistogramChartPlot.js';\nimport { HistogramOverlays } from './components/overlays/HistogramOverlays.js';\nimport { HistogramThresholdArea } from './components/thresholds/HistogramThresholdArea.js';\nimport { ThresholdIndicators } from './components/thresholds/ThresholdIndicators.js';\nimport {\n  DISPLAY_NAME,\n  HISTOGRAM_CHART_ARIA_LABEL,\n} from './constants/defaults.js';\nimport { AREAS } from './constants/histogram-grid-area-rules.js';\nimport { useHistogramAnnotationsConfig } from './hooks/useHistogramAnnotationsConfig.js';\nimport { useHistogramFilteredData } from './hooks/useHistogramFilteredData.js';\nimport { useHistogramLegend } from './hooks/useHistogramLegend.js';\nimport { useHistogramThresholds } from './hooks/useHistogramThresholds.js';\nimport { useYAxisConfig } from './hooks/useYAxisConfig.js';\nimport { HistogramAnnotationsDataProvider } from './providers/HistogramAnnotationsDataProvider.js';\nimport { HistogramChartImperativeHandler } from './providers/HistogramChartImperativeHandler.js';\nimport { HistogramFormatterProvider } from './providers/HistogramFormatterProvider.js';\nimport { HistogramXScaleProvider } from './providers/HistogramXScaleProvider.js';\nimport { HistogramYScalesProvider } from './providers/HistogramYScalesProvider.js';\nimport type { HistogramChartConfiguration } from './types/histogram-props.js';\nimport type { HistogramChartRef } from './types/histogram-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 { 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\nconst histogramGridTemplateAreas = `\n  \"${AREAS.annotations} ${AREAS.annotations} ${AREAS.annotations} . .\"\n  \"${AREAS.leftAxis} ${AREAS.leftThreshold} plot ${AREAS.rightThreshold} ${AREAS.rightAxis}\"\n  \". . ${AREAS.bottomAxis} . .\"\n`;\nconst histogramGridTemplateColumns =\n  'minmax(0, auto) auto minmax(60%, 1fr) auto minmax(0, auto)';\n\nexport interface _HistogramChartProps {\n  config: HistogramChartConfiguration;\n}\n\nexport const HistogramChartInternal = forwardRef<\n  HistogramChartRef,\n  PropsWithChildren<_HistogramChartProps>\n>(({ config }, forwardedRef) => {\n  const loading = useChartLayoutLoading();\n\n  const annotations = useHistogramAnnotationsConfig();\n\n  const tracksQuantity = annotations.tracks.length;\n  const numHiddenTracks = annotations.tracks.filter(\n    (value) => value.hidden,\n  ).length;\n\n  const annotationsVisibleArea = getAnnotationsVisibleArea(\n    tracksQuantity,\n    annotations?.visibleTracksLimit,\n    numHiddenTracks,\n  );\n\n  const histogramGridTemplateRows = `minmax(0, ${\n    annotationsVisibleArea + (tracksQuantity ? ANNOTATIONS_PADDING_BOTTOM : 0)\n  }px) minmax(60%, 1fr) minmax(0, auto)`;\n\n  const { leftThreshold, rightThreshold } = useHistogramThresholds();\n  const hasThresholds = !isEmpty(leftThreshold) || !isEmpty(rightThreshold);\n  const { width, height } = useGraphSize();\n\n  const chartRef = useRef<HTMLDivElement>(null);\n  const mergedRef = useMergeRefs<HistogramChartRef | HTMLDivElement>([\n    forwardedRef,\n    chartRef,\n  ]);\n\n  const { orientation } = useChartLayoutOrientation();\n  const { right: axisRight } = useYAxisConfig();\n  const { hidden: legendHidden } = useHistogramLegend();\n  const { units } = useHistogramFilteredData();\n\n  const availableWidth =\n    tracksQuantity && orientation === 'vertical'\n      ? width - SCROLLBAR_WIDTH\n      : width;\n\n  const noAxisRight = !axisRight || units.length === 1;\n\n  const noLegendRight = legendHidden || orientation === 'vertical';\n  const noLegendBottom = legendHidden || orientation === 'horizontal';\n\n  const hasRightPadding = noAxisRight && noLegendRight;\n\n  const chartGridHeight =\n    height -\n    (!tracksQuantity || noLegendBottom\n      ? OVERLAY_PADDING + BOTTOM_PADDING_ADJUSTMENT\n      : 0);\n\n  return (\n    <div\n      style={{\n        paddingTop: !tracksQuantity ? OVERLAY_PADDING : 0,\n        paddingLeft: 0,\n      }}\n      className={defaultChartSize}\n      role=\"img\"\n      aria-label={HISTOGRAM_CHART_ARIA_LABEL}\n    >\n      <ChartGrid\n        width={availableWidth - (hasRightPadding ? OVERLAY_PADDING : 0)}\n        height={chartGridHeight}\n        gridTemplateAreas={histogramGridTemplateAreas}\n        gridTemplateColumns={histogramGridTemplateColumns}\n        gridTemplateRows={histogramGridTemplateRows}\n        ref={mergedRef}\n        data-testid=\"histogram-chart-root\"\n      >\n        <HistogramXScaleProvider>\n          <HistogramYScalesProvider>\n            <HistogramFormatterProvider>\n              <HistogramAnnotationsDataProvider>\n                <HistogramChartImperativeHandler\n                  config={config}\n                  forwardedRef={forwardedRef}\n                  chartRef={chartRef}\n                >\n                  <HistogramValueLeftAxisArea />\n                  <HistogramValueBottomAxisArea />\n                  <HistogramValueRightAxisArea />\n                  {!!tracksQuantity && <HistogramAnnotationsArea />}\n                  <ChartGrid.PlotArea>\n                    <HistogramChartPlot />\n                    <HistogramAnnotationsIndicators />\n                    <ThresholdIndicators />\n                    <ChartLoaderOverlay\n                      loading={!!loading}\n                      zoomEnabled={!!config.interactions?.zoom?.enabled}\n                    >\n                      <HistogramOverlays />\n                    </ChartLoaderOverlay>\n                  </ChartGrid.PlotArea>\n                  {hasThresholds && <HistogramThresholdArea />}\n                </HistogramChartImperativeHandler>\n              </HistogramAnnotationsDataProvider>\n            </HistogramFormatterProvider>\n          </HistogramYScalesProvider>\n        </HistogramXScaleProvider>\n      </ChartGrid>\n    </div>\n  );\n});\n\n(\n  HistogramChartInternal as typeof HistogramChartInternal & {\n    displayName: string;\n  }\n).displayName = DISPLAY_NAME;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { isEmpty } from 'lodash-es';\nimport { forwardRef, type PropsWithChildren, useRef } from 'react';\n\nimport { ANNOTATIONS_PADDING_BOTTOM } from './components/annotations-histogram/constants.js';\nimport { HistogramAnnotationsArea } from './components/annotations-histogram/HistogramAnnotationsArea.js';\nimport { HistogramAnnotationsIndicators } from './components/annotations-histogram/HistogramAnnotationsIndicators.js';\nimport { HistogramValueBottomAxisArea } from './components/axes/HistogramValueBottomAxisArea/HistogramValueBottomAxisArea.js';\nimport { HistogramValueLeftAxisArea } from './components/axes/HistogramValueLeftAxisArea.js';\nimport { HistogramValueRightAxisArea } from './components/axes/HistogramValueRightAxisArea.js';\nimport { HistogramChartPlot } from './components/layout/HistogramChartPlot.js';\nimport { HistogramOverlays } from './components/overlays/HistogramOverlays.js';\nimport { HistogramThresholdArea } from './components/thresholds/HistogramThresholdArea.js';\nimport { ThresholdIndicators } from './components/thresholds/ThresholdIndicators.js';\nimport {\n  DISPLAY_NAME,\n  HISTOGRAM_CHART_ARIA_LABEL,\n} from './constants/defaults.js';\nimport { AREAS } from './constants/histogram-grid-area-rules.js';\nimport { useHistogramAnnotationsConfig } from './hooks/useHistogramAnnotationsConfig.js';\nimport { useHistogramFilteredData } from './hooks/useHistogramFilteredData.js';\nimport { useHistogramLegend } from './hooks/useHistogramLegend.js';\nimport { useHistogramThresholds } from './hooks/useHistogramThresholds.js';\nimport { useYAxisConfig } from './hooks/useYAxisConfig.js';\nimport { HistogramAnnotationsDataProvider } from './providers/HistogramAnnotationsDataProvider.js';\nimport { HistogramChartImperativeHandler } from './providers/HistogramChartImperativeHandler.js';\nimport { HistogramFormatterProvider } from './providers/HistogramFormatterProvider.js';\nimport { HistogramXScaleProvider } from './providers/HistogramXScaleProvider.js';\nimport { HistogramYScalesProvider } from './providers/HistogramYScalesProvider.js';\nimport type { HistogramChartConfiguration } from './types/histogram-props.js';\nimport type { HistogramChartRef } from './types/histogram-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\nconst histogramGridTemplateAreas = `\n  \"${AREAS.annotations} ${AREAS.annotations} ${AREAS.annotations} . .\"\n  \"${AREAS.leftAxis} ${AREAS.leftThreshold} plot ${AREAS.rightThreshold} ${AREAS.rightAxis}\"\n  \". . ${AREAS.bottomAxis} . .\"\n`;\nconst histogramGridTemplateColumns =\n  'minmax(0, auto) auto minmax(60%, 1fr) auto minmax(0, auto)';\n\nexport interface _HistogramChartProps {\n  config: HistogramChartConfiguration;\n}\n\nexport const HistogramChartInternal = forwardRef<\n  HistogramChartRef,\n  PropsWithChildren<_HistogramChartProps>\n>(({ config }, forwardedRef) => {\n  const loading = useChartLayoutLoading();\n\n  const annotations = useHistogramAnnotationsConfig();\n\n  const tracksQuantity = annotations.tracks.length;\n  const numHiddenTracks = annotations.tracks.filter(\n    (value) => value.hidden,\n  ).length;\n\n  const annotationsVisibleArea = getAnnotationsVisibleArea(\n    tracksQuantity,\n    annotations?.visibleTracksLimit,\n    numHiddenTracks,\n  );\n\n  const { leftThreshold, rightThreshold } = useHistogramThresholds();\n  const hasThresholds = !isEmpty(leftThreshold) || !isEmpty(rightThreshold);\n  const { width, height } = useGraphSize();\n\n  const chartRef = useRef<HTMLDivElement>(null);\n  const mergedRef = useMergeRefs<HistogramChartRef | HTMLDivElement>([\n    forwardedRef,\n    chartRef,\n  ]);\n\n  const { orientation } = useChartLayoutOrientation();\n  const { right: axisRight } = useYAxisConfig();\n  const { hidden: legendHidden } = useHistogramLegend();\n  const { units } = useHistogramFilteredData();\n\n  const availableWidth =\n    tracksQuantity && orientation === 'vertical'\n      ? width - SCROLLBAR_WIDTH\n      : width;\n\n  const noAxisRight = !axisRight || units.length === 1;\n\n  const noLegendRight = legendHidden || orientation === 'vertical';\n  const noLegendBottom = legendHidden || orientation === 'horizontal';\n\n  const hasRightPadding = noAxisRight && noLegendRight;\n\n  const chartGridHeight =\n    height -\n    (!tracksQuantity || noLegendBottom\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\n  const chartGridRenderHeight =\n    tracksQuantity && !noLegendBottom && !showAnnotations\n      ? chartGridHeight - OVERLAY_PADDING\n      : chartGridHeight;\n\n  const annotationsPadding =\n    tracksQuantity - numHiddenTracks > 0 ? ANNOTATIONS_PADDING_BOTTOM : 0;\n  const annotationsRowHeight = showAnnotations\n    ? annotationsVisibleArea + annotationsPadding\n    : 0;\n\n  const histogramGridTemplateRows = showAxes\n    ? `minmax(0, ${annotationsRowHeight}px) minmax(60%, 1fr) minmax(0, auto)`\n    : '0px 1fr 1px';\n\n  return (\n    <div\n      style={{\n        paddingTop: showAnnotations ? 0 : OVERLAY_PADDING,\n        paddingLeft: 0,\n      }}\n      className={defaultChartSize}\n      role=\"img\"\n      aria-label={HISTOGRAM_CHART_ARIA_LABEL}\n    >\n      <ChartGrid\n        width={availableWidth - (hasRightPadding ? OVERLAY_PADDING : 0)}\n        height={chartGridRenderHeight}\n        gridTemplateAreas={histogramGridTemplateAreas}\n        gridTemplateColumns={histogramGridTemplateColumns}\n        gridTemplateRows={histogramGridTemplateRows}\n        ref={mergedRef}\n        data-testid=\"histogram-chart-root\"\n      >\n        <HistogramXScaleProvider>\n          <HistogramYScalesProvider>\n            <HistogramFormatterProvider>\n              <HistogramAnnotationsDataProvider>\n                <HistogramChartImperativeHandler\n                  config={config}\n                  forwardedRef={forwardedRef}\n                  chartRef={chartRef}\n                >\n                  {showAxes && <HistogramValueLeftAxisArea />}\n                  {showAxes && <HistogramValueBottomAxisArea />}\n                  {showAxes && <HistogramValueRightAxisArea />}\n                  {showAnnotations && <HistogramAnnotationsArea />}\n                  <ChartGrid.PlotArea>\n                    <HistogramChartPlot />\n                    {showAnnotations && <HistogramAnnotationsIndicators />}\n                    <ThresholdIndicators />\n                    <ChartLoaderOverlay\n                      loading={!!loading}\n                      zoomEnabled={!!config.interactions?.zoom?.enabled}\n                    >\n                      <HistogramOverlays />\n                    </ChartLoaderOverlay>\n                  </ChartGrid.PlotArea>\n                  {hasThresholds && <HistogramThresholdArea />}\n                </HistogramChartImperativeHandler>\n              </HistogramAnnotationsDataProvider>\n            </HistogramFormatterProvider>\n          </HistogramYScalesProvider>\n        </HistogramXScaleProvider>\n      </ChartGrid>\n    </div>\n  );\n});\n\n(\n  HistogramChartInternal as typeof HistogramChartInternal & {\n    displayName: string;\n  }\n).displayName = DISPLAY_NAME;\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/charts/histogram/components/axes/HistogramValueBottomAxisArea/HistogramValueBottomAxisArea.css

@@ -1,3 +1,3 @@
-._9phcbi0-3-7-1 {
+._9phcbi0-3-8-0 {
   position: relative;
 }

package/esm/charts/histogram/components/axes/HistogramValueBottomAxisArea/HistogramValueBottomAxisArea.sty.js

@@ -1,5 +1,5 @@
 import "./HistogramValueBottomAxisArea.css";
-var axisContainerStyle = "_9phcbi0-3-7-1";
+var axisContainerStyle = "_9phcbi0-3-8-0";
 export {
   axisContainerStyle
 };

package/esm/charts/histogram/components/axes/HistogramValueBottomAxisArea/HistogramValueBottomAxisArea.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/histogram/components/axes/HistogramValueBottomAxisArea/HistogramValueBottomAxisArea.css.ts"],
-  "sourcesContent": ["import './HistogramValueBottomAxisArea.css';\nexport var axisContainerStyle = '_9phcbi0-3-7-1';"],
+  "sourcesContent": ["import './HistogramValueBottomAxisArea.css';\nexport var axisContainerStyle = '_9phcbi0-3-8-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,qBAAqB;",
   "names": []
 }

package/esm/charts/histogram/components/overlays/HistogramExplore/HistogramTooltip.css

@@ -1,4 +1,4 @@
-._fzvydv0-3-7-1 {
+._fzvydv0-3-8-0 {
   padding-left: var(--dt-spacings-size-8, 8px);
   padding-right: var(--dt-spacings-size-8, 8px);
 }

package/esm/charts/histogram/components/overlays/HistogramExplore/HistogramTooltip.sty.js

@@ -1,5 +1,5 @@
 import "./HistogramTooltip.css";
-var wrapper = "_fzvydv0-3-7-1";
+var wrapper = "_fzvydv0-3-8-0";
 export {
   wrapper
 };

package/esm/charts/histogram/components/overlays/HistogramExplore/HistogramTooltip.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/histogram/components/overlays/HistogramExplore/HistogramTooltip.css.ts"],
-  "sourcesContent": ["import './HistogramTooltip.css';\nexport var wrapper = '_fzvydv0-3-7-1';"],
+  "sourcesContent": ["import './HistogramTooltip.css';\nexport var wrapper = '_fzvydv0-3-8-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,UAAU;",
   "names": []
 }

package/esm/charts/histogram/components/overlays/HistogramOverlays.css

@@ -1,4 +1,4 @@
-._drl8ns0-3-7-1 {
+._drl8ns0-3-8-0 {
   top: -7px;
   left: -7px;
   width: calc(100% + 14px);
@@ -6,7 +6,7 @@
   z-index: 2;
   pointer-events: none;
 }
-._drl8ns1-3-7-1 {
+._drl8ns1-3-8-0 {
   pointer-events: none;
   overflow: visible;
   z-index: 1;

package/esm/charts/histogram/components/overlays/HistogramOverlays.sty.js

@@ -1,7 +1,7 @@
 import "../../../core/components/chart-grid/ChartGrid.css";
 import "./HistogramOverlays.css";
-var crosshairLayout = "_drl8ns1-3-7-1 _13lzg4k0-3-7-1";
-var datapointLayout = "_drl8ns0-3-7-1 _13lzg4k0-3-7-1";
+var crosshairLayout = "_drl8ns1-3-8-0 _13lzg4k0-3-8-0";
+var datapointLayout = "_drl8ns0-3-8-0 _13lzg4k0-3-8-0";
 export {
   crosshairLayout,
   datapointLayout

package/esm/charts/histogram/components/overlays/HistogramOverlays.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/histogram/components/overlays/HistogramOverlays.css.ts"],
-  "sourcesContent": ["import '../../../core/components/chart-grid/ChartGrid.css';\nimport './HistogramOverlays.css';\nexport var crosshairLayout = '_drl8ns1-3-7-1 _13lzg4k0-3-7-1';\nexport var datapointLayout = '_drl8ns0-3-7-1 _13lzg4k0-3-7-1';"],
+  "sourcesContent": ["import '../../../core/components/chart-grid/ChartGrid.css';\nimport './HistogramOverlays.css';\nexport var crosshairLayout = '_drl8ns1-3-8-0 _13lzg4k0-3-8-0';\nexport var datapointLayout = '_drl8ns0-3-8-0 _13lzg4k0-3-8-0';"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACA,IAAI,kBAAkB;AACtB,IAAI,kBAAkB;",
   "names": []
 }

package/esm/charts/honeycomb/HoneycombChart.css

@@ -1,3 +1,3 @@
-._p8cogi0-3-7-1 {
+._p8cogi0-3-8-0 {
   position: relative;
 }

package/esm/charts/honeycomb/HoneycombChart.js

@@ -16,6 +16,7 @@ import { HoneycombFormatterContext } from "./context/honeycomb-formatter.context
 import { HoneycombLabelsDisplayContext } from "./context/honeycomb-labels-display.context.js";
 import { HoneycombLoadingContext } from "./context/honeycomb-loading.context.js";
 import { HoneycombShapeContext } from "./context/honeycomb-shape.context.js";
+import { HoneycombTextSizeContext } from "./context/honeycomb-text-size.context.js";
 import { HoneycombTruncationMode } from "./context/honeycomb-truncation-mode.context.js";
 import { useHoneycombChartConfig } from "./hooks/use-honeycomb-chart-config.js";
 import { HoneycombBaseScaleProvider } from "./providers/honeycomb-base-scale.provider.js";
@@ -29,6 +30,8 @@ import { HoneycombLegend } from "./slots/HoneycombLegend.js";
 import { Toolbar } from "./slots/Toolbar.js";
 import { Tooltip } from "./slots/Tooltip.js";
 import { buildAndDownloadCsv } from "./utils/build-and-download-csv.js";
+import { isHoneycombChartAccessorDataProps } from "./utils/build-honeycomb-config.js";
+import { normalizeHoneycombChartData } from "./utils/normalize-honeycomb-chart-data.js";
 import { normalizeTilesData } from "./utils/normalize-tiles-data.js";
 import { useBehavioralTrackingProps } from "../../core/hooks/useBehavioralTrackingProps.js";
 import { useMergeRefs } from "../../core/hooks/useMergeRefs.js";
@@ -68,7 +71,7 @@ const _HoneycombChart = forwardRef((props, forwardedRef) => {
     forwardedRef,
     containerRef
   ]);
-  const sanitizedData = normalizeTilesData(data);
+  const sanitizedData = isHoneycombChartAccessorDataProps(props) ? normalizeHoneycombChartData(data, props.valueAccessor) : normalizeTilesData(data);
   const config = useHoneycombChartConfig(props);
   const formatterContext = {
     formatter: config.formatter,
@@ -106,7 +109,7 @@ const _HoneycombChart = forwardRef((props, forwardedRef) => {
         HoneycombLabelsDisplayContext.Provider,
         {
           value: config.labelsDisplay,
-          children: /* @__PURE__ */ jsx(
+          children: /* @__PURE__ */ jsx(HoneycombTextSizeContext.Provider, { value: config.textSize, children: /* @__PURE__ */ jsx(
             HoneycombFilteredDataProvider,
             {
               data: sanitizedData,
@@ -123,7 +126,7 @@ const _HoneycombChart = forwardRef((props, forwardedRef) => {
                 }
               ) }) })
             }
-          )
+          ) })
         }
       ) }) }) }) }) }) })
     }

package/esm/charts/honeycomb/HoneycombChart.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/honeycomb/HoneycombChart.tsx"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport {\n  forwardRef,\n  type PropsWithChildren,\n  type ReactElement,\n  useImperativeHandle,\n  useRef,\n} from 'react';\n\nimport { HoneycombChartLayout } from './components/HoneycombChartLayout.js';\nimport {\n  DEFAULT_HONEYCOMB_HEIGHT,\n  DISPLAY_NAME,\n  HONEYCOMB_CHART_ARIA_LABEL,\n} from './constants.js';\nimport { HoneycombColorSchemeContext } from './context/honeycomb-color-scheme.context.js';\nimport { HoneycombFormatterContext } from './context/honeycomb-formatter.context.js';\nimport { HoneycombLabelsDisplayContext } from './context/honeycomb-labels-display.context.js';\nimport { HoneycombLoadingContext } from './context/honeycomb-loading.context.js';\nimport { HoneycombShapeContext } from './context/honeycomb-shape.context.js';\nimport { HoneycombTruncationMode } from './context/honeycomb-truncation-mode.context.js';\nimport { useHoneycombChartConfig } from './hooks/use-honeycomb-chart-config.js';\nimport { HoneycombBaseScaleProvider } from './providers/honeycomb-base-scale.provider.js';\nimport { HoneycombConfigurationProvider } from './providers/honeycomb-configuration.provider.js';\nimport { HoneycombDatasetTypeProvider } from './providers/honeycomb-dataset-type.provider.js';\nimport { HoneycombFilteredDataProvider } from './providers/honeycomb-filtered-data.provider.js';\nimport { HoneycombMetadataProvider } from './providers/honeycomb-metadata.provider.js';\nimport { HoneycombStoreProvider } from './providers/honeycomb-store.provider.js';\nimport { HoneycombChartDownloadCSVSlot } from './slots/DownloadCSV.js';\nimport { HoneycombLegend } from './slots/HoneycombLegend.js';\nimport { Toolbar } from './slots/Toolbar.js';\nimport { Tooltip } from './slots/Tooltip.js';\nimport { HoneycombConsumerExportedConfig } from './types/honeycomb-config-properties.js';\nimport { HoneycombRequiredConfigProps } from './types/honeycomb-internal.js';\nimport { HoneycombChartProps, HoneycombChartRef } from './types/honeycomb.js';\nimport { buildAndDownloadCsv } from './utils/build-and-download-csv.js';\nimport { normalizeTilesData } from './utils/normalize-tiles-data.js';\nimport { useBehavioralTrackingProps } from '../../core/hooks/useBehavioralTrackingProps.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport { Intent } from '../../core/slots/Intent/Intent.js';\nimport { defaultChartSize } from '../../core/styles/defaultChartValues.sty.js';\nimport { ChartSeriesActionContext } from '../core/components/series-action/ChartSeriesActionContext.js';\nimport { getToolbarConfigWithoutIntents } from '../core/components/toolbar/utils/get-toolbar-config-without-intents.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 { ChartType } from '../core/types/chart-types.js';\nimport { coerceSizeValue } from '../core/utils/coerceSizeValue.js';\n\nconst COMPONENT_NAME = 'HoneycombChart';\n\nconst normalizeHoneycombConfig = (\n  config: HoneycombRequiredConfigProps,\n): HoneycombConsumerExportedConfig => {\n  const { toolbar: configuredToolbar, ...remainingConfig } = config;\n  const toolbar = configuredToolbar\n    ? getToolbarConfigWithoutIntents(configuredToolbar)\n    : undefined;\n\n  return { ...remainingConfig, toolbar };\n};\n\n/** The honeycomb component */\nexport const _HoneycombChart = forwardRef<\n  HoneycombChartRef,\n  PropsWithChildren<HoneycombChartProps>\n>((props, forwardedRef) => {\n  const {\n    data,\n    seriesActions,\n    width,\n    height,\n    style: costumerStyle,\n    className: customerClassNames,\n    loading,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    'data-testid': dataTestId,\n  } = props;\n\n  const [behavioralTrackingProps] = useBehavioralTrackingProps(props);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const chartWidth = coerceSizeValue(width);\n  const chartHeight = coerceSizeValue(height) || DEFAULT_HONEYCOMB_HEIGHT;\n  const rootRef = useMergeRefs<HoneycombChartRef | HTMLDivElement>([\n    forwardedRef,\n    containerRef,\n  ]);\n\n  const sanitizedData = normalizeTilesData(data);\n\n  const config = useHoneycombChartConfig(props);\n\n  const formatterContext = {\n    formatter: config.formatter,\n    unit: config.unit,\n  };\n\n  useImperativeHandle(forwardedRef, () => {\n    const consumerConfig = normalizeHoneycombConfig(config);\n    return {\n      element: containerRef.current,\n      downloadData: () => {\n        buildAndDownloadCsv(sanitizedData);\n      },\n      getConfig: () => {\n        return JSON.stringify({\n          type: ChartType.Honeycomb,\n          ...consumerConfig,\n        });\n      },\n    };\n  });\n\n  return (\n    <div\n      {...behavioralTrackingProps}\n      ref={rootRef}\n      style={{ ...costumerStyle, width: chartWidth, height: chartHeight }}\n      className={clsx(defaultChartSize, customerClassNames)}\n      data-testid={dataTestId}\n      data-dtrum-mask={dataDtrumMask}\n      data-dtrum-allow={dataDtrumAllow}\n      data-dt-component={COMPONENT_NAME}\n      aria-label={HONEYCOMB_CHART_ARIA_LABEL}\n      role=\"img\"\n    >\n      <HoneycombLoadingContext.Provider value={loading}>\n        <HoneycombConfigurationProvider config={config}>\n          <HoneycombShapeContext.Provider value={config.shape}>\n            <HoneycombColorSchemeContext.Provider value={config.colorScheme}>\n              <HoneycombTruncationMode.Provider value={config.truncationMode}>\n                <HoneycombFormatterContext.Provider value={formatterContext}>\n                  <HoneycombLabelsDisplayContext.Provider\n                    value={config.labelsDisplay}\n                  >\n                    <HoneycombFilteredDataProvider\n                      data={sanitizedData}\n                      config={config}\n                    >\n                      <HoneycombDatasetTypeProvider>\n                        <HoneycombBaseScaleProvider>\n                          <ChartSeriesActionContext.Provider\n                            value={{\n                              // We need a cast here as the provider expects unknown and the\n                              // react context will not be able to carry the generic anyways.\n                              chartSeriesActions: seriesActions as (\n                                series: unknown,\n                              ) => ReactElement<PropsWithChildren>,\n                            }}\n                          >\n                            <HoneycombStoreProvider>\n                              <HoneycombMetadataProvider>\n                                <HoneycombChartLayout {...props} />\n                              </HoneycombMetadataProvider>\n                            </HoneycombStoreProvider>\n                          </ChartSeriesActionContext.Provider>\n                        </HoneycombBaseScaleProvider>\n                      </HoneycombDatasetTypeProvider>\n                    </HoneycombFilteredDataProvider>\n                  </HoneycombLabelsDisplayContext.Provider>\n                </HoneycombFormatterContext.Provider>\n              </HoneycombTruncationMode.Provider>\n            </HoneycombColorSchemeContext.Provider>\n          </HoneycombShapeContext.Provider>\n        </HoneycombConfigurationProvider>\n      </HoneycombLoadingContext.Provider>\n    </div>\n  );\n});\n\n(\n  _HoneycombChart as typeof _HoneycombChart & { displayName: string }\n).displayName = DISPLAY_NAME;\n\n/**\n * The `HoneycombChart` is used to display data in a grid using various shapes\n * for data points.\n * @public\n */\nexport const HoneycombChart = Object.assign(_HoneycombChart, {\n  EmptyState: EmptyStateSlot,\n  ErrorState: ErrorStateSlot,\n  Legend: HoneycombLegend,\n  Intent,\n  ColorRule,\n  Toolbar,\n  DownloadCSV: HoneycombChartDownloadCSVSlot,\n  Tooltip,\n});\n"],
-  "mappings": "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",
+  "sourcesContent": ["import clsx from 'clsx';\nimport {\n  forwardRef,\n  type PropsWithChildren,\n  type ReactElement,\n  useImperativeHandle,\n  useRef,\n} from 'react';\n\nimport { HoneycombChartLayout } from './components/HoneycombChartLayout.js';\nimport {\n  DEFAULT_HONEYCOMB_HEIGHT,\n  DISPLAY_NAME,\n  HONEYCOMB_CHART_ARIA_LABEL,\n} from './constants.js';\nimport { HoneycombColorSchemeContext } from './context/honeycomb-color-scheme.context.js';\nimport { HoneycombFormatterContext } from './context/honeycomb-formatter.context.js';\nimport { HoneycombLabelsDisplayContext } from './context/honeycomb-labels-display.context.js';\nimport { HoneycombLoadingContext } from './context/honeycomb-loading.context.js';\nimport { HoneycombShapeContext } from './context/honeycomb-shape.context.js';\nimport { HoneycombTextSizeContext } from './context/honeycomb-text-size.context.js';\nimport { HoneycombTruncationMode } from './context/honeycomb-truncation-mode.context.js';\nimport { useHoneycombChartConfig } from './hooks/use-honeycomb-chart-config.js';\nimport { HoneycombBaseScaleProvider } from './providers/honeycomb-base-scale.provider.js';\nimport { HoneycombConfigurationProvider } from './providers/honeycomb-configuration.provider.js';\nimport { HoneycombDatasetTypeProvider } from './providers/honeycomb-dataset-type.provider.js';\nimport { HoneycombFilteredDataProvider } from './providers/honeycomb-filtered-data.provider.js';\nimport { HoneycombMetadataProvider } from './providers/honeycomb-metadata.provider.js';\nimport { HoneycombStoreProvider } from './providers/honeycomb-store.provider.js';\nimport { HoneycombChartDownloadCSVSlot } from './slots/DownloadCSV.js';\nimport { HoneycombLegend } from './slots/HoneycombLegend.js';\nimport { Toolbar } from './slots/Toolbar.js';\nimport { Tooltip } from './slots/Tooltip.js';\nimport { HoneycombConsumerExportedConfig } from './types/honeycomb-config-properties.js';\nimport { HoneycombRequiredConfigProps } from './types/honeycomb-internal.js';\nimport {\n  HoneycombChartProps,\n  HoneycombChartRef,\n  type HoneycombData,\n} from './types/honeycomb.js';\nimport { buildAndDownloadCsv } from './utils/build-and-download-csv.js';\nimport { isHoneycombChartAccessorDataProps } from './utils/build-honeycomb-config.js';\nimport { normalizeHoneycombChartData } from './utils/normalize-honeycomb-chart-data.js';\nimport { normalizeTilesData } from './utils/normalize-tiles-data.js';\nimport { useBehavioralTrackingProps } from '../../core/hooks/useBehavioralTrackingProps.js';\nimport { useMergeRefs } from '../../core/hooks/useMergeRefs.js';\nimport { Intent } from '../../core/slots/Intent/Intent.js';\nimport { defaultChartSize } from '../../core/styles/defaultChartValues.sty.js';\nimport { ChartSeriesActionContext } from '../core/components/series-action/ChartSeriesActionContext.js';\nimport { getToolbarConfigWithoutIntents } from '../core/components/toolbar/utils/get-toolbar-config-without-intents.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 type { ChartData } from '../core/types/chart-data.js';\nimport { ChartType } from '../core/types/chart-types.js';\nimport { coerceSizeValue } from '../core/utils/coerceSizeValue.js';\n\nconst COMPONENT_NAME = 'HoneycombChart';\n\nconst normalizeHoneycombConfig = (\n  config: HoneycombRequiredConfigProps,\n): HoneycombConsumerExportedConfig => {\n  const { toolbar: configuredToolbar, ...remainingConfig } = config;\n  const toolbar = configuredToolbar\n    ? getToolbarConfigWithoutIntents(configuredToolbar)\n    : undefined;\n\n  return { ...remainingConfig, toolbar };\n};\n\n/** The honeycomb component */\nexport const _HoneycombChart = forwardRef<\n  HoneycombChartRef,\n  PropsWithChildren<HoneycombChartProps>\n>((props, forwardedRef) => {\n  const {\n    data,\n    seriesActions,\n    width,\n    height,\n    style: costumerStyle,\n    className: customerClassNames,\n    loading,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    'data-testid': dataTestId,\n  } = props;\n\n  const [behavioralTrackingProps] = useBehavioralTrackingProps(props);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const chartWidth = coerceSizeValue(width);\n  const chartHeight = coerceSizeValue(height) || DEFAULT_HONEYCOMB_HEIGHT;\n  const rootRef = useMergeRefs<HoneycombChartRef | HTMLDivElement>([\n    forwardedRef,\n    containerRef,\n  ]);\n\n  const sanitizedData = isHoneycombChartAccessorDataProps(props)\n    ? normalizeHoneycombChartData(data as ChartData, props.valueAccessor)\n    : normalizeTilesData(data as HoneycombData);\n\n  const config = useHoneycombChartConfig(props);\n\n  const formatterContext = {\n    formatter: config.formatter,\n    unit: config.unit,\n  };\n\n  useImperativeHandle(forwardedRef, () => {\n    const consumerConfig = normalizeHoneycombConfig(config);\n    return {\n      element: containerRef.current,\n      downloadData: () => {\n        buildAndDownloadCsv(sanitizedData);\n      },\n      getConfig: () => {\n        return JSON.stringify({\n          type: ChartType.Honeycomb,\n          ...consumerConfig,\n        });\n      },\n    };\n  });\n\n  return (\n    <div\n      {...behavioralTrackingProps}\n      ref={rootRef}\n      style={{ ...costumerStyle, width: chartWidth, height: chartHeight }}\n      className={clsx(defaultChartSize, customerClassNames)}\n      data-testid={dataTestId}\n      data-dtrum-mask={dataDtrumMask}\n      data-dtrum-allow={dataDtrumAllow}\n      data-dt-component={COMPONENT_NAME}\n      aria-label={HONEYCOMB_CHART_ARIA_LABEL}\n      role=\"img\"\n    >\n      <HoneycombLoadingContext.Provider value={loading}>\n        <HoneycombConfigurationProvider config={config}>\n          <HoneycombShapeContext.Provider value={config.shape}>\n            <HoneycombColorSchemeContext.Provider value={config.colorScheme}>\n              <HoneycombTruncationMode.Provider value={config.truncationMode}>\n                <HoneycombFormatterContext.Provider value={formatterContext}>\n                  <HoneycombLabelsDisplayContext.Provider\n                    value={config.labelsDisplay}\n                  >\n                    <HoneycombTextSizeContext.Provider value={config.textSize}>\n                      <HoneycombFilteredDataProvider\n                        data={sanitizedData}\n                        config={config}\n                      >\n                        <HoneycombDatasetTypeProvider>\n                          <HoneycombBaseScaleProvider>\n                            <ChartSeriesActionContext.Provider\n                              value={{\n                                // We need a cast here as the provider expects unknown and the\n                                // react context will not be able to carry the generic anyways.\n                                chartSeriesActions: seriesActions as (\n                                  series: unknown,\n                                ) => ReactElement<PropsWithChildren>,\n                              }}\n                            >\n                              <HoneycombStoreProvider>\n                                <HoneycombMetadataProvider>\n                                  <HoneycombChartLayout {...props} />\n                                </HoneycombMetadataProvider>\n                              </HoneycombStoreProvider>\n                            </ChartSeriesActionContext.Provider>\n                          </HoneycombBaseScaleProvider>\n                        </HoneycombDatasetTypeProvider>\n                      </HoneycombFilteredDataProvider>\n                    </HoneycombTextSizeContext.Provider>\n                  </HoneycombLabelsDisplayContext.Provider>\n                </HoneycombFormatterContext.Provider>\n              </HoneycombTruncationMode.Provider>\n            </HoneycombColorSchemeContext.Provider>\n          </HoneycombShapeContext.Provider>\n        </HoneycombConfigurationProvider>\n      </HoneycombLoadingContext.Provider>\n    </div>\n  );\n});\n\n(\n  _HoneycombChart as typeof _HoneycombChart & { displayName: string }\n).displayName = DISPLAY_NAME;\n\n/**\n * The `HoneycombChart` is used to display data in a grid using various shapes\n * for data points.\n * @public\n */\nexport const HoneycombChart = Object.assign(_HoneycombChart, {\n  EmptyState: EmptyStateSlot,\n  ErrorState: ErrorStateSlot,\n  Legend: HoneycombLegend,\n  Intent,\n  ColorRule,\n  Toolbar,\n  DownloadCSV: HoneycombChartDownloadCSVSlot,\n  Tooltip,\n});\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/charts/honeycomb/HoneycombChart.sty.js

@@ -1,5 +1,5 @@
 import "./HoneycombChart.css";
-var graphContainer = "_p8cogi0-3-7-1";
+var graphContainer = "_p8cogi0-3-8-0";
 export {
   graphContainer
 };

package/esm/charts/honeycomb/HoneycombChart.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/honeycomb/HoneycombChart.css.ts"],
-  "sourcesContent": ["import './HoneycombChart.css';\nexport var graphContainer = '_p8cogi0-3-7-1';"],
+  "sourcesContent": ["import './HoneycombChart.css';\nexport var graphContainer = '_p8cogi0-3-8-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,iBAAiB;",
   "names": []
 }

package/esm/charts/honeycomb/components/HiveOverlay.css

@@ -1,4 +1,4 @@
-._lmrhfg0-3-7-1 {
+._lmrhfg0-3-8-0 {
   position: absolute;
   top: 0;
   left: 0;

package/esm/charts/honeycomb/components/HiveOverlay.js

@@ -14,12 +14,7 @@ const HiveOverlay = () => {
   const toolbarConfig = useHoneycombToolbarConfig();
   const toolbarEnabled = isToolbarEnabled(toolbarConfig);
   const overlay = useOverlay();
-  const {
-    handlePointerEnter,
-    handlePointerMove,
-    handlePointerLeave,
-    handleMouseClick
-  } = useOverlayEvents(overlay);
+  const eventHandlers = useOverlayEvents(overlay);
   const { height, width } = useGraphSize();
   const { chartSeriesActions } = useSeriesActions();
   const data = useTooltipData().data;
@@ -34,11 +29,8 @@ const HiveOverlay = () => {
         width
       },
       "data-testid": "honeycomb-overlay",
-      onPointerEnter: handlePointerEnter,
-      onPointerMove: handlePointerMove,
-      onPointerLeave: handlePointerLeave,
-      onClick: handleMouseClick,
       ref: overlay.overlayRef,
+      ...eventHandlers,
       children: [
         /* @__PURE__ */ jsx(
           HoneycombOverlayTooltip,

package/esm/charts/honeycomb/components/HiveOverlay.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/honeycomb/components/HiveOverlay.tsx"],
-  "sourcesContent": ["import { overlay as overlayClassName } from './HiveOverlay.sty.js';\nimport { HoneycombToolbar } from './toolbar/HoneycombToolbar.js';\nimport { HoneycombOverlayTooltip } from './tooltip/HoneycombOverlayTooltip.js';\nimport { Flex } from '../../../layouts/flex/Flex.js';\nimport { useGraphSize } from '../../core/components/chart-layout/hooks/useGraphSize.js';\nimport { useOverlay } from '../../core/components/overlay-tooltip/contexts/OverlayContext.js';\nimport { useTooltipData } from '../../core/components/overlay-tooltip/hooks/useTooltipData.js';\nimport { useSeriesActions } from '../../core/components/series-action/ChartSeriesActionContext.js';\nimport { isToolbarEnabled } from '../../core/utils/is-toolbar-enabled.js';\nimport { useHoneycombToolbarConfig } from '../hooks/use-honeycomb-toolbar-config.js';\nimport { useOverlayEvents } from '../hooks/use-overlay-events.js';\n\nexport const HiveOverlay = () => {\n  const toolbarConfig = useHoneycombToolbarConfig();\n  const toolbarEnabled = isToolbarEnabled(toolbarConfig);\n  const overlay = useOverlay();\n  const {\n    handlePointerEnter,\n    handlePointerMove,\n    handlePointerLeave,\n    handleMouseClick,\n  } = useOverlayEvents(overlay);\n  const { height, width } = useGraphSize();\n  const { chartSeriesActions } = useSeriesActions();\n  const data = useTooltipData().data;\n\n  const series = data?.series?.[0];\n  const metadata = data?.metadata as { id: string } | undefined;\n\n  return (\n    <Flex\n      className={overlayClassName}\n      style={{\n        height,\n        width,\n      }}\n      data-testid=\"honeycomb-overlay\"\n      onPointerEnter={handlePointerEnter}\n      onPointerMove={handlePointerMove}\n      onPointerLeave={handlePointerLeave}\n      onClick={handleMouseClick}\n      ref={overlay.overlayRef}\n    >\n      <HoneycombOverlayTooltip\n        actionsForItem={\n          chartSeriesActions && series && metadata\n            ? () => () =>\n                chartSeriesActions({\n                  id: metadata.id,\n                  name: series.name,\n                  values: [series.value],\n                })\n            : undefined\n        }\n      />\n      {toolbarEnabled && <HoneycombToolbar />}\n    </Flex>\n  );\n};\n"],
-  "mappings": "AA8BI,SAaE,KAbF;AA9BJ,SAAS,WAAW,wBAAwB;AAC5C,SAAS,wBAAwB;AACjC,SAAS,+BAA+B;AACxC,SAAS,YAAY;AACrB,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB;AAC/B,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AACjC,SAAS,iCAAiC;AAC1C,SAAS,wBAAwB;AAE1B,MAAM,cAAc,MAAM;AAC/B,QAAM,gBAAgB,0BAA0B;AAChD,QAAM,iBAAiB,iBAAiB,aAAa;AACrD,QAAM,UAAU,WAAW;AAC3B,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,iBAAiB,OAAO;AAC5B,QAAM,EAAE,QAAQ,MAAM,IAAI,aAAa;AACvC,QAAM,EAAE,mBAAmB,IAAI,iBAAiB;AAChD,QAAM,OAAO,eAAe,EAAE;AAE9B,QAAM,SAAS,MAAM,SAAS,CAAC;AAC/B,QAAM,WAAW,MAAM;AAEvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACX,OAAO;AAAA,QACL;AAAA,QACA;AAAA,MACF;AAAA,MACA,eAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,eAAe;AAAA,MACf,gBAAgB;AAAA,MAChB,SAAS;AAAA,MACT,KAAK,QAAQ;AAAA,MAEb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,gBACE,sBAAsB,UAAU,WAC5B,MAAM,MACJ,mBAAmB;AAAA,cACjB,IAAI,SAAS;AAAA,cACb,MAAM,OAAO;AAAA,cACb,QAAQ,CAAC,OAAO,KAAK;AAAA,YACvB,CAAC,IACH;AAAA;AAAA,QAER;AAAA,QACC,kBAAkB,oBAAC,oBAAiB;AAAA;AAAA;AAAA,EACvC;AAEJ;",
+  "sourcesContent": ["import { overlay as overlayClassName } from './HiveOverlay.sty.js';\nimport { HoneycombToolbar } from './toolbar/HoneycombToolbar.js';\nimport { HoneycombOverlayTooltip } from './tooltip/HoneycombOverlayTooltip.js';\nimport { Flex } from '../../../layouts/flex/Flex.js';\nimport { useGraphSize } from '../../core/components/chart-layout/hooks/useGraphSize.js';\nimport { useOverlay } from '../../core/components/overlay-tooltip/contexts/OverlayContext.js';\nimport { useTooltipData } from '../../core/components/overlay-tooltip/hooks/useTooltipData.js';\nimport { useSeriesActions } from '../../core/components/series-action/ChartSeriesActionContext.js';\nimport { isToolbarEnabled } from '../../core/utils/is-toolbar-enabled.js';\nimport { useHoneycombToolbarConfig } from '../hooks/use-honeycomb-toolbar-config.js';\nimport { useOverlayEvents } from '../hooks/use-overlay-events.js';\n\nexport const HiveOverlay = () => {\n  const toolbarConfig = useHoneycombToolbarConfig();\n  const toolbarEnabled = isToolbarEnabled(toolbarConfig);\n  const overlay = useOverlay();\n  const eventHandlers = useOverlayEvents(overlay);\n  const { height, width } = useGraphSize();\n  const { chartSeriesActions } = useSeriesActions();\n  const data = useTooltipData().data;\n\n  const series = data?.series?.[0];\n  const metadata = data?.metadata as { id: string } | undefined;\n\n  return (\n    <Flex\n      className={overlayClassName}\n      style={{\n        height,\n        width,\n      }}\n      data-testid=\"honeycomb-overlay\"\n      ref={overlay.overlayRef}\n      {...eventHandlers}\n    >\n      <HoneycombOverlayTooltip\n        actionsForItem={\n          chartSeriesActions && series && metadata\n            ? () => () =>\n                chartSeriesActions({\n                  id: metadata.id,\n                  name: series.name,\n                  values: [series.value],\n                })\n            : undefined\n        }\n      />\n      {toolbarEnabled && <HoneycombToolbar />}\n    </Flex>\n  );\n};\n"],
+  "mappings": "AAyBI,SAUE,KAVF;AAzBJ,SAAS,WAAW,wBAAwB;AAC5C,SAAS,wBAAwB;AACjC,SAAS,+BAA+B;AACxC,SAAS,YAAY;AACrB,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB;AAC/B,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AACjC,SAAS,iCAAiC;AAC1C,SAAS,wBAAwB;AAE1B,MAAM,cAAc,MAAM;AAC/B,QAAM,gBAAgB,0BAA0B;AAChD,QAAM,iBAAiB,iBAAiB,aAAa;AACrD,QAAM,UAAU,WAAW;AAC3B,QAAM,gBAAgB,iBAAiB,OAAO;AAC9C,QAAM,EAAE,QAAQ,MAAM,IAAI,aAAa;AACvC,QAAM,EAAE,mBAAmB,IAAI,iBAAiB;AAChD,QAAM,OAAO,eAAe,EAAE;AAE9B,QAAM,SAAS,MAAM,SAAS,CAAC;AAC/B,QAAM,WAAW,MAAM;AAEvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACX,OAAO;AAAA,QACL;AAAA,QACA;AAAA,MACF;AAAA,MACA,eAAY;AAAA,MACZ,KAAK,QAAQ;AAAA,MACZ,GAAG;AAAA,MAEJ;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,gBACE,sBAAsB,UAAU,WAC5B,MAAM,MACJ,mBAAmB;AAAA,cACjB,IAAI,SAAS;AAAA,cACb,MAAM,OAAO;AAAA,cACb,QAAQ,CAAC,OAAO,KAAK;AAAA,YACvB,CAAC,IACH;AAAA;AAAA,QAER;AAAA,QACC,kBAAkB,oBAAC,oBAAiB;AAAA;AAAA;AAAA,EACvC;AAEJ;",
   "names": []
 }

package/esm/charts/honeycomb/components/HiveOverlay.sty.js

@@ -1,5 +1,5 @@
 import "./HiveOverlay.css";
-var overlay = "_lmrhfg0-3-7-1";
+var overlay = "_lmrhfg0-3-8-0";
 export {
   overlay
 };

package/esm/charts/honeycomb/components/HiveOverlay.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/honeycomb/components/HiveOverlay.css.ts"],
-  "sourcesContent": ["import './HiveOverlay.css';\nexport var overlay = '_lmrhfg0-3-7-1';"],
+  "sourcesContent": ["import './HiveOverlay.css';\nexport var overlay = '_lmrhfg0-3-8-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,UAAU;",
   "names": []
 }

package/esm/charts/honeycomb/components/canvas/HiveCanvasLayout.css

@@ -1,4 +1,4 @@
-._12htcxh0-3-7-1 {
+._12htcxh0-3-8-0 {
   position: absolute;
   top: 0;
   left: 0;

package/esm/charts/honeycomb/components/canvas/HiveCanvasLayout.sty.js

@@ -1,5 +1,5 @@
 import "./HiveCanvasLayout.css";
-var canvasContainer = "_12htcxh0-3-7-1";
+var canvasContainer = "_12htcxh0-3-8-0";
 export {
   canvasContainer
 };

package/esm/charts/honeycomb/components/canvas/HiveCanvasLayout.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/honeycomb/components/canvas/HiveCanvasLayout.css.ts"],
-  "sourcesContent": ["import './HiveCanvasLayout.css';\nexport var canvasContainer = '_12htcxh0-3-7-1';"],
+  "sourcesContent": ["import './HiveCanvasLayout.css';\nexport var canvasContainer = '_12htcxh0-3-8-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,kBAAkB;",
   "names": []
 }

package/esm/charts/honeycomb/components/canvas/renderers/CanvasCircleRenderer.js

@@ -1,5 +1,6 @@
 import { useCallback } from "react";
 import { useCanvas } from "../../../../core/components/canvas/hooks/useCanvas.js";
+import { useHoneycombTextSize } from "../../../hooks/use-honeycomb-text-size.js";
 import { drawLabelAndValue } from "../utils/draw-label-and-value.js";
 import { fillShape } from "../utils/fill-shape.js";
 import { removeTransparentBorder } from "../utils/remove-transparent-border.js";
@@ -31,6 +32,7 @@ const CanvasCircleRenderer = (props) => {
     labelsDisplay,
     truncationMode
   } = props;
+  const textSize = useHoneycombTextSize();
   const squareSideSize = getCircumscribedSquare(radius);
   const textArea = getCircleTextArea(x, y, squareSideSize);
   const draw = useCallback(
@@ -46,7 +48,8 @@ const CanvasCircleRenderer = (props) => {
           fillColor,
           name,
           truncationMode,
-          labelsDisplay
+          labelsDisplay,
+          textSize
         );
       }
       return false;
@@ -60,7 +63,9 @@ const CanvasCircleRenderer = (props) => {
       labelsDisplay,
       truncationMode,
       name,
-      value
+      value,
+      textArea,
+      textSize
     ]
   );
   useCanvas("honeycomb-circle", draw);

package/esm/charts/honeycomb/components/canvas/renderers/CanvasCircleRenderer.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/honeycomb/components/canvas/renderers/CanvasCircleRenderer.tsx"],
-  "sourcesContent": ["import { useCallback } from 'react';\n\nimport type { TruncationMode } from '../../../../../typography/text-ellipsis/TextEllipsis.js';\nimport { useCanvas } from '../../../../core/components/canvas/hooks/useCanvas.js';\nimport { CanvasTextAreaProps } from '../../../types/canvas-text-area.js';\nimport type { HoneycombLabelsDisplay } from '../../../types/honeycomb.js';\nimport { drawLabelAndValue } from '../utils/draw-label-and-value.js';\nimport { fillShape } from '../utils/fill-shape.js';\nimport { removeTransparentBorder } from '../utils/remove-transparent-border.js';\nimport { shouldRenderLabels } from '../utils/should-render-labels.js';\n\ninterface CanvasCircleRendererProps {\n  x: number;\n  y: number;\n  radius: number;\n  fillColor: string;\n  value: string | number;\n  name?: string;\n  strokeColor?: 'transparent' | string;\n  labelsDisplay?: HoneycombLabelsDisplay;\n  truncationMode?: TruncationMode;\n}\n\nconst createCirclePath = (\n  ctx: CanvasRenderingContext2D,\n  radius: number,\n  x: number,\n  y: number,\n) => {\n  ctx.beginPath();\n  const safeRadius = Math.max(radius, 0);\n  ctx.arc(x, y, safeRadius, 0, 2 * Math.PI);\n  ctx.closePath();\n};\n\nconst getCircleTextArea = (x: number, y: number, squareSideSize: number) => ({\n  x,\n  y,\n  width: squareSideSize,\n  height: squareSideSize - 8,\n  leftBoundary: x - squareSideSize / 2,\n  rightBoundary: x + squareSideSize / 2,\n});\n\nconst getCircumscribedSquare = (radius: number) => radius * Math.sqrt(2);\n\nexport const CanvasCircleRenderer = (props: CanvasCircleRendererProps) => {\n  const {\n    x,\n    y,\n    radius,\n    fillColor,\n    strokeColor = fillColor,\n    value,\n    name = '',\n    labelsDisplay,\n    truncationMode,\n  } = props;\n  const squareSideSize = getCircumscribedSquare(radius);\n  const textArea: CanvasTextAreaProps = getCircleTextArea(x, y, squareSideSize);\n\n  const draw = useCallback(\n    (ctx: CanvasRenderingContext2D) => {\n      createCirclePath(ctx, radius, x, y);\n      removeTransparentBorder(ctx, strokeColor);\n      fillShape(ctx, fillColor);\n      if (shouldRenderLabels(labelsDisplay)) {\n        drawLabelAndValue(\n          ctx,\n          value,\n          textArea,\n          fillColor,\n          name,\n          truncationMode,\n          labelsDisplay,\n        );\n      }\n\n      return false;\n    },\n    [\n      x,\n      y,\n      radius,\n      fillColor,\n      strokeColor,\n      labelsDisplay,\n      truncationMode,\n      name,\n      value,\n    ],\n  );\n\n  useCanvas('honeycomb-circle', draw);\n\n  return null;\n};\n\nCanvasCircleRenderer['displayName'] = 'CanvasCircleRenderer';\n"],
-  "mappings": "AAAA,SAAS,mBAAmB;AAG5B,SAAS,iBAAiB;AAG1B,SAAS,yBAAyB;AAClC,SAAS,iBAAiB;AAC1B,SAAS,+BAA+B;AACxC,SAAS,0BAA0B;AAcnC,MAAM,mBAAmB,CACvB,KACA,QACA,GACA,MACG;AACH,MAAI,UAAU;AACd,QAAM,aAAa,KAAK,IAAI,QAAQ,CAAC;AACrC,MAAI,IAAI,GAAG,GAAG,YAAY,GAAG,IAAI,KAAK,EAAE;AACxC,MAAI,UAAU;AAChB;AAEA,MAAM,oBAAoB,CAAC,GAAW,GAAW,oBAA4B;AAAA,EAC3E;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,QAAQ,iBAAiB;AAAA,EACzB,cAAc,IAAI,iBAAiB;AAAA,EACnC,eAAe,IAAI,iBAAiB;AACtC;AAEA,MAAM,yBAAyB,CAAC,WAAmB,SAAS,KAAK,KAAK,CAAC;AAEhE,MAAM,uBAAuB,CAAC,UAAqC;AACxE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,iBAAiB,uBAAuB,MAAM;AACpD,QAAM,WAAgC,kBAAkB,GAAG,GAAG,cAAc;AAE5E,QAAM,OAAO;AAAA,IACX,CAAC,QAAkC;AACjC,uBAAiB,KAAK,QAAQ,GAAG,CAAC;AAClC,8BAAwB,KAAK,WAAW;AACxC,gBAAU,KAAK,SAAS;AACxB,UAAI,mBAAmB,aAAa,GAAG;AACrC;AAAA,UACE;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAEA,aAAO;AAAA,IACT;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,YAAU,oBAAoB,IAAI;AAElC,SAAO;AACT;AAEA,qBAAqB,aAAa,IAAI;",
+  "sourcesContent": ["import { useCallback } from 'react';\n\nimport type { TruncationMode } from '../../../../../typography/text-ellipsis/TextEllipsis.js';\nimport { useCanvas } from '../../../../core/components/canvas/hooks/useCanvas.js';\nimport { useHoneycombTextSize } from '../../../hooks/use-honeycomb-text-size.js';\nimport { CanvasTextAreaProps } from '../../../types/canvas-text-area.js';\nimport type { HoneycombLabelsDisplay } from '../../../types/honeycomb.js';\nimport { drawLabelAndValue } from '../utils/draw-label-and-value.js';\nimport { fillShape } from '../utils/fill-shape.js';\nimport { removeTransparentBorder } from '../utils/remove-transparent-border.js';\nimport { shouldRenderLabels } from '../utils/should-render-labels.js';\n\ninterface CanvasCircleRendererProps {\n  x: number;\n  y: number;\n  radius: number;\n  fillColor: string;\n  value: string | number;\n  name?: string;\n  strokeColor?: 'transparent' | string;\n  labelsDisplay?: HoneycombLabelsDisplay;\n  truncationMode?: TruncationMode;\n}\n\nconst createCirclePath = (\n  ctx: CanvasRenderingContext2D,\n  radius: number,\n  x: number,\n  y: number,\n) => {\n  ctx.beginPath();\n  const safeRadius = Math.max(radius, 0);\n  ctx.arc(x, y, safeRadius, 0, 2 * Math.PI);\n  ctx.closePath();\n};\n\nconst getCircleTextArea = (x: number, y: number, squareSideSize: number) => ({\n  x,\n  y,\n  width: squareSideSize,\n  height: squareSideSize - 8,\n  leftBoundary: x - squareSideSize / 2,\n  rightBoundary: x + squareSideSize / 2,\n});\n\nconst getCircumscribedSquare = (radius: number) => radius * Math.sqrt(2);\n\nexport const CanvasCircleRenderer = (props: CanvasCircleRendererProps) => {\n  const {\n    x,\n    y,\n    radius,\n    fillColor,\n    strokeColor = fillColor,\n    value,\n    name = '',\n    labelsDisplay,\n    truncationMode,\n  } = props;\n  const textSize = useHoneycombTextSize();\n  const squareSideSize = getCircumscribedSquare(radius);\n  const textArea: CanvasTextAreaProps = getCircleTextArea(x, y, squareSideSize);\n\n  const draw = useCallback(\n    (ctx: CanvasRenderingContext2D) => {\n      createCirclePath(ctx, radius, x, y);\n      removeTransparentBorder(ctx, strokeColor);\n      fillShape(ctx, fillColor);\n      if (shouldRenderLabels(labelsDisplay)) {\n        drawLabelAndValue(\n          ctx,\n          value,\n          textArea,\n          fillColor,\n          name,\n          truncationMode,\n          labelsDisplay,\n          textSize,\n        );\n      }\n\n      return false;\n    },\n    [\n      x,\n      y,\n      radius,\n      fillColor,\n      strokeColor,\n      labelsDisplay,\n      truncationMode,\n      name,\n      value,\n      textArea,\n      textSize,\n    ],\n  );\n\n  useCanvas('honeycomb-circle', draw);\n\n  return null;\n};\n\nCanvasCircleRenderer['displayName'] = 'CanvasCircleRenderer';\n"],
+  "mappings": "AAAA,SAAS,mBAAmB;AAG5B,SAAS,iBAAiB;AAC1B,SAAS,4BAA4B;AAGrC,SAAS,yBAAyB;AAClC,SAAS,iBAAiB;AAC1B,SAAS,+BAA+B;AACxC,SAAS,0BAA0B;AAcnC,MAAM,mBAAmB,CACvB,KACA,QACA,GACA,MACG;AACH,MAAI,UAAU;AACd,QAAM,aAAa,KAAK,IAAI,QAAQ,CAAC;AACrC,MAAI,IAAI,GAAG,GAAG,YAAY,GAAG,IAAI,KAAK,EAAE;AACxC,MAAI,UAAU;AAChB;AAEA,MAAM,oBAAoB,CAAC,GAAW,GAAW,oBAA4B;AAAA,EAC3E;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,QAAQ,iBAAiB;AAAA,EACzB,cAAc,IAAI,iBAAiB;AAAA,EACnC,eAAe,IAAI,iBAAiB;AACtC;AAEA,MAAM,yBAAyB,CAAC,WAAmB,SAAS,KAAK,KAAK,CAAC;AAEhE,MAAM,uBAAuB,CAAC,UAAqC;AACxE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,WAAW,qBAAqB;AACtC,QAAM,iBAAiB,uBAAuB,MAAM;AACpD,QAAM,WAAgC,kBAAkB,GAAG,GAAG,cAAc;AAE5E,QAAM,OAAO;AAAA,IACX,CAAC,QAAkC;AACjC,uBAAiB,KAAK,QAAQ,GAAG,CAAC;AAClC,8BAAwB,KAAK,WAAW;AACxC,gBAAU,KAAK,SAAS;AACxB,UAAI,mBAAmB,aAAa,GAAG;AACrC;AAAA,UACE;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,MACF;AAEA,aAAO;AAAA,IACT;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,YAAU,oBAAoB,IAAI;AAElC,SAAO;AACT;AAEA,qBAAqB,aAAa,IAAI;",
   "names": []
 }

package/esm/charts/honeycomb/components/canvas/renderers/CanvasHexagonRenderer.js

@@ -1,5 +1,6 @@
 import { useCallback } from "react";
 import { useCanvas } from "../../../../core/components/canvas/hooks/useCanvas.js";
+import { useHoneycombTextSize } from "../../../hooks/use-honeycomb-text-size.js";
 import { getHexagonGeometry } from "../../../utils/get-hexagon-geometry.js";
 import { drawLabelAndValue } from "../utils/draw-label-and-value.js";
 import { fillShape } from "../utils/fill-shape.js";
@@ -28,6 +29,7 @@ const CanvasHexagonRenderer = (props) => {
     labelsDisplay,
     truncationMode
   } = props;
+  const textSize = useHoneycombTextSize();
   const { hexagonGeometry, textArea } = getHexagonGeometry(x, y, width);
   const draw = useCallback(
     (ctx) => {
@@ -42,21 +44,23 @@ const CanvasHexagonRenderer = (props) => {
           fillColor,
           name,
           truncationMode,
-          labelsDisplay
+          labelsDisplay,
+          textSize
         );
       }
       return false;
     },
     [
-      x,
-      y,
-      width,
       fillColor,
       strokeColor,
       labelsDisplay,
       truncationMode,
       name,
-      value
+      value,
+      hexagonGeometry,
+      radius,
+      textArea,
+      textSize
     ]
   );
   useCanvas("honeycomb-hexagon", draw);