@dynatrace/strato-components 3.5.2 → 3.7.0

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/core/components/overlay-tooltip/components/DynamicTooltip.tsx"],
-  "sourcesContent": ["import { type PropsWithChildren, useCallback, useEffect, useMemo } from 'react';\n\nimport { TooltipPortal } from './TooltipPortal.js';\nimport { useThrottledCallbackOnResize } from '../../../hooks/useThrottledCallbackOnResize.js';\nimport { useThrottledCallbackOnScroll } from '../../../hooks/useThrottledCallbackOnScroll.js';\nimport { throttleRaf } from '../../../utils/throttleRaf.js';\nimport { useOverlay } from '../contexts/OverlayContext.js';\nimport { useTooltip } from '../contexts/TooltipContext.js';\nimport { useTooltipReducer } from '../useTooltipReducer.js';\n\nexport const DynamicTooltip = (\n  props: PropsWithChildren<{\n    pinned: boolean;\n    absoluteX: number;\n    absoluteY: number;\n  }>,\n) => {\n  const { absoluteX, absoluteY, pinned } = props;\n  const overlay = useOverlay();\n  const dispatch = useTooltipReducer();\n  const tooltip = useTooltip();\n\n  const onEscapeKeyPressedHandler = useCallback((event: KeyboardEvent) => {\n    if (event.key === 'Escape') {\n      dispatch({ type: 'RESET_TOOLTIP' })();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    window.addEventListener('keyup', onEscapeKeyPressedHandler);\n    return () => {\n      window.removeEventListener('keyup', onEscapeKeyPressedHandler);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useThrottledCallbackOnScroll(false, () => {\n    if (!overlay.overlayRef.current) {\n      return;\n    }\n\n    if (tooltip.getState().pinned) {\n      dispatch({\n        type: 'UPDATE_POSITION',\n        payload: { type: 'non-resize', scroll: true },\n      })();\n      return;\n    }\n\n    dispatch({ type: 'SET_OUT_BOUNDS' })();\n  });\n\n  useThrottledCallbackOnResize(\n    overlay.overlayRef,\n    dispatch({ type: 'UPDATE_POSITION', payload: { type: 'resize' } }),\n    !pinned,\n  );\n\n  const pointerMoveCallback = useMemo(\n    () =>\n      throttleRaf((event: PointerEvent) => {\n        if (event.pressure && tooltip.getState().pinned) {\n          if (\n            !overlay.overlayRef.current ||\n            overlay.overlayRef.current.contains(event.target as Node)\n          ) {\n            return;\n          }\n          dispatch({\n            type: 'UPDATE_POSITION',\n            payload: { type: 'non-resize' },\n          })();\n          return;\n        }\n      }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [],\n  );\n\n  const pointerUpCallback = useMemo(\n    () =>\n      throttleRaf((event: PointerEvent) => {\n        if (tooltip.getState().pinned) {\n          if (\n            !overlay.overlayRef.current ||\n            overlay.overlayRef.current.contains(event.target as Node)\n          ) {\n            return;\n          }\n          dispatch({\n            type: 'UPDATE_POSITION',\n            payload: { type: 'non-resize' },\n          })();\n          return;\n        }\n      }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [],\n  );\n\n  useEffect(() => {\n    if (!pinned || !overlay.overlayRef.current) {\n      return;\n    }\n    window.addEventListener('pointermove', pointerMoveCallback);\n    window.addEventListener('pointerup', pointerUpCallback);\n\n    return () => {\n      window.removeEventListener('pointermove', pointerMoveCallback);\n      window.removeEventListener('pointerup', pointerUpCallback);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [pinned]);\n\n  return (\n    <TooltipPortal\n      isInteractive={pinned}\n      absoluteX={absoluteX}\n      absoluteY={absoluteY}\n      onMouseLeave={dispatch({ type: 'TOOLTIP_MOUSE_LEAVE' })}\n      onScrollCapture={() => dispatch({ type: 'TOOLTIP_MOUSE_LEAVE' })}\n    >\n      {props.children}\n    </TooltipPortal>\n  );\n};\n"],
-  "mappings": "AAoHI;AApHJ,SAAiC,aAAa,WAAW,eAAe;AAExE,SAAS,qBAAqB;AAC9B,SAAS,oCAAoC;AAC7C,SAAS,oCAAoC;AAC7C,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB;AAC3B,SAAS,yBAAyB;AAE3B,MAAM,iBAAiB,CAC5B,UAKG;AACH,QAAM,EAAE,WAAW,WAAW,OAAO,IAAI;AACzC,QAAM,UAAU,WAAW;AAC3B,QAAM,WAAW,kBAAkB;AACnC,QAAM,UAAU,WAAW;AAE3B,QAAM,4BAA4B,YAAY,CAAC,UAAyB;AACtE,QAAI,MAAM,QAAQ,UAAU;AAC1B,eAAS,EAAE,MAAM,gBAAgB,CAAC,EAAE;AAAA,IACtC;AAAA,EAEF,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,WAAO,iBAAiB,SAAS,yBAAyB;AAC1D,WAAO,MAAM;AACX,aAAO,oBAAoB,SAAS,yBAAyB;AAAA,IAC/D;AAAA,EAEF,GAAG,CAAC,CAAC;AAEL,+BAA6B,OAAO,MAAM;AACxC,QAAI,CAAC,QAAQ,WAAW,SAAS;AAC/B;AAAA,IACF;AAEA,QAAI,QAAQ,SAAS,EAAE,QAAQ;AAC7B,eAAS;AAAA,QACP,MAAM;AAAA,QACN,SAAS,EAAE,MAAM,cAAc,QAAQ,KAAK;AAAA,MAC9C,CAAC,EAAE;AACH;AAAA,IACF;AAEA,aAAS,EAAE,MAAM,iBAAiB,CAAC,EAAE;AAAA,EACvC,CAAC;AAED;AAAA,IACE,QAAQ;AAAA,IACR,SAAS,EAAE,MAAM,mBAAmB,SAAS,EAAE,MAAM,SAAS,EAAE,CAAC;AAAA,IACjE,CAAC;AAAA,EACH;AAEA,QAAM,sBAAsB;AAAA,IAC1B,MACE,YAAY,CAAC,UAAwB;AACnC,UAAI,MAAM,YAAY,QAAQ,SAAS,EAAE,QAAQ;AAC/C,YACE,CAAC,QAAQ,WAAW,WACpB,QAAQ,WAAW,QAAQ,SAAS,MAAM,MAAc,GACxD;AACA;AAAA,QACF;AACA,iBAAS;AAAA,UACP,MAAM;AAAA,UACN,SAAS,EAAE,MAAM,aAAa;AAAA,QAChC,CAAC,EAAE;AACH;AAAA,MACF;AAAA,IACF,CAAC;AAAA;AAAA,IAEH,CAAC;AAAA,EACH;AAEA,QAAM,oBAAoB;AAAA,IACxB,MACE,YAAY,CAAC,UAAwB;AACnC,UAAI,QAAQ,SAAS,EAAE,QAAQ;AAC7B,YACE,CAAC,QAAQ,WAAW,WACpB,QAAQ,WAAW,QAAQ,SAAS,MAAM,MAAc,GACxD;AACA;AAAA,QACF;AACA,iBAAS;AAAA,UACP,MAAM;AAAA,UACN,SAAS,EAAE,MAAM,aAAa;AAAA,QAChC,CAAC,EAAE;AACH;AAAA,MACF;AAAA,IACF,CAAC;AAAA;AAAA,IAEH,CAAC;AAAA,EACH;AAEA,YAAU,MAAM;AACd,QAAI,CAAC,UAAU,CAAC,QAAQ,WAAW,SAAS;AAC1C;AAAA,IACF;AACA,WAAO,iBAAiB,eAAe,mBAAmB;AAC1D,WAAO,iBAAiB,aAAa,iBAAiB;AAEtD,WAAO,MAAM;AACX,aAAO,oBAAoB,eAAe,mBAAmB;AAC7D,aAAO,oBAAoB,aAAa,iBAAiB;AAAA,IAC3D;AAAA,EAEF,GAAG,CAAC,MAAM,CAAC;AAEX,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAe;AAAA,MACf;AAAA,MACA;AAAA,MACA,cAAc,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAAA,MACtD,iBAAiB,MAAM,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAAA,MAE9D,gBAAM;AAAA;AAAA,EACT;AAEJ;",
+  "sourcesContent": ["import {\n  type PropsWithChildren,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n} from 'react';\n\nimport { TooltipPortal } from './TooltipPortal.js';\nimport { useThrottledCallbackOnResize } from '../../../hooks/useThrottledCallbackOnResize.js';\nimport { useThrottledCallbackOnScroll } from '../../../hooks/useThrottledCallbackOnScroll.js';\nimport { throttleRaf } from '../../../utils/throttleRaf.js';\nimport { useOverlay } from '../contexts/OverlayContext.js';\nimport { useTooltip } from '../contexts/TooltipContext.js';\nimport { useTooltipReducer } from '../useTooltipReducer.js';\n\nexport const DynamicTooltip = (\n  props: PropsWithChildren<{\n    pinned: boolean;\n    absoluteX: number;\n    absoluteY: number;\n  }>,\n) => {\n  const { absoluteX, absoluteY, pinned } = props;\n  const overlay = useOverlay();\n  const dispatch = useTooltipReducer();\n  const tooltip = useTooltip();\n  const suppressNextMoveRef = useRef(false);\n\n  const onEscapeKeyPressedHandler = useCallback((event: KeyboardEvent) => {\n    if (event.key === 'Escape') {\n      dispatch({ type: 'RESET_TOOLTIP' })();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useEffect(() => {\n    window.addEventListener('keyup', onEscapeKeyPressedHandler);\n    return () => {\n      window.removeEventListener('keyup', onEscapeKeyPressedHandler);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useThrottledCallbackOnScroll(false, () => {\n    if (!overlay.overlayRef.current) {\n      return;\n    }\n\n    if (tooltip.getState().pinned) {\n      dispatch({\n        type: 'UPDATE_POSITION',\n        payload: { type: 'non-resize', scroll: true },\n      })();\n      return;\n    }\n\n    dispatch({ type: 'SET_OUT_BOUNDS' })();\n  });\n\n  useThrottledCallbackOnResize(\n    overlay.overlayRef,\n    dispatch({ type: 'UPDATE_POSITION', payload: { type: 'resize' } }),\n    !pinned,\n  );\n\n  const pointerMoveCallback = useMemo(\n    () =>\n      throttleRaf((event: PointerEvent) => {\n        if (suppressNextMoveRef.current) {\n          suppressNextMoveRef.current = false;\n          return;\n        }\n        if (event.pressure && tooltip.getState().pinned) {\n          if (\n            !overlay.overlayRef.current ||\n            overlay.overlayRef.current.contains(event.target as Node)\n          ) {\n            return;\n          }\n          dispatch({\n            type: 'UPDATE_POSITION',\n            payload: { type: 'non-resize' },\n          })();\n          return;\n        }\n      }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [],\n  );\n\n  const pointerUpCallback = useMemo(\n    () =>\n      throttleRaf((event: PointerEvent) => {\n        if (tooltip.getState().pinned) {\n          if (\n            !overlay.overlayRef.current ||\n            overlay.overlayRef.current.contains(event.target as Node)\n          ) {\n            return;\n          }\n          dispatch({\n            type: 'UPDATE_POSITION',\n            payload: { type: 'non-resize' },\n          })();\n          return;\n        }\n      }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [],\n  );\n\n  useEffect(() => {\n    if (!pinned || !overlay.overlayRef.current) {\n      return;\n    }\n    suppressNextMoveRef.current = true;\n    window.addEventListener('pointermove', pointerMoveCallback);\n    window.addEventListener('pointerup', pointerUpCallback);\n\n    return () => {\n      window.removeEventListener('pointermove', pointerMoveCallback);\n      window.removeEventListener('pointerup', pointerUpCallback);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [pinned]);\n\n  return (\n    <TooltipPortal\n      isInteractive={pinned}\n      absoluteX={absoluteX}\n      absoluteY={absoluteY}\n      onMouseLeave={dispatch({ type: 'TOOLTIP_MOUSE_LEAVE' })}\n      onScrollCapture={() => dispatch({ type: 'TOOLTIP_MOUSE_LEAVE' })}\n    >\n      {props.children}\n    </TooltipPortal>\n  );\n};\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/charts/core/components/overlay-tooltip/components/DynamicTooltipRenderer.js

@@ -17,8 +17,13 @@ const DynamicTooltipRenderer = (props) => {
   if (!inBounds || isNull(absoluteX) || isNull(absoluteY) || isTooltipDataEmpty(data)) {
     return;
   }
+  const { config, content } = buildContent(props.children, defaultConfig, {
+    userSymbolPosition: props.symbolAlignment,
+    userTruncationMode: props.truncation ?? DEFAULT_TRUNCATION_MODE,
+    customTooltip: !!props.legacyTemplate
+  });
   if (props.legacyTemplate) {
-    return /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx(ExternalConfigContext.Provider, { value: config, children: /* @__PURE__ */ jsx(
       LegacyTemplateTooltip,
       {
         pinned,
@@ -26,12 +31,8 @@ const DynamicTooltipRenderer = (props) => {
         absoluteY,
         children: props.legacyTemplate
       }
-    );
+    ) });
   }
-  const { config, content } = buildContent(props.children, defaultConfig, {
-    userSymbolPosition: props.symbolAlignment,
-    userTruncationMode: props.truncation ?? DEFAULT_TRUNCATION_MODE
-  });
   return /* @__PURE__ */ jsx(DynamicTooltip, { pinned, absoluteX, absoluteY, children: /* @__PURE__ */ jsx(ExternalConfigContext.Provider, { value: config, children: content }) });
 };
 export {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/core/components/overlay-tooltip/components/DynamicTooltipRenderer.tsx"],
-  "sourcesContent": ["import { isNull } from 'lodash-es';\nimport { type PropsWithChildren } from 'react';\n\nimport { DynamicTooltip } from './DynamicTooltip.js';\nimport { LegacyTemplateTooltip } from '../components/LegacyTemplateTooltip.js';\nimport { DEFAULT_TRUNCATION_MODE } from '../constants.js';\nimport { ExternalConfigContext } from '../contexts/ExternalConfigContext.js';\nimport { useDefaultConfig } from '../hooks/useDefaultConfig.js';\nimport { useSelector, useTooltipSnapshot } from '../selectors.js';\nimport type { OverlayTooltipProps } from '../types.js';\nimport { buildContent } from '../utils/build-content.js';\nimport { isTooltipDataEmpty } from '../utils.js';\n\nexport const DynamicTooltipRenderer = (\n  props: PropsWithChildren<OverlayTooltipProps>,\n) => {\n  useSelector(\n    ({ absoluteX, absoluteY, inBounds, pinned }) =>\n      `${absoluteX}-${absoluteY}-${inBounds}-${pinned}`,\n  );\n  const { absoluteX, absoluteY, inBounds, pinned, data } = useTooltipSnapshot();\n  const defaultConfig = useDefaultConfig();\n\n  if (\n    !inBounds ||\n    isNull(absoluteX) ||\n    isNull(absoluteY) ||\n    isTooltipDataEmpty(data)\n  ) {\n    return;\n  }\n  if (props.legacyTemplate) {\n    return (\n      <LegacyTemplateTooltip\n        pinned={pinned}\n        absoluteX={absoluteX}\n        absoluteY={absoluteY}\n      >\n        {props.legacyTemplate}\n      </LegacyTemplateTooltip>\n    );\n  }\n  const { config, content } = buildContent(props.children, defaultConfig, {\n    userSymbolPosition: props.symbolAlignment,\n    userTruncationMode: props.truncation ?? DEFAULT_TRUNCATION_MODE,\n  });\n  return (\n    <DynamicTooltip pinned={pinned} absoluteX={absoluteX} absoluteY={absoluteY}>\n      <ExternalConfigContext.Provider value={config}>\n        {content}\n      </ExternalConfigContext.Provider>\n    </DynamicTooltip>\n  );\n};\n"],
-  "mappings": "AAiCM;AAjCN,SAAS,cAAc;AAGvB,SAAS,sBAAsB;AAC/B,SAAS,6BAA6B;AACtC,SAAS,+BAA+B;AACxC,SAAS,6BAA6B;AACtC,SAAS,wBAAwB;AACjC,SAAS,aAAa,0BAA0B;AAEhD,SAAS,oBAAoB;AAC7B,SAAS,0BAA0B;AAE5B,MAAM,yBAAyB,CACpC,UACG;AACH;AAAA,IACE,CAAC,EAAE,WAAAA,YAAW,WAAAC,YAAW,UAAAC,WAAU,QAAAC,QAAO,MACxC,GAAGH,UAAS,IAAIC,UAAS,IAAIC,SAAQ,IAAIC,OAAM;AAAA,EACnD;AACA,QAAM,EAAE,WAAW,WAAW,UAAU,QAAQ,KAAK,IAAI,mBAAmB;AAC5E,QAAM,gBAAgB,iBAAiB;AAEvC,MACE,CAAC,YACD,OAAO,SAAS,KAChB,OAAO,SAAS,KAChB,mBAAmB,IAAI,GACvB;AACA;AAAA,EACF;AACA,MAAI,MAAM,gBAAgB;AACxB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QAEC,gBAAM;AAAA;AAAA,IACT;AAAA,EAEJ;AACA,QAAM,EAAE,QAAQ,QAAQ,IAAI,aAAa,MAAM,UAAU,eAAe;AAAA,IACtE,oBAAoB,MAAM;AAAA,IAC1B,oBAAoB,MAAM,cAAc;AAAA,EAC1C,CAAC;AACD,SACE,oBAAC,kBAAe,QAAgB,WAAsB,WACpD,8BAAC,sBAAsB,UAAtB,EAA+B,OAAO,QACpC,mBACH,GACF;AAEJ;",
+  "sourcesContent": ["import { isNull } from 'lodash-es';\nimport { type PropsWithChildren } from 'react';\n\nimport { DynamicTooltip } from './DynamicTooltip.js';\nimport { LegacyTemplateTooltip } from '../components/LegacyTemplateTooltip.js';\nimport { DEFAULT_TRUNCATION_MODE } from '../constants.js';\nimport { ExternalConfigContext } from '../contexts/ExternalConfigContext.js';\nimport { useDefaultConfig } from '../hooks/useDefaultConfig.js';\nimport { useSelector, useTooltipSnapshot } from '../selectors.js';\nimport type { OverlayTooltipProps } from '../types.js';\nimport { buildContent } from '../utils/build-content.js';\nimport { isTooltipDataEmpty } from '../utils.js';\n\nexport const DynamicTooltipRenderer = (\n  props: PropsWithChildren<OverlayTooltipProps>,\n) => {\n  useSelector(\n    ({ absoluteX, absoluteY, inBounds, pinned }) =>\n      `${absoluteX}-${absoluteY}-${inBounds}-${pinned}`,\n  );\n  const { absoluteX, absoluteY, inBounds, pinned, data } = useTooltipSnapshot();\n  const defaultConfig = useDefaultConfig();\n\n  if (\n    !inBounds ||\n    isNull(absoluteX) ||\n    isNull(absoluteY) ||\n    isTooltipDataEmpty(data)\n  ) {\n    return;\n  }\n  const { config, content } = buildContent(props.children, defaultConfig, {\n    userSymbolPosition: props.symbolAlignment,\n    userTruncationMode: props.truncation ?? DEFAULT_TRUNCATION_MODE,\n    customTooltip: !!props.legacyTemplate,\n  });\n\n  if (props.legacyTemplate) {\n    return (\n      <ExternalConfigContext.Provider value={config}>\n        <LegacyTemplateTooltip\n          pinned={pinned}\n          absoluteX={absoluteX}\n          absoluteY={absoluteY}\n        >\n          {props.legacyTemplate}\n        </LegacyTemplateTooltip>\n      </ExternalConfigContext.Provider>\n    );\n  }\n  return (\n    <DynamicTooltip pinned={pinned} absoluteX={absoluteX} absoluteY={absoluteY}>\n      <ExternalConfigContext.Provider value={config}>\n        {content}\n      </ExternalConfigContext.Provider>\n    </DynamicTooltip>\n  );\n};\n"],
+  "mappings": "AAwCQ;AAxCR,SAAS,cAAc;AAGvB,SAAS,sBAAsB;AAC/B,SAAS,6BAA6B;AACtC,SAAS,+BAA+B;AACxC,SAAS,6BAA6B;AACtC,SAAS,wBAAwB;AACjC,SAAS,aAAa,0BAA0B;AAEhD,SAAS,oBAAoB;AAC7B,SAAS,0BAA0B;AAE5B,MAAM,yBAAyB,CACpC,UACG;AACH;AAAA,IACE,CAAC,EAAE,WAAAA,YAAW,WAAAC,YAAW,UAAAC,WAAU,QAAAC,QAAO,MACxC,GAAGH,UAAS,IAAIC,UAAS,IAAIC,SAAQ,IAAIC,OAAM;AAAA,EACnD;AACA,QAAM,EAAE,WAAW,WAAW,UAAU,QAAQ,KAAK,IAAI,mBAAmB;AAC5E,QAAM,gBAAgB,iBAAiB;AAEvC,MACE,CAAC,YACD,OAAO,SAAS,KAChB,OAAO,SAAS,KAChB,mBAAmB,IAAI,GACvB;AACA;AAAA,EACF;AACA,QAAM,EAAE,QAAQ,QAAQ,IAAI,aAAa,MAAM,UAAU,eAAe;AAAA,IACtE,oBAAoB,MAAM;AAAA,IAC1B,oBAAoB,MAAM,cAAc;AAAA,IACxC,eAAe,CAAC,CAAC,MAAM;AAAA,EACzB,CAAC;AAED,MAAI,MAAM,gBAAgB;AACxB,WACE,oBAAC,sBAAsB,UAAtB,EAA+B,OAAO,QACrC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QAEC,gBAAM;AAAA;AAAA,IACT,GACF;AAAA,EAEJ;AACA,SACE,oBAAC,kBAAe,QAAgB,WAAsB,WACpD,8BAAC,sBAAsB,UAAtB,EAA+B,OAAO,QACpC,mBACH,GACF;AAEJ;",
   "names": ["absoluteX", "absoluteY", "inBounds", "pinned"]
 }

package/esm/charts/core/components/overlay-tooltip/components/Footer.js

@@ -0,0 +1,19 @@
+import { jsx } from "react/jsx-runtime";
+import useIntl from "react-intl/src/components/useIntl.js";
+import { OVERLAY_TOOLTIP_MESSAGES } from "../messages.js";
+import { useTooltipSnapshot } from "../selectors.js";
+import { actionsPlaceholderTextAnimated } from "./global-actions/actions.sty.js";
+import { GlobalActions } from "./global-actions/GlobalActions.js";
+const Footer = ({ actions, unpinnedPlaceholderText }) => {
+  const intl = useIntl();
+  const { pinned } = useTooltipSnapshot();
+  if (pinned) {
+    return actions.length > 0 ? /* @__PURE__ */ jsx(GlobalActions, { actions }) : null;
+  }
+  const placeholderText = unpinnedPlaceholderText ?? intl.formatMessage(OVERLAY_TOOLTIP_MESSAGES.unpinnedPlaceholderMessage);
+  return /* @__PURE__ */ jsx("div", { className: actionsPlaceholderTextAnimated, children: placeholderText });
+};
+export {
+  Footer
+};
+//# sourceMappingURL=Footer.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../src/charts/core/components/overlay-tooltip/components/Footer.tsx"],
+  "sourcesContent": ["import { type ReactNode } from 'react';\nimport useIntl from 'react-intl/src/components/useIntl.js';\n\nimport { OVERLAY_TOOLTIP_MESSAGES } from '../messages.js';\nimport { useTooltipSnapshot } from '../selectors.js';\nimport { actionsPlaceholderTextAnimated } from './global-actions/actions.sty.js';\nimport { GlobalActions } from './global-actions/GlobalActions.js';\n\n/**\n * Props for the `ChartTooltip.Footer` slot.\n * @public\n */\nexport interface FooterProps {\n  /** Global actions rendered in the footer when the tooltip is pinned. */\n  actions: ReactNode[];\n  /** Text shown in the footer when the tooltip is not yet pinned. Defaults to a built-in pin prompt message. */\n  unpinnedPlaceholderText: string | undefined;\n}\n\n/** @public */\nexport const Footer = ({ actions, unpinnedPlaceholderText }: FooterProps) => {\n  const intl = useIntl();\n  const { pinned } = useTooltipSnapshot();\n\n  if (pinned) {\n    return actions.length > 0 ? <GlobalActions actions={actions} /> : null;\n  }\n\n  const placeholderText =\n    unpinnedPlaceholderText ??\n    intl.formatMessage(OVERLAY_TOOLTIP_MESSAGES.unpinnedPlaceholderMessage);\n\n  return (\n    <div className={actionsPlaceholderTextAnimated}>{placeholderText}</div>\n  );\n};\n"],
+  "mappings": "AAyBgC;AAxBhC,OAAO,aAAa;AAEpB,SAAS,gCAAgC;AACzC,SAAS,0BAA0B;AACnC,SAAS,sCAAsC;AAC/C,SAAS,qBAAqB;AAcvB,MAAM,SAAS,CAAC,EAAE,SAAS,wBAAwB,MAAmB;AAC3E,QAAM,OAAO,QAAQ;AACrB,QAAM,EAAE,OAAO,IAAI,mBAAmB;AAEtC,MAAI,QAAQ;AACV,WAAO,QAAQ,SAAS,IAAI,oBAAC,iBAAc,SAAkB,IAAK;AAAA,EACpE;AAEA,QAAM,kBACJ,2BACA,KAAK,cAAc,yBAAyB,0BAA0B;AAExE,SACE,oBAAC,SAAI,WAAW,gCAAiC,2BAAgB;AAErE;",
+  "names": []
+}

