@dynatrace/strato-components 3.11.2 → 3.12.0

package/esm/charts/core/components/tooltip/section-components/VirtualizedTooltipBody/VirtualizedTooltipBody.css

@@ -1,8 +1,8 @@
-._1n2hhq90-3-11-2 {
+._1n2hhq90-3-12-0 {
   width: 100%;
   position: relative;
 }
-._1n2hhq91-3-11-2 {
+._1n2hhq91-3-12-0 {
   list-style: none;
   padding: 0;
   margin: 0;

package/esm/charts/core/components/tooltip/section-components/VirtualizedTooltipBody/VirtualizedTooltipBody.sty.js

@@ -1,6 +1,6 @@
 import "./VirtualizedTooltipBody.css";
-var itemsList = "_1n2hhq91-3-11-2";
-var listContainer = "_1n2hhq90-3-11-2";
+var itemsList = "_1n2hhq91-3-12-0";
+var listContainer = "_1n2hhq90-3-12-0";
 export {
   itemsList,
   listContainer

package/esm/charts/core/components/tooltip/section-components/VirtualizedTooltipBody/VirtualizedTooltipBody.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/charts/core/components/tooltip/section-components/VirtualizedTooltipBody/VirtualizedTooltipBody.css.ts"],
-  "sourcesContent": ["import './VirtualizedTooltipBody.css';\nexport var itemsList = '_1n2hhq91-3-11-2';\nexport var listContainer = '_1n2hhq90-3-11-2';"],
+  "sourcesContent": ["import './VirtualizedTooltipBody.css';\nexport var itemsList = '_1n2hhq91-3-12-0';\nexport var listContainer = '_1n2hhq90-3-12-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,YAAY;AAChB,IAAI,gBAAgB;",
   "names": []
 }

package/esm/charts/core/components/tooltip/shared/styles/SeriesBasedContent.css

@@ -1,4 +1,4 @@
-._dacoys0-3-11-2 {
+._dacoys0-3-12-0 {
   padding-right: var(--dt-spacings-size-4, 4px);
   padding-left: var(--dt-spacings-size-6, 6px);
   border: none;
@@ -8,13 +8,13 @@
   width: 100%;
   font-family: var(--dt-typography-text-base-default-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
 }
-._dacoys0-3-11-2:hover {
+._dacoys0-3-12-0:hover {
   background-color: var(--dt-colors-background-field-neutral-emphasized-hover, #dadbe4);
   color: var(--dt-colors-text-neutral-default, #2f2f4f);
   border-radius: var(--dt-borders-radius-field-default, 6px);
   cursor: pointer;
 }
-._dacoys1-3-11-2 {
+._dacoys1-3-12-0 {
   display: grid;
   align-items: center;
   column-gap: var(--dt-spacings-size-8, 8px);
@@ -24,20 +24,20 @@
   font-weight: var(--dt-typography-text-small-default-weight, 400);
   padding: var(--dt-spacings-size-2, 2px) 0px;
 }
-._dacoys2-3-11-2 {
+._dacoys2-3-12-0 {
   color: var(--dt-colors-text-neutral-default, #2f2f4f);
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   font-size: var(--dt-typography-text-small-default-size, 12px);
 }
-._dacoys3-3-11-2 {
+._dacoys3-3-12-0 {
   font-weight: var(--dt-typography-text-base-emphasized-weight, 500);
 }
-._dacoys4-3-11-2 {
+._dacoys4-3-12-0 {
   font-weight: var(--dt-typography-text-base-default-weight, 400);
 }
-._dacoys5-3-11-2 {
+._dacoys5-3-12-0 {
   color: var(--dt-colors-text-neutral-default, #2f2f4f);
   white-space: nowrap;
   overflow: hidden;
@@ -50,20 +50,20 @@
   width: 100%;
   box-sizing: border-box;
 }
-._dacoys6-3-11-2 {
+._dacoys6-3-12-0 {
   font-weight: var(--dt-typography-text-base-emphasized-weight, 500);
 }
-._dacoys7-3-11-2 {
+._dacoys7-3-12-0 {
   font-weight: var(--dt-typography-text-base-default-weight, 400);
 }
-._dacoys8-3-11-2 {
+._dacoys8-3-12-0 {
   width: 100%;
   box-sizing: border-box;
 }
-._dacoys9-3-11-2 {
+._dacoys9-3-12-0 {
   padding-left: 0;
 }
-._dacoysa-3-11-2 {
+._dacoysa-3-12-0 {
   color: var(--dt-colors-text-neutral-default, #2f2f4f);
   background-color: var(--dt-colors-background-container-neutral-default, #f2f2f5);
   border-radius: var(--dt-borders-radius-field-default, 6px);

package/esm/charts/core/components/tooltip/shared/styles/SeriesBasedContent.sty.js

@@ -1,13 +1,13 @@
 import "../../../../../../styles/textStyle.css";
 import "./SeriesBasedContent.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var detailViewContent = "_dacoys0-3-11-2";
-var detailViewItem = "_dacoys1-3-11-2";
-var multipleDimensionContainer = _7a468({ defaultClassName: "_dacoys5-3-11-2", variantClassNames: { highlighted: { true: "_dacoys6-3-11-2", false: "_dacoys7-3-11-2" } }, defaultVariants: {}, compoundVariants: [] });
-var multipleDimensionItem = "_dacoys8-3-11-2";
-var singleDimensionContainer = _7a468({ defaultClassName: "_dacoys2-3-11-2", variantClassNames: { highlighted: { true: "_dacoys3-3-11-2", false: "_dacoys4-3-11-2" } }, defaultVariants: {}, compoundVariants: [] });
-var valueContainer = "_dacoys9-3-11-2";
-var valueItem = "_dacoysa-3-11-2 _da9a8v0-3-11-2 _da9a8v2-3-11-2 _da9a8v6-3-11-2 _da9a8ve-3-11-2";
+var detailViewContent = "_dacoys0-3-12-0";
+var detailViewItem = "_dacoys1-3-12-0";
+var multipleDimensionContainer = _7a468({ defaultClassName: "_dacoys5-3-12-0", variantClassNames: { highlighted: { true: "_dacoys6-3-12-0", false: "_dacoys7-3-12-0" } }, defaultVariants: {}, compoundVariants: [] });
+var multipleDimensionItem = "_dacoys8-3-12-0";
+var singleDimensionContainer = _7a468({ defaultClassName: "_dacoys2-3-12-0", variantClassNames: { highlighted: { true: "_dacoys3-3-12-0", false: "_dacoys4-3-12-0" } }, defaultVariants: {}, compoundVariants: [] });
+var valueContainer = "_dacoys9-3-12-0";
+var valueItem = "_dacoysa-3-12-0 _da9a8v0-3-12-0 _da9a8v2-3-12-0 _da9a8v6-3-12-0 _da9a8ve-3-12-0";
 export {
   detailViewContent,
   detailViewItem,

package/esm/charts/core/components/tooltip/shared/styles/SeriesBasedContent.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/charts/core/components/tooltip/shared/styles/SeriesBasedContent.css.ts"],
-  "sourcesContent": ["import '../../../../../../styles/textStyle.css';\nimport './SeriesBasedContent.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var detailViewContent = '_dacoys0-3-11-2';\nexport var detailViewItem = '_dacoys1-3-11-2';\nexport var multipleDimensionContainer = _7a468({defaultClassName:'_dacoys5-3-11-2',variantClassNames:{highlighted:{true:'_dacoys6-3-11-2',false:'_dacoys7-3-11-2'}},defaultVariants:{},compoundVariants:[]});\nexport var multipleDimensionItem = '_dacoys8-3-11-2';\nexport var singleDimensionContainer = _7a468({defaultClassName:'_dacoys2-3-11-2',variantClassNames:{highlighted:{true:'_dacoys3-3-11-2',false:'_dacoys4-3-11-2'}},defaultVariants:{},compoundVariants:[]});\nexport var valueContainer = '_dacoys9-3-11-2';\nexport var valueItem = '_dacoysa-3-11-2 _da9a8v0-3-11-2 _da9a8v2-3-11-2 _da9a8v6-3-11-2 _da9a8ve-3-11-2';"],
+  "sourcesContent": ["import '../../../../../../styles/textStyle.css';\nimport './SeriesBasedContent.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var detailViewContent = '_dacoys0-3-12-0';\nexport var detailViewItem = '_dacoys1-3-12-0';\nexport var multipleDimensionContainer = _7a468({defaultClassName:'_dacoys5-3-12-0',variantClassNames:{highlighted:{true:'_dacoys6-3-12-0',false:'_dacoys7-3-12-0'}},defaultVariants:{},compoundVariants:[]});\nexport var multipleDimensionItem = '_dacoys8-3-12-0';\nexport var singleDimensionContainer = _7a468({defaultClassName:'_dacoys2-3-12-0',variantClassNames:{highlighted:{true:'_dacoys3-3-12-0',false:'_dacoys4-3-12-0'}},defaultVariants:{},compoundVariants:[]});\nexport var valueContainer = '_dacoys9-3-12-0';\nexport var valueItem = '_dacoysa-3-12-0 _da9a8v0-3-12-0 _da9a8v2-3-12-0 _da9a8v6-3-12-0 _da9a8ve-3-12-0';"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,oBAAoB;AACxB,IAAI,iBAAiB;AACrB,IAAI,6BAA6B,OAAO,EAAC,kBAAiB,mBAAkB,mBAAkB,EAAC,aAAY,EAAC,MAAK,mBAAkB,OAAM,kBAAiB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACpM,IAAI,wBAAwB;AAC5B,IAAI,2BAA2B,OAAO,EAAC,kBAAiB,mBAAkB,mBAAkB,EAAC,aAAY,EAAC,MAAK,mBAAkB,OAAM,kBAAiB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AAClM,IAAI,iBAAiB;AACrB,IAAI,YAAY;",
   "names": []
 }

package/esm/charts/core/components/tooltip/shared/styles/TooltipBody.css

@@ -1,4 +1,4 @@
-._1rpjobh0-3-11-2 {
+._1rpjobh0-3-12-0 {
   overflow: hidden auto;
   width: 100%;
   height: 100%;

package/esm/charts/core/components/tooltip/shared/styles/TooltipBody.sty.js

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

package/esm/charts/core/components/tooltip/shared/styles/TooltipBody.sty.js.map

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

package/esm/charts/core/components/tooltip-atoms/components/HeaderChipAtom/HeaderChipAtom.css

@@ -1,4 +1,4 @@
-._19a28040-3-11-2 {
+._19a28040-3-12-0 {
   height: 16px;
   min-width: 45px;
   display: flex;

package/esm/charts/core/components/tooltip-atoms/components/HeaderChipAtom/HeaderChipAtom.sty.js

@@ -1,5 +1,5 @@
 import "./HeaderChipAtom.css";
-var headerChipAtom = "_19a28040-3-11-2";
+var headerChipAtom = "_19a28040-3-12-0";
 export {
   headerChipAtom
 };

package/esm/charts/core/components/tooltip-atoms/components/HeaderChipAtom/HeaderChipAtom.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/charts/core/components/tooltip-atoms/components/HeaderChipAtom/HeaderChipAtom.css.ts"],
-  "sourcesContent": ["import './HeaderChipAtom.css';\nexport var headerChipAtom = '_19a28040-3-11-2';"],
+  "sourcesContent": ["import './HeaderChipAtom.css';\nexport var headerChipAtom = '_19a28040-3-12-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,iBAAiB;",
   "names": []
 }

package/esm/charts/core/components/tooltip-atoms/components/styles.css

@@ -1,4 +1,4 @@
-._1b8jnp60-3-11-2 {
+._1b8jnp60-3-12-0 {
   width: 100%;
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
   font-size: var(--dt-typography-text-small-default-size, 12px);
@@ -6,7 +6,7 @@
   overflow: hidden;
   text-overflow: ellipsis;
 }
-._1b8jnp61-3-11-2 {
+._1b8jnp61-3-12-0 {
   height: 16px;
   min-width: 45px;
   display: flex;
@@ -20,7 +20,7 @@
   background-color: var(--dt-colors-background-container-neutral-default, #f2f2f5);
   border-radius: var(--dt-borders-radius-field-subdued, 3px);
 }
-._1b8jnp62-3-11-2 {
+._1b8jnp62-3-12-0 {
   width: 100%;
   color: var(--dt-colors-text-neutral-default, #2f2f4f);
   font-size: var(--dt-typography-text-small-default-size, 12px);
@@ -28,7 +28,7 @@
   overflow: hidden;
   text-overflow: ellipsis;
 }
-._1b8jnp63-3-11-2 {
+._1b8jnp63-3-12-0 {
   height: 24px;
   width: 24px;
   display: flex;

package/esm/charts/core/components/tooltip-atoms/components/styles.sty.js

@@ -1,8 +1,8 @@
 import "./styles.css";
-var chipAtom = "_1b8jnp61-3-11-2";
-var primaryInfo = "_1b8jnp62-3-11-2";
-var secondaryInfo = "_1b8jnp60-3-11-2";
-var symbolAtom = "_1b8jnp63-3-11-2";
+var chipAtom = "_1b8jnp61-3-12-0";
+var primaryInfo = "_1b8jnp62-3-12-0";
+var secondaryInfo = "_1b8jnp60-3-12-0";
+var symbolAtom = "_1b8jnp63-3-12-0";
 export {
   chipAtom,
   primaryInfo,

package/esm/charts/core/components/tooltip-atoms/components/styles.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/core/components/tooltip-atoms/components/styles.css.ts"],
-  "sourcesContent": ["import './styles.css';\nexport var chipAtom = '_1b8jnp61-3-11-2';\nexport var primaryInfo = '_1b8jnp62-3-11-2';\nexport var secondaryInfo = '_1b8jnp60-3-11-2';\nexport var symbolAtom = '_1b8jnp63-3-11-2';"],
+  "sourcesContent": ["import './styles.css';\nexport var chipAtom = '_1b8jnp61-3-12-0';\nexport var primaryInfo = '_1b8jnp62-3-12-0';\nexport var secondaryInfo = '_1b8jnp60-3-12-0';\nexport var symbolAtom = '_1b8jnp63-3-12-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,WAAW;AACf,IAAI,cAAc;AAClB,IAAI,gBAAgB;AACpB,IAAI,aAAa;",
   "names": []
 }

package/esm/charts/core/components/zoom/ZoomCursors.css

@@ -1,8 +1,8 @@
-._1idfwsm0-3-11-2 {
+._1idfwsm0-3-12-0 {
   cursor: ew-resize;
   user-select: none;
   touch-action: pan-y;
 }
-._1idfwsm1-3-11-2 {
+._1idfwsm1-3-12-0 {
   cursor: default;
 }

package/esm/charts/core/components/zoom/ZoomCursors.sty.js

@@ -1,8 +1,8 @@
 import "./ZoomCursors.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var cursorStyle = _7a468({ defaultClassName: "_1idfwsm2-3-11-2", variantClassNames: { isPanEnabled: { true: "_1idfwsm0-3-11-2", false: "_1idfwsm1-3-11-2" } }, defaultVariants: {}, compoundVariants: [] });
-var defaultCursor = "_1idfwsm1-3-11-2";
-var resizeCursor = "_1idfwsm0-3-11-2";
+var cursorStyle = _7a468({ defaultClassName: "_1idfwsm2-3-12-0", variantClassNames: { isPanEnabled: { true: "_1idfwsm0-3-12-0", false: "_1idfwsm1-3-12-0" } }, defaultVariants: {}, compoundVariants: [] });
+var defaultCursor = "_1idfwsm1-3-12-0";
+var resizeCursor = "_1idfwsm0-3-12-0";
 export {
   cursorStyle,
   defaultCursor,

package/esm/charts/core/components/zoom/ZoomCursors.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/core/components/zoom/ZoomCursors.css.ts"],
-  "sourcesContent": ["import './ZoomCursors.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var cursorStyle = _7a468({defaultClassName:'_1idfwsm2-3-11-2',variantClassNames:{isPanEnabled:{true:'_1idfwsm0-3-11-2',false:'_1idfwsm1-3-11-2'}},defaultVariants:{},compoundVariants:[]});\nexport var defaultCursor = '_1idfwsm1-3-11-2';\nexport var resizeCursor = '_1idfwsm0-3-11-2';"],
+  "sourcesContent": ["import './ZoomCursors.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var cursorStyle = _7a468({defaultClassName:'_1idfwsm2-3-12-0',variantClassNames:{isPanEnabled:{true:'_1idfwsm0-3-12-0',false:'_1idfwsm1-3-12-0'}},defaultVariants:{},compoundVariants:[]});\nexport var defaultCursor = '_1idfwsm1-3-12-0';\nexport var resizeCursor = '_1idfwsm0-3-12-0';"],
   "mappings": "AAAA,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,cAAc,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,cAAa,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACzL,IAAI,gBAAgB;AACpB,IAAI,eAAe;",
   "names": []
 }

package/esm/charts/core/context/AriaLabelingContext.js

@@ -0,0 +1,8 @@
+import { createContext, useContext } from "react";
+const AriaLabelingContext = createContext({});
+const useAriaLabelingContext = () => useContext(AriaLabelingContext);
+export {
+  AriaLabelingContext,
+  useAriaLabelingContext
+};
+//# sourceMappingURL=AriaLabelingContext.js.map

package/esm/charts/core/context/AriaLabelingContext.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/charts/core/context/AriaLabelingContext.ts"],
+  "sourcesContent": ["import { type Context, createContext, useContext } from 'react';\n\nimport type { AriaLabelingProps } from '../../../core/types/a11y-props.js';\n\n/**\n * @internal\n * Context carrying the consumer-provided aria-labeling props from a chart's\n * public root down to the internal element that owns `role=\"img\"`, without\n * threading them through every component in between.\n */\nexport const AriaLabelingContext: Context<AriaLabelingProps> =\n  createContext<AriaLabelingProps>({});\n\n/**\n * @internal\n */\nexport const useAriaLabelingContext = () => useContext(AriaLabelingContext);\n"],
+  "mappings": "AAAA,SAAuB,eAAe,kBAAkB;AAUjD,MAAM,sBACX,cAAiC,CAAC,CAAC;AAK9B,MAAM,yBAAyB,MAAM,WAAW,mBAAmB;",
+  "names": []
+}

package/esm/charts/core/slots/Tooltip.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/core/slots/Tooltip.tsx"],
-  "sourcesContent": ["import type { ReactNode } from 'react';\n\n/**\n * @public\n */\nexport type TooltipProps = {\n  hidden?: boolean;\n  children?: (payload: Record<string, unknown>) => ReactNode;\n};\n\nexport const Tooltip = <T extends TooltipProps>(prefix: string) => {\n  const component = (props: T) => null;\n  component['displayName'] = `${prefix}.Tooltip`;\n\n  return component;\n};\n"],
-  "mappings": "AAUO,MAAM,UAAU,CAAyB,WAAmB;AACjE,QAAM,YAAY,CAAC,UAAa;AAChC,YAAU,aAAa,IAAI,GAAG,MAAM;AAEpC,SAAO;AACT;",
+  "sourcesContent": ["import type { ReactNode } from 'react';\n\nimport type { ChartDatapoint } from '../types/chart-data.js';\n\n/**\n * @internal\n */\nexport type TooltipProps<TData extends ChartDatapoint = ChartDatapoint> = {\n  hidden?: boolean;\n  children?: (payload: TData) => ReactNode;\n};\n\n/**\n * @internal\n */\nexport const Tooltip = <T extends TooltipProps>(prefix: string) => {\n  const component = (props: T) => null;\n  component['displayName'] = `${prefix}.Tooltip`;\n\n  return component;\n};\n"],
+  "mappings": "AAeO,MAAM,UAAU,CAAyB,WAAmB;AACjE,QAAM,YAAY,CAAC,UAAa;AAChC,YAAU,aAAa,IAAI,GAAG,MAAM;AAEpC,SAAO;AACT;",
   "names": []
 }

package/esm/charts/core/typographyStyles.css

@@ -1,3 +1,3 @@
-._18u8ey50-3-11-2 {
+._18u8ey50-3-12-0 {
   font-feature-settings: 'ss01';
 }

package/esm/charts/core/typographyStyles.sty.js

@@ -1,5 +1,5 @@
 import "./typographyStyles.css";
-var replaceSlashedZero = "_18u8ey50-3-11-2";
+var replaceSlashedZero = "_18u8ey50-3-12-0";
 export {
   replaceSlashedZero
 };

package/esm/charts/core/typographyStyles.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/charts/core/typographyStyles.css.ts"],
-  "sourcesContent": ["import './typographyStyles.css';\nexport var replaceSlashedZero = '_18u8ey50-3-11-2';"],
+  "sourcesContent": ["import './typographyStyles.css';\nexport var replaceSlashedZero = '_18u8ey50-3-12-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,qBAAqB;",
   "names": []
 }

package/esm/charts/flame/flame-chart/FlameChart.js

@@ -1,24 +1,26 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { units } from "@dynatrace-sdk/units";
-import { Divider } from "../../../layouts/divider/Divider.js";
-import { ChartTooltip } from "../../core/components/overlay-tooltip/OverlayTooltip.js";
 import { ChartVariantContext } from "../../core/context/ChartVariantContext.js";
+import { ColorRule } from "../../core/slots/ColorRule.js";
 import { XYChart } from "../../xy-chart/XYChartRoot.js";
+import { FlameTooltip } from "../shared/components/tooltip/FlameTooltip.js";
 import {
   DEPTH_FIELD,
+  DISPLAY_NAME_FLAME_CHART,
   END_FIELD,
   FLAME_ORIGINAL_IDX,
   START_FIELD,
   VALUE_FIELD,
   XY_DEFAULTS
 } from "../shared/constants.js";
-import { formatFlameValue } from "../shared/utils/format-flame-value.js";
+import { iterateSlots } from "./utils/iterate-slots.js";
+import { FlameChartTooltipSlot as Tooltip } from "../shared/slots/Tooltip.js";
 import { orderSpansHierarchically } from "../shared/utils/order-spans-hierarchically.js";
 const CROSSHAIR_VARIANT = {
   crosshair: { horizontalHidden: true, cursor: "default" }
 };
-function FlameChart({
+const FlameChartRoot = ({
   data,
   idAccessor,
   parentIdAccessor,
@@ -33,8 +35,9 @@ function FlameChart({
   minTime,
   currentZoom,
   seriesActions,
-  height
-}) {
+  height,
+  children
+}) => {
   const orderedData = useMemo(() => {
     const withIndex = data.map((datum, index) => ({
       ...datum,
@@ -68,6 +71,7 @@ function FlameChart({
     const offset = minTime ?? 0;
     return [currentZoom[0] - offset, currentZoom[1] - offset];
   }, [currentZoom, minTime]);
+  const { customTooltipTemplate, colorRules } = iterateSlots(children);
   return /* @__PURE__ */ jsx(ChartVariantContext.Provider, { value: CROSSHAIR_VARIANT, children: /* @__PURE__ */ jsxs(
     XYChart,
     {
@@ -93,7 +97,7 @@ function FlameChart({
           {
             id: XY_DEFAULTS.xAxisId,
             type: "numerical",
-            position: "top",
+            position: orientation === "bottom-up" ? "bottom" : "top",
             formatter: { input: units.time.millisecond },
             currentZoom: normalizedZoom,
             infiniteZoom: true
@@ -111,43 +115,45 @@ function FlameChart({
         ),
         /* @__PURE__ */ jsx(XYChart.Legend, { hidden: true }),
         /* @__PURE__ */ jsx(XYChart.Toolbar, { hidden: true }),
+        colorRules,
         /* @__PURE__ */ jsx(XYChart.Tooltip, { children: (payload) => {
           const datapoint = payload.rectPayload?.datapoint;
-          const label = String(datapoint?.[labelAccessor] ?? "");
-          const selfDescription = selfValueAccessor !== void 0 ? `Self: ${formatFlameValue(
-            datapoint?.[selfValueAccessor],
-            valueFormatter
-          )}` : void 0;
-          const actions = seriesActions && datapoint ? () => seriesActions(data[datapoint[FLAME_ORIGINAL_IDX]]) : void 0;
-          return /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(ChartTooltip.Header, { header1: label }),
-            /* @__PURE__ */ jsx(
-              Divider,
-              {
-                orientation: "horizontal",
-                style: { marginBottom: "4px" }
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              ChartTooltip.SeriesItem,
-              {
-                color: `${payload.rectPayload?.color}`,
-                name: "Total",
-                value: formatFlameValue(
-                  datapoint?.[VALUE_FIELD],
-                  valueFormatter
-                ),
-                description: selfDescription,
-                actions
-              }
-            )
-          ] });
+          if (!datapoint) {
+            return;
+          }
+          if (customTooltipTemplate) {
+            const template = customTooltipTemplate(datapoint);
+            if (template === null) {
+              return null;
+            }
+            if (template) {
+              return template;
+            }
+          }
+          return /* @__PURE__ */ jsx(
+            FlameTooltip,
+            {
+              payload,
+              data,
+              labelAccessor,
+              valueField: VALUE_FIELD,
+              selfValueAccessor,
+              valueFormatter,
+              seriesActions
+            }
+          );
         } })
       ]
     }
   ) });
-}
+};
+const FlameChart = Object.assign(FlameChartRoot, {
+  Tooltip,
+  ColorRule
+});
+FlameChart.displayName = DISPLAY_NAME_FLAME_CHART;
 export {
-  FlameChart
+  FlameChart,
+  FlameChartRoot
 };
 //# sourceMappingURL=FlameChart.js.map

package/esm/charts/flame/flame-chart/FlameChart.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/flame/flame-chart/FlameChart.tsx"],
-  "sourcesContent": ["import { useMemo } from 'react';\n\nimport { units } from '@dynatrace-sdk/units';\n\nimport { Divider } from '../../../layouts/divider/Divider.js';\nimport { ChartTooltip } from '../../core/components/overlay-tooltip/OverlayTooltip.js';\nimport { ChartVariantContext } from '../../core/context/ChartVariantContext.js';\nimport type { ChartDatapoint } from '../../core/types/chart-data.js';\nimport { XYChart } from '../../xy-chart/XYChartRoot.js';\nimport {\n  DEPTH_FIELD,\n  END_FIELD,\n  FLAME_ORIGINAL_IDX,\n  START_FIELD,\n  VALUE_FIELD,\n  XY_DEFAULTS,\n} from '../shared/constants.js';\nimport type { FlameChartProps } from '../shared/types/flame-chart.js';\nimport { formatFlameValue } from '../shared/utils/format-flame-value.js';\nimport { orderSpansHierarchically } from '../shared/utils/order-spans-hierarchically.js';\n\nconst CROSSHAIR_VARIANT = {\n  crosshair: { horizontalHidden: true, cursor: 'default' as const },\n};\n\n/** @internal */\nexport function FlameChart<TData extends ChartDatapoint = ChartDatapoint>({\n  data,\n  idAccessor,\n  parentIdAccessor,\n  startAccessor,\n  endAccessor,\n  selfValueAccessor,\n  labelAccessor,\n  colorPalette,\n  orientation = 'bottom-up',\n  truncationMode,\n  valueFormatter,\n  minTime,\n  currentZoom,\n  seriesActions,\n  height,\n}: FlameChartProps<TData>) {\n  const orderedData = useMemo(() => {\n    const withIndex = data.map((datum, index) => ({\n      ...datum,\n      [FLAME_ORIGINAL_IDX]: index,\n    }));\n    const ordered = orderSpansHierarchically(withIndex, {\n      spanIdAccessor: idAccessor,\n      parentIdAccessor,\n      x0Accessor: startAccessor,\n      x1Accessor: endAccessor,\n    });\n\n    const offset = minTime ?? 0;\n    const output: ChartDatapoint[] = new Array(ordered.length);\n    for (let i = 0; i < ordered.length; i++) {\n      const span = ordered[i];\n      const start = Number(span[startAccessor] ?? 0);\n      const end = Number(span[endAccessor] ?? 0);\n      output[i] = {\n        ...span,\n        [START_FIELD]: start - offset,\n        [END_FIELD]: end - offset,\n        [VALUE_FIELD]: end - start,\n      };\n    }\n    return output;\n  }, [data, idAccessor, parentIdAccessor, startAccessor, endAccessor, minTime]);\n\n  const normalizedZoom = useMemo<[number, number] | undefined>(() => {\n    if (!currentZoom) {\n      return undefined;\n    }\n    const offset = minTime ?? 0;\n    return [currentZoom[0] - offset, currentZoom[1] - offset];\n  }, [currentZoom, minTime]);\n\n  return (\n    <ChartVariantContext.Provider value={CROSSHAIR_VARIANT}>\n      <XYChart\n        data={orderedData}\n        truncationMode={truncationMode}\n        height={height}\n      >\n        <XYChart.RectSeries\n          x0Accessor={START_FIELD}\n          x1Accessor={END_FIELD}\n          y0Accessor={DEPTH_FIELD}\n          valueAccessor={VALUE_FIELD}\n          colorPalette={colorPalette}\n          _labelAccessor={labelAccessor}\n          xAxisId={XY_DEFAULTS.xAxisId}\n          yAxisId={XY_DEFAULTS.yAxisId}\n        />\n        <XYChart.XAxis\n          id={XY_DEFAULTS.xAxisId}\n          type=\"numerical\"\n          position=\"top\"\n          formatter={{ input: units.time.millisecond }}\n          currentZoom={normalizedZoom}\n          infiniteZoom\n        />\n        <XYChart.YAxis\n          id={XY_DEFAULTS.yAxisId}\n          type=\"categorical\"\n          position=\"left\"\n          hidden\n          reversed={orientation === 'bottom-up'}\n        />\n        <XYChart.Legend hidden />\n        <XYChart.Toolbar hidden />\n        <XYChart.Tooltip>\n          {(payload) => {\n            const datapoint = payload.rectPayload?.datapoint;\n            const label = String(datapoint?.[labelAccessor] ?? '');\n            const selfDescription =\n              selfValueAccessor !== undefined\n                ? `Self: ${formatFlameValue(\n                    datapoint?.[selfValueAccessor],\n                    valueFormatter,\n                  )}`\n                : undefined;\n            const actions =\n              seriesActions && datapoint\n                ? () =>\n                    seriesActions(data[datapoint[FLAME_ORIGINAL_IDX] as number])\n                : undefined;\n\n            return (\n              <>\n                <ChartTooltip.Header header1={label} />\n                <Divider\n                  orientation=\"horizontal\"\n                  style={{ marginBottom: '4px' }}\n                />\n                <ChartTooltip.SeriesItem\n                  color={`${payload.rectPayload?.color}`}\n                  name=\"Total\"\n                  value={formatFlameValue(\n                    datapoint?.[VALUE_FIELD],\n                    valueFormatter,\n                  )}\n                  description={selfDescription}\n                  actions={actions}\n                />\n              </>\n            );\n          }}\n        </XYChart.Tooltip>\n      </XYChart>\n    </ChartVariantContext.Provider>\n  );\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { type PropsWithChildren, useMemo } from 'react';\n\nimport { units } from '@dynatrace-sdk/units';\n\nimport { ChartVariantContext } from '../../core/context/ChartVariantContext.js';\nimport { ColorRule } from '../../core/slots/ColorRule.js';\nimport type { ChartDatapoint } from '../../core/types/chart-data.js';\nimport { XYChart } from '../../xy-chart/XYChartRoot.js';\nimport { FlameTooltip } from '../shared/components/tooltip/FlameTooltip.js';\nimport {\n  DEPTH_FIELD,\n  DISPLAY_NAME_FLAME_CHART,\n  END_FIELD,\n  FLAME_ORIGINAL_IDX,\n  START_FIELD,\n  VALUE_FIELD,\n  XY_DEFAULTS,\n} from '../shared/constants.js';\nimport { iterateSlots } from './utils/iterate-slots.js';\nimport { FlameChartTooltipSlot as Tooltip } from '../shared/slots/Tooltip.js';\nimport type { FlameChartProps } from '../shared/types/flame-chart.js';\nimport { orderSpansHierarchically } from '../shared/utils/order-spans-hierarchically.js';\n\nconst CROSSHAIR_VARIANT = {\n  crosshair: { horizontalHidden: true, cursor: 'default' as const },\n};\n\n/**\n * @internal\n */\nexport const FlameChartRoot = /* @__PURE__ */ <\n  TData extends ChartDatapoint = ChartDatapoint,\n>({\n  data,\n  idAccessor,\n  parentIdAccessor,\n  startAccessor,\n  endAccessor,\n  selfValueAccessor,\n  labelAccessor,\n  colorPalette,\n  orientation = 'bottom-up',\n  truncationMode,\n  valueFormatter,\n  minTime,\n  currentZoom,\n  seriesActions,\n  height,\n  children,\n}: PropsWithChildren<FlameChartProps<TData>>) => {\n  const orderedData = useMemo(() => {\n    const withIndex = data.map((datum, index) => ({\n      ...datum,\n      [FLAME_ORIGINAL_IDX]: index,\n    }));\n    const ordered = orderSpansHierarchically(withIndex, {\n      spanIdAccessor: idAccessor,\n      parentIdAccessor,\n      x0Accessor: startAccessor,\n      x1Accessor: endAccessor,\n    });\n\n    const offset = minTime ?? 0;\n    const output: ChartDatapoint[] = new Array(ordered.length);\n    for (let i = 0; i < ordered.length; i++) {\n      const span = ordered[i];\n      const start = Number(span[startAccessor] ?? 0);\n      const end = Number(span[endAccessor] ?? 0);\n      output[i] = {\n        ...span,\n        [START_FIELD]: start - offset,\n        [END_FIELD]: end - offset,\n        [VALUE_FIELD]: end - start,\n      };\n    }\n    return output;\n  }, [data, idAccessor, parentIdAccessor, startAccessor, endAccessor, minTime]);\n\n  const normalizedZoom = useMemo<[number, number] | undefined>(() => {\n    if (!currentZoom) {\n      return undefined;\n    }\n    const offset = minTime ?? 0;\n    return [currentZoom[0] - offset, currentZoom[1] - offset];\n  }, [currentZoom, minTime]);\n\n  const { customTooltipTemplate, colorRules } = iterateSlots<TData>(children);\n\n  return (\n    <ChartVariantContext.Provider value={CROSSHAIR_VARIANT}>\n      <XYChart\n        data={orderedData}\n        truncationMode={truncationMode}\n        height={height}\n      >\n        <XYChart.RectSeries\n          x0Accessor={START_FIELD}\n          x1Accessor={END_FIELD}\n          y0Accessor={DEPTH_FIELD}\n          valueAccessor={VALUE_FIELD}\n          colorPalette={colorPalette}\n          _labelAccessor={labelAccessor}\n          xAxisId={XY_DEFAULTS.xAxisId}\n          yAxisId={XY_DEFAULTS.yAxisId}\n        />\n        <XYChart.XAxis\n          id={XY_DEFAULTS.xAxisId}\n          type=\"numerical\"\n          position={orientation === 'bottom-up' ? 'bottom' : 'top'}\n          formatter={{ input: units.time.millisecond }}\n          currentZoom={normalizedZoom}\n          infiniteZoom\n        />\n        <XYChart.YAxis\n          id={XY_DEFAULTS.yAxisId}\n          type=\"categorical\"\n          position=\"left\"\n          hidden\n          reversed={orientation === 'bottom-up'}\n        />\n        <XYChart.Legend hidden />\n        <XYChart.Toolbar hidden />\n        {colorRules}\n        <XYChart.Tooltip>\n          {(payload) => {\n            const datapoint = payload.rectPayload?.datapoint as\n              | TData\n              | undefined;\n\n            if (!datapoint) {\n              return;\n            }\n\n            if (customTooltipTemplate) {\n              const template = customTooltipTemplate(datapoint);\n\n              if (template === null) {\n                return null;\n              }\n              if (template) {\n                return template;\n              }\n            }\n\n            return (\n              <FlameTooltip\n                payload={payload}\n                data={data}\n                labelAccessor={labelAccessor}\n                valueField={VALUE_FIELD}\n                selfValueAccessor={selfValueAccessor}\n                valueFormatter={valueFormatter}\n                seriesActions={seriesActions}\n              />\n            );\n          }}\n        </XYChart.Tooltip>\n      </XYChart>\n    </ChartVariantContext.Provider>\n  );\n};\n\n/** @internal */\nexport const FlameChart = Object.assign(FlameChartRoot, {\n  Tooltip,\n  ColorRule,\n});\n\n(FlameChart as typeof FlameChart & { displayName: string }).displayName =\n  DISPLAY_NAME_FLAME_CHART;\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/charts/flame/flame-chart/utils/iterate-slots.js

@@ -0,0 +1,19 @@
+import { Children } from "react";
+import { isSlot } from "../../../../core/utils/is-slot.js";
+import { ColorRule, isValidColorRule } from "../../../core/slots/ColorRule.js";
+import { FlameChartTooltipSlot } from "../../shared/slots/Tooltip.js";
+const iterateSlots = (children) => {
+  const slots = { customTooltipTemplate: void 0, colorRules: [] };
+  Children.forEach(children, (child) => {
+    if (isSlot(child, FlameChartTooltipSlot)) {
+      slots.customTooltipTemplate = child.props.children;
+    } else if (isSlot(child, ColorRule) && isValidColorRule(child.props)) {
+      slots.colorRules.push(child);
+    }
+  });
+  return slots;
+};
+export {
+  iterateSlots
+};
+//# sourceMappingURL=iterate-slots.js.map

package/esm/charts/flame/flame-chart/utils/iterate-slots.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/charts/flame/flame-chart/utils/iterate-slots.ts"],
+  "sourcesContent": ["import { Children, type ReactNode } from 'react';\n\nimport { isSlot } from '../../../../core/utils/is-slot.js';\nimport { ColorRule, isValidColorRule } from '../../../core/slots/ColorRule.js';\nimport type { ChartDatapoint } from '../../../core/types/chart-data.js';\nimport { FlameChartTooltipSlot } from '../../shared/slots/Tooltip.js';\nimport type {\n  CustomTooltipTemplate,\n  Slots,\n} from '../../shared/types/flame-internal.js';\n\nexport const iterateSlots = <TData extends ChartDatapoint = ChartDatapoint>(\n  children: ReactNode,\n): Slots<TData> => {\n  const slots: Slots<TData> = { customTooltipTemplate: undefined, colorRules: [] };\n\n  Children.forEach(children, (child) => {\n    if (isSlot(child, FlameChartTooltipSlot)) {\n      slots.customTooltipTemplate = child.props\n        .children as CustomTooltipTemplate<TData>;\n    } else if (isSlot(child, ColorRule) && isValidColorRule(child.props)) {\n      slots.colorRules.push(child);\n    }\n  });\n\n  return slots;\n};\n"],
+  "mappings": "AAAA,SAAS,gBAAgC;AAEzC,SAAS,cAAc;AACvB,SAAS,WAAW,wBAAwB;AAE5C,SAAS,6BAA6B;AAM/B,MAAM,eAAe,CAC1B,aACiB;AACjB,QAAM,QAAsB,EAAE,uBAAuB,QAAW,YAAY,CAAC,EAAE;AAE/E,WAAS,QAAQ,UAAU,CAAC,UAAU;AACpC,QAAI,OAAO,OAAO,qBAAqB,GAAG;AACxC,YAAM,wBAAwB,MAAM,MACjC;AAAA,IACL,WAAW,OAAO,OAAO,SAAS,KAAK,iBAAiB,MAAM,KAAK,GAAG;AACpE,YAAM,WAAW,KAAK,KAAK;AAAA,IAC7B;AAAA,EACF,CAAC;AAED,SAAO;AACT;",
+  "names": []
+}