@dynatrace/strato-components 3.4.1 → 3.5.2

package/charts/honeycomb/HoneycombChart.css

@@ -1,3 +1,3 @@
-._p8cogi0-3-4-1 {
+._p8cogi0-3-5-2 {
   position: relative;
 }

package/charts/honeycomb/HoneycombChart.sty.js

@@ -21,4 +21,4 @@ __export(HoneycombChart_css_exports, {
 });
 module.exports = __toCommonJS(HoneycombChart_css_exports);
 var import_HoneycombChart_css_ts_vanilla = require("./HoneycombChart.css");
-var graphContainer = "_p8cogi0-3-4-1";
+var graphContainer = "_p8cogi0-3-5-2";

package/charts/honeycomb/components/HiveOverlay.css

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

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

@@ -21,4 +21,4 @@ __export(HiveOverlay_css_exports, {
 });
 module.exports = __toCommonJS(HiveOverlay_css_exports);
 var import_HiveOverlay_css_ts_vanilla = require("./HiveOverlay.css");
-var overlay = "_lmrhfg0-3-4-1";
+var overlay = "_lmrhfg0-3-5-2";

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

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

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

@@ -21,4 +21,4 @@ __export(HiveCanvasLayout_css_exports, {
 });
 module.exports = __toCommonJS(HiveCanvasLayout_css_exports);
 var import_HiveCanvasLayout_css_ts_vanilla = require("./HiveCanvasLayout.css");
-var canvasContainer = "_12htcxh0-3-4-1";
+var canvasContainer = "_12htcxh0-3-5-2";

package/charts/index.d.ts

@@ -62,7 +62,7 @@ export type { ChartTooltipProps as _ChartTooltipProps } from './core/components/
 export { ChartTooltipSlots as _ChartTooltipSlots } from './core/components/tooltip/types/ChartTooltip.config.js';
 export { ChartTooltipAtoms as _ChartTooltipAtoms } from './core/components/tooltip/types/ChartTooltip.config.js';
 export { ChartTooltipTemplate as _ChartTooltipTemplate } from './core/components/tooltip/types/ChartTooltip.config.js';
-export type { TooltipItem } from './core/types/tooltip.js';
+export type { TooltipItem, ChartTooltipConfigProps, } from './core/types/tooltip.js';
 export type { PrimaryAtomProps as _PrimaryAtomProps } from './core/components/tooltip-atoms/components/PrimaryAtom.js';
 export type { SecondaryAtomProps as _SecondaryAtomProps } from './core/components/tooltip-atoms/components/SecondaryAtom.js';
 export type { DurationChipAtomProps as _DurationChipAtomProps } from './core/components/tooltip-atoms/components/DurationChipAtom/DurationChipAtom.js';
@@ -91,6 +91,7 @@ export { DurationChip as _DurationChip } from './core/components/tooltip/ChartTo
 export type { DurationChipProps as _DurationChipProps } from './core/components/tooltip/ChartTooltip/components/DurationChip.js';
 export { SharedChartInteractions } from './core/components/shared-chart-interactions/SharedChartInteractions.js';
 export { OverlayTooltip as _OverlayTooltip } from './core/components/overlay-tooltip/OverlayTooltip.js';
+export { ChartTooltip } from './core/components/overlay-tooltip/OverlayTooltip.js';
 export { GEO_DEFAULTS as _GEO_DEFAULTS } from './core/components/overlay-tooltip/defaults.js';
 export { useDefaultConfig as _useDefaultConfig } from './core/components/overlay-tooltip/hooks/useDefaultConfig.js';
 export { useDefaultLabels as _useDefaultLabels } from './core/components/overlay-tooltip/hooks/useDefaultLabels.js';
@@ -98,15 +99,14 @@ export type { DefaultConfigByGeoLayer as _DefaultConfigByGeoLayer } from './core
 export { OverlayProvider as _OverlayProvider, useOverlay as _useOverlayChart, } from './core/components/overlay-tooltip/contexts/OverlayContext.js';
 export { TooltipProvider as _OverlayTooltipProvider, useTooltip as _useOverlayTooltipStore, } from './core/components/overlay-tooltip/contexts/TooltipContext.js';
 export { useTooltipReducer as _useOverlayTooltipReducer } from './core/components/overlay-tooltip/useTooltipReducer.js';
-export type { OverlayTooltipBaseProps as _OverlayTooltipBaseProps, OverlayTooltipUncontrolledProps as _OverlayTooltipUncontrolledProps, OverlayTooltipControlledProps as _OverlayTooltipControlledProps, TooltipState as _OverlayTooltipState, TooltipStore as _OverlayTooltipStoreType, OverlayTooltipProps as _OverlayTooltipProps, Data as _OverlayTooltipData, NoData as _OverlayTooltipNoData, HeaderData as _OverlayTooltipHeaderData, TooltipValue as _OverlayTooltipValue, GeometryTypes as _OverlayTooltipGeometryTypes, GeometryTypesEnum as _GeometryTypesEnum, SeriesHeaderProps as _OverlayTooltipSeriesHeaderProps, Positions as _OverlayTooltipPositions, Overlay as _OverlayTooltipOverlay, SeriesName as _OverlayTooltipSeriesName, GeoLayerTypes as _OverlayTooltipGeoLayerTypes, DefaultConfig as _OverlayTooltipDefaultConfig, FormatStrategy as _OverlayTooltipFormatStrategy, TooltipAction as _OverlayTooltipAction, DefaultConfigByGeometry as _OverlayTooltipDefaultConfigByGeometry, Geometry as _OverlayTooltipGeometry, } from './core/components/overlay-tooltip/types.js';
-export type { ActionProps as _OverlayTooltipActionProps } from './core/components/overlay-tooltip/components/global-actions/Action.js';
-export type { ActionsPlaceholderProps as _OverlayTooltipActionsPlaceholderProps } from './core/components/overlay-tooltip/components/global-actions/ActionsPlaceholder.js';
-export type { HeaderProps as _OverlayTooltipHeaderProps, HeaderDataWithDuration as _OverlayTooltipHeaderDataWithDuration, HeaderDataInformation as _OverlayTooltipHeaderDataInformation, } from './core/components/overlay-tooltip/components/header/types/header.js';
+export type { OverlayTooltipBaseProps as _OverlayTooltipBaseProps, OverlayTooltipUncontrolledProps as _OverlayTooltipUncontrolledProps, OverlayTooltipControlledProps as _OverlayTooltipControlledProps, TooltipState as _OverlayTooltipState, TooltipStore as _OverlayTooltipStoreType, OverlayTooltipProps as _OverlayTooltipProps, Data as _OverlayTooltipData, NoData as _OverlayTooltipNoData, HeaderData, TooltipValue, GeometryTypes as _OverlayTooltipGeometryTypes, GeometryTypesEnum as _GeometryTypesEnum, SeriesHeaderProps, Positions as _OverlayTooltipPositions, Overlay as _OverlayTooltipOverlay, SeriesName, GeoLayerTypes as _OverlayTooltipGeoLayerTypes, DefaultConfig as _OverlayTooltipDefaultConfig, FormatStrategy as _OverlayTooltipFormatStrategy, TooltipAction as _OverlayTooltipAction, DefaultConfigByGeometry as _OverlayTooltipDefaultConfigByGeometry, Geometry as _OverlayTooltipGeometry, } from './core/components/overlay-tooltip/types.js';
+export type { ActionProps } from './core/components/overlay-tooltip/components/global-actions/Action.js';
+export type { ActionsPlaceholderProps } from './core/components/overlay-tooltip/components/global-actions/ActionsPlaceholder.js';
+export type { HeaderProps as _ChartTooltipHeaderProps, HeaderDataWithDuration as _HeaderDataWithDuration, HeaderDataInformation as _HeaderDataInformation, } from './core/components/overlay-tooltip/components/header/types/header.js';
 export { useDefaultLabels as _useOverlayTooltipDefaultLabels } from './core/components/overlay-tooltip/hooks/useDefaultLabels.js';
 export type { Defaults as _OverlayTooltipDefaults } from './core/components/overlay-tooltip/hooks/useDefaultLabels.js';
 export { OverlayTooltipHeaderStory as _OverlayTooltipHeaderStory, OverlayTooltipTruncationStory as _OverlayTooltipTruncationStory, OverlayTooltipWIPStory as _OverlayTooltipWIPStory, OverlayTooltipCustomStory as _OverlayTooltipCustomStory, } from './core/components/overlay-tooltip/_to-be-removed/_OverlayTooltipWIPStory.js';
-export type { TruncationMode as _OverlayTooltipTruncationMode } from './core/components/text-ellipsis/ChartTextEllipsis.js';
-export type { SeriesItemProps as _OverlayTooltipSeriesItemProps, ShapeSeriesItemProps as _OverlayTooltipShapeSeriesItemProps, SymbolSeriesItemProps as _OverlayTooltipSymbolSeriesItemProps, IconSeriesItemProps as _OverlayTooltipIconSeriesItemProps, BaseSeriesItemProps as _OverlayTooltipBaseSeriesItemProps, SeriesItemActions as _OverlayTooltipSeriesItemActions, TooltipTruncationOptions as _OverlayTooltipTooltipTruncationOptions, TruncationModeMultiLine as _OverlayTooltipTruncationModeMultiLine, TruncationModeMaxLines as _OverlayTooltipTruncationModeMaxLines, IconStyle as _OverlayTooltipIconStyle, Series as _OverlayTooltipSeriesData, } from './core/components/overlay-tooltip/types/series.js';
+export type { SeriesItemProps, ShapeSeriesItemProps, SymbolSeriesItemProps, IconSeriesItemProps, BaseSeriesItemProps, SeriesItemActions, TooltipTruncationOptions, TruncationModeMultiLine, TruncationModeMaxLines, IconStyle, Series, } from './core/components/overlay-tooltip/types/series.js';
 export type { useTooltipReducer as _OverlayTooltipReducerType } from './core/components/overlay-tooltip/useTooltipReducer.js';
 export { SIXTY_FPS as _FPS, DEFAULT_TRUNCATION_MODE, CSS_DOWNLOAD_FILENAME, } from './core/constants.js';
 export { getTabIndexValue as _getTabIndexValue } from './core/utils/a11yToolbarControls.js';
@@ -146,7 +146,7 @@ export type { ChartUnit } from './core/types/chart-unit.js';
 export type { ColorPalette, CustomColorPalette, ColorPaletteMode, ColorToken, AutomaticColorPalette as _AutomaticColorPalette, ThemedColorPalette as _ThemedColorPalette, ColorPaletteDefinition as _ColorPaletteDefinition, } from './core/types/color-palette.js';
 export type { DateString } from './core/types/dates.js';
 export type { Dimensions as _Dimensions } from './core/types/dimensions.js';
-export type { Formatter, TimeFormatter } from './core/types/formatter.js';
+export type { CategoricalFormatter, Formatter, TimeFormatter, } from './core/types/formatter.js';
 export type { LegendPosition, LegendRatio, LegendProps, ChartLegendOrientation as _ChartLegendOrientation, legendPositionOptions, } from './core/types/legend.js';
 export type { MaxScaleBoundary, MinScaleBoundary, } from './core/types/min-max-config.js';
 export type { AxisScaleType, ValueRepresentation, axisScaleTypeOptions, valueRepresentationOptions, } from './core/types/scales.js';
@@ -191,7 +191,7 @@ export { PieChart } from './pie/PieChart.js';
 export { DonutChart } from './pie/DonutChart.js';
 export { DonutChartConfig, PieChartConfig, } from './pie/context/ChartConfigContext.js';
 export type { DonutChartRef, PieChartRef } from './pie/types/pie-chart-ref.js';
-export type { DonutChartData, DonutChartLegendConfig, DonutChartProps, GroupConfig, InnerHandler, InnerParams, LabelTypeOptions, LabelsConfig, PieChartConfiguration, PieChartContextConfig, PieChartData, PieChartLegendConfig, PieChartProps, SliceData, SliceUnit, ThresholdConfig, ThresholdType, thresholdTypeOptions, } from './pie/types/pie-chart.config.js';
+export type { DonutChartData, DonutChartLegendConfig, DonutChartProps, DonutChartCustomTooltipProps, GroupConfig, InnerHandler, InnerParams, LabelTypeOptions, LabelsConfig, PieChartConfiguration, PieChartContextConfig, PieChartCustomTooltipConfig, PieChartData, PieChartLegendConfig, PieChartProps, PieChartTooltipPayload, PieChartCustomTooltipProps, SliceData, SliceUnit, ThresholdConfig, ThresholdType, thresholdTypeOptions, } from './pie/types/pie-chart.config.js';
 export type { PieChartSlotProps } from './pie/types/toolbar.js';
 export type { PieChartToolbarSlotProps } from './pie/types/toolbar.js';
 export type { PieChartToolbarConfig } from './pie/types/toolbar.js';

package/charts/index.js

@@ -25,6 +25,7 @@ __export(charts_exports, {
   ChartInteractions: () => import_ChartInteractions.ChartInteractions,
   ChartSeriesAction: () => import_ChartSeriesAction.ChartSeriesAction,
   ChartToolbar: () => import_ChartToolbar.ChartToolbar,
+  ChartTooltip: () => import_OverlayTooltip2.ChartTooltip,
   DEFAULT_TRUNCATION_MODE: () => import_constants.DEFAULT_TRUNCATION_MODE,
   DonutChart: () => import_DonutChart.DonutChart,
   DonutChartConfig: () => import_ChartConfigContext.DonutChartConfig,
@@ -182,6 +183,7 @@ var import_TextHeader = require("./core/components/tooltip/ChartTooltip/componen
 var import_DurationChip = require("./core/components/tooltip/ChartTooltip/components/DurationChip.js");
 var import_SharedChartInteractions = require("./core/components/shared-chart-interactions/SharedChartInteractions.js");
 var import_OverlayTooltip = require("./core/components/overlay-tooltip/OverlayTooltip.js");
+var import_OverlayTooltip2 = require("./core/components/overlay-tooltip/OverlayTooltip.js");
 var import_defaults = require("./core/components/overlay-tooltip/defaults.js");
 var import_useDefaultConfig = require("./core/components/overlay-tooltip/hooks/useDefaultConfig.js");
 var import_useDefaultLabels = require("./core/components/overlay-tooltip/hooks/useDefaultLabels.js");

package/charts/meter-bar/shared/components/meter-bar-layout/MeterBarLayout.css

@@ -1,68 +1,68 @@
-._1m3udw10-3-4-1 {
+._1m3udw10-3-5-2 {
   display: flex;
   justify-content: center;
   grid-area: value;
   align-self: self-end;
   justify-self: end;
 }
-._1m3udw11-3-4-1 {
+._1m3udw11-3-5-2 {
   margin-bottom: var(--dt-spacings-size-2, 2px);
   align-items: center;
   height: 20px;
 }
-._1m3udw12-3-4-1 {
+._1m3udw12-3-5-2 {
   margin-bottom: var(--dt-spacings-size-4, 4px);
   align-items: end;
   height: 100%;
 }
-._1m3udw13-3-4-1 {
+._1m3udw13-3-5-2 {
   min-width: 0;
   transition: margin-right var(--dt-animations-move-duration-fast, 150ms) var(--dt-animations-move-easing, cubic-bezier(0.4, 0, 0.2, 1));
 }
-._1m3udw14-3-4-1 {
+._1m3udw14-3-5-2 {
   display: flex;
   align-items: center;
   justify-content: flex-end;
   transition: all var(--dt-animations-move-duration-fast, 150ms) var(--dt-animations-move-easing, cubic-bezier(0.4, 0, 0.2, 1));
 }
-._1m3udw15-3-4-1 {
+._1m3udw15-3-5-2 {
   margin-top: var(--dt-spacings-size-4, 4px);
   grid-area: min;
   align-self: center;
 }
-._1m3udw16-3-4-1 {
+._1m3udw16-3-5-2 {
   margin-top: var(--dt-spacings-size-4, 4px);
   grid-area: max;
   align-self: center;
   justify-self: end;
 }
-._1m3udw17-3-4-1 {
+._1m3udw17-3-5-2 {
   grid-area: legend;
   margin: var(--dt-spacings-size-4, 4px) 0 var(--dt-spacings-size-4, 4px);
 }
-._1m3udw18-3-4-1 {
+._1m3udw18-3-5-2 {
   gap: var(--dt-spacings-size-4, 4px);
   margin-bottom: var(--dt-spacings-size-2, 2px);
   grid-area: label;
 }
-._1m3udw19-3-4-1 {
+._1m3udw19-3-5-2 {
   grid-area: chart;
 }
-._1m3udw1a-3-4-1 {
+._1m3udw1a-3-5-2 {
   width: 100%;
 }
-._1m3udw1b-3-4-1 {
+._1m3udw1b-3-5-2 {
   height: 100%;
 }
-._1m3udw1c-3-4-1 {
+._1m3udw1c-3-5-2 {
   height: fit-content;
 }
-._1m3udw1d-3-4-1 {
+._1m3udw1d-3-5-2 {
   position: relative;
   display: block;
   cursor: default;
   user-select: none;
 }
-._1m3udw1e-3-4-1 {
+._1m3udw1e-3-5-2 {
   overflow: hidden;
 }

package/charts/meter-bar/shared/components/meter-bar-layout/MeterBarLayout.sty.js

@@ -31,13 +31,13 @@ __export(MeterBarLayout_css_exports, {
 module.exports = __toCommonJS(MeterBarLayout_css_exports);
 var import_MeterBarLayout_css_ts_vanilla = require("./MeterBarLayout.css");
 var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var chartContainer = "_1m3udw19-3-4-1";
-var container = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_1m3udw1a-3-4-1", variantClassNames: { autoSize: { true: "_1m3udw1b-3-4-1", false: "_1m3udw1c-3-4-1" }, showLoading: { true: "_1m3udw1d-3-4-1" } }, defaultVariants: {}, compoundVariants: [] });
-var containerWrapper = "_1m3udw1e-3-4-1";
-var labelContainer = "_1m3udw18-3-4-1";
-var legendContainer = "_1m3udw17-3-4-1";
-var maxContainer = "_1m3udw16-3-4-1";
-var minContainer = "_1m3udw15-3-4-1";
-var toolbarAnimatedContainer = "_1m3udw14-3-4-1";
-var valueAnimatedContainer = "_1m3udw13-3-4-1";
-var valueContainer = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_1m3udw10-3-4-1", variantClassNames: { inline: { true: "_1m3udw11-3-4-1", false: "_1m3udw12-3-4-1" } }, defaultVariants: {}, compoundVariants: [] });
+var chartContainer = "_1m3udw19-3-5-2";
+var container = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_1m3udw1a-3-5-2", variantClassNames: { autoSize: { true: "_1m3udw1b-3-5-2", false: "_1m3udw1c-3-5-2" }, showLoading: { true: "_1m3udw1d-3-5-2" } }, defaultVariants: {}, compoundVariants: [] });
+var containerWrapper = "_1m3udw1e-3-5-2";
+var labelContainer = "_1m3udw18-3-5-2";
+var legendContainer = "_1m3udw17-3-5-2";
+var maxContainer = "_1m3udw16-3-5-2";
+var minContainer = "_1m3udw15-3-5-2";
+var toolbarAnimatedContainer = "_1m3udw14-3-5-2";
+var valueAnimatedContainer = "_1m3udw13-3-5-2";
+var valueContainer = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_1m3udw10-3-5-2", variantClassNames: { inline: { true: "_1m3udw11-3-5-2", false: "_1m3udw12-3-5-2" } }, defaultVariants: {}, compoundVariants: [] });

package/charts/meter-bar/shared/components/meter-bar-layout/slots/Icon/Icon.css

@@ -1,9 +1,9 @@
-._18riimf0-3-4-1 {
+._18riimf0-3-5-2 {
   width: 20px;
   height: 20px;
   color: var(--dt-colors-text-neutral-default, #2f2f4f);
 }
-._18riimf0-3-4-1 > svg {
+._18riimf0-3-5-2 > svg {
   width: 100%;
   height: 100%;
 }

package/charts/meter-bar/shared/components/meter-bar-layout/slots/Icon/Icon.sty.js

@@ -21,4 +21,4 @@ __export(Icon_css_exports, {
 });
 module.exports = __toCommonJS(Icon_css_exports);
 var import_Icon_css_ts_vanilla = require("./Icon.css");
-var container = "_18riimf0-3-4-1";
+var container = "_18riimf0-3-5-2";

package/charts/meter-bar/shared/components/meter-bar-layout/slots/Label/Label.css

@@ -1,4 +1,4 @@
-._bh277f0-3-4-1 {
+._bh277f0-3-5-2 {
   font-family: var(--dt-typography-text-base-emphasized-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
   font-size: var(--dt-typography-text-base-emphasized-size, 14px);
   font-weight: var(--dt-typography-text-base-emphasized-weight, 500);

package/charts/meter-bar/shared/components/meter-bar-layout/slots/Label/Label.sty.js

@@ -21,4 +21,4 @@ __export(Label_css_exports, {
 });
 module.exports = __toCommonJS(Label_css_exports);
 var import_Label_css_ts_vanilla = require("./Label.css");
-var labelStyle = "_bh277f0-3-4-1";
+var labelStyle = "_bh277f0-3-5-2";

package/charts/meter-bar/shared/components/meter-bar-layout/slots/Max/Max.css

@@ -1,4 +1,4 @@
-._xxg5xc0-3-4-1 {
+._xxg5xc0-3-5-2 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
   font-family: var(--dt-typography-text-small-default-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
   font-size: var(--dt-typography-text-small-default-size, 12px);

package/charts/meter-bar/shared/components/meter-bar-layout/slots/Max/Max.sty.js

@@ -21,4 +21,4 @@ __export(Max_css_exports, {
 });
 module.exports = __toCommonJS(Max_css_exports);
 var import_Max_css_ts_vanilla = require("./Max.css");
-var maxValue = "_xxg5xc0-3-4-1";
+var maxValue = "_xxg5xc0-3-5-2";

package/charts/meter-bar/shared/components/meter-bar-layout/slots/Min/Min.css

@@ -1,4 +1,4 @@
-._16mgjbd0-3-4-1 {
+._16mgjbd0-3-5-2 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
   font-family: var(--dt-typography-text-small-default-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
   font-size: var(--dt-typography-text-small-default-size, 12px);

package/charts/meter-bar/shared/components/meter-bar-layout/slots/Min/Min.sty.js

@@ -21,4 +21,4 @@ __export(Min_css_exports, {
 });
 module.exports = __toCommonJS(Min_css_exports);
 var import_Min_css_ts_vanilla = require("./Min.css");
-var minValue = "_16mgjbd0-3-4-1";
+var minValue = "_16mgjbd0-3-5-2";

package/charts/meter-bar/shared/components/meter-bar-layout/slots/Value/Value.css

@@ -1,4 +1,4 @@
-._1euwfb00-3-4-1 {
+._1euwfb00-3-5-2 {
   font-family: var(--dt-typography-text-small-default-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
   font-size: var(--dt-typography-text-small-default-size, 12px);
   font-weight: var(--dt-typography-text-small-default-weight, 400);

package/charts/meter-bar/shared/components/meter-bar-layout/slots/Value/Value.sty.js

@@ -21,4 +21,4 @@ __export(Value_css_exports, {
 });
 module.exports = __toCommonJS(Value_css_exports);
 var import_Value_css_ts_vanilla = require("./Value.css");
-var valueStyle = "_1euwfb00-3-4-1";
+var valueStyle = "_1euwfb00-3-5-2";

package/charts/meter-bar/shared/components/meter-bar-plot/MeterBarPlot.css

@@ -1,4 +1,4 @@
-._12md1g60-3-4-1 {
+._12md1g60-3-5-2 {
   background-color: var(--dt-colors-theme-neutral-40, #dadbe4);
   width: 100%;
   display: block;

package/charts/meter-bar/shared/components/meter-bar-plot/MeterBarPlot.sty.js

@@ -21,4 +21,4 @@ __export(MeterBarPlot_css_exports, {
 });
 module.exports = __toCommonJS(MeterBarPlot_css_exports);
 var import_MeterBarPlot_css_ts_vanilla = require("./MeterBarPlot.css");
-var svgElement = "_12md1g60-3-4-1";
+var svgElement = "_12md1g60-3-5-2";

package/charts/meter-bar/shared/components/meter-bar-tooltip/MeterBarTooltipItem/MeterBarTooltipItem.css

@@ -1,4 +1,4 @@
-._r5xi4l0-3-4-1 {
+._r5xi4l0-3-5-2 {
   min-width: unset;
   border-radius: var(--dt-borders-radius-field-default, 6px);
   padding: 0 var(--dt-spacings-size-4, 4px);

package/charts/meter-bar/shared/components/meter-bar-tooltip/MeterBarTooltipItem/MeterBarTooltipItem.sty.js

@@ -21,4 +21,4 @@ __export(MeterBarTooltipItem_css_exports, {
 });
 module.exports = __toCommonJS(MeterBarTooltipItem_css_exports);
 var import_MeterBarTooltipItem_css_ts_vanilla = require("./MeterBarTooltipItem.css");
-var valueContent = "_r5xi4l0-3-4-1";
+var valueContent = "_r5xi4l0-3-5-2";

package/charts/meter-bar/shared/styles/element-size.css

@@ -1,12 +1,12 @@
-._1ckoljy1-3-4-1 {
+._1ckoljy1-3-5-2 {
   height: 100%;
 }
-._1ckoljy2-3-4-1 {
+._1ckoljy2-3-5-2 {
   height: 16px;
 }
-._1ckoljy3-3-4-1 {
+._1ckoljy3-3-5-2 {
   height: 24px;
 }
-._1ckoljy4-3-4-1 {
+._1ckoljy4-3-5-2 {
   height: 8px;
 }

package/charts/meter-bar/shared/styles/element-size.sty.js

@@ -22,4 +22,4 @@ __export(element_size_css_exports, {
 module.exports = __toCommonJS(element_size_css_exports);
 var import_element_size_css_ts_vanilla = require("./element-size.css");
 var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var elementSize = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_1ckoljy0-3-4-1", variantClassNames: { size: { auto: "_1ckoljy1-3-4-1", size16: "_1ckoljy2-3-4-1", size24: "_1ckoljy3-3-4-1", size8: "_1ckoljy4-3-4-1" } }, defaultVariants: { size: "size16" }, compoundVariants: [] });
+var elementSize = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_1ckoljy0-3-5-2", variantClassNames: { size: { auto: "_1ckoljy1-3-5-2", size16: "_1ckoljy2-3-5-2", size24: "_1ckoljy3-3-5-2", size8: "_1ckoljy4-3-5-2" } }, defaultVariants: { size: "size16" }, compoundVariants: [] });

package/charts/meter-bar/shared/styles.css

@@ -1,4 +1,4 @@
-._16sdwow0-3-4-1 {
+._16sdwow0-3-5-2 {
   position: relative;
   z-index: 1;
 }

package/charts/meter-bar/shared/styles.sty.js

@@ -23,4 +23,4 @@ __export(styles_css_exports, {
 module.exports = __toCommonJS(styles_css_exports);
 var import_styles_css_ts_vanilla = require("./styles.css");
 var consumerLoadingStyle = { position: "absolute", top: 0, width: "100%", height: "100%", zIndex: 1, pointerEvents: "none", backgroundColor: "var(--dt-colors-background-base-default, #f9f9fa)", opacity: 0.4 };
-var container = "_16sdwow0-3-4-1";
+var container = "_16sdwow0-3-5-2";

package/charts/meter-bar/single-meter-bar/components/MeterBarChartThresholds/MeterBarChartThresholds.css

@@ -1,4 +1,4 @@
-._1kt6hkd0-3-4-1 {
+._1kt6hkd0-3-5-2 {
   width: 100%;
   position: absolute;
   top: -4px;

package/charts/meter-bar/single-meter-bar/components/MeterBarChartThresholds/MeterBarChartThresholds.sty.js

@@ -21,4 +21,4 @@ __export(MeterBarChartThresholds_css_exports, {
 });
 module.exports = __toCommonJS(MeterBarChartThresholds_css_exports);
 var import_MeterBarChartThresholds_css_ts_vanilla = require("./MeterBarChartThresholds.css");
-var thresholdContainer = "_1kt6hkd0-3-4-1";
+var thresholdContainer = "_1kt6hkd0-3-5-2";

package/charts/pie/DonutChart.d.ts

@@ -29,6 +29,10 @@ export declare const DonutChart: ((props: DonutChartProps & {
         }): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
+    Tooltip: {
+        (props: import("./types/pie-chart.config.js").DonutChartCustomTooltipProps): null;
+        displayName: string;
+    };
     Intent: {
         (props: import("../../index.js").IntentProps): null;
         displayName: string;

package/charts/pie/DonutChart.js

@@ -45,6 +45,7 @@ var import_DonutChartGrouping = require("./slots/DonutChartGrouping.js");
 var import_DonutChartInner = require("./slots/DonutChartInner.js");
 var import_DonutChartLabels = require("./slots/DonutChartLabels.js");
 var import_DonutChartLegend = require("./slots/DonutChartLegend.js");
+var import_DonutChartTooltip = require("./slots/DonutChartTooltip.js");
 var import_build_and_download_csv = require("./utils/build-and-download-csv.js");
 var import_useMergeRefs = require("../../core/hooks/useMergeRefs.js");
 var import_Intent = require("../../core/slots/Intent/Intent.js");
@@ -130,6 +131,7 @@ const DonutChart = Object.assign(DonutChartRoot, {
   Grouping: import_DonutChartGrouping.Grouping,
   Labels: import_DonutChartLabels.Labels,
   Inner: import_DonutChartInner.DonutChartInner,
+  Tooltip: import_DonutChartTooltip.Tooltip,
   Intent: import_Intent.Intent,
   Toolbar: import_Toolbar.Toolbar,
   EmptyState: import_EmptyStateSlot.EmptyStateSlot,

package/charts/pie/PieChart.d.ts

@@ -21,6 +21,10 @@ export declare const PieChart: ((props: PieChartProps & {
         (props: import("./types/pie-chart.config.js").LabelsConfig): null;
         displayName: string;
     };
+    Tooltip: {
+        (props: import("./types/pie-chart.config.js").PieChartCustomTooltipProps): null;
+        displayName: string;
+    };
     Intent: {
         (props: import("../../index.js").IntentProps): null;
         displayName: string;

package/charts/pie/PieChart.js

@@ -41,6 +41,7 @@ var import_ChartProviders = require("./providers/ChartProviders.js");
 var import_PieChartGrouping = require("./slots/PieChartGrouping.js");
 var import_PieChartLabels = require("./slots/PieChartLabels.js");
 var import_PieChartLegend = require("./slots/PieChartLegend.js");
+var import_PieChartTooltip = require("./slots/PieChartTooltip.js");
 var import_build_and_download_csv = require("./utils/build-and-download-csv.js");
 var import_useMergeRefs = require("../../core/hooks/useMergeRefs.js");
 var import_Intent = require("../../core/slots/Intent/Intent.js");
@@ -122,6 +123,7 @@ const PieChart = Object.assign(PieChartRoot, {
   Legend: import_PieChartLegend.Legend,
   Grouping: import_PieChartGrouping.Grouping,
   Labels: import_PieChartLabels.Labels,
+  Tooltip: import_PieChartTooltip.Tooltip,
   Intent: import_Intent.Intent,
   EmptyState: import_EmptyStateSlot.EmptyStateSlot,
   ErrorState: import_ErrorStateSlot.ErrorStateSlot,

package/charts/pie/components/InnerWrapper/components/InnerContainer/InnerContainer.css

@@ -1,3 +1,3 @@
-._1cob19w0-3-4-1 {
+._1cob19w0-3-5-2 {
   position: absolute;
 }

package/charts/pie/components/InnerWrapper/components/InnerContainer/InnerContainer.sty.js

@@ -21,4 +21,4 @@ __export(InnerContainer_css_exports, {
 });
 module.exports = __toCommonJS(InnerContainer_css_exports);
 var import_InnerContainer_css_ts_vanilla = require("./InnerContainer.css");
-var container = "_1cob19w0-3-4-1";
+var container = "_1cob19w0-3-5-2";

package/charts/pie/components/InnerWrapper/components/InnerDonut/InnerDonut.css

@@ -1,3 +1,3 @@
-._1gn0gqx0-3-4-1 {
+._1gn0gqx0-3-5-2 {
   overflow: hidden;
 }

package/charts/pie/components/InnerWrapper/components/InnerDonut/InnerDonut.sty.js

@@ -21,4 +21,4 @@ __export(InnerDonut_css_exports, {
 });
 module.exports = __toCommonJS(InnerDonut_css_exports);
 var import_InnerDonut_css_ts_vanilla = require("./InnerDonut.css");
-var container = "_1gn0gqx0-3-4-1";
+var container = "_1gn0gqx0-3-5-2";

package/charts/pie/components/PieChartInternal.js

@@ -30,9 +30,9 @@ var import_useBehavioralTrackingProps = require("../../../core/hooks/useBehavior
 var import_useMergeRefs = require("../../../core/hooks/useMergeRefs.js");
 var import_ChartLayout = require("../../core/components/chart-layout/ChartLayout.js");
 var import_useAutoLegendRefresh = require("../../core/components/chart-layout/hooks/useAutoLegendRefresh.js");
-var import_constants = require("../../core/components/chart-layout/types/constants.js");
 var import_OverlayContext = require("../../core/components/overlay-tooltip/contexts/OverlayContext.js");
 var import_TooltipContext = require("../../core/components/overlay-tooltip/contexts/TooltipContext.js");
+var import_constants = require("../../core/constants.js");
 var import_sanitize_legend_ratio = require("../../core/utils/sanitize-legend-ratio.js");
 var import_ChartLegendContext = require("../context/ChartLegendContext.js");
 var import_PieChartRawDataContext = require("../context/PieChartRawDataContext.js");

package/charts/pie/components/PieChartLegend/PieChartLegend.js

@@ -25,10 +25,10 @@ var import_react = require("react");
 var import_useChartLayoutLoading = require("../../../core/components/chart-layout/hooks/useChartLayoutLoading.js");
 var import_useChartLayoutOrientation = require("../../../core/components/chart-layout/hooks/useChartLayoutOrientation.js");
 var import_useChartLayoutSize = require("../../../core/components/chart-layout/hooks/useChartLayoutSize.js");
-var import_constants = require("../../../core/components/chart-layout/types/constants.js");
 var import_orientation = require("../../../core/components/chart-layout/utils/orientation.js");
 var import_ChartLegend = require("../../../core/components/legend/categorical/ChartLegend.js");
 var import_useLegendSeriesActions = require("../../../core/components/legend/categorical/hooks/useLegendSeriesActions.js");
+var import_constants = require("../../../core/constants.js");
 var import_FormatterContext = require("../../context/FormatterContext.js");
 var import_PieChartSlicesData = require("../../context/PieChartSlicesData.js");
 var import_usePieHandlers = require("../../hooks/usePieHandlers.js");

package/charts/pie/components/PieChartOverlays/PieChartOverlays.css

@@ -1,4 +1,4 @@
-._jxp4cr0-3-4-1 {
+._jxp4cr0-3-5-2 {
   position: relative;
   height: 100%;
   z-index: 1;

package/charts/pie/components/PieChartOverlays/PieChartOverlays.sty.js

@@ -21,4 +21,4 @@ __export(PieChartOverlays_css_exports, {
 });
 module.exports = __toCommonJS(PieChartOverlays_css_exports);
 var import_PieChartOverlays_css_ts_vanilla = require("./PieChartOverlays.css");
-var container = "_jxp4cr0-3-4-1";
+var container = "_jxp4cr0-3-5-2";

package/charts/pie/components/PieChartPlot/PieChartPlot.css

@@ -1,3 +1,3 @@
-._1iotdmn0-3-4-1 {
+._1iotdmn0-3-5-2 {
   position: relative;
 }

package/charts/pie/components/PieChartPlot/PieChartPlot.sty.js

@@ -21,4 +21,4 @@ __export(PieChartPlot_css_exports, {
 });
 module.exports = __toCommonJS(PieChartPlot_css_exports);
 var import_PieChartPlot_css_ts_vanilla = require("./PieChartPlot.css");
-var container = "_1iotdmn0-3-4-1";
+var container = "_1iotdmn0-3-5-2";

package/charts/pie/components/PieChartTooltip/PieChartTooltip.js

@@ -26,7 +26,9 @@ var import_selectors = require("../../../core/components/overlay-tooltip/selecto
 var import_utils = require("../../../core/components/overlay-tooltip/utils.js");
 var import_useTooltipSeriesActions = require("../../../core/components/tooltip/shared/hooks/useTooltipSeriesActions.js");
 var import_selectors2 = require("../../hooks/store/selectors.js");
+var import_usePieChartTooltip = require("../../hooks/usePieChartTooltip.js");
 const PieChartTooltip = () => {
+  const customTooltip = (0, import_usePieChartTooltip.usePieChartTooltip)();
   const overlayTooltipPinned = (0, import_selectors.useSelector)(
     (state) => state.pinned
   );
@@ -36,12 +38,21 @@ const PieChartTooltip = () => {
     visibleSlices,
     (slice) => slice.id
   );
-  if ((0, import_utils.isTooltipDataEmpty)(overlayData)) {
+  if (customTooltip?.hidden || (0, import_utils.isTooltipDataEmpty)(overlayData)) {
     return null;
   }
   const metadata = overlayData.metadata;
   const currentSeries = overlayData.series[0];
   const fallbackSeriesId = typeof currentSeries.name === "string" ? currentSeries.name : "";
+  if (customTooltip?.template) {
+    const payload = {
+      category: typeof currentSeries.name === "string" ? currentSeries.name : "",
+      value: currentSeries.value,
+      percentage: currentSeries.relativeValue,
+      color: currentSeries.color
+    };
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_OverlayTooltip.OverlayTooltip, { legacyTemplate: customTooltip.template(payload) });
+  }
   const tooltipItem = currentSeries ? {
     id: metadata?.sliceId ?? fallbackSeriesId,
     name: currentSeries.name,

package/charts/pie/context/PieChartTooltipContext.d.ts

@@ -0,0 +1,3 @@
+import { PieChartCustomTooltipConfig } from '../types/pie-chart.config.js';
+export declare const DEFAULT_TOOLTIP_CONFIG: PieChartCustomTooltipConfig;
+export declare const PieChartTooltipContext: import("react").Context<PieChartCustomTooltipConfig>;

package/charts/pie/context/PieChartTooltipContext.js

@@ -0,0 +1,28 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var PieChartTooltipContext_exports = {};
+__export(PieChartTooltipContext_exports, {
+  DEFAULT_TOOLTIP_CONFIG: () => DEFAULT_TOOLTIP_CONFIG,
+  PieChartTooltipContext: () => PieChartTooltipContext
+});
+module.exports = __toCommonJS(PieChartTooltipContext_exports);
+var import_react = require("react");
+const DEFAULT_TOOLTIP_CONFIG = {
+  hidden: false
+};
+const PieChartTooltipContext = (0, import_react.createContext)(DEFAULT_TOOLTIP_CONFIG);

package/charts/pie/hooks/usePieChartTooltip.d.ts

@@ -0,0 +1 @@
+export declare const usePieChartTooltip: () => import("../types/pie-chart.config.js").PieChartCustomTooltipConfig;