package/esm/charts/core/components/overlay-tooltip/components/global-actions/Action.js

@@ -1,8 +1,10 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { actionButton } from "./actions.sty.js";
 import { Button } from "../../../../../../buttons/button/Button.js";
+import { useTooltipReducer } from "../../useTooltipReducer.js";
 const Action = (props) => {
   const { label, icon, trailingIcon, onSelect, disabled } = props;
+  const dispatch = useTooltipReducer();
   const handleKeyDown = (event) => {
     if (event.key === "Enter" || event.key === " ") {
       event.preventDefault();
@@ -18,6 +20,10 @@ const Action = (props) => {
       className: actionButton,
       onClick: onSelect,
       onKeyDown: handleKeyDown,
+      onPointerEnter: dispatch({
+        type: "SET_ACTIVE_SERIES",
+        payload: { activeSeries: "global-action" }
+      }),
       width: "full",
       textAlign: "start",
       children: [

package/esm/charts/core/components/overlay-tooltip/components/global-actions/Action.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/charts/core/components/overlay-tooltip/components/global-actions/Action.tsx"],
-  "sourcesContent": ["import type { KeyboardEvent, ReactEventHandler, ReactNode } from 'react';\n\nimport { actionButton } from './actions.sty.js';\nimport { Button } from '../../../../../../buttons/button/Button.js';\n\n/**\n * Props for `ChartTooltip.Action`, defining a global action item rendered in the tooltip footer.\n * @public\n */\nexport interface ActionProps {\n  /** Label text displayed for the action */\n  label: ReactNode;\n  /** Optional icon displayed to the left of the label */\n  icon?: ReactNode;\n  /** Optional icon displayed to the right of the label */\n  trailingIcon?: ReactNode;\n  /** Callback executed when the action is selected */\n  onSelect: ReactEventHandler;\n  /** Whether the action is disabled */\n  disabled?: boolean;\n}\n\n/**\n * A global tooltip action component.\n * Used as a child of OverlayTooltip to provide actions that apply to the entire tooltip content.\n * The tooltip internally manages visibility based on pinned state.\n * @public\n */\nexport const Action = (props: ActionProps) => {\n  const { label, icon, trailingIcon, onSelect, disabled } = props;\n\n  const handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      event.stopPropagation();\n      onSelect(event);\n    }\n  };\n\n  return (\n    <Button\n      disabled={disabled}\n      variant=\"default\"\n      className={actionButton}\n      onClick={onSelect}\n      onKeyDown={handleKeyDown}\n      width=\"full\"\n      textAlign=\"start\"\n    >\n      {icon && <Button.Prefix>{icon}</Button.Prefix>}\n      <Button.Label>{label}</Button.Label>\n      {trailingIcon && <Button.Suffix>{trailingIcon}</Button.Suffix>}\n    </Button>\n  );\n};\n"],
-  "mappings": "AAwCI,SASW,KATX;AAtCJ,SAAS,oBAAoB;AAC7B,SAAS,cAAc;AAyBhB,MAAM,SAAS,CAAC,UAAuB;AAC5C,QAAM,EAAE,OAAO,MAAM,cAAc,UAAU,SAAS,IAAI;AAE1D,QAAM,gBAAgB,CAAC,UAAyB;AAC9C,QAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;AAC9C,YAAM,eAAe;AACrB,YAAM,gBAAgB;AACtB,eAAS,KAAK;AAAA,IAChB;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,SAAQ;AAAA,MACR,WAAW;AAAA,MACX,SAAS;AAAA,MACT,WAAW;AAAA,MACX,OAAM;AAAA,MACN,WAAU;AAAA,MAET;AAAA,gBAAQ,oBAAC,OAAO,QAAP,EAAe,gBAAK;AAAA,QAC9B,oBAAC,OAAO,OAAP,EAAc,iBAAM;AAAA,QACpB,gBAAgB,oBAAC,OAAO,QAAP,EAAe,wBAAa;AAAA;AAAA;AAAA,EAChD;AAEJ;",
+  "sourcesContent": ["import type { KeyboardEvent, ReactEventHandler, ReactNode } from 'react';\n\nimport { actionButton } from './actions.sty.js';\nimport { Button } from '../../../../../../buttons/button/Button.js';\nimport { useTooltipReducer } from '../../useTooltipReducer.js';\n\n/**\n * Props for `ChartTooltip.Action`, defining a global action item rendered in the tooltip footer.\n * @public\n */\nexport interface ActionProps {\n  /** Label text displayed for the action */\n  label: ReactNode;\n  /** Optional icon displayed to the left of the label */\n  icon?: ReactNode;\n  /** Optional icon displayed to the right of the label */\n  trailingIcon?: ReactNode;\n  /** Callback executed when the action is selected */\n  onSelect: ReactEventHandler;\n  /** Whether the action is disabled */\n  disabled?: boolean;\n}\n\n/**\n * A global tooltip action component.\n * Used as a child of OverlayTooltip to provide actions that apply to the entire tooltip content.\n * The tooltip internally manages visibility based on pinned state.\n * @public\n */\nexport const Action = (props: ActionProps) => {\n  const { label, icon, trailingIcon, onSelect, disabled } = props;\n  const dispatch = useTooltipReducer();\n\n  const handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      event.stopPropagation();\n      onSelect(event);\n    }\n  };\n\n  return (\n    <Button\n      disabled={disabled}\n      variant=\"default\"\n      className={actionButton}\n      onClick={onSelect}\n      onKeyDown={handleKeyDown}\n      onPointerEnter={dispatch({\n        type: 'SET_ACTIVE_SERIES',\n        payload: { activeSeries: 'global-action' },\n      })}\n      width=\"full\"\n      textAlign=\"start\"\n    >\n      {icon && <Button.Prefix>{icon}</Button.Prefix>}\n      <Button.Label>{label}</Button.Label>\n      {trailingIcon && <Button.Suffix>{trailingIcon}</Button.Suffix>}\n    </Button>\n  );\n};\n"],
+  "mappings": "AA0CI,SAaW,KAbX;AAxCJ,SAAS,oBAAoB;AAC7B,SAAS,cAAc;AACvB,SAAS,yBAAyB;AAyB3B,MAAM,SAAS,CAAC,UAAuB;AAC5C,QAAM,EAAE,OAAO,MAAM,cAAc,UAAU,SAAS,IAAI;AAC1D,QAAM,WAAW,kBAAkB;AAEnC,QAAM,gBAAgB,CAAC,UAAyB;AAC9C,QAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;AAC9C,YAAM,eAAe;AACrB,YAAM,gBAAgB;AACtB,eAAS,KAAK;AAAA,IAChB;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,SAAQ;AAAA,MACR,WAAW;AAAA,MACX,SAAS;AAAA,MACT,WAAW;AAAA,MACX,gBAAgB,SAAS;AAAA,QACvB,MAAM;AAAA,QACN,SAAS,EAAE,cAAc,gBAAgB;AAAA,MAC3C,CAAC;AAAA,MACD,OAAM;AAAA,MACN,WAAU;AAAA,MAET;AAAA,gBAAQ,oBAAC,OAAO,QAAP,EAAe,gBAAK;AAAA,QAC9B,oBAAC,OAAO,OAAP,EAAc,iBAAM;AAAA,QACpB,gBAAgB,oBAAC,OAAO,QAAP,EAAe,wBAAa;AAAA;AAAA;AAAA,EAChD;AAEJ;",
   "names": []
 }

package/esm/charts/core/components/overlay-tooltip/components/global-actions/GlobalActions.js

@@ -1,21 +1,11 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Divider } from "../../../../../../layouts/divider/Divider.js";
 import { divider, actionsContainer } from "../../tooltip.sty.js";
-import { useTooltipReducer } from "../../useTooltipReducer.js";
 const GlobalActions = ({ actions }) => {
-  const dispatch = useTooltipReducer();
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: actionsContainer,
-      "aria-label": "Tooltip actions",
-      onPointerMove: dispatch({ type: "TOOLTIP_MOUSE_LEAVE" }),
-      children: [
-        /* @__PURE__ */ jsx(Divider, { orientation: "horizontal", className: divider }, "divider"),
-        actions
-      ]
-    }
-  );
+  return /* @__PURE__ */ jsxs("div", { className: actionsContainer, "aria-label": "Tooltip actions", children: [
+    /* @__PURE__ */ jsx(Divider, { orientation: "horizontal", className: divider }, "divider"),
+    actions
+  ] });
 };
 export {
   GlobalActions

package/esm/charts/core/components/overlay-tooltip/components/global-actions/GlobalActions.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/charts/core/components/overlay-tooltip/components/global-actions/GlobalActions.tsx"],
-  "sourcesContent": ["import { type JSX } from 'react';\n\nimport { Divider } from '../../../../../../layouts/divider/Divider.js';\nimport { divider, actionsContainer } from '../../tooltip.sty.js';\nimport { useTooltipReducer } from '../../useTooltipReducer.js';\n\ninterface GlobalActionsProps {\n  actions: JSX.Element[];\n}\n\nexport const GlobalActions = ({ actions }: GlobalActionsProps) => {\n  const dispatch = useTooltipReducer();\n  return (\n    <div\n      className={actionsContainer}\n      aria-label=\"Tooltip actions\"\n      onPointerMove={dispatch({ type: 'TOOLTIP_MOUSE_LEAVE' })}\n    >\n      <Divider orientation=\"horizontal\" key=\"divider\" className={divider} />\n      {actions}\n    </div>\n  );\n};\n"],
-  "mappings": "AAaI,SAKE,KALF;AAXJ,SAAS,eAAe;AACxB,SAAS,SAAS,wBAAwB;AAC1C,SAAS,yBAAyB;AAM3B,MAAM,gBAAgB,CAAC,EAAE,QAAQ,MAA0B;AAChE,QAAM,WAAW,kBAAkB;AACnC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACX,cAAW;AAAA,MACX,eAAe,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAAA,MAEvD;AAAA,4BAAC,WAAQ,aAAY,cAA2B,WAAW,WAArB,SAA8B;AAAA,QACnE;AAAA;AAAA;AAAA,EACH;AAEJ;",
+  "sourcesContent": ["import { type ReactNode } from 'react';\n\nimport { Divider } from '../../../../../../layouts/divider/Divider.js';\nimport { divider, actionsContainer } from '../../tooltip.sty.js';\n\ninterface GlobalActionsProps {\n  actions: ReactNode[];\n}\n\nexport const GlobalActions = ({ actions }: GlobalActionsProps) => {\n  return (\n    <div className={actionsContainer} aria-label=\"Tooltip actions\">\n      <Divider orientation=\"horizontal\" key=\"divider\" className={divider} />\n      {actions}\n    </div>\n  );\n};\n"],
+  "mappings": "AAWI,SACE,KADF;AATJ,SAAS,eAAe;AACxB,SAAS,SAAS,wBAAwB;AAMnC,MAAM,gBAAgB,CAAC,EAAE,QAAQ,MAA0B;AAChE,SACE,qBAAC,SAAI,WAAW,kBAAkB,cAAW,mBAC3C;AAAA,wBAAC,WAAQ,aAAY,cAA2B,WAAW,WAArB,SAA8B;AAAA,IACnE;AAAA,KACH;AAEJ;",
   "names": []
 }

package/esm/charts/core/components/overlay-tooltip/components/global-actions/actions.css

@@ -1,4 +1,4 @@
-@keyframes _15am2yg1-3-5-2 {
+@keyframes _15am2yg1-3-7-0 {
   from {
     opacity: 0;
     max-height: 0;
@@ -12,7 +12,7 @@
     margin-top: var(--dt-spacings-size-4, 4px);
   }
 }
-._15am2yg0-3-5-2 {
+._15am2yg0-3-7-0 {
   display: block;
   padding: var(--dt-spacings-size-6, 6px) var(--dt-spacings-size-8, 8px);
   width: 100%;
@@ -24,7 +24,7 @@
   line-height: var(--dt-typography-text-base-emphasized-line-height, 1.4285714286);
   border-radius: var(--dt-borders-radius-field-default, 6px);
 }
-._15am2yg2-3-5-2 {
+._15am2yg2-3-7-0 {
   box-sizing: border-box;
   border-top: 1px solid var(--dt-colors-border-neutral-default, #dadbe4);
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
@@ -36,6 +36,6 @@
   padding: 0;
   margin-top: 0;
   overflow: hidden;
-  animation: _15am2yg1-3-5-2 var(--dt-animations-expand-collapse-duration-fast, 250ms) var(--dt-animations-expand-collapse-easing, cubic-bezier(0.4, 0, 0.2, 1)) both;
+  animation: _15am2yg1-3-7-0 var(--dt-animations-expand-collapse-duration-fast, 250ms) var(--dt-animations-expand-collapse-easing, cubic-bezier(0.4, 0, 0.2, 1)) both;
   animation-delay: 1200ms;
 }

package/esm/charts/core/components/overlay-tooltip/components/global-actions/actions.sty.js

@@ -1,6 +1,6 @@
 import "./actions.css";
-var actionButton = "_15am2yg0-3-5-2";
-var actionsPlaceholderTextAnimated = "_15am2yg2-3-5-2";
+var actionButton = "_15am2yg0-3-7-0";
+var actionsPlaceholderTextAnimated = "_15am2yg2-3-7-0";
 export {
   actionButton,
   actionsPlaceholderTextAnimated

package/esm/charts/core/components/overlay-tooltip/components/global-actions/actions.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/charts/core/components/overlay-tooltip/components/global-actions/actions.css.ts"],
-  "sourcesContent": ["import './actions.css';\nexport var actionButton = '_15am2yg0-3-5-2';\nexport var actionsPlaceholderTextAnimated = '_15am2yg2-3-5-2';"],
+  "sourcesContent": ["import './actions.css';\nexport var actionButton = '_15am2yg0-3-7-0';\nexport var actionsPlaceholderTextAnimated = '_15am2yg2-3-7-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,eAAe;AACnB,IAAI,iCAAiC;",
   "names": []
 }

package/esm/charts/core/components/overlay-tooltip/components/header/Header.css

@@ -1,10 +1,10 @@
-._1ldhlar2-3-5-2 {
+._1ldhlar2-3-7-0 {
   padding: var(--dt-spacings-size-4, 4px) var(--dt-spacings-size-6, 6px);
-  width: var(--_1ldhlar1-3-5-2, calc(100% - 8px));
+  width: var(--_1ldhlar1-3-7-0, calc(100% - 8px));
   height: 100%;
   display: inline-block;
 }
-._1ldhlar3-3-5-2 {
+._1ldhlar3-3-7-0 {
   font-family: var(--dt-typography-text-small-emphasized-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
   font-size: var(--dt-typography-text-small-emphasized-size, 12px);
   line-height: var(--dt-typography-text-small-emphasized-line-height, 1.333333333);
@@ -13,15 +13,15 @@
   margin: 0;
   padding: 0;
 }
-._1ldhlar4-3-5-2 {
+._1ldhlar4-3-7-0 {
   display: -webkit-box;
   -webkit-box-orient: vertical;
-  -webkit-line-clamp: var(--_1ldhlar0-3-5-2);
+  -webkit-line-clamp: var(--_1ldhlar0-3-7-0);
   overflow: hidden;
   text-overflow: ellipsis;
   word-break: break-word;
 }
-._1ldhlar5-3-5-2 {
+._1ldhlar5-3-7-0 {
   font-family: var(--dt-typography-text-small-default-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
   font-size: var(--dt-typography-text-small-default-size, 12px);
   line-height: var(--dt-typography-text-small-default-line-height, 1.333333333);

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/charts/core/components/overlay-tooltip/components/header/Header.tsx"],
-  "sourcesContent": ["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport clsx from 'clsx';\n\nimport {\n  headerContainer,\n  headerSubText,\n  headerText,\n  headerTextMultiLine,\n  headerWidthVar,\n  maxLinesVar,\n} from './Header.sty.js';\nimport { HeaderProps, HeaderValueFormatter } from './types/header.js';\nimport { getShowRangeDuration } from './utils/get-show-range-duration.js';\nimport { isHeaderEmpty } from './utils/type-guards.js';\nimport { defaultLabelFormatterStrategy } from './utils/value-formatters.js';\nimport { Divider } from '../../../../../../layouts/divider/Divider.js';\nimport { Tooltip } from '../../../../../../overlays/tooltip/Tooltip.js';\nimport {\n  DEFAULT_HEADER_LINES,\n  DEFAULT_TRUNCATION_MODE,\n  MAX_HEADER_LINES,\n  TOOLTIP_WRAPPER_PADDING,\n} from '../../constants.js';\nimport { useExternalConfig } from '../../contexts/ExternalConfigContext.js';\nimport { useTooltipDimensions } from '../../contexts/TooltipDimensionsContext.js';\nimport { useDefaultConfig } from '../../hooks/useDefaultConfig.js';\nimport { useDefaultLabels } from '../../hooks/useDefaultLabels.js';\nimport { divider, TOOLTIP_MAX_WIDTH } from '../../tooltip.sty.js';\nimport { computeHeaderDisplay } from './utils/compute-header-display.js';\nimport { computeSubheaderDisplay } from './utils/compute-subheader-display.js';\nimport { getNonGeometryHeader } from './utils/get-non-geometry-header.js';\n\nexport const Header = (props: HeaderProps) => {\n  const {\n    header1,\n    header2,\n    subheader,\n    label,\n    label2,\n    maxLines,\n    duration1,\n    duration2,\n    showRangeDuration2,\n  } = props;\n  const labelFor = useDefaultLabels();\n  const defaultConfig = useDefaultConfig();\n  const defaultStrategy = (defaultConfig?.headerFormatStrategy ??\n    defaultLabelFormatterStrategy) as HeaderValueFormatter;\n  const { displayHeaderDivider, truncationMode = DEFAULT_TRUNCATION_MODE } =\n    useExternalConfig();\n  const containerWidth = useTooltipDimensions()?.width || TOOLTIP_MAX_WIDTH;\n  const showedLines = Math.min(\n    maxLines ?? DEFAULT_HEADER_LINES,\n    MAX_HEADER_LINES,\n  );\n  const isSingleLine = showedLines === 1;\n  const isTruncationEnd = truncationMode === 'end';\n\n  const showRangeDuration1 = getShowRangeDuration(\n    defaultConfig,\n    props.showRangeDuration1,\n  );\n  const computedShowDuration2 = showRangeDuration2 ?? false;\n  const formatStrategy = defaultStrategy ?? getNonGeometryHeader(header1);\n  const header2FormatStrategy = getNonGeometryHeader(header2);\n  const availableWidth = containerWidth - TOOLTIP_WRAPPER_PADDING * 2;\n\n  if (isHeaderEmpty(header1, header2, subheader)) {\n    return null;\n  }\n\n  const sharedDisplayParams = {\n    labelFor,\n    isSingleLine,\n    isTruncationEnd,\n    availableWidth,\n    showedLines,\n    truncationMode,\n    showRangeDuration: showRangeDuration1,\n  };\n\n  const {\n    content: headerContent,\n    totalTextWidth,\n    shownText,\n    isTruncated,\n    durationContent,\n    durationSuffix,\n  } = computeHeaderDisplay({\n    header: header1,\n    label,\n    duration: duration1,\n    formatStrategy,\n    ...sharedDisplayParams,\n  });\n\n  const {\n    content: header2Content,\n    totalTextWidth: header2TotalTextWidth,\n    shownText: shownHeader2Text,\n    isTruncated: isHeader2Truncated,\n    durationContent: duration2Content,\n    durationSuffix: duration2Suffix,\n  } = computeHeaderDisplay({\n    header: header2,\n    label: label2,\n    duration: duration2,\n    formatStrategy: header2FormatStrategy,\n    ...sharedDisplayParams,\n    showRangeDuration: computedShowDuration2,\n  });\n\n  const { subheaderContent, shownSubheaderText, isSubheaderTruncated } =\n    computeSubheaderDisplay({\n      subheader,\n      formatStrategy,\n      availableWidth,\n      truncationMode,\n    });\n\n  const headerClassName =\n    !isSingleLine && isTruncationEnd\n      ? clsx(headerText, headerTextMultiLine)\n      : headerText;\n\n  const shouldConstrainWidth =\n    totalTextWidth > availableWidth || header2TotalTextWidth > availableWidth;\n  const headerContainerStyle = shouldConstrainWidth\n    ? assignInlineVars({ [headerWidthVar]: `${availableWidth}px` })\n    : {};\n  const isHeader2Unique =\n    header2Content + duration2Suffix !== headerContent + durationSuffix;\n\n  return (\n    <>\n      <div className={headerContainer} style={headerContainerStyle}>\n        <Tooltip text={headerContent} disabled={!isTruncated}>\n          <p\n            className={headerClassName}\n            style={assignInlineVars({ [maxLinesVar]: String(showedLines) })}\n          >\n            {shownText}\n            {durationContent && durationContent !== '0' && (\n              <span className={headerSubText}>{durationSuffix}</span>\n            )}\n          </p>\n        </Tooltip>\n        {shownHeader2Text && isHeader2Unique && (\n          <div>\n            <Tooltip text={header2Content} disabled={!isHeader2Truncated}>\n              <p\n                className={headerClassName}\n                style={assignInlineVars({\n                  [maxLinesVar]: String(showedLines),\n                })}\n              >\n                {shownHeader2Text}\n                {duration2Content && duration2Content !== '0' && (\n                  <span className={headerSubText}>{duration2Suffix}</span>\n                )}\n              </p>\n            </Tooltip>\n          </div>\n        )}\n        {shownSubheaderText && (\n          <div>\n            <Tooltip text={subheaderContent} disabled={!isSubheaderTruncated}>\n              <p className={headerSubText}>{shownSubheaderText}</p>\n            </Tooltip>\n          </div>\n        )}\n      </div>\n      {displayHeaderDivider && (\n        <Divider orientation=\"horizontal\" key=\"divider\" className={divider} />\n      )}\n    </>\n  );\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { assignInlineVars } from '@vanilla-extract/dynamic';\nimport clsx from 'clsx';\n\nimport {\n  headerContainer,\n  headerSubText,\n  headerText,\n  headerTextMultiLine,\n  headerWidthVar,\n  maxLinesVar,\n} from './Header.sty.js';\nimport { HeaderProps, HeaderValueFormatter } from './types/header.js';\nimport { getShowRangeDuration } from './utils/get-show-range-duration.js';\nimport { isHeaderEmpty } from './utils/type-guards.js';\nimport { defaultLabelFormatterStrategy } from './utils/value-formatters.js';\nimport { Divider } from '../../../../../../layouts/divider/Divider.js';\nimport { Tooltip } from '../../../../../../overlays/tooltip/Tooltip.js';\nimport {\n  DEFAULT_HEADER_LINES,\n  DEFAULT_TRUNCATION_MODE,\n  MAX_HEADER_LINES,\n  TOOLTIP_WRAPPER_PADDING,\n} from '../../constants.js';\nimport { useExternalConfig } from '../../contexts/ExternalConfigContext.js';\nimport { useTooltipDimensions } from '../../contexts/TooltipDimensionsContext.js';\nimport { useDefaultConfig } from '../../hooks/useDefaultConfig.js';\nimport { useDefaultLabels } from '../../hooks/useDefaultLabels.js';\nimport { divider, TOOLTIP_MAX_WIDTH } from '../../tooltip.sty.js';\nimport { computeHeaderDisplay } from './utils/compute-header-display.js';\nimport { computeSubheaderDisplay } from './utils/compute-subheader-display.js';\nimport { getNonGeometryHeader } from './utils/get-non-geometry-header.js';\n\n/** @public */\nexport const Header = (props: HeaderProps) => {\n  const {\n    header1,\n    header2,\n    subheader,\n    label,\n    label2,\n    maxLines,\n    duration1,\n    duration2,\n    showRangeDuration2,\n  } = props;\n  const labelFor = useDefaultLabels();\n  const defaultConfig = useDefaultConfig();\n  const defaultStrategy = (defaultConfig?.headerFormatStrategy ??\n    defaultLabelFormatterStrategy) as HeaderValueFormatter;\n  const { displayHeaderDivider, truncationMode = DEFAULT_TRUNCATION_MODE } =\n    useExternalConfig();\n  const containerWidth = useTooltipDimensions()?.width || TOOLTIP_MAX_WIDTH;\n  const showedLines = Math.min(\n    maxLines ?? DEFAULT_HEADER_LINES,\n    MAX_HEADER_LINES,\n  );\n  const isSingleLine = showedLines === 1;\n  const isTruncationEnd = truncationMode === 'end';\n\n  const showRangeDuration1 = getShowRangeDuration(\n    defaultConfig,\n    props.showRangeDuration1,\n  );\n  const computedShowDuration2 = showRangeDuration2 ?? false;\n  const formatStrategy = defaultStrategy ?? getNonGeometryHeader(header1);\n  const header2FormatStrategy = getNonGeometryHeader(header2);\n  const availableWidth = containerWidth - TOOLTIP_WRAPPER_PADDING * 2;\n\n  if (isHeaderEmpty(header1, header2, subheader)) {\n    return null;\n  }\n\n  const sharedDisplayParams = {\n    labelFor,\n    isSingleLine,\n    isTruncationEnd,\n    availableWidth,\n    showedLines,\n    truncationMode,\n    showRangeDuration: showRangeDuration1,\n  };\n\n  const {\n    content: headerContent,\n    totalTextWidth,\n    shownText,\n    isTruncated,\n    durationContent,\n    durationSuffix,\n  } = computeHeaderDisplay({\n    header: header1,\n    label,\n    duration: duration1,\n    formatStrategy,\n    ...sharedDisplayParams,\n  });\n\n  const {\n    content: header2Content,\n    totalTextWidth: header2TotalTextWidth,\n    shownText: shownHeader2Text,\n    isTruncated: isHeader2Truncated,\n    durationContent: duration2Content,\n    durationSuffix: duration2Suffix,\n  } = computeHeaderDisplay({\n    header: header2,\n    label: label2,\n    duration: duration2,\n    formatStrategy: header2FormatStrategy,\n    ...sharedDisplayParams,\n    showRangeDuration: computedShowDuration2,\n  });\n\n  const { subheaderContent, shownSubheaderText, isSubheaderTruncated } =\n    computeSubheaderDisplay({\n      subheader,\n      formatStrategy,\n      availableWidth,\n      truncationMode,\n    });\n\n  const headerClassName =\n    !isSingleLine && isTruncationEnd\n      ? clsx(headerText, headerTextMultiLine)\n      : headerText;\n\n  const shouldConstrainWidth =\n    totalTextWidth > availableWidth || header2TotalTextWidth > availableWidth;\n  const headerContainerStyle = shouldConstrainWidth\n    ? assignInlineVars({ [headerWidthVar]: `${availableWidth}px` })\n    : {};\n  const isHeader2Unique =\n    header2Content + duration2Suffix !== headerContent + durationSuffix;\n\n  return (\n    <>\n      <div className={headerContainer} style={headerContainerStyle}>\n        <Tooltip text={headerContent} disabled={!isTruncated}>\n          <p\n            className={headerClassName}\n            style={assignInlineVars({ [maxLinesVar]: String(showedLines) })}\n          >\n            {shownText}\n            {durationContent && durationContent !== '0' && (\n              <span className={headerSubText}>{durationSuffix}</span>\n            )}\n          </p>\n        </Tooltip>\n        {shownHeader2Text && isHeader2Unique && (\n          <div>\n            <Tooltip text={header2Content} disabled={!isHeader2Truncated}>\n              <p\n                className={headerClassName}\n                style={assignInlineVars({\n                  [maxLinesVar]: String(showedLines),\n                })}\n              >\n                {shownHeader2Text}\n                {duration2Content && duration2Content !== '0' && (\n                  <span className={headerSubText}>{duration2Suffix}</span>\n                )}\n              </p>\n            </Tooltip>\n          </div>\n        )}\n        {shownSubheaderText && (\n          <div>\n            <Tooltip text={subheaderContent} disabled={!isSubheaderTruncated}>\n              <p className={headerSubText}>{shownSubheaderText}</p>\n            </Tooltip>\n          </div>\n        )}\n      </div>\n      {displayHeaderDivider && (\n        <Divider orientation=\"horizontal\" key=\"divider\" className={divider} />\n      )}\n    </>\n  );\n};\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/charts/core/components/overlay-tooltip/components/header/Header.sty.js

@@ -1,10 +1,10 @@
 import "./Header.css";
-var headerContainer = "_1ldhlar2-3-5-2";
-var headerSubText = "_1ldhlar5-3-5-2";
-var headerText = "_1ldhlar3-3-5-2";
-var headerTextMultiLine = "_1ldhlar4-3-5-2";
-var headerWidthVar = "var(--_1ldhlar1-3-5-2)";
-var maxLinesVar = "var(--_1ldhlar0-3-5-2)";
+var headerContainer = "_1ldhlar2-3-7-0";
+var headerSubText = "_1ldhlar5-3-7-0";
+var headerText = "_1ldhlar3-3-7-0";
+var headerTextMultiLine = "_1ldhlar4-3-7-0";
+var headerWidthVar = "var(--_1ldhlar1-3-7-0)";
+var maxLinesVar = "var(--_1ldhlar0-3-7-0)";
 export {
   headerContainer,
   headerSubText,

package/esm/charts/core/components/overlay-tooltip/components/header/Header.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/charts/core/components/overlay-tooltip/components/header/Header.css.ts"],
-  "sourcesContent": ["import './Header.css';\nexport var headerContainer = '_1ldhlar2-3-5-2';\nexport var headerSubText = '_1ldhlar5-3-5-2';\nexport var headerText = '_1ldhlar3-3-5-2';\nexport var headerTextMultiLine = '_1ldhlar4-3-5-2';\nexport var headerWidthVar = 'var(--_1ldhlar1-3-5-2)';\nexport var maxLinesVar = 'var(--_1ldhlar0-3-5-2)';"],
+  "sourcesContent": ["import './Header.css';\nexport var headerContainer = '_1ldhlar2-3-7-0';\nexport var headerSubText = '_1ldhlar5-3-7-0';\nexport var headerText = '_1ldhlar3-3-7-0';\nexport var headerTextMultiLine = '_1ldhlar4-3-7-0';\nexport var headerWidthVar = 'var(--_1ldhlar1-3-7-0)';\nexport var maxLinesVar = 'var(--_1ldhlar0-3-7-0)';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,kBAAkB;AACtB,IAAI,gBAAgB;AACpB,IAAI,aAAa;AACjB,IAAI,sBAAsB;AAC1B,IAAI,iBAAiB;AACrB,IAAI,cAAc;",
   "names": []
 }

package/esm/charts/core/components/overlay-tooltip/components/series/SeriesItem.js

@@ -7,6 +7,7 @@ import { ChevronRightSmallIcon } from "@dynatrace/strato-icons";
 import { useSeriesItemDisplayState } from "./hooks/use-series-item-display-state.js";
 import { SeriesActionsHeader } from "./SeriesActionsHeader.js";
 import { SeriesItemContent } from "./SeriesItemContent.js";
+import { useId } from "../../../../../../core/hooks/useId.js";
 import { COPY_TO_CLIPBOARD_MESSAGES } from "../../../copy-to-clipboard/copy-to-clipboard-messages.js";
 import { ChartActionsMenuAsync } from "../../../series-action/ChartActionsMenuAsync.js";
 import { TOOLTIP_CONTENT_PADDING } from "../../constants.js";
@@ -23,18 +24,18 @@ import {
 } from "../../tooltip.sty.js";
 import { useTooltipReducer } from "../../useTooltipReducer.js";
 import { getDefaultAction } from "../../utils/get-copy-action.js";
-const ACTIVE_SERIES_HOVER_DELAY = 500;
+const ACTIVE_SERIES_HOVER_DELAY = 150;
 const CHEVRON_SLOT_WIDTH = 20;
 const SeriesItem = (props) => {
   const intl = useIntl();
   const { pinned } = useTooltipSnapshot();
   const labelFor = useDefaultLabels();
-  const internalProps = props;
-  const { actions, ...restProps } = internalProps;
+  const { actions, ...restProps } = props;
   const { symbolPosition = "left", defaultActionsConfig } = useExternalConfig();
   const hasActions = actions !== void 0 || defaultActionsConfig.size > 0;
   const dispatch = useTooltipReducer();
-  const isOpen = useSelector(({ activeSeries: activeSeries2 }) => activeSeries2 === props.name);
+  const rowId = useId();
+  const isOpen = useSelector(({ activeSeries: activeSeries2 }) => activeSeries2 === rowId);
   const { activeSeries } = useTooltipSnapshot();
   const menuDelayRef = useRef(0);
   const asyncActions = actions ? async () => actions() : void 0;
@@ -47,14 +48,14 @@ const SeriesItem = (props) => {
     menuDelayRef.current = 0;
     dispatch({
       type: "SET_ACTIVE_SERIES",
-      payload: { activeSeries: props.name }
+      payload: { activeSeries: rowId }
     })();
   };
   const handlePointerMove = () => {
     menuDelayRef.current = ACTIVE_SERIES_HOVER_DELAY;
     dispatch({
       type: "SET_ACTIVE_SERIES",
-      payload: { activeSeries: props.name }
+      payload: { activeSeries: rowId }
     })();
   };
   const defaultActions = !pinned ? null : [...defaultActionsConfig.entries()].map(([accessor, config]) => {
@@ -73,12 +74,13 @@ const SeriesItem = (props) => {
     "button",
     {
       className: clsx(
-        activeSeries === props.name && seriesItemActive,
+        activeSeries === rowId && seriesItemActive,
         seriesItemWrapper
       ),
       onClick: handleClick,
       onPointerMove: handlePointerMove,
       onKeyDown: noop,
+      "data-testid": "menu-trigger",
       children: /* @__PURE__ */ jsx(
         ChartActionsMenuAsync,
         {
@@ -105,11 +107,25 @@ const SeriesItem = (props) => {
 const WithSymbol = forwardRef(
   (props, ref) => {
     const containerWidth = TOOLTIP_MAX_WIDTH - TOOLTIP_CONTENT_PADDING;
-    const { color, multiLine = false, name, shape, icon, symbol } = props;
+    const {
+      color,
+      multiLine = false,
+      name,
+      description,
+      shape,
+      iconStyle,
+      icon,
+      symbol
+    } = props;
     const { symbolPosition, hasActions } = props;
     const seriesContentMaxWidth = hasActions ? containerWidth - CHEVRON_SLOT_WIDTH : containerWidth;
     const {
       nameText,
+      descriptionText,
+      fullDescriptionText,
+      isDescriptionTruncated,
+      descriptionShouldUseMultiLineCss,
+      descriptionMultiLineMode,
       displayValueText,
       displayRelativeValueText,
       fullValueText,
@@ -126,7 +142,13 @@ const WithSymbol = forwardRef(
         {
           color,
           name,
+          description,
           nameText,
+          descriptionText,
+          fullDescriptionText,
+          isDescriptionTruncated,
+          descriptionShouldUseMultiLineCss,
+          descriptionMultiLineMode,
           displayValueText,
           displayRelativeValueText,
           fullValueText,
@@ -137,6 +159,7 @@ const WithSymbol = forwardRef(
           symbolPosition,
           shape,
           symbol,
+          iconStyle,
           icon,
           hasChevron: hasActions,
           maxWidth: seriesContentMaxWidth

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/charts/core/components/overlay-tooltip/components/series/SeriesItem.tsx"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport { noop } from 'lodash-es';\nimport { forwardRef, useRef, type MouseEventHandler } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { ChevronRightSmallIcon } from '@dynatrace/strato-icons';\n\nimport { useSeriesItemDisplayState } from './hooks/use-series-item-display-state.js';\nimport { SeriesActionsHeader } from './SeriesActionsHeader.js';\nimport { SeriesItemContent } from './SeriesItemContent.js';\nimport { COPY_TO_CLIPBOARD_MESSAGES } from '../../../copy-to-clipboard/copy-to-clipboard-messages.js';\nimport { ChartActionsMenuAsync } from '../../../series-action/ChartActionsMenuAsync.js';\nimport { TOOLTIP_CONTENT_PADDING } from '../../constants.js';\nimport { useExternalConfig } from '../../contexts/ExternalConfigContext.js';\nimport { useDefaultLabels } from '../../hooks/useDefaultLabels.js';\nimport { useSelector, useTooltipSnapshot } from '../../selectors.js';\nimport {\n  chevron,\n  chevronRightAligned,\n  seriesItemActive,\n  seriesItemWithChevron,\n  seriesItemWrapper,\n  TOOLTIP_MAX_WIDTH,\n} from '../../tooltip.sty.js';\nimport type { SeriesItemProps } from '../../types/series.js';\nimport { InternalSeriesItemProps } from '../../types/series.js';\nimport { useTooltipReducer } from '../../useTooltipReducer.js';\nimport { getDefaultAction } from '../../utils/get-copy-action.js';\n\nconst ACTIVE_SERIES_HOVER_DELAY = 500;\nconst CHEVRON_SLOT_WIDTH = 20;\n\nexport const SeriesItem = (props: SeriesItemProps) => {\n  const intl = useIntl();\n  const { pinned } = useTooltipSnapshot();\n  const labelFor = useDefaultLabels();\n  const internalProps = props as InternalSeriesItemProps;\n  const { actions, ...restProps } = internalProps;\n  const { symbolPosition = 'left', defaultActionsConfig } = useExternalConfig();\n  const hasActions = actions !== undefined || defaultActionsConfig.size > 0;\n  const dispatch = useTooltipReducer();\n  const isOpen = useSelector(({ activeSeries }) => activeSeries === props.name);\n  const { activeSeries } = useTooltipSnapshot();\n  const menuDelayRef = useRef(0);\n  const asyncActions = actions ? async () => actions() : undefined;\n\n  const triggerLeftTooltip: MouseEventHandler<HTMLDivElement> = (event) => {\n    event.stopPropagation();\n    dispatch({ type: 'TOOLTIP_MOUSE_LEAVE' })();\n  };\n  const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n    event.stopPropagation();\n    menuDelayRef.current = 0;\n    dispatch({\n      type: 'SET_ACTIVE_SERIES',\n      payload: { activeSeries: props.name },\n    })();\n  };\n  const handlePointerMove = () => {\n    menuDelayRef.current = ACTIVE_SERIES_HOVER_DELAY;\n    dispatch({\n      type: 'SET_ACTIVE_SERIES',\n      payload: { activeSeries: props.name },\n    })();\n  };\n  const defaultActions = !pinned\n    ? null\n    : [...defaultActionsConfig.entries()].map(([accessor, config]) => {\n        const message = intl.formatMessage(\n          config.messageLabel ?? COPY_TO_CLIPBOARD_MESSAGES.copyField,\n          {\n            field: labelFor?.(\n              config.field,\n              config.customLabel,\n            )?.toLocaleLowerCase(),\n          },\n        );\n        return getDefaultAction(props, accessor, message);\n      });\n\n  return (\n    <button\n      className={clsx(\n        activeSeries === props.name && seriesItemActive,\n        seriesItemWrapper,\n      )}\n      onClick={handleClick}\n      onPointerMove={handlePointerMove}\n      onKeyDown={noop}\n    >\n      <ChartActionsMenuAsync\n        hasActions={hasActions}\n        defaultActions={defaultActions}\n        actions={asyncActions}\n        isOpen={isOpen}\n        header={<SeriesActionsHeader text={props.name} />}\n        onActionSelected={triggerLeftTooltip}\n        delay={menuDelayRef.current}\n      >\n        <WithSymbol\n          symbolPosition={symbolPosition}\n          hasActions={hasActions}\n          {...restProps}\n        />\n      </ChartActionsMenuAsync>\n    </button>\n  );\n};\n\ntype SeriesWithSymbolProps = Omit<InternalSeriesItemProps, 'actions'> & {\n  symbolPosition: 'left' | 'right';\n  hasActions: boolean;\n};\n\nconst WithSymbol = forwardRef<HTMLDivElement, SeriesWithSymbolProps>(\n  (props, ref) => {\n    const containerWidth = TOOLTIP_MAX_WIDTH - TOOLTIP_CONTENT_PADDING;\n    const { color, multiLine = false, name, shape, icon, symbol } = props;\n    const { symbolPosition, hasActions } = props;\n    const seriesContentMaxWidth = hasActions\n      ? containerWidth - CHEVRON_SLOT_WIDTH\n      : containerWidth;\n    const {\n      nameText,\n      displayValueText,\n      displayRelativeValueText,\n      fullValueText,\n      fullRelativeValueText,\n      nameTextStyle,\n      nameStyle,\n    } = useSeriesItemDisplayState({\n      ...props,\n      maxWidth: seriesContentMaxWidth,\n    });\n    return (\n      <div ref={ref} className={seriesItemWithChevron}>\n        <SeriesItemContent\n          color={color}\n          name={name}\n          nameText={nameText}\n          displayValueText={displayValueText}\n          displayRelativeValueText={displayRelativeValueText}\n          fullValueText={fullValueText}\n          fullRelativeValueText={fullRelativeValueText}\n          nameTextStyle={nameTextStyle}\n          nameStyle={nameStyle}\n          multiLine={multiLine}\n          symbolPosition={symbolPosition}\n          shape={shape}\n          symbol={symbol}\n          icon={icon}\n          hasChevron={hasActions}\n          maxWidth={seriesContentMaxWidth}\n        />\n        {hasActions && (\n          <span\n            className={clsx(\n              chevron,\n              symbolPosition === 'right' && chevronRightAligned,\n            )}\n            aria-hidden\n          >\n            <ChevronRightSmallIcon size={16} />\n          </span>\n        )}\n      </div>\n    );\n  },\n);\n"],
-  "mappings": "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",
+  "sourcesContent": ["import clsx from 'clsx';\nimport { noop } from 'lodash-es';\nimport { forwardRef, useRef, type MouseEventHandler } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { ChevronRightSmallIcon } from '@dynatrace/strato-icons';\n\nimport { useSeriesItemDisplayState } from './hooks/use-series-item-display-state.js';\nimport { SeriesActionsHeader } from './SeriesActionsHeader.js';\nimport { SeriesItemContent } from './SeriesItemContent.js';\nimport { useId } from '../../../../../../core/hooks/useId.js';\nimport { COPY_TO_CLIPBOARD_MESSAGES } from '../../../copy-to-clipboard/copy-to-clipboard-messages.js';\nimport { ChartActionsMenuAsync } from '../../../series-action/ChartActionsMenuAsync.js';\nimport { TOOLTIP_CONTENT_PADDING } from '../../constants.js';\nimport { useExternalConfig } from '../../contexts/ExternalConfigContext.js';\nimport { useDefaultLabels } from '../../hooks/useDefaultLabels.js';\nimport { useSelector, useTooltipSnapshot } from '../../selectors.js';\nimport {\n  chevron,\n  chevronRightAligned,\n  seriesItemActive,\n  seriesItemWithChevron,\n  seriesItemWrapper,\n  TOOLTIP_MAX_WIDTH,\n} from '../../tooltip.sty.js';\nimport type { SeriesItemProps } from '../../types/series.js';\nimport { InternalSeriesItemProps } from '../../types/series.js';\nimport { useTooltipReducer } from '../../useTooltipReducer.js';\nimport { getDefaultAction } from '../../utils/get-copy-action.js';\n\nconst ACTIVE_SERIES_HOVER_DELAY = 150;\nconst CHEVRON_SLOT_WIDTH = 20;\n\nexport const SeriesItem = (props: SeriesItemProps) => {\n  const intl = useIntl();\n  const { pinned } = useTooltipSnapshot();\n  const labelFor = useDefaultLabels();\n  const { actions, ...restProps } = props as InternalSeriesItemProps;\n  const { symbolPosition = 'left', defaultActionsConfig } = useExternalConfig();\n  const hasActions = actions !== undefined || defaultActionsConfig.size > 0;\n  const dispatch = useTooltipReducer();\n  const rowId = useId();\n  const isOpen = useSelector(({ activeSeries }) => activeSeries === rowId);\n  const { activeSeries } = useTooltipSnapshot();\n  const menuDelayRef = useRef(0);\n  const asyncActions = actions ? async () => actions() : undefined;\n\n  const triggerLeftTooltip: MouseEventHandler<HTMLDivElement> = (event) => {\n    event.stopPropagation();\n    dispatch({ type: 'TOOLTIP_MOUSE_LEAVE' })();\n  };\n  const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n    event.stopPropagation();\n    menuDelayRef.current = 0;\n    dispatch({\n      type: 'SET_ACTIVE_SERIES',\n      payload: { activeSeries: rowId },\n    })();\n  };\n  const handlePointerMove = () => {\n    menuDelayRef.current = ACTIVE_SERIES_HOVER_DELAY;\n    dispatch({\n      type: 'SET_ACTIVE_SERIES',\n      payload: { activeSeries: rowId },\n    })();\n  };\n  const defaultActions = !pinned\n    ? null\n    : [...defaultActionsConfig.entries()].map(([accessor, config]) => {\n        const message = intl.formatMessage(\n          config.messageLabel ?? COPY_TO_CLIPBOARD_MESSAGES.copyField,\n          {\n            field: labelFor?.(\n              config.field,\n              config.customLabel,\n            )?.toLocaleLowerCase(),\n          },\n        );\n        return getDefaultAction(props, accessor, message);\n      });\n\n  return (\n    <button\n      className={clsx(\n        activeSeries === rowId && seriesItemActive,\n        seriesItemWrapper,\n      )}\n      onClick={handleClick}\n      onPointerMove={handlePointerMove}\n      onKeyDown={noop}\n      data-testid=\"menu-trigger\"\n    >\n      <ChartActionsMenuAsync\n        hasActions={hasActions}\n        defaultActions={defaultActions}\n        actions={asyncActions}\n        isOpen={isOpen}\n        header={<SeriesActionsHeader text={props.name} />}\n        onActionSelected={triggerLeftTooltip}\n        delay={menuDelayRef.current}\n      >\n        <WithSymbol\n          symbolPosition={symbolPosition}\n          hasActions={hasActions}\n          {...restProps}\n        />\n      </ChartActionsMenuAsync>\n    </button>\n  );\n};\n\ntype SeriesWithSymbolProps = Omit<InternalSeriesItemProps, 'actions'> & {\n  symbolPosition: 'left' | 'right';\n  hasActions: boolean;\n};\n\nconst WithSymbol = forwardRef<HTMLDivElement, SeriesWithSymbolProps>(\n  (props, ref) => {\n    const containerWidth = TOOLTIP_MAX_WIDTH - TOOLTIP_CONTENT_PADDING;\n    const {\n      color,\n      multiLine = false,\n      name,\n      description,\n      shape,\n      iconStyle,\n      icon,\n      symbol,\n    } = props;\n    const { symbolPosition, hasActions } = props;\n    const seriesContentMaxWidth = hasActions\n      ? containerWidth - CHEVRON_SLOT_WIDTH\n      : containerWidth;\n    const {\n      nameText,\n      descriptionText,\n      fullDescriptionText,\n      isDescriptionTruncated,\n      descriptionShouldUseMultiLineCss,\n      descriptionMultiLineMode,\n      displayValueText,\n      displayRelativeValueText,\n      fullValueText,\n      fullRelativeValueText,\n      nameTextStyle,\n      nameStyle,\n    } = useSeriesItemDisplayState({\n      ...props,\n      maxWidth: seriesContentMaxWidth,\n    });\n    return (\n      <div ref={ref} className={seriesItemWithChevron}>\n        <SeriesItemContent\n          color={color}\n          name={name}\n          description={description}\n          nameText={nameText}\n          descriptionText={descriptionText}\n          fullDescriptionText={fullDescriptionText}\n          isDescriptionTruncated={isDescriptionTruncated}\n          descriptionShouldUseMultiLineCss={descriptionShouldUseMultiLineCss}\n          descriptionMultiLineMode={descriptionMultiLineMode}\n          displayValueText={displayValueText}\n          displayRelativeValueText={displayRelativeValueText}\n          fullValueText={fullValueText}\n          fullRelativeValueText={fullRelativeValueText}\n          nameTextStyle={nameTextStyle}\n          nameStyle={nameStyle}\n          multiLine={multiLine}\n          symbolPosition={symbolPosition}\n          shape={shape}\n          symbol={symbol}\n          iconStyle={iconStyle}\n          icon={icon}\n          hasChevron={hasActions}\n          maxWidth={seriesContentMaxWidth}\n        />\n        {hasActions && (\n          <span\n            className={clsx(\n              chevron,\n              symbolPosition === 'right' && chevronRightAligned,\n            )}\n            aria-hidden\n          >\n            <ChevronRightSmallIcon size={16} />\n          </span>\n        )}\n      </div>\n    );\n  },\n);\n"],
+  "mappings": "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",
   "names": ["activeSeries"]
 }