@dynatrace/strato-components 3.5.2 → 3.7.0

package/esm/charts/core/components/overlay-tooltip/useTooltipReducer.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/core/components/overlay-tooltip/useTooltipReducer.ts"],
-  "sourcesContent": ["import { isNil, isNull } from 'lodash-es';\nimport { useCallback } from 'react';\n\nimport { useOverlay } from './contexts/OverlayContext.js';\nimport { useTooltip } from './contexts/TooltipContext.js';\nimport type { TooltipAction } from './types.js';\nimport { emptyData } from './utils.js';\n\n/** @internal */\nexport const useTooltipReducer = () => {\n  const store = useTooltip();\n  const overlay = useOverlay();\n\n  const dispatch = useCallback(\n    (action: TooltipAction) =>\n      (event?: { clientX: number; clientY: number }) => {\n        switch (action.type) {\n          case 'RESET_TOOLTIP':\n            overlay.clear();\n\n            store.setState(() => ({\n              pinned: false,\n              absoluteX: null,\n              absoluteY: null,\n              relativeX: null,\n              relativeY: null,\n              percentX: null,\n              percentY: null,\n              inBounds: false,\n              activeSeries: null,\n              data: emptyData(),\n            }));\n            break;\n          case 'SET_PINNED':\n            store.setState((prevState) => {\n              prevState.inBounds || overlay.clear();\n              const { relativeX, relativeY, pinned, data } = action.payload;\n              const activeSeries = pinned ? prevState.activeSeries : null;\n              if (isNil(relativeX) || isNil(relativeY)) {\n                return {\n                  ...prevState,\n                  inBounds: true,\n                  pinned,\n                  data,\n                  activeSeries,\n                };\n              }\n\n              const positions = overlay.getAdjustedPositionsFromRelative(\n                relativeX,\n                relativeY,\n              );\n\n              return {\n                ...prevState,\n                pinned: action.payload.pinned,\n                inBounds: true,\n                data,\n                activeSeries,\n                ...positions,\n              };\n            });\n            break;\n          case 'SET_POSITION':\n            store.setState((prevState) => {\n              const { payload: data } = action;\n              if (prevState.pinned || !event) {\n                return prevState;\n              }\n              prevState.inBounds || overlay.clear();\n              const absoluteX = Math.round(event.clientX);\n              const absoluteY = Math.round(event.clientY);\n              const positions = overlay.getAdjustedPositionsFromAbsolute(\n                absoluteX,\n                absoluteY,\n              );\n\n              return {\n                ...prevState,\n                inBounds: true,\n                ...positions,\n                data: data || emptyData(),\n              };\n            });\n            break;\n          case 'SET_OUT_BOUNDS':\n            store.setState((prevState) => {\n              overlay.clear();\n\n              if (prevState.pinned) {\n                return prevState;\n              }\n\n              return {\n                ...prevState,\n                absoluteX: null,\n                absoluteY: null,\n                relativeX: null,\n                relativeY: null,\n                percentX: null,\n                percentY: null,\n                inBounds: false,\n                data: emptyData(),\n              };\n            });\n            break;\n          case 'UPDATE_POSITION':\n            store.setState((prevState) => {\n              overlay.clear();\n\n              const { pinned, percentX, percentY, relativeX, relativeY } =\n                prevState;\n              if (!pinned || isNil(percentX) || isNil(percentY)) {\n                return prevState;\n              }\n\n              const positions = overlay.getAdjustedPositionsFromPercent(\n                percentX,\n                percentY,\n                ...(action.payload.type === 'non-resize'\n                  ? [relativeX as number, relativeY as number]\n                  : [undefined, undefined]),\n              );\n\n              return {\n                ...prevState,\n                ...positions,\n                activeSeries: action.payload.scroll\n                  ? null\n                  : prevState.activeSeries,\n              };\n            });\n            break;\n          case 'SET_ACTIVE_SERIES':\n            store.setState((prevState) => {\n              if (prevState.activeSeries === action.payload.activeSeries) {\n                return prevState;\n              }\n              return {\n                ...prevState,\n                activeSeries: action.payload.activeSeries,\n              };\n            });\n            break;\n          case 'TOOLTIP_MOUSE_LEAVE':\n            store.setState((prevState) => {\n              if (isNull(prevState.activeSeries)) {\n                return prevState;\n              }\n\n              return {\n                ...prevState,\n                activeSeries: null,\n              };\n            });\n            break;\n          default:\n            throw new Error('Unhandled action type');\n        }\n      },\n    [store, overlay],\n  );\n\n  return dispatch;\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { isNil, isNull } from 'lodash-es';\nimport { useCallback } from 'react';\n\nimport { useOverlay } from './contexts/OverlayContext.js';\nimport { useTooltip } from './contexts/TooltipContext.js';\nimport type { TooltipAction } from './types.js';\nimport { emptyData } from './utils.js';\n\n/** @internal */\nexport const useTooltipReducer = () => {\n  const store = useTooltip();\n  const overlay = useOverlay();\n\n  const dispatch = useCallback(\n    (action: TooltipAction) => () => {\n      switch (action.type) {\n        case 'RESET_TOOLTIP':\n          overlay.clear();\n\n          store.setState(() => ({\n            pinned: false,\n            absoluteX: null,\n            absoluteY: null,\n            relativeX: null,\n            relativeY: null,\n            percentX: null,\n            percentY: null,\n            inBounds: false,\n            activeSeries: null,\n            data: emptyData(),\n          }));\n          break;\n        case 'SET_PINNED':\n          store.setState((prevState) => {\n            prevState.inBounds || overlay.clear();\n            const { pinned, data, absoluteX, absoluteY } = action.payload;\n            const activeSeries = pinned ? prevState.activeSeries : null;\n\n            if (isNil(absoluteX) || isNil(absoluteY)) {\n              return {\n                ...prevState,\n                inBounds: true,\n                pinned,\n                data,\n                activeSeries,\n              };\n            }\n\n            const positions = overlay.getAdjustedPositionsFromAbsolute(\n              absoluteX,\n              absoluteY,\n            );\n\n            return {\n              ...prevState,\n              pinned,\n              inBounds: true,\n              data,\n              activeSeries,\n              ...positions,\n            };\n          });\n          break;\n        case 'SET_POSITION':\n          store.setState((prevState) => {\n            if (prevState.pinned) {\n              return prevState;\n            }\n            prevState.inBounds || overlay.clear();\n            const { absoluteX, absoluteY, data } = action.payload;\n            const positions = overlay.getAdjustedPositionsFromAbsolute(\n              absoluteX,\n              absoluteY,\n            );\n\n            return {\n              ...prevState,\n              inBounds: true,\n              ...positions,\n              data: data || emptyData(),\n            };\n          });\n          break;\n        case 'SET_OUT_BOUNDS':\n          store.setState((prevState) => {\n            overlay.clear();\n\n            if (prevState.pinned) {\n              return prevState;\n            }\n\n            return {\n              ...prevState,\n              absoluteX: null,\n              absoluteY: null,\n              relativeX: null,\n              relativeY: null,\n              percentX: null,\n              percentY: null,\n              inBounds: false,\n              data: emptyData(),\n            };\n          });\n          break;\n        case 'UPDATE_POSITION':\n          store.setState((prevState) => {\n            overlay.clear();\n\n            const { pinned, percentX, percentY, relativeX, relativeY } =\n              prevState;\n            if (!pinned || isNil(percentX) || isNil(percentY)) {\n              return prevState;\n            }\n\n            const positions = overlay.getAdjustedPositionsFromPercent(\n              percentX,\n              percentY,\n              ...(action.payload.type === 'non-resize'\n                ? [relativeX as number, relativeY as number]\n                : [undefined, undefined]),\n            );\n\n            return {\n              ...prevState,\n              ...positions,\n              activeSeries: action.payload.scroll\n                ? null\n                : prevState.activeSeries,\n            };\n          });\n          break;\n        case 'SET_ACTIVE_SERIES':\n          store.setState((prevState) => {\n            if (prevState.activeSeries === action.payload.activeSeries) {\n              return prevState;\n            }\n            return {\n              ...prevState,\n              activeSeries: action.payload.activeSeries,\n            };\n          });\n          break;\n        case 'TOOLTIP_MOUSE_LEAVE':\n          store.setState((prevState) => {\n            if (isNull(prevState.activeSeries)) {\n              return prevState;\n            }\n\n            return {\n              ...prevState,\n              activeSeries: null,\n            };\n          });\n          break;\n        default:\n          throw new Error('Unhandled action type');\n      }\n    },\n    [store, overlay],\n  );\n\n  return dispatch;\n};\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/charts/core/components/overlay-tooltip/utils/build-content.js

@@ -2,13 +2,13 @@ import { jsx } from "react/jsx-runtime";
 import { clone } from "lodash-es";
 import { Children, Fragment } from "react";
 import { isSlot } from "../../../../../core/utils/is-slot.js";
+import { Footer } from "../components/Footer.js";
 import { Action } from "../components/global-actions/Action.js";
 import { ActionsPlaceholder } from "../components/global-actions/ActionsPlaceholder.js";
 import { Header } from "../components/header/Header.js";
 import { Series } from "../components/series/Series.js";
 import { SeriesHeader } from "../components/series/SeriesHeader.js";
 import { SeriesItem } from "../components/series/SeriesItem.js";
-import { TooltipFooter } from "../components/TooltipFooter.js";
 import { DEFAULT_TRUNCATION_MODE } from "../constants.js";
 const VALID_TRUNCATION_MODES = ["start", "middle", "end"];
 const isValidTruncationMode = (value) => {
@@ -26,6 +26,7 @@ const getTruncationMode = (userTruncationMode, defaultConfigTruncationMode) => {
 function buildContent(children, defaultConfig, args) {
   const slots = {
     Header: null,
+    Footer: null,
     Series: null,
     SeriesHeader: null,
     SeriesItem: null,
@@ -34,45 +35,49 @@ function buildContent(children, defaultConfig, args) {
   };
   let unpinnedPlaceholderText;
   let defaultActionsConfig = defaultConfig?.defaultActionsConfig;
-  Children.forEach(children, (child) => {
-    if (isSlot(child, Header)) {
-      slots.Header = child;
-    } else if (isSlot(child, SeriesHeader)) {
-      slots.SeriesHeader = child;
-      defaultActionsConfig = clone(
-        defaultConfig?.defaultActionsConfig
-      );
-      const defaultNameAction = defaultActionsConfig?.get("name");
-      if (child.props.seriesLabel && defaultNameAction) {
-        defaultActionsConfig?.set("name", {
-          ...defaultNameAction,
-          customLabel: child.props.seriesLabel
-        });
+  if (!args.customTooltip) {
+    Children.forEach(children, (child) => {
+      if (isSlot(child, Header)) {
+        slots.Header = child;
+      } else if (isSlot(child, Footer)) {
+        slots.Footer = child;
+      } else if (isSlot(child, SeriesHeader)) {
+        slots.SeriesHeader = child;
+        defaultActionsConfig = clone(
+          defaultConfig?.defaultActionsConfig
+        );
+        const defaultNameAction = defaultActionsConfig?.get("name");
+        if (child.props.seriesLabel && defaultNameAction) {
+          defaultActionsConfig?.set("name", {
+            ...defaultNameAction,
+            customLabel: child.props.seriesLabel
+          });
+        }
+        const defaultValueAction = defaultActionsConfig?.get("value");
+        if (child.props.valueLabel && defaultValueAction) {
+          defaultActionsConfig?.set("value", {
+            ...defaultValueAction,
+            customLabel: child.props.valueLabel
+          });
+        }
+      } else if (isSlot(child, Series)) {
+        slots.Series = child;
+      } else if (isSlot(child, SeriesItem)) {
+        slots.SeriesItem = child;
+      } else if (isSlot(child, ActionsPlaceholder)) {
+        unpinnedPlaceholderText = child.props.text;
+      } else if (isSlot(child, Action)) {
+        slots.GlobalActions.push(child);
       }
-      const defaultValueAction = defaultActionsConfig?.get("value");
-      if (child.props.valueLabel && defaultValueAction) {
-        defaultActionsConfig?.set("value", {
-          ...defaultValueAction,
-          customLabel: child.props.valueLabel
-        });
-      }
-    } else if (isSlot(child, Series)) {
-      slots.Series = child;
-    } else if (isSlot(child, SeriesItem)) {
-      slots.SeriesItem = child;
-    } else if (isSlot(child, ActionsPlaceholder)) {
-      unpinnedPlaceholderText = child.props.text;
-    } else if (isSlot(child, Action)) {
-      slots.GlobalActions.push(child);
-    }
-  });
+    });
+  }
   return {
     content: [
       /* @__PURE__ */ jsx(Fragment, { children: slots.Header }, "header"),
       slots.SeriesItem ? /* @__PURE__ */ jsx(Fragment, { children: slots.SeriesHeader || /* @__PURE__ */ jsx(SeriesHeader, {}) }, "seriesHeader") : null,
       /* @__PURE__ */ jsx(Fragment, { children: slots.Series || slots.SeriesItem }, "series"),
-      /* @__PURE__ */ jsx(
-        TooltipFooter,
+      slots.Footer ?? /* @__PURE__ */ jsx(
+        Footer,
         {
           actions: slots.GlobalActions,
           unpinnedPlaceholderText
@@ -82,14 +87,14 @@ function buildContent(children, defaultConfig, args) {
     ],
     config: {
       seriesHeader: slots.SeriesHeader || /* @__PURE__ */ jsx(SeriesHeader, {}),
-      displayHeaderDivider: !!(slots.Header && (slots.Series || slots.SeriesItem || slots.GlobalActions)),
+      displayHeaderDivider: !!(slots.Header && (slots.Series || slots.SeriesItem)),
       symbolPosition: args.userSymbolPosition || defaultConfig?.symbolPosition || "left",
       truncationMode: getTruncationMode(
         args.userTruncationMode,
         defaultConfig?.truncationMode
       ),
       defaultActionsConfig,
-      variant: defaultConfig?.sharedVariant && slots.Series?.props.variant || "single"
+      variant: args.customTooltip || defaultConfig?.sharedVariant && slots.Series?.props.variant === "shared" ? "shared" : "single"
     }
   };
 }

package/esm/charts/core/components/overlay-tooltip/utils/build-content.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/core/components/overlay-tooltip/utils/build-content.tsx"],
-  "sourcesContent": ["import { clone } from 'lodash-es';\nimport { Children, Fragment, type JSX, type ReactNode } from 'react';\n\nimport { isSlot } from '../../../../../core/utils/is-slot.js';\nimport type { TruncationMode } from '../../../../../typography/text-ellipsis/TextEllipsis.js';\nimport { Action } from '../components/global-actions/Action.js';\nimport { ActionsPlaceholder } from '../components/global-actions/ActionsPlaceholder.js';\nimport { Header } from '../components/header/Header.js';\nimport { Series } from '../components/series/Series.js';\nimport { SeriesHeader } from '../components/series/SeriesHeader.js';\nimport { SeriesItem } from '../components/series/SeriesItem.js';\nimport { TooltipFooter } from '../components/TooltipFooter.js';\nimport { DEFAULT_TRUNCATION_MODE } from '../constants.js';\nimport type { DefaultConfigByGeometry, ExternalConfig } from '../types.js';\n\nconst VALID_TRUNCATION_MODES: TruncationMode[] = ['start', 'middle', 'end'];\n\nconst isValidTruncationMode = (value: unknown): value is TruncationMode => {\n  return (\n    typeof value === 'string' &&\n    VALID_TRUNCATION_MODES.includes(value as TruncationMode)\n  );\n};\n\nconst getTruncationMode = (\n  userTruncationMode: TruncationMode,\n  defaultConfigTruncationMode?: TruncationMode,\n): TruncationMode => {\n  if (isValidTruncationMode(userTruncationMode)) {\n    return userTruncationMode;\n  }\n\n  if (isValidTruncationMode(defaultConfigTruncationMode)) {\n    return defaultConfigTruncationMode;\n  }\n\n  return DEFAULT_TRUNCATION_MODE;\n};\n\nexport function buildContent(\n  children: ReactNode,\n  defaultConfig: null | DefaultConfigByGeometry[keyof DefaultConfigByGeometry],\n  args: {\n    userSymbolPosition: ExternalConfig['symbolPosition'];\n    userTruncationMode: ExternalConfig['truncationMode'];\n  },\n): {\n  content: ReactNode;\n  config: ExternalConfig;\n} {\n  const slots: {\n    Header: JSX.Element | null;\n    Series: JSX.Element | null;\n    SeriesItem: JSX.Element | null;\n    SeriesHeader: JSX.Element | null;\n    ActionsPlaceholder: JSX.Element | null;\n    GlobalActions: JSX.Element[];\n  } = {\n    Header: null,\n    Series: null,\n    SeriesHeader: null,\n    SeriesItem: null,\n    ActionsPlaceholder: null,\n    GlobalActions: [],\n  };\n  let unpinnedPlaceholderText: string | undefined;\n  let defaultActionsConfig =\n    defaultConfig?.defaultActionsConfig as ExternalConfig['defaultActionsConfig'];\n\n  Children.forEach(children, (child) => {\n    if (isSlot(child, Header)) {\n      slots.Header = child;\n    } else if (isSlot(child, SeriesHeader)) {\n      slots.SeriesHeader = child;\n      defaultActionsConfig = clone(\n        defaultConfig?.defaultActionsConfig,\n      ) as ExternalConfig['defaultActionsConfig'];\n      const defaultNameAction = defaultActionsConfig?.get('name');\n      if (child.props.seriesLabel && defaultNameAction) {\n        defaultActionsConfig?.set('name', {\n          ...defaultNameAction,\n          customLabel: child.props.seriesLabel,\n        });\n      }\n\n      const defaultValueAction = defaultActionsConfig?.get('value');\n      if (child.props.valueLabel && defaultValueAction) {\n        defaultActionsConfig?.set('value', {\n          ...defaultValueAction,\n          customLabel: child.props.valueLabel,\n        });\n      }\n    } else if (isSlot(child, Series)) {\n      slots.Series = child;\n    } else if (isSlot(child, SeriesItem)) {\n      slots.SeriesItem = child;\n    } else if (isSlot(child, ActionsPlaceholder)) {\n      unpinnedPlaceholderText = child.props.text;\n    } else if (isSlot(child, Action)) {\n      slots.GlobalActions.push(child);\n    }\n  });\n\n  return {\n    content: [\n      <Fragment key=\"header\">{slots.Header}</Fragment>,\n      slots.SeriesItem ? (\n        <Fragment key=\"seriesHeader\">\n          {slots.SeriesHeader || <SeriesHeader />}\n        </Fragment>\n      ) : null,\n      <Fragment key=\"series\">{slots.Series || slots.SeriesItem}</Fragment>,\n      <TooltipFooter\n        key=\"footer\"\n        actions={slots.GlobalActions}\n        unpinnedPlaceholderText={unpinnedPlaceholderText}\n      />,\n    ],\n    config: {\n      seriesHeader: slots.SeriesHeader || <SeriesHeader />,\n      displayHeaderDivider: !!(\n        slots.Header &&\n        (slots.Series || slots.SeriesItem || slots.GlobalActions)\n      ),\n      symbolPosition:\n        args.userSymbolPosition || defaultConfig?.symbolPosition || 'left',\n      truncationMode: getTruncationMode(\n        args.userTruncationMode,\n        defaultConfig?.truncationMode,\n      ),\n      defaultActionsConfig,\n      variant:\n        (defaultConfig?.sharedVariant && slots.Series?.props.variant) ||\n        'single',\n    },\n  };\n}\n"],
-  "mappings": "AAyGM;AAzGN,SAAS,aAAa;AACtB,SAAS,UAAU,gBAA0C;AAE7D,SAAS,cAAc;AAEvB,SAAS,cAAc;AACvB,SAAS,0BAA0B;AACnC,SAAS,cAAc;AACvB,SAAS,cAAc;AACvB,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AAC3B,SAAS,qBAAqB;AAC9B,SAAS,+BAA+B;AAGxC,MAAM,yBAA2C,CAAC,SAAS,UAAU,KAAK;AAE1E,MAAM,wBAAwB,CAAC,UAA4C;AACzE,SACE,OAAO,UAAU,YACjB,uBAAuB,SAAS,KAAuB;AAE3D;AAEA,MAAM,oBAAoB,CACxB,oBACA,gCACmB;AACnB,MAAI,sBAAsB,kBAAkB,GAAG;AAC7C,WAAO;AAAA,EACT;AAEA,MAAI,sBAAsB,2BAA2B,GAAG;AACtD,WAAO;AAAA,EACT;AAEA,SAAO;AACT;AAEO,SAAS,aACd,UACA,eACA,MAOA;AACA,QAAM,QAOF;AAAA,IACF,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,oBAAoB;AAAA,IACpB,eAAe,CAAC;AAAA,EAClB;AACA,MAAI;AACJ,MAAI,uBACF,eAAe;AAEjB,WAAS,QAAQ,UAAU,CAAC,UAAU;AACpC,QAAI,OAAO,OAAO,MAAM,GAAG;AACzB,YAAM,SAAS;AAAA,IACjB,WAAW,OAAO,OAAO,YAAY,GAAG;AACtC,YAAM,eAAe;AACrB,6BAAuB;AAAA,QACrB,eAAe;AAAA,MACjB;AACA,YAAM,oBAAoB,sBAAsB,IAAI,MAAM;AAC1D,UAAI,MAAM,MAAM,eAAe,mBAAmB;AAChD,8BAAsB,IAAI,QAAQ;AAAA,UAChC,GAAG;AAAA,UACH,aAAa,MAAM,MAAM;AAAA,QAC3B,CAAC;AAAA,MACH;AAEA,YAAM,qBAAqB,sBAAsB,IAAI,OAAO;AAC5D,UAAI,MAAM,MAAM,cAAc,oBAAoB;AAChD,8BAAsB,IAAI,SAAS;AAAA,UACjC,GAAG;AAAA,UACH,aAAa,MAAM,MAAM;AAAA,QAC3B,CAAC;AAAA,MACH;AAAA,IACF,WAAW,OAAO,OAAO,MAAM,GAAG;AAChC,YAAM,SAAS;AAAA,IACjB,WAAW,OAAO,OAAO,UAAU,GAAG;AACpC,YAAM,aAAa;AAAA,IACrB,WAAW,OAAO,OAAO,kBAAkB,GAAG;AAC5C,gCAA0B,MAAM,MAAM;AAAA,IACxC,WAAW,OAAO,OAAO,MAAM,GAAG;AAChC,YAAM,cAAc,KAAK,KAAK;AAAA,IAChC;AAAA,EACF,CAAC;AAED,SAAO;AAAA,IACL,SAAS;AAAA,MACP,oBAAC,YAAuB,gBAAM,UAAhB,QAAuB;AAAA,MACrC,MAAM,aACJ,oBAAC,YACE,gBAAM,gBAAgB,oBAAC,gBAAa,KADzB,cAEd,IACE;AAAA,MACJ,oBAAC,YAAuB,gBAAM,UAAU,MAAM,cAAhC,QAA2C;AAAA,MACzD;AAAA,QAAC;AAAA;AAAA,UAEC,SAAS,MAAM;AAAA,UACf;AAAA;AAAA,QAFI;AAAA,MAGN;AAAA,IACF;AAAA,IACA,QAAQ;AAAA,MACN,cAAc,MAAM,gBAAgB,oBAAC,gBAAa;AAAA,MAClD,sBAAsB,CAAC,EACrB,MAAM,WACL,MAAM,UAAU,MAAM,cAAc,MAAM;AAAA,MAE7C,gBACE,KAAK,sBAAsB,eAAe,kBAAkB;AAAA,MAC9D,gBAAgB;AAAA,QACd,KAAK;AAAA,QACL,eAAe;AAAA,MACjB;AAAA,MACA;AAAA,MACA,SACG,eAAe,iBAAiB,MAAM,QAAQ,MAAM,WACrD;AAAA,IACJ;AAAA,EACF;AACF;",
+  "sourcesContent": ["import { clone } from 'lodash-es';\nimport { Children, Fragment, type JSX, type ReactNode } from 'react';\n\nimport { isSlot } from '../../../../../core/utils/is-slot.js';\nimport type { TruncationMode } from '../../../../../typography/text-ellipsis/TextEllipsis.js';\nimport { Footer } from '../components/Footer.js';\nimport { Action } from '../components/global-actions/Action.js';\nimport { ActionsPlaceholder } from '../components/global-actions/ActionsPlaceholder.js';\nimport { Header } from '../components/header/Header.js';\nimport { Series } from '../components/series/Series.js';\nimport { SeriesHeader } from '../components/series/SeriesHeader.js';\nimport { SeriesItem } from '../components/series/SeriesItem.js';\nimport { DEFAULT_TRUNCATION_MODE } from '../constants.js';\nimport type { DefaultConfigByGeometry, ExternalConfig } from '../types.js';\n\nconst VALID_TRUNCATION_MODES: TruncationMode[] = ['start', 'middle', 'end'];\n\nconst isValidTruncationMode = (value: unknown): value is TruncationMode => {\n  return (\n    typeof value === 'string' &&\n    VALID_TRUNCATION_MODES.includes(value as TruncationMode)\n  );\n};\n\nconst getTruncationMode = (\n  userTruncationMode: TruncationMode,\n  defaultConfigTruncationMode?: TruncationMode,\n): TruncationMode => {\n  if (isValidTruncationMode(userTruncationMode)) {\n    return userTruncationMode;\n  }\n\n  if (isValidTruncationMode(defaultConfigTruncationMode)) {\n    return defaultConfigTruncationMode;\n  }\n\n  return DEFAULT_TRUNCATION_MODE;\n};\n\nexport function buildContent(\n  children: ReactNode,\n  defaultConfig: null | DefaultConfigByGeometry[keyof DefaultConfigByGeometry],\n  args: {\n    userSymbolPosition: ExternalConfig['symbolPosition'];\n    userTruncationMode: ExternalConfig['truncationMode'];\n    customTooltip: boolean;\n  },\n): {\n  content: ReactNode;\n  config: ExternalConfig;\n} {\n  const slots: {\n    Header: JSX.Element | null;\n    Footer: JSX.Element | null;\n    Series: JSX.Element | null;\n    SeriesItem: JSX.Element | null;\n    SeriesHeader: JSX.Element | null;\n    ActionsPlaceholder: JSX.Element | null;\n    GlobalActions: ReactNode[];\n  } = {\n    Header: null,\n    Footer: null,\n    Series: null,\n    SeriesHeader: null,\n    SeriesItem: null,\n    ActionsPlaceholder: null,\n    GlobalActions: [],\n  };\n  let unpinnedPlaceholderText: string | undefined;\n  let defaultActionsConfig =\n    defaultConfig?.defaultActionsConfig as ExternalConfig['defaultActionsConfig'];\n\n  if (!args.customTooltip) {\n    Children.forEach(children, (child) => {\n      if (isSlot(child, Header)) {\n        slots.Header = child;\n      } else if (isSlot(child, Footer)) {\n          slots.Footer = child;\n      } else if (isSlot(child, SeriesHeader)) {\n        slots.SeriesHeader = child;\n        defaultActionsConfig = clone(\n          defaultConfig?.defaultActionsConfig,\n        ) as ExternalConfig['defaultActionsConfig'];\n        const defaultNameAction = defaultActionsConfig?.get('name');\n        if (child.props.seriesLabel && defaultNameAction) {\n          defaultActionsConfig?.set('name', {\n            ...defaultNameAction,\n            customLabel: child.props.seriesLabel,\n          });\n        }\n\n        const defaultValueAction = defaultActionsConfig?.get('value');\n        if (child.props.valueLabel && defaultValueAction) {\n          defaultActionsConfig?.set('value', {\n            ...defaultValueAction,\n            customLabel: child.props.valueLabel,\n          });\n        }\n      } else if (isSlot(child, Series)) {\n        slots.Series = child;\n      } else if (isSlot(child, SeriesItem)) {\n        slots.SeriesItem = child;\n      } else if (isSlot(child, ActionsPlaceholder)) {\n        unpinnedPlaceholderText = child.props.text;\n      } else if (isSlot(child, Action)) {\n        slots.GlobalActions.push(child);\n      }\n    });\n  }\n\n  return {\n    content: [\n      <Fragment key=\"header\">{slots.Header}</Fragment>,\n      slots.SeriesItem ? (\n        <Fragment key=\"seriesHeader\">\n          {slots.SeriesHeader || <SeriesHeader />}\n        </Fragment>\n      ) : null,\n      <Fragment key=\"series\">{slots.Series || slots.SeriesItem}</Fragment>,\n      slots.Footer ?? (\n        <Footer\n          key=\"footer\"\n          actions={slots.GlobalActions}\n          unpinnedPlaceholderText={unpinnedPlaceholderText}\n        />\n      ),\n    ],\n    config: {\n      seriesHeader: slots.SeriesHeader || <SeriesHeader />,\n      displayHeaderDivider: !!(\n        slots.Header &&\n        (slots.Series || slots.SeriesItem)\n      ),\n      symbolPosition:\n        args.userSymbolPosition || defaultConfig?.symbolPosition || 'left',\n      truncationMode: getTruncationMode(\n        args.userTruncationMode,\n        defaultConfig?.truncationMode,\n      ),\n      defaultActionsConfig,\n      variant:\n        args.customTooltip ||\n        (defaultConfig?.sharedVariant &&\n          slots.Series?.props.variant === 'shared')\n          ? 'shared'\n          : 'single',\n    },\n  };\n}\n"],
+  "mappings": "AAgHM;AAhHN,SAAS,aAAa;AACtB,SAAS,UAAU,gBAA0C;AAE7D,SAAS,cAAc;AAEvB,SAAS,cAAc;AACvB,SAAS,cAAc;AACvB,SAAS,0BAA0B;AACnC,SAAS,cAAc;AACvB,SAAS,cAAc;AACvB,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AAC3B,SAAS,+BAA+B;AAGxC,MAAM,yBAA2C,CAAC,SAAS,UAAU,KAAK;AAE1E,MAAM,wBAAwB,CAAC,UAA4C;AACzE,SACE,OAAO,UAAU,YACjB,uBAAuB,SAAS,KAAuB;AAE3D;AAEA,MAAM,oBAAoB,CACxB,oBACA,gCACmB;AACnB,MAAI,sBAAsB,kBAAkB,GAAG;AAC7C,WAAO;AAAA,EACT;AAEA,MAAI,sBAAsB,2BAA2B,GAAG;AACtD,WAAO;AAAA,EACT;AAEA,SAAO;AACT;AAEO,SAAS,aACd,UACA,eACA,MAQA;AACA,QAAM,QAQF;AAAA,IACF,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,oBAAoB;AAAA,IACpB,eAAe,CAAC;AAAA,EAClB;AACA,MAAI;AACJ,MAAI,uBACF,eAAe;AAEjB,MAAI,CAAC,KAAK,eAAe;AACvB,aAAS,QAAQ,UAAU,CAAC,UAAU;AACpC,UAAI,OAAO,OAAO,MAAM,GAAG;AACzB,cAAM,SAAS;AAAA,MACjB,WAAW,OAAO,OAAO,MAAM,GAAG;AAC9B,cAAM,SAAS;AAAA,MACnB,WAAW,OAAO,OAAO,YAAY,GAAG;AACtC,cAAM,eAAe;AACrB,+BAAuB;AAAA,UACrB,eAAe;AAAA,QACjB;AACA,cAAM,oBAAoB,sBAAsB,IAAI,MAAM;AAC1D,YAAI,MAAM,MAAM,eAAe,mBAAmB;AAChD,gCAAsB,IAAI,QAAQ;AAAA,YAChC,GAAG;AAAA,YACH,aAAa,MAAM,MAAM;AAAA,UAC3B,CAAC;AAAA,QACH;AAEA,cAAM,qBAAqB,sBAAsB,IAAI,OAAO;AAC5D,YAAI,MAAM,MAAM,cAAc,oBAAoB;AAChD,gCAAsB,IAAI,SAAS;AAAA,YACjC,GAAG;AAAA,YACH,aAAa,MAAM,MAAM;AAAA,UAC3B,CAAC;AAAA,QACH;AAAA,MACF,WAAW,OAAO,OAAO,MAAM,GAAG;AAChC,cAAM,SAAS;AAAA,MACjB,WAAW,OAAO,OAAO,UAAU,GAAG;AACpC,cAAM,aAAa;AAAA,MACrB,WAAW,OAAO,OAAO,kBAAkB,GAAG;AAC5C,kCAA0B,MAAM,MAAM;AAAA,MACxC,WAAW,OAAO,OAAO,MAAM,GAAG;AAChC,cAAM,cAAc,KAAK,KAAK;AAAA,MAChC;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SAAO;AAAA,IACL,SAAS;AAAA,MACP,oBAAC,YAAuB,gBAAM,UAAhB,QAAuB;AAAA,MACrC,MAAM,aACJ,oBAAC,YACE,gBAAM,gBAAgB,oBAAC,gBAAa,KADzB,cAEd,IACE;AAAA,MACJ,oBAAC,YAAuB,gBAAM,UAAU,MAAM,cAAhC,QAA2C;AAAA,MACzD,MAAM,UACJ;AAAA,QAAC;AAAA;AAAA,UAEC,SAAS,MAAM;AAAA,UACf;AAAA;AAAA,QAFI;AAAA,MAGN;AAAA,IAEJ;AAAA,IACA,QAAQ;AAAA,MACN,cAAc,MAAM,gBAAgB,oBAAC,gBAAa;AAAA,MAClD,sBAAsB,CAAC,EACrB,MAAM,WACL,MAAM,UAAU,MAAM;AAAA,MAEzB,gBACE,KAAK,sBAAsB,eAAe,kBAAkB;AAAA,MAC9D,gBAAgB;AAAA,QACd,KAAK;AAAA,QACL,eAAe;AAAA,MACjB;AAAA,MACA;AAAA,MACA,SACE,KAAK,iBACJ,eAAe,iBACd,MAAM,QAAQ,MAAM,YAAY,WAC9B,WACA;AAAA,IACR;AAAA,EACF;AACF;",
   "names": []
 }

package/esm/charts/core/components/overlay-tooltip/utils/estimate-series-item-size.js

@@ -10,12 +10,11 @@ const estimateSeriesItemSize = (item, maxContainerWidth) => {
   const baseHeight = 24;
   const multiLine = "multiLine" in item ? item.multiLine : false;
   const maxLines = "maxLines" in item ? item.maxLines : DEFAULT_SERIES_NAME_LINES;
+  const containerWidth = Math.max(maxContainerWidth, MIN_TOOLTIP_WIDTH) - (SYMBOL_AND_SPACING_WIDTH + TOOLTIP_WRAPPER_PADDING);
   let lineCount = 1;
   if (Array.isArray(item.name)) {
     lineCount = item.name.length;
   } else if (typeof item.name === "string" && multiLine) {
-    const actualContainerWidth = Math.max(maxContainerWidth, MIN_TOOLTIP_WIDTH);
-    const containerWidth = actualContainerWidth - (SYMBOL_AND_SPACING_WIDTH + TOOLTIP_WRAPPER_PADDING);
     const textWidth = calculateWidth(
       item.name,
       charsFontWidth12pixelsSize400Map
@@ -24,7 +23,24 @@ const estimateSeriesItemSize = (item, maxContainerWidth) => {
       lineCount = Math.min(Math.ceil(textWidth / containerWidth), maxLines);
     }
   }
-  return baseHeight + (lineCount - 1) * 16;
+  let descriptionLineCount = 0;
+  const description = "description" in item ? item.description : void 0;
+  if (typeof description === "string" && description.length > 0) {
+    descriptionLineCount = 1;
+    if (multiLine) {
+      const descriptionWidth = calculateWidth(
+        description,
+        charsFontWidth12pixelsSize400Map
+      );
+      if (descriptionWidth > containerWidth) {
+        descriptionLineCount = Math.min(
+          Math.ceil(descriptionWidth / containerWidth),
+          maxLines
+        );
+      }
+    }
+  }
+  return baseHeight + (lineCount + descriptionLineCount - 1) * 16;
 };
 export {
   estimateSeriesItemSize

package/esm/charts/core/components/overlay-tooltip/utils/estimate-series-item-size.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/core/components/overlay-tooltip/utils/estimate-series-item-size.ts"],
-  "sourcesContent": ["import { charsFontWidth12pixelsSize400Map } from '../../text-ellipsis/chars-font-width-map.js';\nimport { calculateWidth } from '../../text-ellipsis/truncate-string.js';\nimport {\n  DEFAULT_SERIES_NAME_LINES,\n  MIN_TOOLTIP_WIDTH,\n  SYMBOL_AND_SPACING_WIDTH,\n  TOOLTIP_WRAPPER_PADDING,\n} from '../constants.js';\n\n/**\n * Estimates the size (height) of a series item for virtualization\n * @param item - The series item data\n * @param maxContainerWidth - Maximum container width available\n * @returns Estimated height in pixels\n */\nexport const estimateSeriesItemSize = (\n  item: Record<string, unknown>,\n  maxContainerWidth: number,\n): number => {\n  const baseHeight = 24;\n\n  const multiLine = ('multiLine' in item ? item.multiLine : false) as boolean;\n  const maxLines = (\n    'maxLines' in item ? item.maxLines : DEFAULT_SERIES_NAME_LINES\n  ) as number;\n\n  let lineCount = 1;\n\n  if (Array.isArray(item.name)) {\n    lineCount = item.name.length;\n  } else if (typeof item.name === 'string' && multiLine) {\n    const actualContainerWidth = Math.max(maxContainerWidth, MIN_TOOLTIP_WIDTH);\n    const containerWidth =\n      actualContainerWidth -\n      (SYMBOL_AND_SPACING_WIDTH + TOOLTIP_WRAPPER_PADDING);\n    const textWidth = calculateWidth(\n      item.name,\n      charsFontWidth12pixelsSize400Map,\n    );\n\n    if (textWidth > containerWidth) {\n      lineCount = Math.min(Math.ceil(textWidth / containerWidth), maxLines);\n    }\n  }\n\n  return baseHeight + (lineCount - 1) * 16;\n};\n"],
-  "mappings": "AAAA,SAAS,wCAAwC;AACjD,SAAS,sBAAsB;AAC/B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAQA,MAAM,yBAAyB,CACpC,MACA,sBACW;AACX,QAAM,aAAa;AAEnB,QAAM,YAAa,eAAe,OAAO,KAAK,YAAY;AAC1D,QAAM,WACJ,cAAc,OAAO,KAAK,WAAW;AAGvC,MAAI,YAAY;AAEhB,MAAI,MAAM,QAAQ,KAAK,IAAI,GAAG;AAC5B,gBAAY,KAAK,KAAK;AAAA,EACxB,WAAW,OAAO,KAAK,SAAS,YAAY,WAAW;AACrD,UAAM,uBAAuB,KAAK,IAAI,mBAAmB,iBAAiB;AAC1E,UAAM,iBACJ,wBACC,2BAA2B;AAC9B,UAAM,YAAY;AAAA,MAChB,KAAK;AAAA,MACL;AAAA,IACF;AAEA,QAAI,YAAY,gBAAgB;AAC9B,kBAAY,KAAK,IAAI,KAAK,KAAK,YAAY,cAAc,GAAG,QAAQ;AAAA,IACtE;AAAA,EACF;AAEA,SAAO,cAAc,YAAY,KAAK;AACxC;",
+  "sourcesContent": ["import { charsFontWidth12pixelsSize400Map } from '../../text-ellipsis/chars-font-width-map.js';\nimport { calculateWidth } from '../../text-ellipsis/truncate-string.js';\nimport {\n  DEFAULT_SERIES_NAME_LINES,\n  MIN_TOOLTIP_WIDTH,\n  SYMBOL_AND_SPACING_WIDTH,\n  TOOLTIP_WRAPPER_PADDING,\n} from '../constants.js';\n\n/**\n * Estimates the size (height) of a series item for virtualization\n * @param item - The series item data\n * @param maxContainerWidth - Maximum container width available\n * @returns Estimated height in pixels\n */\nexport const estimateSeriesItemSize = (\n  item: Record<string, unknown>,\n  maxContainerWidth: number,\n): number => {\n  const baseHeight = 24;\n\n  const multiLine = ('multiLine' in item ? item.multiLine : false) as boolean;\n  const maxLines = (\n    'maxLines' in item ? item.maxLines : DEFAULT_SERIES_NAME_LINES\n  ) as number;\n\n  const containerWidth =\n    Math.max(maxContainerWidth, MIN_TOOLTIP_WIDTH) -\n    (SYMBOL_AND_SPACING_WIDTH + TOOLTIP_WRAPPER_PADDING);\n\n  let lineCount = 1;\n\n  if (Array.isArray(item.name)) {\n    lineCount = item.name.length;\n  } else if (typeof item.name === 'string' && multiLine) {\n    const textWidth = calculateWidth(\n      item.name,\n      charsFontWidth12pixelsSize400Map,\n    );\n\n    if (textWidth > containerWidth) {\n      lineCount = Math.min(Math.ceil(textWidth / containerWidth), maxLines);\n    }\n  }\n\n  let descriptionLineCount = 0;\n  const description = ('description' in item ? item.description : undefined) as\n    | string\n    | undefined;\n  if (typeof description === 'string' && description.length > 0) {\n    descriptionLineCount = 1;\n    if (multiLine) {\n      const descriptionWidth = calculateWidth(\n        description,\n        charsFontWidth12pixelsSize400Map,\n      );\n      if (descriptionWidth > containerWidth) {\n        descriptionLineCount = Math.min(\n          Math.ceil(descriptionWidth / containerWidth),\n          maxLines,\n        );\n      }\n    }\n  }\n\n  return baseHeight + (lineCount + descriptionLineCount - 1) * 16;\n};\n"],
+  "mappings": "AAAA,SAAS,wCAAwC;AACjD,SAAS,sBAAsB;AAC/B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAQA,MAAM,yBAAyB,CACpC,MACA,sBACW;AACX,QAAM,aAAa;AAEnB,QAAM,YAAa,eAAe,OAAO,KAAK,YAAY;AAC1D,QAAM,WACJ,cAAc,OAAO,KAAK,WAAW;AAGvC,QAAM,iBACJ,KAAK,IAAI,mBAAmB,iBAAiB,KAC5C,2BAA2B;AAE9B,MAAI,YAAY;AAEhB,MAAI,MAAM,QAAQ,KAAK,IAAI,GAAG;AAC5B,gBAAY,KAAK,KAAK;AAAA,EACxB,WAAW,OAAO,KAAK,SAAS,YAAY,WAAW;AACrD,UAAM,YAAY;AAAA,MAChB,KAAK;AAAA,MACL;AAAA,IACF;AAEA,QAAI,YAAY,gBAAgB;AAC9B,kBAAY,KAAK,IAAI,KAAK,KAAK,YAAY,cAAc,GAAG,QAAQ;AAAA,IACtE;AAAA,EACF;AAEA,MAAI,uBAAuB;AAC3B,QAAM,cAAe,iBAAiB,OAAO,KAAK,cAAc;AAGhE,MAAI,OAAO,gBAAgB,YAAY,YAAY,SAAS,GAAG;AAC7D,2BAAuB;AACvB,QAAI,WAAW;AACb,YAAM,mBAAmB;AAAA,QACvB;AAAA,QACA;AAAA,MACF;AACA,UAAI,mBAAmB,gBAAgB;AACrC,+BAAuB,KAAK;AAAA,UAC1B,KAAK,KAAK,mBAAmB,cAAc;AAAA,UAC3C;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,SAAO,cAAc,YAAY,uBAAuB,KAAK;AAC/D;",
   "names": []
 }

package/esm/charts/core/components/overlay-tooltip/utils/get-copy-action.js

@@ -7,7 +7,9 @@ const getDefaultAction = (item, accessor, message) => {
   return /* @__PURE__ */ jsxs(
     Item,
     {
-      onSelect: async () => await handleCopyToClipboard(`${item?.[accessor]}`),
+      onSelect: () => {
+        void handleCopyToClipboard(`${item?.[accessor]}`);
+      },
       children: [
         /* @__PURE__ */ jsx(Prefix, { children: /* @__PURE__ */ jsx(CopyIcon, {}) }),
         message

package/esm/charts/core/components/overlay-tooltip/utils/get-copy-action.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/core/components/overlay-tooltip/utils/get-copy-action.tsx"],
-  "sourcesContent": ["import { CopyIcon } from '@dynatrace/strato-icons';\n\nimport { Item } from '../../../../../navigation/menu/Item.js';\nimport { Prefix } from '../../../../../navigation/menu/Prefix.js';\nimport { handleCopyToClipboard } from '../../series-action/utils/handleCopyToClipboard.js';\n\nexport const getDefaultAction = <A extends string>(\n  item: Record<A, unknown>,\n  accessor: A,\n  message: string,\n) => {\n  return (\n    <Item\n      key={`default-action-copy-${accessor}`}\n      onSelect={async () => await handleCopyToClipboard(`${item?.[accessor]}`)}\n    >\n      <Prefix>\n        <CopyIcon />\n      </Prefix>\n      {message}\n    </Item>\n  );\n};\n"],
-  "mappings": "AAYI,SAKI,KALJ;AAZJ,SAAS,gBAAgB;AAEzB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,6BAA6B;AAE/B,MAAM,mBAAmB,CAC9B,MACA,UACA,YACG;AACH,SACE;AAAA,IAAC;AAAA;AAAA,MAEC,UAAU,YAAY,MAAM,sBAAsB,GAAG,OAAO,QAAQ,CAAC,EAAE;AAAA,MAEvE;AAAA,4BAAC,UACC,8BAAC,YAAS,GACZ;AAAA,QACC;AAAA;AAAA;AAAA,IANI,uBAAuB,QAAQ;AAAA,EAOtC;AAEJ;",
+  "sourcesContent": ["import { CopyIcon } from '@dynatrace/strato-icons';\n\nimport { Item } from '../../../../../navigation/menu/Item.js';\nimport { Prefix } from '../../../../../navigation/menu/Prefix.js';\nimport { handleCopyToClipboard } from '../../series-action/utils/handleCopyToClipboard.js';\n\nexport const getDefaultAction = <A extends string>(\n  item: Record<A, unknown>,\n  accessor: A,\n  message: string,\n) => {\n  return (\n    <Item\n      key={`default-action-copy-${accessor}`}\n      onSelect={() => {\n        void handleCopyToClipboard(`${item?.[accessor]}`);\n      }}\n    >\n      <Prefix>\n        <CopyIcon />\n      </Prefix>\n      {message}\n    </Item>\n  );\n};\n"],
+  "mappings": "AAYI,SAOI,KAPJ;AAZJ,SAAS,gBAAgB;AAEzB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,6BAA6B;AAE/B,MAAM,mBAAmB,CAC9B,MACA,UACA,YACG;AACH,SACE;AAAA,IAAC;AAAA;AAAA,MAEC,UAAU,MAAM;AACd,aAAK,sBAAsB,GAAG,OAAO,QAAQ,CAAC,EAAE;AAAA,MAClD;AAAA,MAEA;AAAA,4BAAC,UACC,8BAAC,YAAS,GACZ;AAAA,QACC;AAAA;AAAA;AAAA,IARI,uBAAuB,QAAQ;AAAA,EAStC;AAEJ;",
   "names": []
 }

package/esm/charts/core/components/overlays/ChartOverlaysBorder.css

@@ -1,4 +1,4 @@
-._sw8x1w0-3-5-2 {
+._sw8x1w0-3-7-0 {
   position: absolute;
   top: -0.5px;
   left: -0.5px;
@@ -10,15 +10,15 @@
   border-bottom: none;
   box-sizing: border-box;
 }
-._sw8x1w1-3-5-2 {
+._sw8x1w1-3-7-0 {
   border-left: 1px solid var(--dt-colors-text-neutral-subdued, #595a7d);
 }
-._sw8x1w2-3-5-2 {
+._sw8x1w2-3-7-0 {
   border-right: 1px solid var(--dt-colors-text-neutral-subdued, #595a7d);
 }
-._sw8x1w3-3-5-2 {
+._sw8x1w3-3-7-0 {
   border-bottom: 1px solid var(--dt-colors-text-neutral-subdued, #595a7d);
 }
-._sw8x1w4-3-5-2 {
+._sw8x1w4-3-7-0 {
   border-top: 1px solid var(--dt-colors-text-neutral-subdued, #595a7d);
 }

package/esm/charts/core/components/overlays/ChartOverlaysBorder.sty.js

@@ -1,9 +1,9 @@
 import "./ChartOverlaysBorder.css";
-var chartOverlaysBorder = "_sw8x1w0-3-5-2";
-var chartOverlaysBorder__rightAxis = "_sw8x1w2-3-5-2";
-var chartOverlaysBorder__topAxis = "_sw8x1w4-3-5-2";
-var chartOverlaysBorder__xAxis = "_sw8x1w1-3-5-2";
-var chartOverlaysBorder__yAxis = "_sw8x1w3-3-5-2";
+var chartOverlaysBorder = "_sw8x1w0-3-7-0";
+var chartOverlaysBorder__rightAxis = "_sw8x1w2-3-7-0";
+var chartOverlaysBorder__topAxis = "_sw8x1w4-3-7-0";
+var chartOverlaysBorder__xAxis = "_sw8x1w1-3-7-0";
+var chartOverlaysBorder__yAxis = "_sw8x1w3-3-7-0";
 export {
   chartOverlaysBorder,
   chartOverlaysBorder__rightAxis,

package/esm/charts/core/components/overlays/ChartOverlaysBorder.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/core/components/overlays/ChartOverlaysBorder.css.ts"],
-  "sourcesContent": ["import './ChartOverlaysBorder.css';\nexport var chartOverlaysBorder = '_sw8x1w0-3-5-2';\nexport var chartOverlaysBorder__rightAxis = '_sw8x1w2-3-5-2';\nexport var chartOverlaysBorder__topAxis = '_sw8x1w4-3-5-2';\nexport var chartOverlaysBorder__xAxis = '_sw8x1w1-3-5-2';\nexport var chartOverlaysBorder__yAxis = '_sw8x1w3-3-5-2';"],
+  "sourcesContent": ["import './ChartOverlaysBorder.css';\nexport var chartOverlaysBorder = '_sw8x1w0-3-7-0';\nexport var chartOverlaysBorder__rightAxis = '_sw8x1w2-3-7-0';\nexport var chartOverlaysBorder__topAxis = '_sw8x1w4-3-7-0';\nexport var chartOverlaysBorder__xAxis = '_sw8x1w1-3-7-0';\nexport var chartOverlaysBorder__yAxis = '_sw8x1w3-3-7-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,sBAAsB;AAC1B,IAAI,iCAAiC;AACrC,IAAI,+BAA+B;AACnC,IAAI,6BAA6B;AACjC,IAAI,6BAA6B;",
   "names": []
 }

package/esm/charts/core/components/selection-area/SelectionArea.css

@@ -1,10 +1,10 @@
-._efl7nz0-3-5-2 {
+._efl7nz0-3-7-0 {
   background-color: transparent;
   overflow: visible;
   pointer-events: none;
   z-index: 3;
 }
-._efl7nz1-3-5-2 {
+._efl7nz1-3-7-0 {
   width: 5px;
   height: 40px;
   fill: var(--dt-colors-border-primary-on-accent-default, #f4f4fb);
@@ -15,21 +15,21 @@
   transform-box: stroke-box;
   transition: transform var(--dt-animations-rescale-duration-fast, 170ms) var(--dt-animations-rescale-easing, cubic-bezier(0.4, 0, 0.2, 1));
 }
-._efl7nz1-3-5-2:focus {
+._efl7nz1-3-7-0:focus {
   outline: none;
   stroke-width: 3;
 }
-._efl7nz2-3-5-2 {
+._efl7nz2-3-7-0 {
   width: 15px;
   height: 80px;
   fill: transparent;
   cursor: col-resize;
   touch-action: pan-x;
 }
-._efl7nz2-3-5-2 + .knob--hovered {
+._efl7nz2-3-7-0 + .knob--hovered {
   transform: scaleY(1);
 }
-._efl7nz3-3-5-2 {
+._efl7nz3-3-7-0 {
   fill: var(--dt-colors-background-field-primary-accent, #474fcf);
   stroke: var(--dt-colors-border-primary-accent, #464cce);
   stroke-width: 1;
@@ -37,14 +37,14 @@
   fill-opacity: 0.1;
   touch-action: pan-x;
 }
-._efl7nz3-3-5-2:hover {
+._efl7nz3-3-7-0:hover {
   cursor: move;
 }
-._efl7nz3-3-5-2:focus {
+._efl7nz3-3-7-0:focus {
   outline: none;
   clip-path: unset;
   stroke-width: 3;
 }
-._efl7nz3-3-5-2:focus ~ .knob {
+._efl7nz3-3-7-0:focus ~ .knob {
   stroke-width: 3;
 }

package/esm/charts/core/components/selection-area/SelectionArea.sty.js

@@ -1,9 +1,9 @@
 import "../chart-grid/ChartGrid.css";
 import "./SelectionArea.css";
-var brushOverlay = "_efl7nz0-3-5-2 _13lzg4k0-3-5-2";
-var knob = "_efl7nz1-3-5-2";
-var selectionArea = "_efl7nz3-3-5-2";
-var transparentDraggingArea = "_efl7nz2-3-5-2";
+var brushOverlay = "_efl7nz0-3-7-0 _13lzg4k0-3-7-0";
+var knob = "_efl7nz1-3-7-0";
+var selectionArea = "_efl7nz3-3-7-0";
+var transparentDraggingArea = "_efl7nz2-3-7-0";
 export {
   brushOverlay,
   knob,

package/esm/charts/core/components/selection-area/SelectionArea.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/core/components/selection-area/SelectionArea.css.ts"],
-  "sourcesContent": ["import '../chart-grid/ChartGrid.css';\nimport './SelectionArea.css';\nexport var brushOverlay = '_efl7nz0-3-5-2 _13lzg4k0-3-5-2';\nexport var knob = '_efl7nz1-3-5-2';\nexport var selectionArea = '_efl7nz3-3-5-2';\nexport var transparentDraggingArea = '_efl7nz2-3-5-2';"],
+  "sourcesContent": ["import '../chart-grid/ChartGrid.css';\nimport './SelectionArea.css';\nexport var brushOverlay = '_efl7nz0-3-7-0 _13lzg4k0-3-7-0';\nexport var knob = '_efl7nz1-3-7-0';\nexport var selectionArea = '_efl7nz3-3-7-0';\nexport var transparentDraggingArea = '_efl7nz2-3-7-0';"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACA,IAAI,eAAe;AACnB,IAAI,OAAO;AACX,IAAI,gBAAgB;AACpB,IAAI,0BAA0B;",
   "names": []
 }

package/esm/charts/core/components/series-action/ChartActionsMenu.js

@@ -8,7 +8,15 @@ import { renderMenuActionChildren } from "../../utils/render-menu-action-childre
 const ChartActionsMenu = forwardRef((props, forwardedRef) => {
   const { children, isOpen, actions, defaultActions, onActionClick } = props;
   const customActions = useCustomSeriesActions(actions, isOpen);
-  return /* @__PURE__ */ jsx("div", { onClick: onActionClick, children: /* @__PURE__ */ jsxs(Menu, { open: isOpen, modal: false, children: [
+  const handleClick = (e) => {
+    const isSubmenuTrigger = e.target.closest(
+      '[aria-haspopup="true"]'
+    );
+    if (!isSubmenuTrigger) {
+      onActionClick?.(e);
+    }
+  };
+  return /* @__PURE__ */ jsx("div", { role: "none", onClick: handleClick, children: /* @__PURE__ */ jsxs(Menu, { open: isOpen, modal: false, children: [
     /* @__PURE__ */ jsx(Menu.Trigger, { children }),
     isOpen && /* @__PURE__ */ jsxs(Menu.Content, { ref: forwardedRef, side: "right", children: [
       defaultActions ? renderMenuActionChildren(defaultActions) : null,

package/esm/charts/core/components/series-action/ChartActionsMenu.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/core/components/series-action/ChartActionsMenu.tsx"],
-  "sourcesContent": ["import {\n  forwardRef,\n  MouseEvent as ReactMouseEvent,\n  type PropsWithChildren,\n  type ReactElement,\n} from 'react';\n\nimport { Menu } from '../../../../navigation/menu/Menu.js';\nimport { useCustomSeriesActions } from '../../hooks/useCustomSeriesActions.js';\nimport { renderMenuActionChildren } from '../../utils/render-menu-action-children.js';\n\nexport interface ChartActionsMenuProps {\n  /** Controlled open or closed state */\n  isOpen: boolean;\n  /** Default actions to display **/\n  defaultActions?: ReactElement<PropsWithChildren>;\n  /** Custom series actions to display **/\n  actions?:\n    | ReactElement<PropsWithChildren>\n    | Promise<ReactElement<PropsWithChildren>>;\n  /** Handler for the action click */\n  onActionClick?: (e: ReactMouseEvent) => void;\n}\n\n/**\n * ChartActionsMenu component.\n */\nexport const ChartActionsMenu = forwardRef<\n  HTMLDivElement,\n  PropsWithChildren<ChartActionsMenuProps>\n>((props: PropsWithChildren<ChartActionsMenuProps>, forwardedRef) => {\n  const { children, isOpen, actions, defaultActions, onActionClick } = props;\n  const customActions = useCustomSeriesActions(actions, isOpen);\n\n  return (\n    <div onClick={onActionClick}>\n      <Menu open={isOpen} modal={false}>\n        <Menu.Trigger>{children}</Menu.Trigger>\n        {isOpen && (\n          <Menu.Content ref={forwardedRef} side=\"right\">\n            {defaultActions ? renderMenuActionChildren(defaultActions) : null}\n            {customActions ? (\n              <div data-dt-children-name=\"TooltipSeriesItems\">\n                {renderMenuActionChildren(customActions.props.children)}\n              </div>\n            ) : null}\n          </Menu.Content>\n        )}\n      </Menu>\n    </div>\n  );\n});\n\n(\n  ChartActionsMenu as typeof ChartActionsMenu & { displayName: string }\n).displayName = 'ChartActionsMenu';\n"],
-  "mappings": "AAqCQ,cAEE,YAFF;AArCR;AAAA,EACE;AAAA,OAIK;AAEP,SAAS,YAAY;AACrB,SAAS,8BAA8B;AACvC,SAAS,gCAAgC;AAkBlC,MAAM,mBAAmB,WAG9B,CAAC,OAAiD,iBAAiB;AACnE,QAAM,EAAE,UAAU,QAAQ,SAAS,gBAAgB,cAAc,IAAI;AACrE,QAAM,gBAAgB,uBAAuB,SAAS,MAAM;AAE5D,SACE,oBAAC,SAAI,SAAS,eACZ,+BAAC,QAAK,MAAM,QAAQ,OAAO,OACzB;AAAA,wBAAC,KAAK,SAAL,EAAc,UAAS;AAAA,IACvB,UACC,qBAAC,KAAK,SAAL,EAAa,KAAK,cAAc,MAAK,SACnC;AAAA,uBAAiB,yBAAyB,cAAc,IAAI;AAAA,MAC5D,gBACC,oBAAC,SAAI,yBAAsB,sBACxB,mCAAyB,cAAc,MAAM,QAAQ,GACxD,IACE;AAAA,OACN;AAAA,KAEJ,GACF;AAEJ,CAAC;AAGC,iBACA,cAAc;",
+  "sourcesContent": ["import {\n  forwardRef,\n  MouseEvent as ReactMouseEvent,\n  type PropsWithChildren,\n  type ReactElement,\n} from 'react';\n\nimport { Menu } from '../../../../navigation/menu/Menu.js';\nimport { useCustomSeriesActions } from '../../hooks/useCustomSeriesActions.js';\nimport { renderMenuActionChildren } from '../../utils/render-menu-action-children.js';\n\nexport interface ChartActionsMenuProps {\n  /** Controlled open or closed state */\n  isOpen: boolean;\n  /** Default actions to display **/\n  defaultActions?: ReactElement<PropsWithChildren>;\n  /** Custom series actions to display **/\n  actions?:\n    | ReactElement<PropsWithChildren>\n    | Promise<ReactElement<PropsWithChildren>>;\n  /** Handler for the action click */\n  onActionClick?: (e: ReactMouseEvent) => void;\n}\n\n/**\n * ChartActionsMenu component.\n */\nexport const ChartActionsMenu = forwardRef<\n  HTMLDivElement,\n  PropsWithChildren<ChartActionsMenuProps>\n>((props: PropsWithChildren<ChartActionsMenuProps>, forwardedRef) => {\n  const { children, isOpen, actions, defaultActions, onActionClick } = props;\n  const customActions = useCustomSeriesActions(actions, isOpen);\n\n  const handleClick = (e: ReactMouseEvent<HTMLDivElement>) => {\n    const isSubmenuTrigger = (e.target as HTMLElement).closest(\n      '[aria-haspopup=\"true\"]',\n    );\n    if (!isSubmenuTrigger) {\n      onActionClick?.(e);\n    }\n  };\n\n  return (\n    <div role=\"none\" onClick={handleClick}>\n      <Menu open={isOpen} modal={false}>\n        <Menu.Trigger>{children}</Menu.Trigger>\n        {isOpen && (\n          <Menu.Content ref={forwardedRef} side=\"right\">\n            {defaultActions ? renderMenuActionChildren(defaultActions) : null}\n            {customActions ? (\n              <div data-dt-children-name=\"TooltipSeriesItems\">\n                {renderMenuActionChildren(customActions.props.children)}\n              </div>\n            ) : null}\n          </Menu.Content>\n        )}\n      </Menu>\n    </div>\n  );\n});\n\n(\n  ChartActionsMenu as typeof ChartActionsMenu & { displayName: string }\n).displayName = 'ChartActionsMenu';\n"],
+  "mappings": "AA8CQ,cAEE,YAFF;AA9CR;AAAA,EACE;AAAA,OAIK;AAEP,SAAS,YAAY;AACrB,SAAS,8BAA8B;AACvC,SAAS,gCAAgC;AAkBlC,MAAM,mBAAmB,WAG9B,CAAC,OAAiD,iBAAiB;AACnE,QAAM,EAAE,UAAU,QAAQ,SAAS,gBAAgB,cAAc,IAAI;AACrE,QAAM,gBAAgB,uBAAuB,SAAS,MAAM;AAE5D,QAAM,cAAc,CAAC,MAAuC;AAC1D,UAAM,mBAAoB,EAAE,OAAuB;AAAA,MACjD;AAAA,IACF;AACA,QAAI,CAAC,kBAAkB;AACrB,sBAAgB,CAAC;AAAA,IACnB;AAAA,EACF;AAEA,SACE,oBAAC,SAAI,MAAK,QAAO,SAAS,aACxB,+BAAC,QAAK,MAAM,QAAQ,OAAO,OACzB;AAAA,wBAAC,KAAK,SAAL,EAAc,UAAS;AAAA,IACvB,UACC,qBAAC,KAAK,SAAL,EAAa,KAAK,cAAc,MAAK,SACnC;AAAA,uBAAiB,yBAAyB,cAAc,IAAI;AAAA,MAC5D,gBACC,oBAAC,SAAI,yBAAsB,sBACxB,mCAAyB,cAAc,MAAM,QAAQ,GACxD,IACE;AAAA,OACN;AAAA,KAEJ,GACF;AAEJ,CAAC;AAGC,iBACA,cAAc;",
   "names": []
 }

package/esm/charts/core/components/series-action/ChartActionsMenuAsync.js

@@ -54,9 +54,17 @@ const Content = forwardRef(
       side: "right",
       _sideOffset: ACTIONS_MENU_SIDE_OFFSET
     };
+    const handleClick = (e) => {
+      const isSubmenuTrigger = e.target.closest(
+        '[aria-haspopup="true"]'
+      );
+      if (!isSubmenuTrigger) {
+        onActionSelected?.(e);
+      }
+    };
     return /* @__PURE__ */ jsx(Menu.Content, { ...menuContentProps, children: /* @__PURE__ */ jsxs("div", { ref, style: { width: "100%" }, role: "tooltip", children: [
       /* @__PURE__ */ jsx(Menu.Group, { children: header }),
-      /* @__PURE__ */ jsx("span", { role: "none", onClick: onActionSelected, onKeyDown: noop, children: /* @__PURE__ */ jsxs(Menu.Group, { children: [
+      /* @__PURE__ */ jsx("span", { role: "none", onClick: handleClick, onKeyDown: noop, children: /* @__PURE__ */ jsxs(Menu.Group, { children: [
         defaultActionsMapped,
         customActions && renderMenuActionChildren(customActions.props.children, {
           divideActionsAndIntents: false

package/esm/charts/core/components/series-action/ChartActionsMenuAsync.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/core/components/series-action/ChartActionsMenuAsync.tsx"],
-  "sourcesContent": ["import { noop } from 'lodash-es';\nimport {\n  forwardRef,\n  type MouseEventHandler,\n  type PropsWithChildren,\n  type ComponentProps,\n  type ReactElement,\n  type ReactNode,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Menu } from '../../../../navigation/menu/Menu.js';\nimport { useResolveAsyncComponent } from '../../hooks/useResolveAsyncComponent.js';\nimport { renderMenuActionChildren } from '../../utils/render-menu-action-children.js';\n\ntype ChartActionsMenuAsyncProps = {\n  isOpen: boolean;\n  defaultActions?: ReactNode;\n  header?: ReactElement | null;\n  onActionSelected?: MouseEventHandler<HTMLDivElement>;\n  actions: (() => Promise<ReactElement>) | undefined;\n  delay?: number;\n  hasActions: boolean;\n};\n\nconst ACTIONS_MENU_SIDE_OFFSET = 0;\n\ntype InternalMenuContentProps = ComponentProps<typeof Menu.Content> & {\n  _sideOffset?: number;\n};\n\nexport const ChartActionsMenuAsync = forwardRef<\n  HTMLDivElement,\n  PropsWithChildren<ChartActionsMenuAsyncProps>\n>((props: PropsWithChildren<ChartActionsMenuAsyncProps>, forwardedRef) => {\n  const { children, isOpen, hasActions } = props;\n  if (!hasActions) {\n    return children;\n  }\n\n  return (\n    <Menu open={isOpen} modal={false}>\n      <Menu.Trigger>{children}</Menu.Trigger>\n      <Content {...props} ref={forwardedRef} />\n    </Menu>\n  );\n});\n\nconst Content = forwardRef<HTMLDivElement, ChartActionsMenuAsyncProps>(\n  (props, forwardedRef) => {\n    const {\n      isOpen,\n      actions,\n      defaultActions,\n      onActionSelected,\n      header,\n      delay = 0,\n    } = props;\n    const [shouldRun, setShouldRun] = useState(false);\n    const ref = useRef<HTMLDivElement>(null);\n    const customActions = useResolveAsyncComponent(actions, shouldRun);\n    const defaultActionsMapped =\n      shouldRun && defaultActions\n        ? renderMenuActionChildren(defaultActions)\n        : null;\n\n    useEffect(() => {\n      if (!isOpen) {\n        return;\n      }\n\n      const timer = setTimeout(() => {\n        setShouldRun(true);\n      }, delay);\n\n      return () => {\n        clearTimeout(timer);\n        setShouldRun(false);\n      };\n    }, [isOpen, delay]);\n\n    if (!shouldRun) {\n      return null;\n    }\n\n    const menuContentProps = {\n      ref: forwardedRef,\n      side: 'right',\n      _sideOffset: ACTIONS_MENU_SIDE_OFFSET,\n    } as InternalMenuContentProps;\n\n    return (\n      <Menu.Content {...menuContentProps}>\n        <div ref={ref} style={{ width: '100%' }} role=\"tooltip\">\n          <Menu.Group>{header}</Menu.Group>\n          <span role=\"none\" onClick={onActionSelected} onKeyDown={noop}>\n            <Menu.Group>\n              {defaultActionsMapped}\n              {customActions &&\n                renderMenuActionChildren(customActions.props.children, {\n                  divideActionsAndIntents: false,\n                })}\n            </Menu.Group>\n          </span>\n        </div>\n      </Menu.Content>\n    );\n  },\n);\n"],
-  "mappings": "AA2CI,SACE,KADF;AA3CJ,SAAS,YAAY;AACrB;AAAA,EACE;AAAA,EAMA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,YAAY;AACrB,SAAS,gCAAgC;AACzC,SAAS,gCAAgC;AAYzC,MAAM,2BAA2B;AAM1B,MAAM,wBAAwB,WAGnC,CAAC,OAAsD,iBAAiB;AACxE,QAAM,EAAE,UAAU,QAAQ,WAAW,IAAI;AACzC,MAAI,CAAC,YAAY;AACf,WAAO;AAAA,EACT;AAEA,SACE,qBAAC,QAAK,MAAM,QAAQ,OAAO,OACzB;AAAA,wBAAC,KAAK,SAAL,EAAc,UAAS;AAAA,IACxB,oBAAC,WAAS,GAAG,OAAO,KAAK,cAAc;AAAA,KACzC;AAEJ,CAAC;AAED,MAAM,UAAU;AAAA,EACd,CAAC,OAAO,iBAAiB;AACvB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,IACV,IAAI;AACJ,UAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,UAAM,MAAM,OAAuB,IAAI;AACvC,UAAM,gBAAgB,yBAAyB,SAAS,SAAS;AACjE,UAAM,uBACJ,aAAa,iBACT,yBAAyB,cAAc,IACvC;AAEN,cAAU,MAAM;AACd,UAAI,CAAC,QAAQ;AACX;AAAA,MACF;AAEA,YAAM,QAAQ,WAAW,MAAM;AAC7B,qBAAa,IAAI;AAAA,MACnB,GAAG,KAAK;AAER,aAAO,MAAM;AACX,qBAAa,KAAK;AAClB,qBAAa,KAAK;AAAA,MACpB;AAAA,IACF,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,QAAI,CAAC,WAAW;AACd,aAAO;AAAA,IACT;AAEA,UAAM,mBAAmB;AAAA,MACvB,KAAK;AAAA,MACL,MAAM;AAAA,MACN,aAAa;AAAA,IACf;AAEA,WACE,oBAAC,KAAK,SAAL,EAAc,GAAG,kBAChB,+BAAC,SAAI,KAAU,OAAO,EAAE,OAAO,OAAO,GAAG,MAAK,WAC5C;AAAA,0BAAC,KAAK,OAAL,EAAY,kBAAO;AAAA,MACpB,oBAAC,UAAK,MAAK,QAAO,SAAS,kBAAkB,WAAW,MACtD,+BAAC,KAAK,OAAL,EACE;AAAA;AAAA,QACA,iBACC,yBAAyB,cAAc,MAAM,UAAU;AAAA,UACrD,yBAAyB;AAAA,QAC3B,CAAC;AAAA,SACL,GACF;AAAA,OACF,GACF;AAAA,EAEJ;AACF;",
+  "sourcesContent": ["import { noop } from 'lodash-es';\nimport {\n  forwardRef,\n  type MouseEvent as ReactMouseEvent,\n  type MouseEventHandler,\n  type PropsWithChildren,\n  type ComponentProps,\n  type ReactElement,\n  type ReactNode,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Menu } from '../../../../navigation/menu/Menu.js';\nimport { useResolveAsyncComponent } from '../../hooks/useResolveAsyncComponent.js';\nimport { renderMenuActionChildren } from '../../utils/render-menu-action-children.js';\n\ntype ChartActionsMenuAsyncProps = {\n  isOpen: boolean;\n  defaultActions?: ReactNode;\n  header?: ReactElement | null;\n  onActionSelected?: MouseEventHandler<HTMLDivElement>;\n  actions: (() => Promise<ReactElement>) | undefined;\n  delay?: number;\n  hasActions: boolean;\n};\n\nconst ACTIONS_MENU_SIDE_OFFSET = 0;\n\ntype InternalMenuContentProps = ComponentProps<typeof Menu.Content> & {\n  _sideOffset?: number;\n};\n\nexport const ChartActionsMenuAsync = forwardRef<\n  HTMLDivElement,\n  PropsWithChildren<ChartActionsMenuAsyncProps>\n>((props: PropsWithChildren<ChartActionsMenuAsyncProps>, forwardedRef) => {\n  const { children, isOpen, hasActions } = props;\n  if (!hasActions) {\n    return children;\n  }\n\n  return (\n    <Menu open={isOpen} modal={false}>\n      <Menu.Trigger>{children}</Menu.Trigger>\n      <Content {...props} ref={forwardedRef} />\n    </Menu>\n  );\n});\n\nconst Content = forwardRef<HTMLDivElement, ChartActionsMenuAsyncProps>(\n  (props, forwardedRef) => {\n    const {\n      isOpen,\n      actions,\n      defaultActions,\n      onActionSelected,\n      header,\n      delay = 0,\n    } = props;\n    const [shouldRun, setShouldRun] = useState(false);\n    const ref = useRef<HTMLDivElement>(null);\n    const customActions = useResolveAsyncComponent(actions, shouldRun);\n    const defaultActionsMapped =\n      shouldRun && defaultActions\n        ? renderMenuActionChildren(defaultActions)\n        : null;\n\n    useEffect(() => {\n      if (!isOpen) {\n        return;\n      }\n\n      const timer = setTimeout(() => {\n        setShouldRun(true);\n      }, delay);\n\n      return () => {\n        clearTimeout(timer);\n        setShouldRun(false);\n      };\n    }, [isOpen, delay]);\n\n    if (!shouldRun) {\n      return null;\n    }\n\n    const menuContentProps = {\n      ref: forwardedRef,\n      side: 'right',\n      _sideOffset: ACTIONS_MENU_SIDE_OFFSET,\n    } as InternalMenuContentProps;\n\n    const handleClick = (e: ReactMouseEvent<HTMLSpanElement>) => {\n      const isSubmenuTrigger = (e.target as HTMLElement).closest(\n        '[aria-haspopup=\"true\"]',\n      );\n      if (!isSubmenuTrigger) {\n        onActionSelected?.(e as unknown as ReactMouseEvent<HTMLDivElement>);\n      }\n    };\n\n    return (\n      <Menu.Content {...menuContentProps}>\n        <div ref={ref} style={{ width: '100%' }} role=\"tooltip\">\n          <Menu.Group>{header}</Menu.Group>\n          <span role=\"none\" onClick={handleClick} onKeyDown={noop}>\n            <Menu.Group>\n              {defaultActionsMapped}\n              {customActions &&\n                renderMenuActionChildren(customActions.props.children, {\n                  divideActionsAndIntents: false,\n                })}\n            </Menu.Group>\n          </span>\n        </div>\n      </Menu.Content>\n    );\n  },\n);\n"],
+  "mappings": "AA4CI,SACE,KADF;AA5CJ,SAAS,YAAY;AACrB;AAAA,EACE;AAAA,EAOA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,YAAY;AACrB,SAAS,gCAAgC;AACzC,SAAS,gCAAgC;AAYzC,MAAM,2BAA2B;AAM1B,MAAM,wBAAwB,WAGnC,CAAC,OAAsD,iBAAiB;AACxE,QAAM,EAAE,UAAU,QAAQ,WAAW,IAAI;AACzC,MAAI,CAAC,YAAY;AACf,WAAO;AAAA,EACT;AAEA,SACE,qBAAC,QAAK,MAAM,QAAQ,OAAO,OACzB;AAAA,wBAAC,KAAK,SAAL,EAAc,UAAS;AAAA,IACxB,oBAAC,WAAS,GAAG,OAAO,KAAK,cAAc;AAAA,KACzC;AAEJ,CAAC;AAED,MAAM,UAAU;AAAA,EACd,CAAC,OAAO,iBAAiB;AACvB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,IACV,IAAI;AACJ,UAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,UAAM,MAAM,OAAuB,IAAI;AACvC,UAAM,gBAAgB,yBAAyB,SAAS,SAAS;AACjE,UAAM,uBACJ,aAAa,iBACT,yBAAyB,cAAc,IACvC;AAEN,cAAU,MAAM;AACd,UAAI,CAAC,QAAQ;AACX;AAAA,MACF;AAEA,YAAM,QAAQ,WAAW,MAAM;AAC7B,qBAAa,IAAI;AAAA,MACnB,GAAG,KAAK;AAER,aAAO,MAAM;AACX,qBAAa,KAAK;AAClB,qBAAa,KAAK;AAAA,MACpB;AAAA,IACF,GAAG,CAAC,QAAQ,KAAK,CAAC;AAElB,QAAI,CAAC,WAAW;AACd,aAAO;AAAA,IACT;AAEA,UAAM,mBAAmB;AAAA,MACvB,KAAK;AAAA,MACL,MAAM;AAAA,MACN,aAAa;AAAA,IACf;AAEA,UAAM,cAAc,CAAC,MAAwC;AAC3D,YAAM,mBAAoB,EAAE,OAAuB;AAAA,QACjD;AAAA,MACF;AACA,UAAI,CAAC,kBAAkB;AACrB,2BAAmB,CAA+C;AAAA,MACpE;AAAA,IACF;AAEA,WACE,oBAAC,KAAK,SAAL,EAAc,GAAG,kBAChB,+BAAC,SAAI,KAAU,OAAO,EAAE,OAAO,OAAO,GAAG,MAAK,WAC5C;AAAA,0BAAC,KAAK,OAAL,EAAY,kBAAO;AAAA,MACpB,oBAAC,UAAK,MAAK,QAAO,SAAS,aAAa,WAAW,MACjD,+BAAC,KAAK,OAAL,EACE;AAAA;AAAA,QACA,iBACC,yBAAyB,cAAc,MAAM,UAAU;AAAA,UACrD,yBAAyB;AAAA,QAC3B,CAAC;AAAA,SACL,GACF;AAAA,OACF,GACF;AAAA,EAEJ;AACF;",
   "names": []
 }

package/esm/charts/core/components/series-action/hooks/useDefaultAction.js

@@ -9,7 +9,9 @@ const getDefaultAction = (item) => {
     ChartSeriesAction.Item,
     {
       "data-dt-children-name": "TooltipCopyName",
-      onSelect: async () => await handleCopyToClipboard(item?.name),
+      onSelect: () => {
+        void handleCopyToClipboard(item?.name);
+      },
       children: [
         /* @__PURE__ */ jsx(ChartSeriesAction.ItemIcon, { children: /* @__PURE__ */ jsx(CopyIcon, {}) }),
         /* @__PURE__ */ jsx(FormattedMessage, { ...COPY_TO_CLIPBOARD_MESSAGES.copyActionName })

package/esm/charts/core/components/series-action/hooks/useDefaultAction.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/core/components/series-action/hooks/useDefaultAction.tsx"],
-  "sourcesContent": ["import { FormattedMessage } from 'react-intl';\n\nimport { CopyIcon } from '@dynatrace/strato-icons';\n\nimport { COPY_TO_CLIPBOARD_MESSAGES } from '../../copy-to-clipboard/copy-to-clipboard-messages.js';\nimport { ChartSeriesAction } from '../ChartSeriesAction.js';\nimport { handleCopyToClipboard } from '../utils/handleCopyToClipboard.js';\n\nexport const getDefaultAction = (item: { name: string | string[] }) => {\n  return (\n    <ChartSeriesAction.Item\n      key=\"default-action\"\n      data-dt-children-name=\"TooltipCopyName\"\n      onSelect={async () => await handleCopyToClipboard(item?.name)}\n    >\n      <ChartSeriesAction.ItemIcon>\n        <CopyIcon />\n      </ChartSeriesAction.ItemIcon>\n      <FormattedMessage {...COPY_TO_CLIPBOARD_MESSAGES.copyActionName} />\n    </ChartSeriesAction.Item>\n  );\n};\n"],
-  "mappings": "AAUI,SAMI,KANJ;AAVJ,SAAS,wBAAwB;AAEjC,SAAS,gBAAgB;AAEzB,SAAS,kCAAkC;AAC3C,SAAS,yBAAyB;AAClC,SAAS,6BAA6B;AAE/B,MAAM,mBAAmB,CAAC,SAAsC;AACrE,SACE;AAAA,IAAC,kBAAkB;AAAA,IAAlB;AAAA,MAEC,yBAAsB;AAAA,MACtB,UAAU,YAAY,MAAM,sBAAsB,MAAM,IAAI;AAAA,MAE5D;AAAA,4BAAC,kBAAkB,UAAlB,EACC,8BAAC,YAAS,GACZ;AAAA,QACA,oBAAC,oBAAkB,GAAG,2BAA2B,gBAAgB;AAAA;AAAA;AAAA,IAP7D;AAAA,EAQN;AAEJ;",
+  "sourcesContent": ["import { FormattedMessage } from 'react-intl';\n\nimport { CopyIcon } from '@dynatrace/strato-icons';\n\nimport { COPY_TO_CLIPBOARD_MESSAGES } from '../../copy-to-clipboard/copy-to-clipboard-messages.js';\nimport { ChartSeriesAction } from '../ChartSeriesAction.js';\nimport { handleCopyToClipboard } from '../utils/handleCopyToClipboard.js';\n\nexport const getDefaultAction = (item: { name: string | string[] }) => {\n  return (\n    <ChartSeriesAction.Item\n      key=\"default-action\"\n      data-dt-children-name=\"TooltipCopyName\"\n      onSelect={() => {\n        void handleCopyToClipboard(item?.name);\n      }}\n    >\n      <ChartSeriesAction.ItemIcon>\n        <CopyIcon />\n      </ChartSeriesAction.ItemIcon>\n      <FormattedMessage {...COPY_TO_CLIPBOARD_MESSAGES.copyActionName} />\n    </ChartSeriesAction.Item>\n  );\n};\n"],
+  "mappings": "AAUI,SAQI,KARJ;AAVJ,SAAS,wBAAwB;AAEjC,SAAS,gBAAgB;AAEzB,SAAS,kCAAkC;AAC3C,SAAS,yBAAyB;AAClC,SAAS,6BAA6B;AAE/B,MAAM,mBAAmB,CAAC,SAAsC;AACrE,SACE;AAAA,IAAC,kBAAkB;AAAA,IAAlB;AAAA,MAEC,yBAAsB;AAAA,MACtB,UAAU,MAAM;AACd,aAAK,sBAAsB,MAAM,IAAI;AAAA,MACvC;AAAA,MAEA;AAAA,4BAAC,kBAAkB,UAAlB,EACC,8BAAC,YAAS,GACZ;AAAA,QACA,oBAAC,oBAAkB,GAAG,2BAA2B,gBAAgB;AAAA;AAAA;AAAA,IAT7D;AAAA,EAUN;AAEJ;",
   "names": []
 }

package/esm/charts/core/components/shape/BubbleShape/BubbleShape.css

@@ -1,18 +1,18 @@
-._hctkb30-3-5-2 {
+._hctkb30-3-7-0 {
   border-radius: 50%;
 }
-._hctkb31-3-5-2 {
+._hctkb31-3-7-0 {
   border: 1px solid var(--dt-colors-text-neutral-default, #2f2f4f);
 }
-._hctkb32-3-5-2 {
+._hctkb32-3-7-0 {
   border: none;
 }
-._hctkb33-3-5-2 {
+._hctkb33-3-7-0 {
   border-width: 1px;
   border-style: solid;
   border-radius: 50%;
 }
-._hctkb34-3-5-2 {
+._hctkb34-3-7-0 {
   height: 8px;
   width: 8px;
   border-radius: 50%;

package/esm/charts/core/components/shape/BubbleShape/BubbleShape.sty.js

@@ -1,8 +1,8 @@
 import "./BubbleShape.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var bubble = "_hctkb34-3-5-2";
-var bubbleBorder = "_hctkb33-3-5-2";
-var bubbleOutline = _7a468({ defaultClassName: "_hctkb30-3-5-2", variantClassNames: { active: { true: "_hctkb31-3-5-2", false: "_hctkb32-3-5-2" } }, defaultVariants: {}, compoundVariants: [] });
+var bubble = "_hctkb34-3-7-0";
+var bubbleBorder = "_hctkb33-3-7-0";
+var bubbleOutline = _7a468({ defaultClassName: "_hctkb30-3-7-0", variantClassNames: { active: { true: "_hctkb31-3-7-0", false: "_hctkb32-3-7-0" } }, defaultVariants: {}, compoundVariants: [] });
 export {
   bubble,
   bubbleBorder,