@dynatrace/strato-components 3.6.0 → 3.7.1

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

@@ -3,6 +3,7 @@ import { useCanvas } from "../../../../core/components/canvas/hooks/useCanvas.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";
+import { shouldRenderLabels } from "../utils/should-render-labels.js";
 const createRoundedSquarePath = (ctx, x, y, width, radius) => {
   ctx.moveTo(x, y);
   ctx.beginPath();
@@ -26,7 +27,7 @@ const CanvasSquareRenderer = (props) => {
     value,
     name = "",
     radius = 0,
-    showLabels,
+    labelsDisplay,
     truncationMode
   } = props;
   const textArea = getSquareTextArea(x, y, width);
@@ -35,14 +36,15 @@ const CanvasSquareRenderer = (props) => {
       createRoundedSquarePath(ctx, x, y, width, radius);
       removeTransparentBorder(ctx, strokeColor);
       fillShape(ctx, fillColor);
-      if (showLabels) {
+      if (shouldRenderLabels(labelsDisplay)) {
         drawLabelAndValue(
           ctx,
           value,
           textArea,
           fillColor,
           name,
-          truncationMode
+          truncationMode,
+          labelsDisplay
         );
       }
       return false;
@@ -53,7 +55,7 @@ const CanvasSquareRenderer = (props) => {
       width,
       fillColor,
       strokeColor,
-      showLabels,
+      labelsDisplay,
       truncationMode,
       name,
       value,

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/honeycomb/components/canvas/renderers/CanvasSquareRenderer.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 { drawLabelAndValue } from '../utils/draw-label-and-value.js';\nimport { fillShape } from '../utils/fill-shape.js';\nimport { removeTransparentBorder } from '../utils/remove-transparent-border.js';\n\ninterface CanvasSquareRendererProps {\n  x: number;\n  y: number;\n  width: number;\n  fillColor: string;\n  value: string | number;\n  name?: string;\n  strokeColor?: 'transparent' | string;\n  radius?: number;\n  showLabels?: boolean;\n  truncationMode?: TruncationMode;\n}\n\nconst createRoundedSquarePath = (\n  ctx: CanvasRenderingContext2D,\n  x: number,\n  y: number,\n  width: number,\n  radius: number,\n) => {\n  ctx.moveTo(x, y);\n  ctx.beginPath();\n  ctx.roundRect(x, y, width, width, radius);\n};\n\nconst getSquareTextArea = (x: number, y: number, width: number) => ({\n  x: x + width / 2,\n  y: y + width / 2,\n  width,\n  height: width,\n  leftBoundary: x,\n  rightBoundary: x + width,\n});\n\nexport const CanvasSquareRenderer = (props: CanvasSquareRendererProps) => {\n  const {\n    x,\n    y,\n    width,\n    fillColor,\n    strokeColor = fillColor,\n    value,\n    name = '',\n    radius = 0,\n    showLabels,\n    truncationMode,\n  } = props;\n\n  const textArea: CanvasTextAreaProps = getSquareTextArea(x, y, width);\n\n  const draw = useCallback(\n    (ctx: CanvasRenderingContext2D) => {\n      createRoundedSquarePath(ctx, x, y, width, radius);\n      removeTransparentBorder(ctx, strokeColor);\n      fillShape(ctx, fillColor);\n      if (showLabels) {\n        drawLabelAndValue(\n          ctx,\n          value,\n          textArea,\n          fillColor,\n          name,\n          truncationMode,\n        );\n      }\n\n      return false;\n    },\n    [\n      x,\n      y,\n      width,\n      fillColor,\n      strokeColor,\n      showLabels,\n      truncationMode,\n      name,\n      value,\n      radius,\n    ],\n  );\n\n  useCanvas('honeycomb-square', draw);\n\n  return null;\n};\n\nCanvasSquareRenderer['displayName'] = 'CanvasSquareRenderer';\n"],
-  "mappings": "AAAA,SAAS,mBAAmB;AAG5B,SAAS,iBAAiB;AAE1B,SAAS,yBAAyB;AAClC,SAAS,iBAAiB;AAC1B,SAAS,+BAA+B;AAexC,MAAM,0BAA0B,CAC9B,KACA,GACA,GACA,OACA,WACG;AACH,MAAI,OAAO,GAAG,CAAC;AACf,MAAI,UAAU;AACd,MAAI,UAAU,GAAG,GAAG,OAAO,OAAO,MAAM;AAC1C;AAEA,MAAM,oBAAoB,CAAC,GAAW,GAAW,WAAmB;AAAA,EAClE,GAAG,IAAI,QAAQ;AAAA,EACf,GAAG,IAAI,QAAQ;AAAA,EACf;AAAA,EACA,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,eAAe,IAAI;AACrB;AAEO,MAAM,uBAAuB,CAAC,UAAqC;AACxE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA,OAAO;AAAA,IACP,SAAS;AAAA,IACT;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,WAAgC,kBAAkB,GAAG,GAAG,KAAK;AAEnE,QAAM,OAAO;AAAA,IACX,CAAC,QAAkC;AACjC,8BAAwB,KAAK,GAAG,GAAG,OAAO,MAAM;AAChD,8BAAwB,KAAK,WAAW;AACxC,gBAAU,KAAK,SAAS;AACxB,UAAI,YAAY;AACd;AAAA,UACE;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,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 { 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 CanvasSquareRendererProps {\n  x: number;\n  y: number;\n  width: number;\n  fillColor: string;\n  value: string | number;\n  name?: string;\n  strokeColor?: 'transparent' | string;\n  radius?: number;\n  labelsDisplay?: HoneycombLabelsDisplay;\n  truncationMode?: TruncationMode;\n}\n\nconst createRoundedSquarePath = (\n  ctx: CanvasRenderingContext2D,\n  x: number,\n  y: number,\n  width: number,\n  radius: number,\n) => {\n  ctx.moveTo(x, y);\n  ctx.beginPath();\n  ctx.roundRect(x, y, width, width, radius);\n};\n\nconst getSquareTextArea = (x: number, y: number, width: number) => ({\n  x: x + width / 2,\n  y: y + width / 2,\n  width,\n  height: width,\n  leftBoundary: x,\n  rightBoundary: x + width,\n});\n\nexport const CanvasSquareRenderer = (props: CanvasSquareRendererProps) => {\n  const {\n    x,\n    y,\n    width,\n    fillColor,\n    strokeColor = fillColor,\n    value,\n    name = '',\n    radius = 0,\n    labelsDisplay,\n    truncationMode,\n  } = props;\n\n  const textArea: CanvasTextAreaProps = getSquareTextArea(x, y, width);\n\n  const draw = useCallback(\n    (ctx: CanvasRenderingContext2D) => {\n      createRoundedSquarePath(ctx, x, y, width, radius);\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      width,\n      fillColor,\n      strokeColor,\n      labelsDisplay,\n      truncationMode,\n      name,\n      value,\n      radius,\n    ],\n  );\n\n  useCanvas('honeycomb-square', draw);\n\n  return null;\n};\n\nCanvasSquareRenderer['displayName'] = 'CanvasSquareRenderer';\n"],
+  "mappings": "AAAA,SAAS,mBAAmB;AAG5B,SAAS,iBAAiB;AAG1B,SAAS,yBAAyB;AAClC,SAAS,iBAAiB;AAC1B,SAAS,+BAA+B;AACxC,SAAS,0BAA0B;AAenC,MAAM,0BAA0B,CAC9B,KACA,GACA,GACA,OACA,WACG;AACH,MAAI,OAAO,GAAG,CAAC;AACf,MAAI,UAAU;AACd,MAAI,UAAU,GAAG,GAAG,OAAO,OAAO,MAAM;AAC1C;AAEA,MAAM,oBAAoB,CAAC,GAAW,GAAW,WAAmB;AAAA,EAClE,GAAG,IAAI,QAAQ;AAAA,EACf,GAAG,IAAI,QAAQ;AAAA,EACf;AAAA,EACA,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,eAAe,IAAI;AACrB;AAEO,MAAM,uBAAuB,CAAC,UAAqC;AACxE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA,OAAO;AAAA,IACP,SAAS;AAAA,IACT;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,WAAgC,kBAAkB,GAAG,GAAG,KAAK;AAEnE,QAAM,OAAO;AAAA,IACX,CAAC,QAAkC;AACjC,8BAAwB,KAAK,GAAG,GAAG,OAAO,MAAM;AAChD,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,MACA;AAAA,IACF;AAAA,EACF;AAEA,YAAU,oBAAoB,IAAI;AAElC,SAAO;AACT;AAEA,qBAAqB,aAAa,IAAI;",
   "names": []
 }

package/esm/charts/honeycomb/components/canvas/utils/draw-label-and-value.js

@@ -4,7 +4,73 @@ import { renderTextToCanvas } from "./render-text-to-canvas.js";
 import { getColorByContrast } from "../../../../core/utils/color-contrast.js";
 import { HONEYCOMB_DEFAULT_TEXT_ALIGNMENT } from "../../../constants.js";
 const topAndBottomPadding = 2;
-const drawLabelAndValue = (ctx, value, textArea, backgroundColor, name = "", truncationMode = "middle") => {
+const renderNameMode = ({
+  ctx,
+  x,
+  y,
+  renderedName,
+  nameHeight,
+  ableToRenderName
+}) => {
+  if (ableToRenderName) {
+    renderTextToCanvas(ctx, renderedName, "label", x, y + nameHeight / 2);
+  }
+};
+const renderValueMode = (params) => {
+  const {
+    ctx,
+    x,
+    y,
+    renderedValue,
+    valueHeight,
+    nameHeight,
+    ableToRenderValue,
+    ableToRenderName,
+    textArea,
+    value,
+    truncationMode
+  } = params;
+  if (ableToRenderValue) {
+    renderTextToCanvas(ctx, renderedValue, "value", x, y + valueHeight / 2);
+  } else if (ableToRenderName) {
+    const cropValueAsLabel = getTruncationMethod(
+      ctx,
+      textArea,
+      value.toString(),
+      truncationMode,
+      "label"
+    );
+    renderTextToCanvas(ctx, cropValueAsLabel(), "label", x, y + nameHeight / 2);
+  }
+};
+const renderAllMode = ({
+  ctx,
+  x,
+  y,
+  renderedName,
+  renderedValue,
+  nameHeight,
+  valueHeight,
+  ableToRenderBoth,
+  ableToRenderName,
+  ableToRenderValue
+}) => {
+  if (ableToRenderBoth) {
+    renderTextToCanvas(ctx, renderedName, "label", x, y - 2);
+    renderTextToCanvas(
+      ctx,
+      renderedValue,
+      "value",
+      x,
+      y + nameHeight + nameHeight * 0.5
+    );
+  } else if (ableToRenderName) {
+    renderTextToCanvas(ctx, renderedName, "label", x, y + nameHeight / 2);
+  } else if (ableToRenderValue) {
+    renderTextToCanvas(ctx, renderedValue, "value", x, y + valueHeight / 2);
+  }
+};
+const drawLabelAndValue = (ctx, value, textArea, backgroundColor, name = "", truncationMode = "middle", labelsDisplay) => {
   const { x, y } = textArea;
   const cropNameToFit = getTruncationMethod(
     ctx,
@@ -25,24 +91,31 @@ const drawLabelAndValue = (ctx, value, textArea, backgroundColor, name = "", tru
   } = measureNodeTextContent(ctx, value, name, textArea);
   if (ableToRenderNothing) {
     return;
-  } else {
-    const textColor = getColorByContrast(backgroundColor);
-    ctx.textAlign = HONEYCOMB_DEFAULT_TEXT_ALIGNMENT;
-    ctx.fillStyle = textColor;
-    const availableWidth = textArea.width - topAndBottomPadding * 2;
-    const renderedName = availableWidth > nameWidth ? name : cropNameToFit();
-    const renderedValue = availableWidth >= valueWidth ? value.toString() : cropValueToFit();
-    if (ableToRenderBoth) {
-      renderTextToCanvas(ctx, renderedName, "label", x, y - 2);
-      const valueY = y + nameHeight + nameHeight * 0.5;
-      renderTextToCanvas(ctx, renderedValue, "value", x, valueY);
-    } else if (ableToRenderName) {
-      const nameCenteredY = y + nameHeight / 2;
-      renderTextToCanvas(ctx, renderedName, "label", x, nameCenteredY);
-    } else if (ableToRenderValue) {
-      const valueCenteredY = y + valueHeight / 2;
-      availableWidth > valueWidth && renderTextToCanvas(ctx, renderedValue, "value", x, valueCenteredY);
-    }
+  }
+  ctx.textAlign = HONEYCOMB_DEFAULT_TEXT_ALIGNMENT;
+  ctx.fillStyle = getColorByContrast(backgroundColor);
+  const availableWidth = textArea.width - topAndBottomPadding * 2;
+  const renderParams = {
+    ctx,
+    x,
+    y,
+    renderedName: availableWidth > nameWidth ? name : cropNameToFit(),
+    renderedValue: availableWidth >= valueWidth ? value.toString() : cropValueToFit(),
+    nameHeight,
+    valueHeight,
+    ableToRenderName,
+    ableToRenderValue,
+    ableToRenderBoth,
+    textArea,
+    value,
+    truncationMode
+  };
+  if (labelsDisplay === "name") {
+    renderNameMode(renderParams);
+  } else if (labelsDisplay === "value") {
+    renderValueMode(renderParams);
+  } else if (labelsDisplay === "all") {
+    renderAllMode(renderParams);
   }
 };
 export {

package/esm/charts/honeycomb/components/canvas/utils/draw-label-and-value.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/honeycomb/components/canvas/utils/draw-label-and-value.ts"],
-  "sourcesContent": ["\nimport { getTruncationMethod } from './get-truncation-method.js';\nimport { measureNodeTextContent } from './measure-node-text-content.js';\nimport { renderTextToCanvas } from './render-text-to-canvas.js';\nimport type { TruncationMode } from '../../../../../typography/text-ellipsis/TextEllipsis.js';\nimport { getColorByContrast } from '../../../../core/utils/color-contrast.js';\nimport { HONEYCOMB_DEFAULT_TEXT_ALIGNMENT } from '../../../constants.js';\nimport { CanvasTextAreaProps } from '../../../types/canvas-text-area.js';\n\nconst topAndBottomPadding = 2;\n\nexport const drawLabelAndValue = (\n  ctx: CanvasRenderingContext2D,\n  value: string | number,\n  textArea: CanvasTextAreaProps,\n  backgroundColor: string,\n  name: string = '',\n  truncationMode: TruncationMode = 'middle',\n) => {\n  const { x, y } = textArea;\n  const cropNameToFit = getTruncationMethod(\n    ctx,\n    textArea,\n    name,\n    truncationMode,\n  );\n  const cropValueToFit =\n    typeof value === 'string'\n      ? getTruncationMethod(ctx, textArea, value, truncationMode, 'value')\n      : () => value.toString();\n\n  const {\n    valueHeight,\n    nameHeight,\n    ableToRenderNothing,\n    ableToRenderBoth,\n    valueWidth,\n    nameWidth,\n    ableToRenderName,\n    ableToRenderValue,\n  } = measureNodeTextContent(ctx, value, name, textArea);\n\n  if (ableToRenderNothing) {\n    return;\n  } else {\n    const textColor = getColorByContrast(backgroundColor);\n    ctx.textAlign = HONEYCOMB_DEFAULT_TEXT_ALIGNMENT;\n    ctx.fillStyle = textColor;\n\n    const availableWidth = textArea.width - topAndBottomPadding * 2;\n    const renderedName = availableWidth > nameWidth ? name : cropNameToFit();\n    const renderedValue =\n      availableWidth >= valueWidth ? value.toString() : cropValueToFit();\n    if (ableToRenderBoth) {\n      renderTextToCanvas(ctx, renderedName, 'label', x, y - 2);\n      const valueY = y + nameHeight + nameHeight * 0.5;\n      renderTextToCanvas(ctx, renderedValue, 'value', x, valueY);\n    } else if (ableToRenderName) {\n      const nameCenteredY = y + nameHeight / 2;\n      renderTextToCanvas(ctx, renderedName, 'label', x, nameCenteredY);\n    } else if (ableToRenderValue) {\n      const valueCenteredY = y + valueHeight / 2;\n      availableWidth > valueWidth &&\n        renderTextToCanvas(ctx, renderedValue, 'value', x, valueCenteredY);\n    }\n  }\n};\n"],
-  "mappings": "AACA,SAAS,2BAA2B;AACpC,SAAS,8BAA8B;AACvC,SAAS,0BAA0B;AAEnC,SAAS,0BAA0B;AACnC,SAAS,wCAAwC;AAGjD,MAAM,sBAAsB;AAErB,MAAM,oBAAoB,CAC/B,KACA,OACA,UACA,iBACA,OAAe,IACf,iBAAiC,aAC9B;AACH,QAAM,EAAE,GAAG,EAAE,IAAI;AACjB,QAAM,gBAAgB;AAAA,IACpB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACA,QAAM,iBACJ,OAAO,UAAU,WACb,oBAAoB,KAAK,UAAU,OAAO,gBAAgB,OAAO,IACjE,MAAM,MAAM,SAAS;AAE3B,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,uBAAuB,KAAK,OAAO,MAAM,QAAQ;AAErD,MAAI,qBAAqB;AACvB;AAAA,EACF,OAAO;AACL,UAAM,YAAY,mBAAmB,eAAe;AACpD,QAAI,YAAY;AAChB,QAAI,YAAY;AAEhB,UAAM,iBAAiB,SAAS,QAAQ,sBAAsB;AAC9D,UAAM,eAAe,iBAAiB,YAAY,OAAO,cAAc;AACvE,UAAM,gBACJ,kBAAkB,aAAa,MAAM,SAAS,IAAI,eAAe;AACnE,QAAI,kBAAkB;AACpB,yBAAmB,KAAK,cAAc,SAAS,GAAG,IAAI,CAAC;AACvD,YAAM,SAAS,IAAI,aAAa,aAAa;AAC7C,yBAAmB,KAAK,eAAe,SAAS,GAAG,MAAM;AAAA,IAC3D,WAAW,kBAAkB;AAC3B,YAAM,gBAAgB,IAAI,aAAa;AACvC,yBAAmB,KAAK,cAAc,SAAS,GAAG,aAAa;AAAA,IACjE,WAAW,mBAAmB;AAC5B,YAAM,iBAAiB,IAAI,cAAc;AACzC,uBAAiB,cACf,mBAAmB,KAAK,eAAe,SAAS,GAAG,cAAc;AAAA,IACrE;AAAA,EACF;AACF;",
+  "sourcesContent": ["import { getTruncationMethod } from './get-truncation-method.js';\nimport { measureNodeTextContent } from './measure-node-text-content.js';\nimport { renderTextToCanvas } from './render-text-to-canvas.js';\nimport type { TruncationMode } from '../../../../../typography/text-ellipsis/TextEllipsis.js';\nimport { getColorByContrast } from '../../../../core/utils/color-contrast.js';\nimport { HONEYCOMB_DEFAULT_TEXT_ALIGNMENT } from '../../../constants.js';\nimport { CanvasTextAreaProps } from '../../../types/canvas-text-area.js';\nimport type { HoneycombLabelsDisplay } from '../../../types/honeycomb.js';\n\nconst topAndBottomPadding = 2;\n\ntype RenderParams = {\n  ctx: CanvasRenderingContext2D;\n  x: number;\n  y: number;\n  renderedName: string;\n  renderedValue: string;\n  nameHeight: number;\n  valueHeight: number;\n  ableToRenderName: boolean;\n  ableToRenderValue: boolean;\n  ableToRenderBoth: boolean;\n  textArea: CanvasTextAreaProps;\n  value: string | number;\n  truncationMode: TruncationMode;\n};\n\nconst renderNameMode = ({\n  ctx,\n  x,\n  y,\n  renderedName,\n  nameHeight,\n  ableToRenderName,\n}: RenderParams) => {\n  if (ableToRenderName) {\n    renderTextToCanvas(ctx, renderedName, 'label', x, y + nameHeight / 2);\n  }\n};\n\nconst renderValueMode = (params: RenderParams) => {\n  const {\n    ctx,\n    x,\n    y,\n    renderedValue,\n    valueHeight,\n    nameHeight,\n    ableToRenderValue,\n    ableToRenderName,\n    textArea,\n    value,\n    truncationMode,\n  } = params;\n  if (ableToRenderValue) {\n    renderTextToCanvas(ctx, renderedValue, 'value', x, y + valueHeight / 2);\n  } else if (ableToRenderName) {\n    // Value font (16px) doesn't fit but label font (12px) does \u2014 render value at smaller size.\n    const cropValueAsLabel = getTruncationMethod(\n      ctx,\n      textArea,\n      value.toString(),\n      truncationMode,\n      'label',\n    );\n    renderTextToCanvas(ctx, cropValueAsLabel(), 'label', x, y + nameHeight / 2);\n  }\n};\n\nconst renderAllMode = ({\n  ctx,\n  x,\n  y,\n  renderedName,\n  renderedValue,\n  nameHeight,\n  valueHeight,\n  ableToRenderBoth,\n  ableToRenderName,\n  ableToRenderValue,\n}: RenderParams) => {\n  if (ableToRenderBoth) {\n    renderTextToCanvas(ctx, renderedName, 'label', x, y - 2);\n    renderTextToCanvas(\n      ctx,\n      renderedValue,\n      'value',\n      x,\n      y + nameHeight + nameHeight * 0.5,\n    );\n  } else if (ableToRenderName) {\n    renderTextToCanvas(ctx, renderedName, 'label', x, y + nameHeight / 2);\n  } else if (ableToRenderValue) {\n    renderTextToCanvas(ctx, renderedValue, 'value', x, y + valueHeight / 2);\n  }\n};\n\nexport const drawLabelAndValue = (\n  ctx: CanvasRenderingContext2D,\n  value: string | number,\n  textArea: CanvasTextAreaProps,\n  backgroundColor: string,\n  name: string = '',\n  truncationMode: TruncationMode = 'middle',\n  labelsDisplay: HoneycombLabelsDisplay,\n) => {\n  const { x, y } = textArea;\n  const cropNameToFit = getTruncationMethod(\n    ctx,\n    textArea,\n    name,\n    truncationMode,\n  );\n  const cropValueToFit =\n    typeof value === 'string'\n      ? getTruncationMethod(ctx, textArea, value, truncationMode, 'value')\n      : () => value.toString();\n\n  const {\n    valueHeight,\n    nameHeight,\n    ableToRenderNothing,\n    ableToRenderBoth,\n    valueWidth,\n    nameWidth,\n    ableToRenderName,\n    ableToRenderValue,\n  } = measureNodeTextContent(ctx, value, name, textArea);\n\n  if (ableToRenderNothing) {\n    return;\n  }\n\n  ctx.textAlign = HONEYCOMB_DEFAULT_TEXT_ALIGNMENT;\n  ctx.fillStyle = getColorByContrast(backgroundColor);\n\n  const availableWidth = textArea.width - topAndBottomPadding * 2;\n  const renderParams: RenderParams = {\n    ctx,\n    x,\n    y,\n    renderedName: availableWidth > nameWidth ? name : cropNameToFit(),\n    renderedValue:\n      availableWidth >= valueWidth ? value.toString() : cropValueToFit(),\n    nameHeight,\n    valueHeight,\n    ableToRenderName,\n    ableToRenderValue,\n    ableToRenderBoth,\n    textArea,\n    value,\n    truncationMode,\n  };\n\n  if (labelsDisplay === 'name') {\n    renderNameMode(renderParams);\n  } else if (labelsDisplay === 'value') {\n    renderValueMode(renderParams);\n  } else if (labelsDisplay === 'all') {\n    renderAllMode(renderParams);\n  }\n};\n"],
+  "mappings": "AAAA,SAAS,2BAA2B;AACpC,SAAS,8BAA8B;AACvC,SAAS,0BAA0B;AAEnC,SAAS,0BAA0B;AACnC,SAAS,wCAAwC;AAIjD,MAAM,sBAAsB;AAkB5B,MAAM,iBAAiB,CAAC;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAoB;AAClB,MAAI,kBAAkB;AACpB,uBAAmB,KAAK,cAAc,SAAS,GAAG,IAAI,aAAa,CAAC;AAAA,EACtE;AACF;AAEA,MAAM,kBAAkB,CAAC,WAAyB;AAChD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,MAAI,mBAAmB;AACrB,uBAAmB,KAAK,eAAe,SAAS,GAAG,IAAI,cAAc,CAAC;AAAA,EACxE,WAAW,kBAAkB;AAE3B,UAAM,mBAAmB;AAAA,MACvB;AAAA,MACA;AAAA,MACA,MAAM,SAAS;AAAA,MACf;AAAA,MACA;AAAA,IACF;AACA,uBAAmB,KAAK,iBAAiB,GAAG,SAAS,GAAG,IAAI,aAAa,CAAC;AAAA,EAC5E;AACF;AAEA,MAAM,gBAAgB,CAAC;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAoB;AAClB,MAAI,kBAAkB;AACpB,uBAAmB,KAAK,cAAc,SAAS,GAAG,IAAI,CAAC;AACvD;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,IAAI,aAAa,aAAa;AAAA,IAChC;AAAA,EACF,WAAW,kBAAkB;AAC3B,uBAAmB,KAAK,cAAc,SAAS,GAAG,IAAI,aAAa,CAAC;AAAA,EACtE,WAAW,mBAAmB;AAC5B,uBAAmB,KAAK,eAAe,SAAS,GAAG,IAAI,cAAc,CAAC;AAAA,EACxE;AACF;AAEO,MAAM,oBAAoB,CAC/B,KACA,OACA,UACA,iBACA,OAAe,IACf,iBAAiC,UACjC,kBACG;AACH,QAAM,EAAE,GAAG,EAAE,IAAI;AACjB,QAAM,gBAAgB;AAAA,IACpB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACA,QAAM,iBACJ,OAAO,UAAU,WACb,oBAAoB,KAAK,UAAU,OAAO,gBAAgB,OAAO,IACjE,MAAM,MAAM,SAAS;AAE3B,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,uBAAuB,KAAK,OAAO,MAAM,QAAQ;AAErD,MAAI,qBAAqB;AACvB;AAAA,EACF;AAEA,MAAI,YAAY;AAChB,MAAI,YAAY,mBAAmB,eAAe;AAElD,QAAM,iBAAiB,SAAS,QAAQ,sBAAsB;AAC9D,QAAM,eAA6B;AAAA,IACjC;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc,iBAAiB,YAAY,OAAO,cAAc;AAAA,IAChE,eACE,kBAAkB,aAAa,MAAM,SAAS,IAAI,eAAe;AAAA,IACnE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,MAAI,kBAAkB,QAAQ;AAC5B,mBAAe,YAAY;AAAA,EAC7B,WAAW,kBAAkB,SAAS;AACpC,oBAAgB,YAAY;AAAA,EAC9B,WAAW,kBAAkB,OAAO;AAClC,kBAAc,YAAY;AAAA,EAC5B;AACF;",
   "names": []
 }

package/esm/charts/honeycomb/components/canvas/utils/should-render-labels.js

@@ -0,0 +1,5 @@
+const shouldRenderLabels = (labelsDisplay) => labelsDisplay !== void 0 && labelsDisplay !== "none";
+export {
+  shouldRenderLabels
+};
+//# sourceMappingURL=should-render-labels.js.map

package/esm/charts/honeycomb/components/canvas/utils/should-render-labels.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../src/charts/honeycomb/components/canvas/utils/should-render-labels.ts"],
+  "sourcesContent": ["import type { HoneycombLabelsDisplay } from '../../../types/honeycomb.js';\n\nexport const shouldRenderLabels = (\n  labelsDisplay: HoneycombLabelsDisplay | undefined,\n): labelsDisplay is Exclude<HoneycombLabelsDisplay, 'none'> =>\n  labelsDisplay !== undefined && labelsDisplay !== 'none';\n"],
+  "mappings": "AAEO,MAAM,qBAAqB,CAChC,kBAEA,kBAAkB,UAAa,kBAAkB;",
+  "names": []
+}

package/esm/charts/honeycomb/components/tooltip/HoneycombOverlayTooltip.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { useTooltipData } from "../../../core/components/overlay-tooltip/_to-be-removed/utils.js";
+import { useTooltipData } from "../../../core/components/overlay-tooltip/hooks/useTooltipData.js";
 import { OverlayTooltip } from "../../../core/components/overlay-tooltip/OverlayTooltip.js";
 import { isTooltipDataEmpty } from "../../../core/components/overlay-tooltip/utils.js";
 import { useHoneycombCustomTooltip } from "../../hooks/use-honeycomb-custom-tooltip.js";

package/esm/charts/honeycomb/components/tooltip/HoneycombOverlayTooltip.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/honeycomb/components/tooltip/HoneycombOverlayTooltip.tsx"],
-  "sourcesContent": ["import { useTooltipData } from '../../../core/components/overlay-tooltip/_to-be-removed/utils.js';\nimport { OverlayTooltip } from '../../../core/components/overlay-tooltip/OverlayTooltip.js';\nimport type { Data } from '../../../core/components/overlay-tooltip/types.js';\nimport { isTooltipDataEmpty } from '../../../core/components/overlay-tooltip/utils.js';\nimport type { SeriesActionsTemplate } from '../../../core/types/series-actions-template.js';\nimport { useHoneycombCustomTooltip } from '../../hooks/use-honeycomb-custom-tooltip.js';\nimport { useHoneycombTruncationMode } from '../../hooks/use-honeycomb-truncation-mode.js';\nimport type {\n  HoneycombTooltipMetadata,\n  HoneycombTooltipPayload,\n} from '../../types/honeycomb-internal.js';\nimport type { HoneycombTileData } from '../../types/honeycomb.js';\n\ntype SeriesData = Data['series'][number];\n\ninterface HoneycombOverlayTooltipProps {\n  actionsForItem?: (\n    item: SeriesData,\n  ) => (() => SeriesActionsTemplate) | undefined;\n}\n\nexport const HoneycombOverlayTooltip = (\n  props: HoneycombOverlayTooltipProps,\n) => {\n  const data = useTooltipData().data;\n  const truncationMode = useHoneycombTruncationMode();\n  const tooltip = useHoneycombCustomTooltip();\n\n  if (tooltip?.hidden || isTooltipDataEmpty(data)) {\n    return null;\n  }\n\n  const series = data.series[0];\n\n  if (typeof tooltip?.template === 'function') {\n    const metadata = data.metadata as\n      | {\n          id: string;\n          tileData: HoneycombTileData;\n          tooltipMetadata: HoneycombTooltipMetadata;\n        }\n      | undefined;\n\n    if (metadata) {\n      const payload: HoneycombTooltipPayload = {\n        name: metadata.tooltipMetadata.name,\n        value: metadata.tileData.value,\n        formattedValue: String(series.value),\n        color: metadata.tooltipMetadata.color.Default,\n        data: metadata.tileData,\n      };\n\n      return <OverlayTooltip legacyTemplate={tooltip.template(payload)} />;\n    }\n  }\n\n  return (\n    <OverlayTooltip truncation={truncationMode}>\n      <OverlayTooltip.SeriesItem\n        name={series.name}\n        value={series.value}\n        color={series.color}\n        actions={props.actionsForItem?.(series)}\n      />\n    </OverlayTooltip>\n  );\n};\n\nHoneycombOverlayTooltip['displayName'] = 'HoneycombOverlayTooltip';\n"],
+  "sourcesContent": ["import { useTooltipData } from '../../../core/components/overlay-tooltip/hooks/useTooltipData.js';\nimport { OverlayTooltip } from '../../../core/components/overlay-tooltip/OverlayTooltip.js';\nimport type { Data } from '../../../core/components/overlay-tooltip/types.js';\nimport { isTooltipDataEmpty } from '../../../core/components/overlay-tooltip/utils.js';\nimport type { SeriesActionsTemplate } from '../../../core/types/series-actions-template.js';\nimport { useHoneycombCustomTooltip } from '../../hooks/use-honeycomb-custom-tooltip.js';\nimport { useHoneycombTruncationMode } from '../../hooks/use-honeycomb-truncation-mode.js';\nimport type {\n  HoneycombTooltipMetadata,\n  HoneycombTooltipPayload,\n} from '../../types/honeycomb-internal.js';\nimport type { HoneycombTileData } from '../../types/honeycomb.js';\n\ntype SeriesData = Data['series'][number];\n\ninterface HoneycombOverlayTooltipProps {\n  actionsForItem?: (\n    item: SeriesData,\n  ) => (() => SeriesActionsTemplate) | undefined;\n}\n\nexport const HoneycombOverlayTooltip = (\n  props: HoneycombOverlayTooltipProps,\n) => {\n  const data = useTooltipData().data;\n  const truncationMode = useHoneycombTruncationMode();\n  const tooltip = useHoneycombCustomTooltip();\n\n  if (tooltip?.hidden || isTooltipDataEmpty(data)) {\n    return null;\n  }\n\n  const series = data.series[0];\n\n  if (typeof tooltip?.template === 'function') {\n    const metadata = data.metadata as\n      | {\n          id: string;\n          tileData: HoneycombTileData;\n          tooltipMetadata: HoneycombTooltipMetadata;\n        }\n      | undefined;\n\n    if (metadata) {\n      const payload: HoneycombTooltipPayload = {\n        name: metadata.tooltipMetadata.name,\n        value: metadata.tileData.value,\n        formattedValue: String(series.value),\n        color: metadata.tooltipMetadata.color.Default,\n        data: metadata.tileData,\n      };\n\n      return <OverlayTooltip legacyTemplate={tooltip.template(payload)} />;\n    }\n  }\n\n  return (\n    <OverlayTooltip truncation={truncationMode}>\n      <OverlayTooltip.SeriesItem\n        name={series.name}\n        value={series.value}\n        color={series.color}\n        actions={props.actionsForItem?.(series)}\n      />\n    </OverlayTooltip>\n  );\n};\n\nHoneycombOverlayTooltip['displayName'] = 'HoneycombOverlayTooltip';\n"],
   "mappings": "AAoDa;AApDb,SAAS,sBAAsB;AAC/B,SAAS,sBAAsB;AAE/B,SAAS,0BAA0B;AAEnC,SAAS,iCAAiC;AAC1C,SAAS,kCAAkC;AAepC,MAAM,0BAA0B,CACrC,UACG;AACH,QAAM,OAAO,eAAe,EAAE;AAC9B,QAAM,iBAAiB,2BAA2B;AAClD,QAAM,UAAU,0BAA0B;AAE1C,MAAI,SAAS,UAAU,mBAAmB,IAAI,GAAG;AAC/C,WAAO;AAAA,EACT;AAEA,QAAM,SAAS,KAAK,OAAO,CAAC;AAE5B,MAAI,OAAO,SAAS,aAAa,YAAY;AAC3C,UAAM,WAAW,KAAK;AAQtB,QAAI,UAAU;AACZ,YAAM,UAAmC;AAAA,QACvC,MAAM,SAAS,gBAAgB;AAAA,QAC/B,OAAO,SAAS,SAAS;AAAA,QACzB,gBAAgB,OAAO,OAAO,KAAK;AAAA,QACnC,OAAO,SAAS,gBAAgB,MAAM;AAAA,QACtC,MAAM,SAAS;AAAA,MACjB;AAEA,aAAO,oBAAC,kBAAe,gBAAgB,QAAQ,SAAS,OAAO,GAAG;AAAA,IACpE;AAAA,EACF;AAEA,SACE,oBAAC,kBAAe,YAAY,gBAC1B;AAAA,IAAC,eAAe;AAAA,IAAf;AAAA,MACC,MAAM,OAAO;AAAA,MACb,OAAO,OAAO;AAAA,MACd,OAAO,OAAO;AAAA,MACd,SAAS,MAAM,iBAAiB,MAAM;AAAA;AAAA,EACxC,GACF;AAEJ;AAEA,wBAAwB,aAAa,IAAI;",
   "names": []
 }

package/esm/charts/honeycomb/constants.js

@@ -20,6 +20,7 @@ const NON_OVERLAPPING_HEIGHT = {
 const NOT_HOVERED_TILE_OPACITY = 0.2;
 const HOVERED_TILE_OPACITY = 1;
 const DEFAULT_LEGEND_POSITION = "auto";
+const DEFAULT_HONEYCOMB_LABELS_DISPLAY = "none";
 const DEFAULT_HONEYCOMB_CONFIG = {
   shape: DEFAULT_HONEYCOMB_SHAPE,
   colorScheme: DEFAULT_HONEYCOMB_COLOR_PALETTE,
@@ -30,7 +31,7 @@ const DEFAULT_HONEYCOMB_CONFIG = {
   truncationMode: "middle",
   min: void 0,
   max: void 0,
-  showLabels: false,
+  labelsDisplay: DEFAULT_HONEYCOMB_LABELS_DISPLAY,
   colorRules: []
 };
 const DEFAULT_TILE_NAME = "node";
@@ -63,6 +64,7 @@ export {
   DEFAULT_HONEYCOMB_COLOR_PALETTE,
   DEFAULT_HONEYCOMB_CONFIG,
   DEFAULT_HONEYCOMB_HEIGHT,
+  DEFAULT_HONEYCOMB_LABELS_DISPLAY,
   DEFAULT_HONEYCOMB_SHAPE,
   DEFAULT_HONEYCOMB_TILE_COLOR,
   DEFAULT_HONEYCOMB_WIDTH,

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/honeycomb/constants.ts"],
-  "sourcesContent": ["import Colors from '@dynatrace/strato-design-tokens/colors';\n\nimport { HoneycombRequiredConfigProps } from './types/honeycomb-internal.js';\nimport { type HoneycombDatasetType } from './types/honeycomb.js';\nimport { HiveTileBestFitProps } from './types/rendering.js';\nimport { HoneycombState } from './types/state.js';\nimport { SCALE_FALLBACK_COLOR } from '../core/constants.js';\nimport { type LegendPosition } from '../core/types/legend.js';\n\nexport const DISPLAY_NAME = 'HoneycombChart';\n\nexport const DEFAULT_DATASET_TYPE: HoneycombDatasetType = 'numeric';\n\nexport const DEFAULT_HONEYCOMB_WIDTH = '100%';\nexport const DEFAULT_HONEYCOMB_HEIGHT = 300;\nexport const DEFAULT_HONEYCOMB_SHAPE = 'hexagon';\nexport const DEFAULT_HONEYCOMB_TILE_COLOR = SCALE_FALLBACK_COLOR;\nexport const DEFAULT_HONEYCOMB_COLOR_PALETTE = 'blue';\nexport const DEFAULT_HONEYCOMB_CATEGORICAL_COLOR_PALETTE = 'categorical';\n\nexport const HONEYCOMB_TILE_STROKE_COLOR = Colors.Theme.Background['10'];\n\n/**\n * Amount of height considered from the second line on,\n * because a 25% overlaps with the previous line.\n * example: hiveHeight =\\> 1st line = 1, 2nd line = 1.75\n */\nexport const NON_OVERLAPPING_HEIGHT_HEXS = 0.75;\n/**\n * Amount of height considered from the second line on,\n * because a 14% overlaps with the previous line.\n * example: hiveHeight =\\> 1st line = 1, 2nd line = 1.86\n */\nexport const NON_OVERLAPPING_HEIGHT_CIRCLES = 0.86;\nconst NON_OVERLAPPING_HEIGHT_SQUARES = 1;\n\nexport const NON_OVERLAPPING_HEIGHT = {\n  circle: NON_OVERLAPPING_HEIGHT_CIRCLES,\n  square: NON_OVERLAPPING_HEIGHT_SQUARES,\n  hexagon: NON_OVERLAPPING_HEIGHT_HEXS,\n};\n\nexport const NOT_HOVERED_TILE_OPACITY = 0.2;\nexport const HOVERED_TILE_OPACITY = 1;\n\nexport const DEFAULT_LEGEND_POSITION: LegendPosition = 'auto';\n\nexport const DEFAULT_HONEYCOMB_CONFIG: HoneycombRequiredConfigProps = {\n  shape: DEFAULT_HONEYCOMB_SHAPE,\n  colorScheme: DEFAULT_HONEYCOMB_COLOR_PALETTE,\n  toolbar: undefined,\n  legend: {},\n  formatter: {},\n  unit: undefined,\n  truncationMode: 'middle',\n  min: undefined,\n  max: undefined,\n  showLabels: false,\n  colorRules: [],\n};\n\nexport const DEFAULT_TILE_NAME = 'node';\n\nexport const initialState: HoneycombState = {\n  selection: {\n    hovered: undefined,\n  },\n  overlay: {\n    toolbarVisible: false,\n  },\n};\n\nexport const bestFitInitialState: HiveTileBestFitProps = {\n  hiveHeight: 0,\n  tileWidth: 0,\n  gap: 0,\n};\n\nexport const MAX_GAP_SIZE = 16;\nexport const HONEYCOMB_LABEL_FONT_SIZE = 12;\nexport const HONEYCOMB_VALUE_LABEL_FONT_SIZE = 16;\nexport const HONEYCOMB_LABEL_FONT_WEIGHT = 400;\nexport const HONEYCOMB_VALUE_FONT_WEIGHT = 500;\nexport const HONEYCOMB_LABEL_LINE_HEIGHT = 20;\nexport const HONEYCOMB_VALUE_LINE_HEIGHT = 28;\nexport const HONEYCOMB_DEFAULT_TEXT_ALIGNMENT = 'center';\nexport const HONEYCOMB_DEFAULT_MIN_ELLIPSIZED_TEXT = 'w...w';\nexport const HONEYCOMB_CHART_ARIA_LABEL = 'Honeycomb Chart';\n"],
-  "mappings": "AAAA,OAAO,YAAY;AAMnB,SAAS,4BAA4B;AAG9B,MAAM,eAAe;AAErB,MAAM,uBAA6C;AAEnD,MAAM,0BAA0B;AAChC,MAAM,2BAA2B;AACjC,MAAM,0BAA0B;AAChC,MAAM,+BAA+B;AACrC,MAAM,kCAAkC;AACxC,MAAM,8CAA8C;AAEpD,MAAM,8BAA8B,OAAO,MAAM,WAAW,IAAI;AAOhE,MAAM,8BAA8B;AAMpC,MAAM,iCAAiC;AAC9C,MAAM,iCAAiC;AAEhC,MAAM,yBAAyB;AAAA,EACpC,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,SAAS;AACX;AAEO,MAAM,2BAA2B;AACjC,MAAM,uBAAuB;AAE7B,MAAM,0BAA0C;AAEhD,MAAM,2BAAyD;AAAA,EACpE,OAAO;AAAA,EACP,aAAa;AAAA,EACb,SAAS;AAAA,EACT,QAAQ,CAAC;AAAA,EACT,WAAW,CAAC;AAAA,EACZ,MAAM;AAAA,EACN,gBAAgB;AAAA,EAChB,KAAK;AAAA,EACL,KAAK;AAAA,EACL,YAAY;AAAA,EACZ,YAAY,CAAC;AACf;AAEO,MAAM,oBAAoB;AAE1B,MAAM,eAA+B;AAAA,EAC1C,WAAW;AAAA,IACT,SAAS;AAAA,EACX;AAAA,EACA,SAAS;AAAA,IACP,gBAAgB;AAAA,EAClB;AACF;AAEO,MAAM,sBAA4C;AAAA,EACvD,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,KAAK;AACP;AAEO,MAAM,eAAe;AACrB,MAAM,4BAA4B;AAClC,MAAM,kCAAkC;AACxC,MAAM,8BAA8B;AACpC,MAAM,8BAA8B;AACpC,MAAM,8BAA8B;AACpC,MAAM,8BAA8B;AACpC,MAAM,mCAAmC;AACzC,MAAM,wCAAwC;AAC9C,MAAM,6BAA6B;",
+  "sourcesContent": ["import Colors from '@dynatrace/strato-design-tokens/colors';\n\nimport { HoneycombRequiredConfigProps } from './types/honeycomb-internal.js';\nimport {\n  type HoneycombDatasetType,\n  type HoneycombLabelsDisplay,\n} from './types/honeycomb.js';\nimport { HiveTileBestFitProps } from './types/rendering.js';\nimport { HoneycombState } from './types/state.js';\nimport { SCALE_FALLBACK_COLOR } from '../core/constants.js';\nimport { type LegendPosition } from '../core/types/legend.js';\n\nexport const DISPLAY_NAME = 'HoneycombChart';\n\nexport const DEFAULT_DATASET_TYPE: HoneycombDatasetType = 'numeric';\n\nexport const DEFAULT_HONEYCOMB_WIDTH = '100%';\nexport const DEFAULT_HONEYCOMB_HEIGHT = 300;\nexport const DEFAULT_HONEYCOMB_SHAPE = 'hexagon';\nexport const DEFAULT_HONEYCOMB_TILE_COLOR = SCALE_FALLBACK_COLOR;\nexport const DEFAULT_HONEYCOMB_COLOR_PALETTE = 'blue';\nexport const DEFAULT_HONEYCOMB_CATEGORICAL_COLOR_PALETTE = 'categorical';\n\nexport const HONEYCOMB_TILE_STROKE_COLOR = Colors.Theme.Background['10'];\n\n/**\n * Amount of height considered from the second line on,\n * because a 25% overlaps with the previous line.\n * example: hiveHeight =\\> 1st line = 1, 2nd line = 1.75\n */\nexport const NON_OVERLAPPING_HEIGHT_HEXS = 0.75;\n/**\n * Amount of height considered from the second line on,\n * because a 14% overlaps with the previous line.\n * example: hiveHeight =\\> 1st line = 1, 2nd line = 1.86\n */\nexport const NON_OVERLAPPING_HEIGHT_CIRCLES = 0.86;\nconst NON_OVERLAPPING_HEIGHT_SQUARES = 1;\n\nexport const NON_OVERLAPPING_HEIGHT = {\n  circle: NON_OVERLAPPING_HEIGHT_CIRCLES,\n  square: NON_OVERLAPPING_HEIGHT_SQUARES,\n  hexagon: NON_OVERLAPPING_HEIGHT_HEXS,\n};\n\nexport const NOT_HOVERED_TILE_OPACITY = 0.2;\nexport const HOVERED_TILE_OPACITY = 1;\n\nexport const DEFAULT_LEGEND_POSITION: LegendPosition = 'auto';\n\nexport const DEFAULT_HONEYCOMB_LABELS_DISPLAY: HoneycombLabelsDisplay = 'none';\n\nexport const DEFAULT_HONEYCOMB_CONFIG: HoneycombRequiredConfigProps = {\n  shape: DEFAULT_HONEYCOMB_SHAPE,\n  colorScheme: DEFAULT_HONEYCOMB_COLOR_PALETTE,\n  toolbar: undefined,\n  legend: {},\n  formatter: {},\n  unit: undefined,\n  truncationMode: 'middle',\n  min: undefined,\n  max: undefined,\n  labelsDisplay: DEFAULT_HONEYCOMB_LABELS_DISPLAY,\n  colorRules: [],\n};\n\nexport const DEFAULT_TILE_NAME = 'node';\n\nexport const initialState: HoneycombState = {\n  selection: {\n    hovered: undefined,\n  },\n  overlay: {\n    toolbarVisible: false,\n  },\n};\n\nexport const bestFitInitialState: HiveTileBestFitProps = {\n  hiveHeight: 0,\n  tileWidth: 0,\n  gap: 0,\n};\n\nexport const MAX_GAP_SIZE = 16;\nexport const HONEYCOMB_LABEL_FONT_SIZE = 12;\nexport const HONEYCOMB_VALUE_LABEL_FONT_SIZE = 16;\nexport const HONEYCOMB_LABEL_FONT_WEIGHT = 400;\nexport const HONEYCOMB_VALUE_FONT_WEIGHT = 500;\nexport const HONEYCOMB_LABEL_LINE_HEIGHT = 20;\nexport const HONEYCOMB_VALUE_LINE_HEIGHT = 28;\nexport const HONEYCOMB_DEFAULT_TEXT_ALIGNMENT = 'center';\nexport const HONEYCOMB_DEFAULT_MIN_ELLIPSIZED_TEXT = 'w...w';\nexport const HONEYCOMB_CHART_ARIA_LABEL = 'Honeycomb Chart';\n"],
+  "mappings": "AAAA,OAAO,YAAY;AASnB,SAAS,4BAA4B;AAG9B,MAAM,eAAe;AAErB,MAAM,uBAA6C;AAEnD,MAAM,0BAA0B;AAChC,MAAM,2BAA2B;AACjC,MAAM,0BAA0B;AAChC,MAAM,+BAA+B;AACrC,MAAM,kCAAkC;AACxC,MAAM,8CAA8C;AAEpD,MAAM,8BAA8B,OAAO,MAAM,WAAW,IAAI;AAOhE,MAAM,8BAA8B;AAMpC,MAAM,iCAAiC;AAC9C,MAAM,iCAAiC;AAEhC,MAAM,yBAAyB;AAAA,EACpC,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,SAAS;AACX;AAEO,MAAM,2BAA2B;AACjC,MAAM,uBAAuB;AAE7B,MAAM,0BAA0C;AAEhD,MAAM,mCAA2D;AAEjE,MAAM,2BAAyD;AAAA,EACpE,OAAO;AAAA,EACP,aAAa;AAAA,EACb,SAAS;AAAA,EACT,QAAQ,CAAC;AAAA,EACT,WAAW,CAAC;AAAA,EACZ,MAAM;AAAA,EACN,gBAAgB;AAAA,EAChB,KAAK;AAAA,EACL,KAAK;AAAA,EACL,eAAe;AAAA,EACf,YAAY,CAAC;AACf;AAEO,MAAM,oBAAoB;AAE1B,MAAM,eAA+B;AAAA,EAC1C,WAAW;AAAA,IACT,SAAS;AAAA,EACX;AAAA,EACA,SAAS;AAAA,IACP,gBAAgB;AAAA,EAClB;AACF;AAEO,MAAM,sBAA4C;AAAA,EACvD,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,KAAK;AACP;AAEO,MAAM,eAAe;AACrB,MAAM,4BAA4B;AAClC,MAAM,kCAAkC;AACxC,MAAM,8BAA8B;AACpC,MAAM,8BAA8B;AACpC,MAAM,8BAA8B;AACpC,MAAM,8BAA8B;AACpC,MAAM,mCAAmC;AACzC,MAAM,wCAAwC;AAC9C,MAAM,6BAA6B;",
   "names": []
 }

package/esm/charts/honeycomb/context/honeycomb-labels-display.context.js

@@ -0,0 +1,7 @@
+import { createContext } from "react";
+import { DEFAULT_HONEYCOMB_LABELS_DISPLAY } from "../constants.js";
+const HoneycombLabelsDisplayContext = createContext(DEFAULT_HONEYCOMB_LABELS_DISPLAY);
+export {
+  HoneycombLabelsDisplayContext
+};
+//# sourceMappingURL=honeycomb-labels-display.context.js.map

package/esm/charts/honeycomb/context/honeycomb-labels-display.context.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/charts/honeycomb/context/honeycomb-labels-display.context.ts"],
+  "sourcesContent": ["import { createContext } from 'react';\n\nimport { DEFAULT_HONEYCOMB_LABELS_DISPLAY } from '../constants.js';\nimport type { HoneycombLabelsDisplay } from '../types/honeycomb.js';\n\nexport const HoneycombLabelsDisplayContext =\n  createContext<HoneycombLabelsDisplay>(DEFAULT_HONEYCOMB_LABELS_DISPLAY);\n"],
+  "mappings": "AAAA,SAAS,qBAAqB;AAE9B,SAAS,wCAAwC;AAG1C,MAAM,gCACX,cAAsC,gCAAgC;",
+  "names": []
+}

package/esm/charts/honeycomb/hooks/use-honeycomb-labels-display.js

@@ -0,0 +1,7 @@
+import { useContext } from "react";
+import { HoneycombLabelsDisplayContext } from "../context/honeycomb-labels-display.context.js";
+const useHoneycombLabelsDisplay = () => useContext(HoneycombLabelsDisplayContext);
+export {
+  useHoneycombLabelsDisplay
+};
+//# sourceMappingURL=use-honeycomb-labels-display.js.map

package/esm/charts/honeycomb/hooks/use-honeycomb-labels-display.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/charts/honeycomb/hooks/use-honeycomb-labels-display.ts"],
+  "sourcesContent": ["import { useContext } from 'react';\n\nimport { HoneycombLabelsDisplayContext } from '../context/honeycomb-labels-display.context.js';\nimport type { HoneycombLabelsDisplay } from '../types/honeycomb.js';\n\nexport const useHoneycombLabelsDisplay = (): HoneycombLabelsDisplay =>\n  useContext(HoneycombLabelsDisplayContext);\n"],
+  "mappings": "AAAA,SAAS,kBAAkB;AAE3B,SAAS,qCAAqC;AAGvC,MAAM,4BAA4B,MACvC,WAAW,6BAA6B;",
+  "names": []
+}

package/esm/charts/honeycomb/utils/build-honeycomb-config.js

@@ -6,6 +6,7 @@ import {
   DEFAULT_HONEYCOMB_CATEGORICAL_COLOR_PALETTE,
   DEFAULT_HONEYCOMB_CONFIG
 } from "../constants.js";
+const showLabelsToLabelsDisplay = (showLabels) => showLabels ? "all" : "none";
 const checkCategoricalDataset = (data) => Array.isArray(data) && (isString(data[0]) || isHoneycombTileCategoricalData(data[0] ?? {}));
 const checkNumericalDataset = (props) => Array.isArray(props.data) && (isNumber(props.data[0]) || isHoneycombTileNumericData(props.data[0] ?? {}));
 const getDefaultColorScheme = (props, contextConfig) => {
@@ -39,7 +40,11 @@ const buildHoneycombConfig = (props, contextConfig, slots) => {
   const unit = props.unit ?? contextConfig.unit ?? void 0;
   const truncationMode = props.truncationMode ?? contextConfig.truncationMode ?? DEFAULT_HONEYCOMB_CONFIG.truncationMode;
   const formatter = props.formatter ?? contextConfig.formatter;
-  const showLabels = props.showLabels ?? contextConfig.showLabels ?? false;
+  const legacyPropsShowLabels = props.showLabels;
+  const fromPropsShowLabels = legacyPropsShowLabels !== void 0 ? showLabelsToLabelsDisplay(legacyPropsShowLabels) : void 0;
+  const legacyConfigShowLabels = contextConfig.showLabels;
+  const fromConfigShowLabels = legacyConfigShowLabels !== void 0 ? showLabelsToLabelsDisplay(legacyConfigShowLabels) : void 0;
+  const labelsDisplay = props.labelsDisplay ?? fromPropsShowLabels ?? contextConfig.labelsDisplay ?? fromConfigShowLabels ?? DEFAULT_HONEYCOMB_CONFIG.labelsDisplay;
   const legend = merge(
     {},
     DEFAULT_HONEYCOMB_CONFIG.legend,
@@ -62,7 +67,7 @@ const buildHoneycombConfig = (props, contextConfig, slots) => {
     truncationMode,
     min,
     max,
-    showLabels,
+    labelsDisplay,
     colorRules,
     tooltip: slots.tooltip ?? contextConfig.tooltip
   };

package/esm/charts/honeycomb/utils/build-honeycomb-config.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/honeycomb/utils/build-honeycomb-config.ts"],
-  "sourcesContent": ["import { isEmpty, isNumber, isString, isUndefined, merge } from 'lodash-es';\nimport { type PropsWithChildren } from 'react';\n\nimport { isHoneycombTileCategoricalData } from './is-honeycomb-tile-categorical-data.js';\nimport { isHoneycombTileNumericData } from './is-honeycomb-tile-numeric-data.js';\nimport { isValidColorRule } from '../../core/slots/ColorRule.js';\nimport {\n  DEFAULT_HONEYCOMB_CATEGORICAL_COLOR_PALETTE,\n  DEFAULT_HONEYCOMB_CONFIG,\n} from '../constants.js';\nimport { HoneycombChartProperties } from '../types/honeycomb-config-properties.js';\nimport {\n  HoneycombRequiredConfigProps,\n  HoneycombSlotsConfig,\n} from '../types/honeycomb-internal.js';\nimport {\n  HoneycombChartNumericalProps,\n  HoneycombChartProps,\n  HoneycombData,\n  type HoneycombTileData,\n  HoneycombTileShape,\n} from '../types/honeycomb.js';\n\nconst checkCategoricalDataset = (data: HoneycombData) =>\n  Array.isArray(data) &&\n  (isString(data[0]) ||\n    isHoneycombTileCategoricalData((data[0] ?? {}) as HoneycombTileData));\n\nexport const checkNumericalDataset = (\n  props: PropsWithChildren<HoneycombChartProps>,\n): props is HoneycombChartNumericalProps =>\n  Array.isArray(props.data) &&\n  (isNumber(props.data[0]) ||\n    isHoneycombTileNumericData((props.data[0] ?? {}) as HoneycombTileData));\n\nexport const getDefaultColorScheme = (\n  props: PropsWithChildren<HoneycombChartProps>,\n  contextConfig: HoneycombChartProperties,\n) => {\n  const currentColorScheme = props.colorScheme || contextConfig.colorScheme;\n  const isCategoricalDataset = checkCategoricalDataset(props.data);\n  const isColorPaletteName = typeof currentColorScheme === 'string';\n  const isCustomNumericColorScheme = Array.isArray(currentColorScheme);\n  const isInvalidColorScheme =\n    isUndefined(currentColorScheme) || isEmpty(currentColorScheme);\n\n  if (isInvalidColorScheme) {\n    return isCategoricalDataset\n      ? DEFAULT_HONEYCOMB_CATEGORICAL_COLOR_PALETTE\n      : DEFAULT_HONEYCOMB_CONFIG.colorScheme;\n  } else if (\n    isColorPaletteName ||\n    !isCategoricalDataset ||\n    isCustomNumericColorScheme\n  ) {\n    return currentColorScheme;\n  } else {\n    const capitalizedCategories: Record<string, string> = {};\n    Object.keys(currentColorScheme).forEach((key) => {\n      capitalizedCategories[key] = currentColorScheme[key];\n    });\n\n    return capitalizedCategories;\n  }\n};\n\nexport const buildHoneycombConfig = (\n  props: PropsWithChildren<HoneycombChartProps>,\n  contextConfig: HoneycombChartProperties,\n  slots: HoneycombSlotsConfig,\n): HoneycombRequiredConfigProps => {\n  const shape: HoneycombTileShape =\n    props.shape ?? contextConfig.shape ?? DEFAULT_HONEYCOMB_CONFIG.shape;\n\n  const colorScheme = getDefaultColorScheme(props, contextConfig);\n\n  const isToolbarSet = !!(slots.toolbar || contextConfig.toolbar);\n\n  const toolbar = isToolbarSet\n    ? merge(\n        {},\n        DEFAULT_HONEYCOMB_CONFIG.toolbar,\n        contextConfig.toolbar,\n        slots.toolbar,\n      )\n    : undefined;\n\n  const unit = props.unit ?? contextConfig.unit ?? undefined;\n  const truncationMode =\n    props.truncationMode ??\n    contextConfig.truncationMode ??\n    DEFAULT_HONEYCOMB_CONFIG.truncationMode;\n\n  const formatter = props.formatter ?? contextConfig.formatter;\n  const showLabels = props.showLabels ?? contextConfig.showLabels ?? false;\n\n  const legend = merge(\n    {},\n    DEFAULT_HONEYCOMB_CONFIG.legend,\n    contextConfig.legend,\n    slots.legend,\n  );\n\n  let min, max;\n\n  if (checkNumericalDataset(props)) {\n    min = props.min ?? contextConfig.min ?? undefined;\n    max = props.max ?? contextConfig.max ?? undefined;\n  }\n\n  const colorRules = (contextConfig.colorRules || [])\n    .filter(isValidColorRule)\n    .concat(slots.colorRules || []);\n\n  return {\n    shape,\n    colorScheme,\n    toolbar,\n    legend,\n    unit,\n    formatter,\n    truncationMode,\n    min,\n    max,\n    showLabels,\n    colorRules,\n    tooltip: slots.tooltip ?? contextConfig.tooltip,\n  };\n};\n"],
-  "mappings": "AAAA,SAAS,SAAS,UAAU,UAAU,aAAa,aAAa;AAGhE,SAAS,sCAAsC;AAC/C,SAAS,kCAAkC;AAC3C,SAAS,wBAAwB;AACjC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAcP,MAAM,0BAA0B,CAAC,SAC/B,MAAM,QAAQ,IAAI,MACjB,SAAS,KAAK,CAAC,CAAC,KACf,+BAAgC,KAAK,CAAC,KAAK,CAAC,CAAuB;AAEhE,MAAM,wBAAwB,CACnC,UAEA,MAAM,QAAQ,MAAM,IAAI,MACvB,SAAS,MAAM,KAAK,CAAC,CAAC,KACrB,2BAA4B,MAAM,KAAK,CAAC,KAAK,CAAC,CAAuB;AAElE,MAAM,wBAAwB,CACnC,OACA,kBACG;AACH,QAAM,qBAAqB,MAAM,eAAe,cAAc;AAC9D,QAAM,uBAAuB,wBAAwB,MAAM,IAAI;AAC/D,QAAM,qBAAqB,OAAO,uBAAuB;AACzD,QAAM,6BAA6B,MAAM,QAAQ,kBAAkB;AACnE,QAAM,uBACJ,YAAY,kBAAkB,KAAK,QAAQ,kBAAkB;AAE/D,MAAI,sBAAsB;AACxB,WAAO,uBACH,8CACA,yBAAyB;AAAA,EAC/B,WACE,sBACA,CAAC,wBACD,4BACA;AACA,WAAO;AAAA,EACT,OAAO;AACL,UAAM,wBAAgD,CAAC;AACvD,WAAO,KAAK,kBAAkB,EAAE,QAAQ,CAAC,QAAQ;AAC/C,4BAAsB,GAAG,IAAI,mBAAmB,GAAG;AAAA,IACrD,CAAC;AAED,WAAO;AAAA,EACT;AACF;AAEO,MAAM,uBAAuB,CAClC,OACA,eACA,UACiC;AACjC,QAAM,QACJ,MAAM,SAAS,cAAc,SAAS,yBAAyB;AAEjE,QAAM,cAAc,sBAAsB,OAAO,aAAa;AAE9D,QAAM,eAAe,CAAC,EAAE,MAAM,WAAW,cAAc;AAEvD,QAAM,UAAU,eACZ;AAAA,IACE,CAAC;AAAA,IACD,yBAAyB;AAAA,IACzB,cAAc;AAAA,IACd,MAAM;AAAA,EACR,IACA;AAEJ,QAAM,OAAO,MAAM,QAAQ,cAAc,QAAQ;AACjD,QAAM,iBACJ,MAAM,kBACN,cAAc,kBACd,yBAAyB;AAE3B,QAAM,YAAY,MAAM,aAAa,cAAc;AACnD,QAAM,aAAa,MAAM,cAAc,cAAc,cAAc;AAEnE,QAAM,SAAS;AAAA,IACb,CAAC;AAAA,IACD,yBAAyB;AAAA,IACzB,cAAc;AAAA,IACd,MAAM;AAAA,EACR;AAEA,MAAI,KAAK;AAET,MAAI,sBAAsB,KAAK,GAAG;AAChC,UAAM,MAAM,OAAO,cAAc,OAAO;AACxC,UAAM,MAAM,OAAO,cAAc,OAAO;AAAA,EAC1C;AAEA,QAAM,cAAc,cAAc,cAAc,CAAC,GAC9C,OAAO,gBAAgB,EACvB,OAAO,MAAM,cAAc,CAAC,CAAC;AAEhC,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS,MAAM,WAAW,cAAc;AAAA,EAC1C;AACF;",
+  "sourcesContent": ["import { isEmpty, isNumber, isString, isUndefined, merge } from 'lodash-es';\nimport { type PropsWithChildren } from 'react';\n\nimport { isHoneycombTileCategoricalData } from './is-honeycomb-tile-categorical-data.js';\nimport { isHoneycombTileNumericData } from './is-honeycomb-tile-numeric-data.js';\nimport { isValidColorRule } from '../../core/slots/ColorRule.js';\nimport {\n  DEFAULT_HONEYCOMB_CATEGORICAL_COLOR_PALETTE,\n  DEFAULT_HONEYCOMB_CONFIG,\n} from '../constants.js';\nimport { HoneycombChartProperties } from '../types/honeycomb-config-properties.js';\nimport {\n  HoneycombRequiredConfigProps,\n  HoneycombSlotsConfig,\n} from '../types/honeycomb-internal.js';\nimport {\n  HoneycombChartNumericalProps,\n  HoneycombChartProps,\n  HoneycombData,\n  HoneycombLabelsDisplay,\n  type HoneycombTileData,\n  HoneycombTileShape,\n} from '../types/honeycomb.js';\n\nconst showLabelsToLabelsDisplay = (\n  showLabels: boolean,\n): HoneycombLabelsDisplay => (showLabels ? 'all' : 'none');\n\nconst checkCategoricalDataset = (data: HoneycombData) =>\n  Array.isArray(data) &&\n  (isString(data[0]) ||\n    isHoneycombTileCategoricalData((data[0] ?? {}) as HoneycombTileData));\n\nexport const checkNumericalDataset = (\n  props: PropsWithChildren<HoneycombChartProps>,\n): props is HoneycombChartNumericalProps =>\n  Array.isArray(props.data) &&\n  (isNumber(props.data[0]) ||\n    isHoneycombTileNumericData((props.data[0] ?? {}) as HoneycombTileData));\n\nexport const getDefaultColorScheme = (\n  props: PropsWithChildren<HoneycombChartProps>,\n  contextConfig: HoneycombChartProperties,\n) => {\n  const currentColorScheme = props.colorScheme || contextConfig.colorScheme;\n  const isCategoricalDataset = checkCategoricalDataset(props.data);\n  const isColorPaletteName = typeof currentColorScheme === 'string';\n  const isCustomNumericColorScheme = Array.isArray(currentColorScheme);\n  const isInvalidColorScheme =\n    isUndefined(currentColorScheme) || isEmpty(currentColorScheme);\n\n  if (isInvalidColorScheme) {\n    return isCategoricalDataset\n      ? DEFAULT_HONEYCOMB_CATEGORICAL_COLOR_PALETTE\n      : DEFAULT_HONEYCOMB_CONFIG.colorScheme;\n  } else if (\n    isColorPaletteName ||\n    !isCategoricalDataset ||\n    isCustomNumericColorScheme\n  ) {\n    return currentColorScheme;\n  } else {\n    const capitalizedCategories: Record<string, string> = {};\n    Object.keys(currentColorScheme).forEach((key) => {\n      capitalizedCategories[key] = currentColorScheme[key];\n    });\n\n    return capitalizedCategories;\n  }\n};\n\nexport const buildHoneycombConfig = (\n  props: PropsWithChildren<HoneycombChartProps>,\n  contextConfig: HoneycombChartProperties,\n  slots: HoneycombSlotsConfig,\n): HoneycombRequiredConfigProps => {\n  const shape: HoneycombTileShape =\n    props.shape ?? contextConfig.shape ?? DEFAULT_HONEYCOMB_CONFIG.shape;\n\n  const colorScheme = getDefaultColorScheme(props, contextConfig);\n\n  const isToolbarSet = !!(slots.toolbar || contextConfig.toolbar);\n\n  const toolbar = isToolbarSet\n    ? merge(\n        {},\n        DEFAULT_HONEYCOMB_CONFIG.toolbar,\n        contextConfig.toolbar,\n        slots.toolbar,\n      )\n    : undefined;\n\n  const unit = props.unit ?? contextConfig.unit ?? undefined;\n  const truncationMode =\n    props.truncationMode ??\n    contextConfig.truncationMode ??\n    DEFAULT_HONEYCOMB_CONFIG.truncationMode;\n\n  const formatter = props.formatter ?? contextConfig.formatter;\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  const legacyPropsShowLabels = props.showLabels;\n  const fromPropsShowLabels =\n    legacyPropsShowLabels !== undefined\n      ? showLabelsToLabelsDisplay(legacyPropsShowLabels)\n      : undefined;\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  const legacyConfigShowLabels = contextConfig.showLabels;\n  const fromConfigShowLabels =\n    legacyConfigShowLabels !== undefined\n      ? showLabelsToLabelsDisplay(legacyConfigShowLabels)\n      : undefined;\n  const labelsDisplay =\n    props.labelsDisplay ??\n    fromPropsShowLabels ??\n    contextConfig.labelsDisplay ??\n    fromConfigShowLabels ??\n    DEFAULT_HONEYCOMB_CONFIG.labelsDisplay;\n\n  const legend = merge(\n    {},\n    DEFAULT_HONEYCOMB_CONFIG.legend,\n    contextConfig.legend,\n    slots.legend,\n  );\n\n  let min, max;\n\n  if (checkNumericalDataset(props)) {\n    min = props.min ?? contextConfig.min ?? undefined;\n    max = props.max ?? contextConfig.max ?? undefined;\n  }\n\n  const colorRules = (contextConfig.colorRules || [])\n    .filter(isValidColorRule)\n    .concat(slots.colorRules || []);\n\n  return {\n    shape,\n    colorScheme,\n    toolbar,\n    legend,\n    unit,\n    formatter,\n    truncationMode,\n    min,\n    max,\n    labelsDisplay,\n    colorRules,\n    tooltip: slots.tooltip ?? contextConfig.tooltip,\n  };\n};\n"],
+  "mappings": "AAAA,SAAS,SAAS,UAAU,UAAU,aAAa,aAAa;AAGhE,SAAS,sCAAsC;AAC/C,SAAS,kCAAkC;AAC3C,SAAS,wBAAwB;AACjC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAeP,MAAM,4BAA4B,CAChC,eAC4B,aAAa,QAAQ;AAEnD,MAAM,0BAA0B,CAAC,SAC/B,MAAM,QAAQ,IAAI,MACjB,SAAS,KAAK,CAAC,CAAC,KACf,+BAAgC,KAAK,CAAC,KAAK,CAAC,CAAuB;AAEhE,MAAM,wBAAwB,CACnC,UAEA,MAAM,QAAQ,MAAM,IAAI,MACvB,SAAS,MAAM,KAAK,CAAC,CAAC,KACrB,2BAA4B,MAAM,KAAK,CAAC,KAAK,CAAC,CAAuB;AAElE,MAAM,wBAAwB,CACnC,OACA,kBACG;AACH,QAAM,qBAAqB,MAAM,eAAe,cAAc;AAC9D,QAAM,uBAAuB,wBAAwB,MAAM,IAAI;AAC/D,QAAM,qBAAqB,OAAO,uBAAuB;AACzD,QAAM,6BAA6B,MAAM,QAAQ,kBAAkB;AACnE,QAAM,uBACJ,YAAY,kBAAkB,KAAK,QAAQ,kBAAkB;AAE/D,MAAI,sBAAsB;AACxB,WAAO,uBACH,8CACA,yBAAyB;AAAA,EAC/B,WACE,sBACA,CAAC,wBACD,4BACA;AACA,WAAO;AAAA,EACT,OAAO;AACL,UAAM,wBAAgD,CAAC;AACvD,WAAO,KAAK,kBAAkB,EAAE,QAAQ,CAAC,QAAQ;AAC/C,4BAAsB,GAAG,IAAI,mBAAmB,GAAG;AAAA,IACrD,CAAC;AAED,WAAO;AAAA,EACT;AACF;AAEO,MAAM,uBAAuB,CAClC,OACA,eACA,UACiC;AACjC,QAAM,QACJ,MAAM,SAAS,cAAc,SAAS,yBAAyB;AAEjE,QAAM,cAAc,sBAAsB,OAAO,aAAa;AAE9D,QAAM,eAAe,CAAC,EAAE,MAAM,WAAW,cAAc;AAEvD,QAAM,UAAU,eACZ;AAAA,IACE,CAAC;AAAA,IACD,yBAAyB;AAAA,IACzB,cAAc;AAAA,IACd,MAAM;AAAA,EACR,IACA;AAEJ,QAAM,OAAO,MAAM,QAAQ,cAAc,QAAQ;AACjD,QAAM,iBACJ,MAAM,kBACN,cAAc,kBACd,yBAAyB;AAE3B,QAAM,YAAY,MAAM,aAAa,cAAc;AAEnD,QAAM,wBAAwB,MAAM;AACpC,QAAM,sBACJ,0BAA0B,SACtB,0BAA0B,qBAAqB,IAC/C;AAEN,QAAM,yBAAyB,cAAc;AAC7C,QAAM,uBACJ,2BAA2B,SACvB,0BAA0B,sBAAsB,IAChD;AACN,QAAM,gBACJ,MAAM,iBACN,uBACA,cAAc,iBACd,wBACA,yBAAyB;AAE3B,QAAM,SAAS;AAAA,IACb,CAAC;AAAA,IACD,yBAAyB;AAAA,IACzB,cAAc;AAAA,IACd,MAAM;AAAA,EACR;AAEA,MAAI,KAAK;AAET,MAAI,sBAAsB,KAAK,GAAG;AAChC,UAAM,MAAM,OAAO,cAAc,OAAO;AACxC,UAAM,MAAM,OAAO,cAAc,OAAO;AAAA,EAC1C;AAEA,QAAM,cAAc,cAAc,cAAc,CAAC,GAC9C,OAAO,gBAAgB,EACvB,OAAO,MAAM,cAAc,CAAC,CAAC;AAEhC,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS,MAAM,WAAW,cAAc;AAAA,EAC1C;AACF;",
   "names": []
 }

package/esm/charts/index.js

@@ -49,16 +49,11 @@ import {
   useTooltip
 } from "./core/components/overlay-tooltip/contexts/TooltipContext.js";
 import { useTooltipReducer } from "./core/components/overlay-tooltip/useTooltipReducer.js";
+import { useTooltipData } from "./core/components/overlay-tooltip/hooks/useTooltipData.js";
 import {
   useTooltipActions
 } from "./core/components/overlay-tooltip/useTooltipActions.js";
 import { useDefaultLabels as useDefaultLabels2 } from "./core/components/overlay-tooltip/hooks/useDefaultLabels.js";
-import {
-  OverlayTooltipHeaderStory,
-  OverlayTooltipTruncationStory,
-  OverlayTooltipWIPStory,
-  OverlayTooltipCustomStory
-} from "./core/components/overlay-tooltip/_to-be-removed/_OverlayTooltipWIPStory.js";
 import {
   SIXTY_FPS,
   DEFAULT_TRUNCATION_MODE,
@@ -144,9 +139,8 @@ import { getDimensions } from "./timeseries/utils/convert-to-timeseries/utils/ge
 import { _getMetadataMetricsUnitForFieldName } from "./timeseries/utils/convert-to-timeseries/utils/get-metadata-metrics-unit-for-field-name.js";
 import { XYChart, XYChartAnnotations } from "./xy-chart/XYChartRoot.js";
 import { XYChartConfig } from "./xy-chart/context/XYChartConfig.context.js";
-import { XYChartTooltipTemplate } from "./xy-chart/components/tooltip/XYChartTooltipTemplate/XYChartTooltipTemplate.js";
-import { XYChartTooltipHeader } from "./xy-chart/components/tooltip/XYChartTooltipHeader/XYChartTooltipHeader.js";
 import { XYChartTooltipBody } from "./xy-chart/components/tooltip/XYChartTooltipBody/XYChartTooltipBody.js";
+import { TopList } from "./top-list/TopList.js";
 import { TreeMap } from "./tree-map/TreeMap.js";
 import { TreeMapConfig } from "./tree-map/context/TreeMapConfigContext.js";
 import { useMousePosition } from "./core/hooks/useMousePosition.js";
@@ -190,6 +184,7 @@ export {
   TimeseriesAnnotations,
   TimeseriesChart,
   TimeseriesChartConfig,
+  TopList,
   TreeMap,
   TreeMapConfig,
   VERTICAL_LABEL_LAYOUT_TYPE,
@@ -219,11 +214,7 @@ export {
   MeterBarChartThresholdLegend as _MeterBarChartThresholdLegend,
   OverlayProvider as _OverlayProvider,
   OverlayTooltip as _OverlayTooltip,
-  OverlayTooltipCustomStory as _OverlayTooltipCustomStory,
-  OverlayTooltipHeaderStory as _OverlayTooltipHeaderStory,
   TooltipProvider as _OverlayTooltipProvider,
-  OverlayTooltipTruncationStory as _OverlayTooltipTruncationStory,
-  OverlayTooltipWIPStory as _OverlayTooltipWIPStory,
   RangeLegend as _RangeLegend,
   SeriesItem as _SeriesItem,
   TextHeader as _TextHeader,
@@ -232,8 +223,6 @@ export {
   TimeFrameHeader as _TimeFrameHeader,
   TrackAtom as _TrackAtom,
   XYChartTooltipBody as _XYChartTooltipBody,
-  XYChartTooltipHeader as _XYChartTooltipHeader,
-  XYChartTooltipTemplate as _XYChartTooltipTemplate,
   automaticColoringMap as _automaticColoringMap,
   automaticColoringOptions as _automaticColoringOptions,
   buildCategoricalItemsFromScale as _buildCategoricalItemsFromScale,
@@ -270,6 +259,7 @@ export {
   useObserveContainerSize as _useObserveContainerSize,
   useOverlay as _useOverlayChart,
   useTooltipActions as _useOverlayTooltipActions,
+  useTooltipData as _useOverlayTooltipData,
   useDefaultLabels2 as _useOverlayTooltipDefaultLabels,
   useTooltipReducer as _useOverlayTooltipReducer,
   useTooltip as _useOverlayTooltipStore,