@dynatrace/strato-components 3.10.4 → 3.11.0

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/meter-bar/shared/components/meter-bar-layout/MeterBarLayout.tsx"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport {\n  forwardRef,\n  Fragment,\n  type PropsWithChildren,\n  Ref,\n  useImperativeHandle,\n  useRef,\n} from 'react';\n\nimport { MeterBarLayoutTopRightSlot } from './components/MeterBarLayoutTopRightSlot.js';\nimport { useComputedSegmentSize } from './hooks/useComputedSegmentSize.js';\nimport {\n  chartContainer,\n  container,\n  containerWrapper,\n  labelContainer,\n  legendContainer,\n  maxContainer,\n  minContainer,\n} from './MeterBarLayout.sty.js';\nimport { Chart } from './slots/Chart.js';\nimport { Icon } from './slots/Icon/Icon.js';\nimport { Label } from './slots/Label/Label.js';\nimport { Legend } from './slots/Legend.js';\nimport { Max } from './slots/Max/Max.js';\nimport { Min } from './slots/Min/Min.js';\nimport { Providers } from './slots/Providers.js';\nimport { Value } from './slots/Value/Value.js';\nimport { extractSlots } from './utils/extract-slots.js';\nimport { useBehavioralTrackingProps } from '../../../../../core/hooks/useBehavioralTrackingProps.js';\nimport { useMergeRefs } from '../../../../../core/hooks/useMergeRefs.js';\nimport type { BehaviorTrackingProps } from '../../../../../core/types/behavior-tracking-props.js';\nimport type { DataTestId } from '../../../../../core/types/data-props.js';\nimport type { MaskingProps } from '../../../../../core/types/masking-props.js';\nimport type { StylingProps } from '../../../../../core/types/styling-props.js';\nimport { Flex } from '../../../../../layouts/flex/Flex.js';\nimport { Grid } from '../../../../../layouts/grid/Grid.js';\nimport { LoaderOverlay } from '../../../../core/components/loader-overlay/LoaderOverlay.js';\nimport { useTooltipImperativeHandle } from '../../../../core/components/overlay-tooltip/hooks/useTooltipImperativeHandle.js';\nimport type { AriaLabel } from '../../../../core/types/aria-label.js';\nimport type { ComponentWithName } from '../../../../core/types/component-with-name.js';\nimport { coerceSizeValue } from '../../../../core/utils/coerceSizeValue.js';\nimport type { MultiMeterBarChartConsumerConfig } from '../../../multi-meter-bar/types/multi-meter-bar-chart-config.js';\nimport type { MeterBarChartConsumerConfig } from '../../../single-meter-bar/types/meter-bar-chart-config.js';\nimport {\n  DEFAULT_HEIGHT,\n  DEFAULT_WIDTH,\n  METER_BAR_SIZE,\n} from '../../constants.js';\nimport { useMeterBarChartLoading } from '../../context/MeterBarChartLoadingContext.js';\nimport { useMeterBarChartToolbar } from '../../hooks/useMeterBarChartToolbar.js';\nimport { consumerLoadingStyle } from '../../styles.sty.js';\nimport type {\n  MeterBarChartElementRef,\n  MeterBarSize,\n} from '../../types/meter-bars.js';\nimport { MeterBarSizeProviders } from '../meter-bar-providers/MeterBarSizeProviders.js';\n\nexport interface MeterBarLayoutProps\n  extends StylingProps,\n    MaskingProps,\n    DataTestId,\n    AriaLabel,\n    BehaviorTrackingProps {\n  /**\n   * The size that applies to the value, icon, and label.\n   * @defaultvalue 'size16'\n   */\n  size: MeterBarSize;\n  /**\n   * The chart width. A valid CSS width is expected.\n   * @defaultValue 100%\n   */\n  width?: number | string;\n  /**\n   * The chart height. A valid CSS height is expected.\n   * @defaultValue 300px\n   */\n  height?: number | string;\n  /**\n   * The component name used for internal tracking purposes.\n   */\n  'data-dt-component': string;\n  /**\n   * A ref object that exposes imperative methods for the meter bar chart element.\n   */\n  userRef?: Ref<MeterBarChartElementRef>;\n  /**\n   * Configuration passed from the consumer chart component (e.g. MeterBarChart or MultiMeterBarChart).\n   */\n  consumerConfig?:\n    | MeterBarChartConsumerConfig\n    | MultiMeterBarChartConsumerConfig;\n}\n\n/**\n * Component responsible for defining the layout of the meter bars.\n * The layout is divided in the labels area (icon, label and value), chart area and legend area.\n */\nexport const MeterBarLayoutRoot = forwardRef<\n  HTMLDivElement,\n  PropsWithChildren<MeterBarLayoutProps>\n>((props, forwardedRef) => {\n  const {\n    width,\n    height,\n    size,\n    children,\n    className,\n    style,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    'data-testid': dataTestId,\n    'data-dt-component': dataDtComponent,\n    'aria-label': ariaLabel,\n    userRef,\n    consumerConfig = {},\n  } = props;\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const { label, min, max, value, chart, icon, legend, providers } =\n    extractSlots(children);\n\n  const [behavioralTrackingProps] = useBehavioralTrackingProps(props);\n  const loading = useMeterBarChartLoading();\n  const { isToolbarEnabled, modifyHoverState, toolbarRef } =\n    useMeterBarChartToolbar();\n  const tooltipActions = useTooltipImperativeHandle();\n\n  const ref = useMergeRefs([containerRef, forwardedRef]);\n\n  useImperativeHandle(userRef, () => {\n    return {\n      element: containerRef.current,\n      getConfig: () => JSON.stringify(consumerConfig),\n      ...tooltipActions,\n    };\n  });\n\n  const hasAutoSize = size === METER_BAR_SIZE.Auto;\n  const gridTemplateRows = hasAutoSize ? 'auto 1fr auto auto' : 'auto';\n\n  const {\n    segmentSize: { height: segmentHeight, width: segmentWidth },\n    labelRef,\n    minLabelRef,\n    maxLabelRef,\n    plotAreaRef,\n    legendRef,\n  } = useComputedSegmentSize();\n\n  const chartWidth = coerceSizeValue(width) ?? DEFAULT_WIDTH;\n  const chartHeight = coerceSizeValue(height) ?? DEFAULT_HEIGHT;\n  const ExternalProviders = providers ? providers.Component : Fragment;\n  const externalProvidersProps = providers ? providers.props : {};\n\n  return (\n    <div\n      {...behavioralTrackingProps}\n      className={clsx(className, containerWrapper)}\n      style={{\n        width: chartWidth,\n        height: chartHeight,\n        ...style,\n      }}\n      data-testid={dataTestId}\n      data-dtrum-mask={dataDtrumMask}\n      data-dtrum-allow={dataDtrumAllow}\n      data-dt-component={dataDtComponent}\n      ref={ref}\n    >\n      <div\n        className={container({ showLoading: loading, autoSize: hasAutoSize })}\n      >\n        <Grid\n          className={container({ autoSize: hasAutoSize })}\n          gridTemplateAreas=\"\n            'label label label value'\n            'chart chart chart chart'\n            'min min max max'\n            'legend legend legend legend'\"\n          gridTemplateColumns=\"25% 25% 25% 25%\"\n          gridTemplateRows={gridTemplateRows}\n          rowGap={0}\n          columnGap={0}\n          aria-label={ariaLabel}\n          role=\"img\"\n          onMouseEnter={() => modifyHoverState(true)}\n          onMouseLeave={() => modifyHoverState(false)}\n          onFocus={() => modifyHoverState(true)}\n          onBlur={() => modifyHoverState(false)}\n        >\n          <MeterBarSizeProviders\n            size={size}\n            chartWidth={containerRef.current?.clientWidth ?? 0}\n            chartHeight={containerRef.current?.clientHeight ?? 0}\n            segmentWidth={segmentWidth}\n            segmentHeight={segmentHeight}\n            data-dtrum-allow={dataDtrumAllow}\n            data-dtrum-mask={dataDtrumMask}\n          >\n            <ExternalProviders {...externalProvidersProps}>\n              {(label || icon) && (\n                <Flex\n                  ref={labelRef}\n                  alignItems=\"center\"\n                  alignSelf=\"center\"\n                  className={labelContainer}\n                >\n                  {icon}\n                  {label}\n                </Flex>\n              )}\n              {(isToolbarEnabled || value) && (\n                <MeterBarLayoutTopRightSlot\n                  value={value}\n                  isToolbarEnabled={isToolbarEnabled}\n                  ref={toolbarRef}\n                />\n              )}\n              <div className={chartContainer} ref={plotAreaRef}>\n                {chart}\n              </div>\n              {min && (\n                <div ref={minLabelRef} className={minContainer}>\n                  {min}\n                </div>\n              )}\n              {max && (\n                <div ref={maxLabelRef} className={maxContainer}>\n                  {max}\n                </div>\n              )}\n              {legend && (\n                <div ref={legendRef} className={legendContainer}>\n                  {legend}\n                </div>\n              )}\n              {loading ? (\n                <LoaderOverlay\n                  gridArea=\"1/1/2/2\"\n                  consumerStyle={consumerLoadingStyle}\n                />\n              ) : null}\n            </ExternalProviders>\n          </MeterBarSizeProviders>\n        </Grid>\n      </div>\n    </div>\n  );\n});\n\n(\n  MeterBarLayoutRoot as ComponentWithName<typeof MeterBarLayoutRoot>\n).displayName = 'MeterBarLayoutRoot';\n\n/** Slot component for meter bar */\nexport const MeterBarLayout = Object.assign(MeterBarLayoutRoot, {\n  Label,\n  Min,\n  Max,\n  Chart,\n  Value,\n  Icon,\n  Providers,\n  Legend,\n});\n"],
-  "mappings": "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",
+  "sourcesContent": ["import clsx from 'clsx';\nimport {\n  forwardRef,\n  Fragment,\n  type PropsWithChildren,\n  Ref,\n  useImperativeHandle,\n  useRef,\n} from 'react';\n\nimport { MeterBarLayoutTopRightSlot } from './components/MeterBarLayoutTopRightSlot.js';\nimport { useComputedSegmentSize } from './hooks/useComputedSegmentSize.js';\nimport {\n  chartContainer,\n  container,\n  containerWrapper,\n  labelContainer,\n  legendContainer,\n  maxContainer,\n  minContainer,\n  thresholdsContainer,\n} from './MeterBarLayout.sty.js';\nimport { Chart } from './slots/Chart.js';\nimport { Icon } from './slots/Icon/Icon.js';\nimport { Label } from './slots/Label/Label.js';\nimport { Legend } from './slots/Legend.js';\nimport { Max } from './slots/Max/Max.js';\nimport { Min } from './slots/Min/Min.js';\nimport { Providers } from './slots/Providers.js';\nimport { Thresholds } from './slots/Thresholds.js';\nimport { Value } from './slots/Value/Value.js';\nimport { extractSlots } from './utils/extract-slots.js';\nimport { useBehavioralTrackingProps } from '../../../../../core/hooks/useBehavioralTrackingProps.js';\nimport { useMergeRefs } from '../../../../../core/hooks/useMergeRefs.js';\nimport type { AriaLabelingProps } from '../../../../../core/types/a11y-props.js';\nimport type { BehaviorTrackingProps } from '../../../../../core/types/behavior-tracking-props.js';\nimport type { DataTestId } from '../../../../../core/types/data-props.js';\nimport type { MaskingProps } from '../../../../../core/types/masking-props.js';\nimport type { StylingProps } from '../../../../../core/types/styling-props.js';\nimport { Flex } from '../../../../../layouts/flex/Flex.js';\nimport { Grid } from '../../../../../layouts/grid/Grid.js';\nimport { LoaderOverlay } from '../../../../core/components/loader-overlay/LoaderOverlay.js';\nimport { useTooltipImperativeHandle } from '../../../../core/components/overlay-tooltip/hooks/useTooltipImperativeHandle.js';\nimport type { ComponentWithName } from '../../../../core/types/component-with-name.js';\nimport { coerceSizeValue } from '../../../../core/utils/coerceSizeValue.js';\nimport type { MultiMeterBarChartConsumerConfig } from '../../../multi-meter-bar/types/multi-meter-bar-chart-config.js';\nimport type { MeterBarChartConsumerConfig } from '../../../single-meter-bar/types/meter-bar-chart-config.js';\nimport {\n  DEFAULT_HEIGHT,\n  DEFAULT_WIDTH,\n  METER_BAR_SIZE,\n} from '../../constants.js';\nimport { useMeterBarChartLoading } from '../../context/MeterBarChartLoadingContext.js';\nimport { useMeterBarChartToolbar } from '../../hooks/useMeterBarChartToolbar.js';\nimport { consumerLoadingStyle } from '../../styles.sty.js';\nimport type {\n  MeterBarChartElementRef,\n  MeterBarSize,\n} from '../../types/meter-bars.js';\nimport { MeterBarSizeProviders } from '../meter-bar-providers/MeterBarSizeProviders.js';\n\nexport interface MeterBarLayoutProps\n  extends StylingProps,\n    MaskingProps,\n    DataTestId,\n    AriaLabelingProps,\n    BehaviorTrackingProps {\n  /**\n   * The size that applies to the value, icon, and label.\n   * @defaultvalue 'size16'\n   */\n  size: MeterBarSize;\n  /**\n   * The chart width. A valid CSS width is expected.\n   * @defaultValue 100%\n   */\n  width?: number | string;\n  /**\n   * The chart height. A valid CSS height is expected.\n   * @defaultValue 300px\n   */\n  height?: number | string;\n  /**\n   * The component name used for internal tracking purposes.\n   */\n  'data-dt-component': string;\n  /**\n   * A ref object that exposes imperative methods for the meter bar chart element.\n   */\n  userRef?: Ref<MeterBarChartElementRef>;\n  /**\n   * Configuration passed from the consumer chart component (e.g. MeterBarChart or MultiMeterBarChart).\n   */\n  consumerConfig?:\n    | MeterBarChartConsumerConfig\n    | MultiMeterBarChartConsumerConfig;\n}\n\n/**\n * Component responsible for defining the layout of the meter bars.\n * The layout is divided in the labels area (icon, label and value), chart area and legend area.\n */\nexport const MeterBarLayoutRoot = forwardRef<\n  HTMLDivElement,\n  PropsWithChildren<MeterBarLayoutProps>\n>((props, forwardedRef) => {\n  const {\n    width,\n    height,\n    size,\n    children,\n    className,\n    style,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    'data-testid': dataTestId,\n    'data-dt-component': dataDtComponent,\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-details': ariaDetails,\n    userRef,\n    consumerConfig = {},\n  } = props;\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const { label, min, max, value, chart, icon, legend, thresholds, providers } =\n    extractSlots(children);\n\n  const [behavioralTrackingProps] = useBehavioralTrackingProps(props);\n  const loading = useMeterBarChartLoading();\n  const { isToolbarEnabled, modifyHoverState, toolbarRef } =\n    useMeterBarChartToolbar();\n  const tooltipActions = useTooltipImperativeHandle();\n\n  const ref = useMergeRefs([containerRef, forwardedRef]);\n\n  useImperativeHandle(userRef, () => {\n    return {\n      element: containerRef.current,\n      getConfig: () => JSON.stringify(consumerConfig),\n      ...tooltipActions,\n    };\n  });\n\n  const hasAutoSize = size === METER_BAR_SIZE.Auto;\n  const gridTemplateRows = hasAutoSize ? 'auto 1fr auto auto auto' : 'auto';\n\n  const {\n    segmentSize: { height: segmentHeight, width: segmentWidth },\n    labelRef,\n    minLabelRef,\n    maxLabelRef,\n    plotAreaRef,\n    legendRef,\n  } = useComputedSegmentSize();\n\n  const chartWidth = coerceSizeValue(width) ?? DEFAULT_WIDTH;\n  const chartHeight = coerceSizeValue(height) ?? DEFAULT_HEIGHT;\n  const ExternalProviders = providers ? providers.Component : Fragment;\n  const externalProvidersProps = providers ? providers.props : {};\n\n  return (\n    <div\n      {...behavioralTrackingProps}\n      className={clsx(className, containerWrapper)}\n      style={{\n        width: chartWidth,\n        height: chartHeight,\n        ...style,\n      }}\n      data-testid={dataTestId}\n      data-dtrum-mask={dataDtrumMask}\n      data-dtrum-allow={dataDtrumAllow}\n      data-dt-component={dataDtComponent}\n      ref={ref}\n    >\n      <div\n        className={container({ showLoading: loading, autoSize: hasAutoSize })}\n      >\n        <Grid\n          className={container({ autoSize: hasAutoSize })}\n          gridTemplateAreas=\"\n            'label label label value'\n            'chart chart chart chart'\n            'thresholds thresholds thresholds thresholds'\n            'min min max max'\n            'legend legend legend legend'\"\n          gridTemplateColumns=\"25% 25% 25% 25%\"\n          gridTemplateRows={gridTemplateRows}\n          rowGap={0}\n          columnGap={0}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledBy}\n          aria-describedby={ariaDescribedBy}\n          aria-details={ariaDetails}\n          role=\"img\"\n          onMouseEnter={() => modifyHoverState(true)}\n          onMouseLeave={() => modifyHoverState(false)}\n          onFocus={() => modifyHoverState(true)}\n          onBlur={() => modifyHoverState(false)}\n        >\n          <MeterBarSizeProviders\n            size={size}\n            chartWidth={containerRef.current?.clientWidth ?? 0}\n            chartHeight={containerRef.current?.clientHeight ?? 0}\n            segmentWidth={segmentWidth}\n            segmentHeight={segmentHeight}\n            data-dtrum-allow={dataDtrumAllow}\n            data-dtrum-mask={dataDtrumMask}\n          >\n            <ExternalProviders {...externalProvidersProps}>\n              {(label || icon) && (\n                <Flex\n                  ref={labelRef}\n                  alignItems=\"center\"\n                  alignSelf=\"center\"\n                  className={labelContainer}\n                >\n                  {icon}\n                  {label}\n                </Flex>\n              )}\n              {(isToolbarEnabled || value) && (\n                <MeterBarLayoutTopRightSlot\n                  value={value}\n                  isToolbarEnabled={isToolbarEnabled}\n                  ref={toolbarRef}\n                />\n              )}\n              <div className={chartContainer} ref={plotAreaRef}>\n                {chart}\n              </div>\n              {thresholds && (\n                <div className={thresholdsContainer}>{thresholds}</div>\n              )}\n              {min && (\n                <div ref={minLabelRef} className={minContainer}>\n                  {min}\n                </div>\n              )}\n              {max && (\n                <div ref={maxLabelRef} className={maxContainer}>\n                  {max}\n                </div>\n              )}\n              {legend && (\n                <div ref={legendRef} className={legendContainer}>\n                  {legend}\n                </div>\n              )}\n              {loading ? (\n                <LoaderOverlay\n                  gridArea=\"1/1/2/2\"\n                  consumerStyle={consumerLoadingStyle}\n                />\n              ) : null}\n            </ExternalProviders>\n          </MeterBarSizeProviders>\n        </Grid>\n      </div>\n    </div>\n  );\n});\n\n(\n  MeterBarLayoutRoot as ComponentWithName<typeof MeterBarLayoutRoot>\n).displayName = 'MeterBarLayoutRoot';\n\n/** Slot component for meter bar */\nexport const MeterBarLayout = Object.assign(MeterBarLayoutRoot, {\n  Label,\n  Min,\n  Max,\n  Chart,\n  Value,\n  Icon,\n  Providers,\n  Legend,\n  Thresholds,\n});\n"],
+  "mappings": "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",
   "names": []
 }

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

@@ -1,15 +1,16 @@
 import "./MeterBarLayout.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var chartContainer = "_1m3udw19-3-10-4";
-var container = _7a468({ defaultClassName: "_1m3udw1a-3-10-4", variantClassNames: { autoSize: { true: "_1m3udw1b-3-10-4", false: "_1m3udw1c-3-10-4" }, showLoading: { true: "_1m3udw1d-3-10-4" } }, defaultVariants: {}, compoundVariants: [] });
-var containerWrapper = "_1m3udw1e-3-10-4";
-var labelContainer = "_1m3udw18-3-10-4";
-var legendContainer = "_1m3udw17-3-10-4";
-var maxContainer = "_1m3udw16-3-10-4";
-var minContainer = "_1m3udw15-3-10-4";
-var toolbarAnimatedContainer = "_1m3udw14-3-10-4";
-var valueAnimatedContainer = "_1m3udw13-3-10-4";
-var valueContainer = _7a468({ defaultClassName: "_1m3udw10-3-10-4", variantClassNames: { inline: { true: "_1m3udw11-3-10-4", false: "_1m3udw12-3-10-4" } }, defaultVariants: {}, compoundVariants: [] });
+var chartContainer = "_1m3udw19-3-11-0";
+var container = _7a468({ defaultClassName: "_1m3udw1b-3-11-0", variantClassNames: { autoSize: { true: "_1m3udw1c-3-11-0", false: "_1m3udw1d-3-11-0" }, showLoading: { true: "_1m3udw1e-3-11-0" } }, defaultVariants: {}, compoundVariants: [] });
+var containerWrapper = "_1m3udw1f-3-11-0";
+var labelContainer = "_1m3udw18-3-11-0";
+var legendContainer = "_1m3udw17-3-11-0";
+var maxContainer = "_1m3udw16-3-11-0";
+var minContainer = "_1m3udw15-3-11-0";
+var thresholdsContainer = "_1m3udw1a-3-11-0";
+var toolbarAnimatedContainer = "_1m3udw14-3-11-0";
+var valueAnimatedContainer = "_1m3udw13-3-11-0";
+var valueContainer = _7a468({ defaultClassName: "_1m3udw10-3-11-0", variantClassNames: { inline: { true: "_1m3udw11-3-11-0", false: "_1m3udw12-3-11-0" } }, defaultVariants: {}, compoundVariants: [] });
 export {
   chartContainer,
   container,
@@ -18,6 +19,7 @@ export {
   legendContainer,
   maxContainer,
   minContainer,
+  thresholdsContainer,
   toolbarAnimatedContainer,
   valueAnimatedContainer,
   valueContainer

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/meter-bar/shared/components/meter-bar-layout/MeterBarLayout.css.ts"],
-  "sourcesContent": ["import './MeterBarLayout.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var chartContainer = '_1m3udw19-3-10-4';\nexport var container = _7a468({defaultClassName:'_1m3udw1a-3-10-4',variantClassNames:{autoSize:{true:'_1m3udw1b-3-10-4',false:'_1m3udw1c-3-10-4'},showLoading:{true:'_1m3udw1d-3-10-4'}},defaultVariants:{},compoundVariants:[]});\nexport var containerWrapper = '_1m3udw1e-3-10-4';\nexport var labelContainer = '_1m3udw18-3-10-4';\nexport var legendContainer = '_1m3udw17-3-10-4';\nexport var maxContainer = '_1m3udw16-3-10-4';\nexport var minContainer = '_1m3udw15-3-10-4';\nexport var toolbarAnimatedContainer = '_1m3udw14-3-10-4';\nexport var valueAnimatedContainer = '_1m3udw13-3-10-4';\nexport var valueContainer = _7a468({defaultClassName:'_1m3udw10-3-10-4',variantClassNames:{inline:{true:'_1m3udw11-3-10-4',false:'_1m3udw12-3-10-4'}},defaultVariants:{},compoundVariants:[]});"],
-  "mappings": "AAAA,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,iBAAiB;AACrB,IAAI,YAAY,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,UAAS,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,GAAE,aAAY,EAAC,MAAK,mBAAkB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACzN,IAAI,mBAAmB;AACvB,IAAI,iBAAiB;AACrB,IAAI,kBAAkB;AACtB,IAAI,eAAe;AACnB,IAAI,eAAe;AACnB,IAAI,2BAA2B;AAC/B,IAAI,yBAAyB;AAC7B,IAAI,iBAAiB,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,QAAO,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;",
+  "sourcesContent": ["import './MeterBarLayout.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var chartContainer = '_1m3udw19-3-11-0';\nexport var container = _7a468({defaultClassName:'_1m3udw1b-3-11-0',variantClassNames:{autoSize:{true:'_1m3udw1c-3-11-0',false:'_1m3udw1d-3-11-0'},showLoading:{true:'_1m3udw1e-3-11-0'}},defaultVariants:{},compoundVariants:[]});\nexport var containerWrapper = '_1m3udw1f-3-11-0';\nexport var labelContainer = '_1m3udw18-3-11-0';\nexport var legendContainer = '_1m3udw17-3-11-0';\nexport var maxContainer = '_1m3udw16-3-11-0';\nexport var minContainer = '_1m3udw15-3-11-0';\nexport var thresholdsContainer = '_1m3udw1a-3-11-0';\nexport var toolbarAnimatedContainer = '_1m3udw14-3-11-0';\nexport var valueAnimatedContainer = '_1m3udw13-3-11-0';\nexport var valueContainer = _7a468({defaultClassName:'_1m3udw10-3-11-0',variantClassNames:{inline:{true:'_1m3udw11-3-11-0',false:'_1m3udw12-3-11-0'}},defaultVariants:{},compoundVariants:[]});"],
+  "mappings": "AAAA,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,iBAAiB;AACrB,IAAI,YAAY,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,UAAS,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,GAAE,aAAY,EAAC,MAAK,mBAAkB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACzN,IAAI,mBAAmB;AACvB,IAAI,iBAAiB;AACrB,IAAI,kBAAkB;AACtB,IAAI,eAAe;AACnB,IAAI,eAAe;AACnB,IAAI,sBAAsB;AAC1B,IAAI,2BAA2B;AAC/B,IAAI,yBAAyB;AAC7B,IAAI,iBAAiB,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,QAAO,EAAC,MAAK,oBAAmB,OAAM,mBAAkB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;",
   "names": []
 }

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

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

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

@@ -1,5 +1,5 @@
 import "./Icon.css";
-var container = "_18riimf0-3-10-4";
+var container = "_18riimf0-3-11-0";
 export {
   container
 };

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../../src/charts/meter-bar/shared/components/meter-bar-layout/slots/Icon/Icon.css.ts"],
-  "sourcesContent": ["import './Icon.css';\nexport var container = '_18riimf0-3-10-4';"],
+  "sourcesContent": ["import './Icon.css';\nexport var container = '_18riimf0-3-11-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,YAAY;",
   "names": []
 }

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

@@ -1,4 +1,4 @@
-._bh277f0-3-10-4 {
+._bh277f0-3-11-0 {
   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/esm/charts/meter-bar/shared/components/meter-bar-layout/slots/Label/Label.sty.js

@@ -1,5 +1,5 @@
 import "./Label.css";
-var labelStyle = "_bh277f0-3-10-4";
+var labelStyle = "_bh277f0-3-11-0";
 export {
   labelStyle
 };

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../../src/charts/meter-bar/shared/components/meter-bar-layout/slots/Label/Label.css.ts"],
-  "sourcesContent": ["import './Label.css';\nexport var labelStyle = '_bh277f0-3-10-4';"],
+  "sourcesContent": ["import './Label.css';\nexport var labelStyle = '_bh277f0-3-11-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,aAAa;",
   "names": []
 }

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

@@ -1,4 +1,4 @@
-._xxg5xc0-3-10-4 {
+._xxg5xc0-3-11-0 {
   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/esm/charts/meter-bar/shared/components/meter-bar-layout/slots/Max/Max.sty.js

@@ -1,5 +1,5 @@
 import "./Max.css";
-var maxValue = "_xxg5xc0-3-10-4";
+var maxValue = "_xxg5xc0-3-11-0";
 export {
   maxValue
 };

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../../src/charts/meter-bar/shared/components/meter-bar-layout/slots/Max/Max.css.ts"],
-  "sourcesContent": ["import './Max.css';\nexport var maxValue = '_xxg5xc0-3-10-4';"],
+  "sourcesContent": ["import './Max.css';\nexport var maxValue = '_xxg5xc0-3-11-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,WAAW;",
   "names": []
 }

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

@@ -1,4 +1,4 @@
-._16mgjbd0-3-10-4 {
+._16mgjbd0-3-11-0 {
   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/esm/charts/meter-bar/shared/components/meter-bar-layout/slots/Min/Min.sty.js

@@ -1,5 +1,5 @@
 import "./Min.css";
-var minValue = "_16mgjbd0-3-10-4";
+var minValue = "_16mgjbd0-3-11-0";
 export {
   minValue
 };

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../../src/charts/meter-bar/shared/components/meter-bar-layout/slots/Min/Min.css.ts"],
-  "sourcesContent": ["import './Min.css';\nexport var minValue = '_16mgjbd0-3-10-4';"],
+  "sourcesContent": ["import './Min.css';\nexport var minValue = '_16mgjbd0-3-11-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,WAAW;",
   "names": []
 }

package/esm/charts/meter-bar/shared/components/meter-bar-layout/slots/Thresholds.js

@@ -0,0 +1,10 @@
+import { Fragment, jsx } from "react/jsx-runtime";
+const Thresholds = ({ children }) => children !== void 0 && children !== null ? (
+  // eslint-disable-next-line react/jsx-no-useless-fragment
+  /* @__PURE__ */ jsx(Fragment, { children })
+) : null;
+Thresholds["displayName"] = "MeterBarLayout.Thresholds";
+export {
+  Thresholds
+};
+//# sourceMappingURL=Thresholds.js.map

package/esm/charts/meter-bar/shared/components/meter-bar-layout/slots/Thresholds.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../../src/charts/meter-bar/shared/components/meter-bar-layout/slots/Thresholds.tsx"],
+  "sourcesContent": ["import { type PropsWithChildren } from 'react';\n\nexport const Thresholds = ({ children }: PropsWithChildren) =>\n  children !== undefined && children !== null ? (\n    // eslint-disable-next-line react/jsx-no-useless-fragment\n    <>{children}</>\n  ) : null;\n\nThresholds['displayName'] = 'MeterBarLayout.Thresholds';\n"],
+  "mappings": "AAKI;AAHG,MAAM,aAAa,CAAC,EAAE,SAAS,MACpC,aAAa,UAAa,aAAa;AAAA;AAAA,EAErC,gCAAG,UAAS;AAAA,IACV;AAEN,WAAW,aAAa,IAAI;",
+  "names": []
+}

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

@@ -1,4 +1,4 @@
-._1euwfb00-3-10-4 {
+._1euwfb00-3-11-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);
   font-weight: var(--dt-typography-text-small-default-weight, 400);

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

@@ -1,5 +1,5 @@
 import "./Value.css";
-var valueStyle = "_1euwfb00-3-10-4";
+var valueStyle = "_1euwfb00-3-11-0";
 export {
   valueStyle
 };

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../../src/charts/meter-bar/shared/components/meter-bar-layout/slots/Value/Value.css.ts"],
-  "sourcesContent": ["import './Value.css';\nexport var valueStyle = '_1euwfb00-3-10-4';"],
+  "sourcesContent": ["import './Value.css';\nexport var valueStyle = '_1euwfb00-3-11-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,aAAa;",
   "names": []
 }

package/esm/charts/meter-bar/shared/components/meter-bar-layout/utils/extract-slots.js

@@ -7,6 +7,7 @@ import { Legend } from "../slots/Legend.js";
 import { Max } from "../slots/Max/Max.js";
 import { Min } from "../slots/Min/Min.js";
 import { Providers } from "../slots/Providers.js";
+import { Thresholds } from "../slots/Thresholds.js";
 import { Value } from "../slots/Value/Value.js";
 function extractSlots(children) {
   const areas = {};
@@ -25,6 +26,8 @@ function extractSlots(children) {
       areas.max = child;
     } else if (isSlot(child, Legend)) {
       areas.legend = child;
+    } else if (isSlot(child, Thresholds)) {
+      areas.thresholds = child;
     } else if (isSlot(child, Providers)) {
       areas.providers = {
         Component: child.props.providerName,

package/esm/charts/meter-bar/shared/components/meter-bar-layout/utils/extract-slots.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../../src/charts/meter-bar/shared/components/meter-bar-layout/utils/extract-slots.ts"],
-  "sourcesContent": ["import { type ReactNode, Children, type ExoticComponent } from 'react';\n\nimport { isSlot } from '../../../../../../core/utils/is-slot.js';\nimport { Chart } from '../slots/Chart.js';\nimport { Icon } from '../slots/Icon/Icon.js';\nimport { Label } from '../slots/Label/Label.js';\nimport { Legend } from '../slots/Legend.js';\nimport { Max } from '../slots/Max/Max.js';\nimport { Min } from '../slots/Min/Min.js';\nimport { Providers } from '../slots/Providers.js';\nimport { Value } from '../slots/Value/Value.js';\n\n/**\n * Function that selects all the meter bar layout slots from the children, and returns them identified.\n * @param children - Children for the MeterBarLayout. Should have the Label, Value, Chart and MinMaxLabel areas.\n * @returns An object with each children identified.\n */\nexport function extractSlots(children?: ReactNode) {\n  const areas: {\n    label?: ReactNode;\n    min?: ReactNode;\n    max?: ReactNode;\n    chart?: ReactNode;\n    value?: ReactNode;\n    icon?: ReactNode;\n    legend?: ReactNode;\n    providers?: { Component: ExoticComponent; props: Record<string, unknown> };\n  } = {};\n\n  Children.forEach(children, (child) => {\n    if (isSlot(child, Label)) {\n      areas.label = child;\n    } else if (isSlot(child, Icon)) {\n      areas.icon = child;\n    } else if (isSlot(child, Value)) {\n      areas.value = child;\n    } else if (isSlot(child, Chart)) {\n      areas.chart = child;\n    } else if (isSlot(child, Min)) {\n      areas.min = child;\n    } else if (isSlot(child, Max)) {\n      areas.max = child;\n    } else if (isSlot(child, Legend)) {\n      areas.legend = child;\n    } else if (isSlot(child, Providers)) {\n      areas.providers = {\n        Component: child.props.providerName as ExoticComponent,\n        props: child.props.providerProps,\n      };\n    }\n  });\n\n  return areas;\n}\n"],
-  "mappings": "AAAA,SAAyB,gBAAsC;AAE/D,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,YAAY;AACrB,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,WAAW;AACpB,SAAS,WAAW;AACpB,SAAS,iBAAiB;AAC1B,SAAS,aAAa;AAOf,SAAS,aAAa,UAAsB;AACjD,QAAM,QASF,CAAC;AAEL,WAAS,QAAQ,UAAU,CAAC,UAAU;AACpC,QAAI,OAAO,OAAO,KAAK,GAAG;AACxB,YAAM,QAAQ;AAAA,IAChB,WAAW,OAAO,OAAO,IAAI,GAAG;AAC9B,YAAM,OAAO;AAAA,IACf,WAAW,OAAO,OAAO,KAAK,GAAG;AAC/B,YAAM,QAAQ;AAAA,IAChB,WAAW,OAAO,OAAO,KAAK,GAAG;AAC/B,YAAM,QAAQ;AAAA,IAChB,WAAW,OAAO,OAAO,GAAG,GAAG;AAC7B,YAAM,MAAM;AAAA,IACd,WAAW,OAAO,OAAO,GAAG,GAAG;AAC7B,YAAM,MAAM;AAAA,IACd,WAAW,OAAO,OAAO,MAAM,GAAG;AAChC,YAAM,SAAS;AAAA,IACjB,WAAW,OAAO,OAAO,SAAS,GAAG;AACnC,YAAM,YAAY;AAAA,QAChB,WAAW,MAAM,MAAM;AAAA,QACvB,OAAO,MAAM,MAAM;AAAA,MACrB;AAAA,IACF;AAAA,EACF,CAAC;AAED,SAAO;AACT;",
+  "sourcesContent": ["import { type ReactNode, Children, type ExoticComponent } from 'react';\n\nimport { isSlot } from '../../../../../../core/utils/is-slot.js';\nimport { Chart } from '../slots/Chart.js';\nimport { Icon } from '../slots/Icon/Icon.js';\nimport { Label } from '../slots/Label/Label.js';\nimport { Legend } from '../slots/Legend.js';\nimport { Max } from '../slots/Max/Max.js';\nimport { Min } from '../slots/Min/Min.js';\nimport { Providers } from '../slots/Providers.js';\nimport { Thresholds } from '../slots/Thresholds.js';\nimport { Value } from '../slots/Value/Value.js';\n\n/**\n * Function that selects all the meter bar layout slots from the children, and returns them identified.\n * @param children - Children for the MeterBarLayout. Should have the Label, Value, Chart and MinMaxLabel areas.\n * @returns An object with each children identified.\n */\nexport function extractSlots(children?: ReactNode) {\n  const areas: {\n    label?: ReactNode;\n    min?: ReactNode;\n    max?: ReactNode;\n    chart?: ReactNode;\n    value?: ReactNode;\n    icon?: ReactNode;\n    legend?: ReactNode;\n    thresholds?: ReactNode;\n    providers?: { Component: ExoticComponent; props: Record<string, unknown> };\n  } = {};\n\n  Children.forEach(children, (child) => {\n    if (isSlot(child, Label)) {\n      areas.label = child;\n    } else if (isSlot(child, Icon)) {\n      areas.icon = child;\n    } else if (isSlot(child, Value)) {\n      areas.value = child;\n    } else if (isSlot(child, Chart)) {\n      areas.chart = child;\n    } else if (isSlot(child, Min)) {\n      areas.min = child;\n    } else if (isSlot(child, Max)) {\n      areas.max = child;\n    } else if (isSlot(child, Legend)) {\n      areas.legend = child;\n    } else if (isSlot(child, Thresholds)) {\n      areas.thresholds = child;\n    } else if (isSlot(child, Providers)) {\n      areas.providers = {\n        Component: child.props.providerName as ExoticComponent,\n        props: child.props.providerProps,\n      };\n    }\n  });\n\n  return areas;\n}\n"],
+  "mappings": "AAAA,SAAyB,gBAAsC;AAE/D,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,YAAY;AACrB,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,WAAW;AACpB,SAAS,WAAW;AACpB,SAAS,iBAAiB;AAC1B,SAAS,kBAAkB;AAC3B,SAAS,aAAa;AAOf,SAAS,aAAa,UAAsB;AACjD,QAAM,QAUF,CAAC;AAEL,WAAS,QAAQ,UAAU,CAAC,UAAU;AACpC,QAAI,OAAO,OAAO,KAAK,GAAG;AACxB,YAAM,QAAQ;AAAA,IAChB,WAAW,OAAO,OAAO,IAAI,GAAG;AAC9B,YAAM,OAAO;AAAA,IACf,WAAW,OAAO,OAAO,KAAK,GAAG;AAC/B,YAAM,QAAQ;AAAA,IAChB,WAAW,OAAO,OAAO,KAAK,GAAG;AAC/B,YAAM,QAAQ;AAAA,IAChB,WAAW,OAAO,OAAO,GAAG,GAAG;AAC7B,YAAM,MAAM;AAAA,IACd,WAAW,OAAO,OAAO,GAAG,GAAG;AAC7B,YAAM,MAAM;AAAA,IACd,WAAW,OAAO,OAAO,MAAM,GAAG;AAChC,YAAM,SAAS;AAAA,IACjB,WAAW,OAAO,OAAO,UAAU,GAAG;AACpC,YAAM,aAAa;AAAA,IACrB,WAAW,OAAO,OAAO,SAAS,GAAG;AACnC,YAAM,YAAY;AAAA,QAChB,WAAW,MAAM,MAAM;AAAA,QACvB,OAAO,MAAM,MAAM;AAAA,MACrB;AAAA,IACF;AAAA,EACF,CAAC;AAED,SAAO;AACT;",
   "names": []
 }

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

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

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

@@ -1,7 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import clsx from "clsx";
 import { svgElement } from "./MeterBarPlot.sty.js";
-import { METER_BAR_CHART_PLOT_ARIA_LABEL } from "../../../single-meter-bar/constants.js";
 import { METER_BAR_SIZE } from "../../constants.js";
 import { useMeterBarLayoutSize } from "../../context/MeterBarLayoutSizeContext.js";
 import { elementSize } from "../../styles/element-size.sty.js";
@@ -13,7 +12,7 @@ const MeterBarPlot = ({ children }) => {
     {
       height: isSegmentHeight ? segmentHeight : void 0,
       className: clsx(svgElement, elementSize({ size })),
-      "aria-label": METER_BAR_CHART_PLOT_ARIA_LABEL,
+      "aria-hidden": "true",
       children
     }
   );

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/meter-bar/shared/components/meter-bar-plot/MeterBarPlot.tsx"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport { type PropsWithChildren } from 'react';\n\nimport { svgElement } from './MeterBarPlot.sty.js';\nimport { METER_BAR_CHART_PLOT_ARIA_LABEL } from '../../../single-meter-bar/constants.js';\nimport { METER_BAR_SIZE } from '../../constants.js';\nimport { useMeterBarLayoutSize } from '../../context/MeterBarLayoutSizeContext.js';\nimport { elementSize } from '../../styles/element-size.sty.js';\n\nexport const MeterBarPlot = ({ children }: PropsWithChildren) => {\n  const { size, segmentHeight } = useMeterBarLayoutSize();\n\n  const isSegmentHeight = size === METER_BAR_SIZE.Auto;\n\n  return (\n    <svg\n      height={isSegmentHeight ? segmentHeight : undefined}\n      className={clsx(svgElement, elementSize({ size }))}\n      aria-label={METER_BAR_CHART_PLOT_ARIA_LABEL}\n    >\n      {children}\n    </svg>\n  );\n};\n"],
-  "mappings": "AAeI;AAfJ,OAAO,UAAU;AAGjB,SAAS,kBAAkB;AAC3B,SAAS,uCAAuC;AAChD,SAAS,sBAAsB;AAC/B,SAAS,6BAA6B;AACtC,SAAS,mBAAmB;AAErB,MAAM,eAAe,CAAC,EAAE,SAAS,MAAyB;AAC/D,QAAM,EAAE,MAAM,cAAc,IAAI,sBAAsB;AAEtD,QAAM,kBAAkB,SAAS,eAAe;AAEhD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,QAAQ,kBAAkB,gBAAgB;AAAA,MAC1C,WAAW,KAAK,YAAY,YAAY,EAAE,KAAK,CAAC,CAAC;AAAA,MACjD,cAAY;AAAA,MAEX;AAAA;AAAA,EACH;AAEJ;",
+  "sourcesContent": ["import clsx from 'clsx';\nimport { type PropsWithChildren } from 'react';\n\nimport { svgElement } from './MeterBarPlot.sty.js';\nimport { METER_BAR_SIZE } from '../../constants.js';\nimport { useMeterBarLayoutSize } from '../../context/MeterBarLayoutSizeContext.js';\nimport { elementSize } from '../../styles/element-size.sty.js';\n\nexport const MeterBarPlot = ({ children }: PropsWithChildren) => {\n  const { size, segmentHeight } = useMeterBarLayoutSize();\n\n  const isSegmentHeight = size === METER_BAR_SIZE.Auto;\n\n  return (\n    <svg\n      height={isSegmentHeight ? segmentHeight : undefined}\n      className={clsx(svgElement, elementSize({ size }))}\n      aria-hidden=\"true\"\n    >\n      {children}\n    </svg>\n  );\n};\n"],
+  "mappings": "AAcI;AAdJ,OAAO,UAAU;AAGjB,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB;AAC/B,SAAS,6BAA6B;AACtC,SAAS,mBAAmB;AAErB,MAAM,eAAe,CAAC,EAAE,SAAS,MAAyB;AAC/D,QAAM,EAAE,MAAM,cAAc,IAAI,sBAAsB;AAEtD,QAAM,kBAAkB,SAAS,eAAe;AAEhD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,QAAQ,kBAAkB,gBAAgB;AAAA,MAC1C,WAAW,KAAK,YAAY,YAAY,EAAE,KAAK,CAAC,CAAC;AAAA,MACjD,eAAY;AAAA,MAEX;AAAA;AAAA,EACH;AAEJ;",
   "names": []
 }

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

@@ -1,5 +1,5 @@
 import "./MeterBarPlot.css";
-var svgElement = "_12md1g60-3-10-4";
+var svgElement = "_12md1g60-3-11-0";
 export {
   svgElement
 };

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../src/charts/meter-bar/shared/components/meter-bar-plot/MeterBarPlot.css.ts"],
-  "sourcesContent": ["import './MeterBarPlot.css';\nexport var svgElement = '_12md1g60-3-10-4';"],
+  "sourcesContent": ["import './MeterBarPlot.css';\nexport var svgElement = '_12md1g60-3-11-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,aAAa;",
   "names": []
 }

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

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

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

@@ -1,6 +1,6 @@
 import "./element-size.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var elementSize = _7a468({ defaultClassName: "_1ckoljy0-3-10-4", variantClassNames: { size: { auto: "_1ckoljy1-3-10-4", size16: "_1ckoljy2-3-10-4", size24: "_1ckoljy3-3-10-4", size8: "_1ckoljy4-3-10-4" } }, defaultVariants: { size: "size16" }, compoundVariants: [] });
+var elementSize = _7a468({ defaultClassName: "_1ckoljy0-3-11-0", variantClassNames: { size: { auto: "_1ckoljy1-3-11-0", size16: "_1ckoljy2-3-11-0", size24: "_1ckoljy3-3-11-0", size8: "_1ckoljy4-3-11-0" } }, defaultVariants: { size: "size16" }, compoundVariants: [] });
 export {
   elementSize
 };

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/charts/meter-bar/shared/styles/element-size.css.ts"],
-  "sourcesContent": ["import './element-size.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var elementSize = _7a468({defaultClassName:'_1ckoljy0-3-10-4',variantClassNames:{size:{auto:'_1ckoljy1-3-10-4',size16:'_1ckoljy2-3-10-4',size24:'_1ckoljy3-3-10-4',size8:'_1ckoljy4-3-10-4'}},defaultVariants:{size:'size16'},compoundVariants:[]});"],
+  "sourcesContent": ["import './element-size.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var elementSize = _7a468({defaultClassName:'_1ckoljy0-3-11-0',variantClassNames:{size:{auto:'_1ckoljy1-3-11-0',size16:'_1ckoljy2-3-11-0',size24:'_1ckoljy3-3-11-0',size8:'_1ckoljy4-3-11-0'}},defaultVariants:{size:'size16'},compoundVariants:[]});"],
   "mappings": "AAAA,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,cAAc,OAAO,EAAC,kBAAiB,oBAAmB,mBAAkB,EAAC,MAAK,EAAC,MAAK,oBAAmB,QAAO,oBAAmB,QAAO,oBAAmB,OAAM,mBAAkB,EAAC,GAAE,iBAAgB,EAAC,MAAK,SAAQ,GAAE,kBAAiB,CAAC,EAAC,CAAC;",
   "names": []
 }

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

@@ -1,4 +1,4 @@
-._16sdwow0-3-10-4 {
+._16sdwow0-3-11-0 {
   position: relative;
   z-index: 1;
 }

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

@@ -1,6 +1,6 @@
 import "./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-10-4";
+var container = "_16sdwow0-3-11-0";
 export {
   consumerLoadingStyle,
   container

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/meter-bar/shared/styles.css.ts"],
-  "sourcesContent": ["import './styles.css';\nexport 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};\nexport var container = '_16sdwow0-3-10-4';"],
+  "sourcesContent": ["import './styles.css';\nexport 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};\nexport var container = '_16sdwow0-3-11-0';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,uBAAuB,EAAC,UAAS,YAAW,KAAI,GAAE,OAAM,QAAO,QAAO,QAAO,QAAO,GAAE,eAAc,QAAO,iBAAgB,qDAAoD,SAAQ,IAAG;AAC9L,IAAI,YAAY;",
   "names": []
 }

package/esm/charts/meter-bar/shared/utils/collapse-threshold-show-indicators.js

@@ -0,0 +1,20 @@
+import { devLog } from "../../../../core/utils/logging.js";
+function collapseThresholdShowIndicators(showIndicators, mixedValuesWarning) {
+  const usesLegacyConfig = showIndicators.some((flag) => flag !== void 0);
+  if (!usesLegacyConfig) {
+    return void 0;
+  }
+  const resolvedFlags = showIndicators.map((flag) => flag ?? false);
+  if (resolvedFlags.every((flag) => flag === true)) {
+    return true;
+  }
+  if (resolvedFlags.every((flag) => flag === false)) {
+    return false;
+  }
+  devLog(mixedValuesWarning);
+  return void 0;
+}
+export {
+  collapseThresholdShowIndicators
+};
+//# sourceMappingURL=collapse-threshold-show-indicators.js.map

package/esm/charts/meter-bar/shared/utils/collapse-threshold-show-indicators.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/charts/meter-bar/shared/utils/collapse-threshold-show-indicators.ts"],
+  "sourcesContent": ["import { devLog } from '../../../../core/utils/logging.js';\n\n/**\n * Collapses the deprecated per-threshold `showIndicator` flags into a single\n * chart-level \"show threshold indicators\" value, shared by the standalone\n * `MeterBarChart` and the DataTable `meterbar` column.\n *\n * - all defined flags `true` \u2192 `true` (show all indicators)\n * - all defined flags `false` \u2192 `false` (hide all indicators)\n * - no flag defined \u2192 `undefined` (no legacy config; defer to the default)\n * - a mix of `true`/`false` (indeterminate) can't map to a single flag, so we\n *   warn the developer with `mixedValuesWarning` and defer to the default.\n *\n * The old per-threshold `showIndicator` defaulted to `false`, so an unset flag\n * is treated as `false` when collapsing.\n * @internal\n */\nexport function collapseThresholdShowIndicators(\n  showIndicators: Array<boolean | undefined>,\n  mixedValuesWarning: string,\n): boolean | undefined {\n  const usesLegacyConfig = showIndicators.some((flag) => flag !== undefined);\n  if (!usesLegacyConfig) {\n    return undefined;\n  }\n\n  const resolvedFlags = showIndicators.map((flag) => flag ?? false);\n  if (resolvedFlags.every((flag) => flag === true)) {\n    return true;\n  }\n  if (resolvedFlags.every((flag) => flag === false)) {\n    return false;\n  }\n\n  devLog(mixedValuesWarning);\n  return undefined;\n}\n"],
+  "mappings": "AAAA,SAAS,cAAc;AAiBhB,SAAS,gCACd,gBACA,oBACqB;AACrB,QAAM,mBAAmB,eAAe,KAAK,CAAC,SAAS,SAAS,MAAS;AACzE,MAAI,CAAC,kBAAkB;AACrB,WAAO;AAAA,EACT;AAEA,QAAM,gBAAgB,eAAe,IAAI,CAAC,SAAS,QAAQ,KAAK;AAChE,MAAI,cAAc,MAAM,CAAC,SAAS,SAAS,IAAI,GAAG;AAChD,WAAO;AAAA,EACT;AACA,MAAI,cAAc,MAAM,CAAC,SAAS,SAAS,KAAK,GAAG;AACjD,WAAO;AAAA,EACT;AAEA,SAAO,kBAAkB;AACzB,SAAO;AACT;",
+  "names": []
+}

package/esm/charts/meter-bar/single-meter-bar/MeterBarChart.js

@@ -2,6 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import clsx from "clsx";
 import { forwardRef, useRef } from "react";
 import { MeterBarChartPlotArea } from "./components/MeterBarChartPlotArea.js";
+import { MeterBarChartThresholdIntervals } from "./components/MeterBarChartThresholdIntervals/MeterBarChartThresholdIntervals.js";
 import { MeterBarChartThresholdLegend } from "./components/MeterBarChartThresholdLegend/MeterBarChartThresholdLegend.js";
 import { METER_BAR_CHART_ARIA_LABEL } from "./constants.js";
 import { useMeterBarChartConfig } from "./hooks/useMeterBarChartConfig.js";
@@ -38,6 +39,10 @@ const MeterBarChartRoot = forwardRef((props, forwardedRef) => {
     "data-dtrum-mask": dataDtrumMask,
     "data-dtrum-allow": dataDtrumAllow,
     "data-testid": dataTestId = "single-meter-bar-chart-root",
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    "aria-details": ariaDetails,
     prefixIcon,
     valueAccessor
   } = props;
@@ -98,7 +103,10 @@ const MeterBarChartRoot = forwardRef((props, forwardedRef) => {
       "data-dtrum-allow": dataDtrumAllow,
       "data-testid": dataTestId,
       "data-dt-component": COMPONENT_NAME,
-      "aria-label": METER_BAR_CHART_ARIA_LABEL,
+      "aria-label": ariaLabel ?? METER_BAR_CHART_ARIA_LABEL,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-describedby": ariaDescribedBy,
+      "aria-details": ariaDetails,
       consumerConfig,
       userRef: forwardedRef,
       children: [
@@ -121,6 +129,7 @@ const MeterBarChartRoot = forwardRef((props, forwardedRef) => {
           }
         ) }),
         /* @__PURE__ */ jsx(MeterBarLayout.Chart, { children: /* @__PURE__ */ jsx(MeterBarChartPlotArea, {}) }),
+        thresholds.data.length > 0 && /* @__PURE__ */ jsx(MeterBarLayout.Thresholds, { children: /* @__PURE__ */ jsx(MeterBarChartThresholdIntervals, {}) }),
         minSlot && /* @__PURE__ */ jsx(MeterBarLayout.Min, { children: /* @__PURE__ */ jsx(MeterBarChartFormattedValue, { value: min, auto: minSlot?.auto, children: minSlot?.value }) }),
         maxSlot && /* @__PURE__ */ jsx(MeterBarLayout.Max, { children: /* @__PURE__ */ jsx(MeterBarChartFormattedValue, { value: max, auto: maxSlot?.auto, children: maxSlot?.value }) }),
         hasLegend && /* @__PURE__ */ jsx(MeterBarLayout.Legend, { children: /* @__PURE__ */ jsx(MeterBarChartThresholdLegend, {}) })

package/esm/charts/meter-bar/single-meter-bar/MeterBarChart.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/charts/meter-bar/single-meter-bar/MeterBarChart.tsx"],
-  "sourcesContent": ["import clsx from 'clsx';\nimport { forwardRef, type PropsWithChildren, useRef } from 'react';\n\nimport { MeterBarChartPlotArea } from './components/MeterBarChartPlotArea.js';\nimport { MeterBarChartThresholdLegend } from './components/MeterBarChartThresholdLegend/MeterBarChartThresholdLegend.js';\nimport { METER_BAR_CHART_ARIA_LABEL } from './constants.js';\nimport { useMeterBarChartConfig } from './hooks/useMeterBarChartConfig.js';\nimport { MeterBarChartInternalDataProviders } from './providers/MeterBarChartInternalDataProviders.js';\nimport { MeterBarChartProviders } from './providers/MeterBarChartProviders.js';\nimport { Label } from './slots/Label.js';\nimport { Legend } from './slots/Legend.js';\nimport { Max } from './slots/Max.js';\nimport { Min } from './slots/Min.js';\nimport { ThresholdIndicator } from './slots/ThresholdIndicator.js';\nimport { ThresholdLegend } from './slots/ThresholdLegend.js';\nimport { Tooltip } from './slots/Tooltip.js';\nimport { Value } from './slots/Value.js';\nimport type {\n  MeterBarChartConsumerConfig,\n  MeterBarChartTooltipConsumerConfig,\n} from './types/meter-bar-chart-config.js';\nimport { type MeterBarChartProps } from './types/meter-bar-chart.js';\nimport { useBehavioralTrackingProps } from '../../../core/hooks/useBehavioralTrackingProps.js';\nimport { Intent } from '../../../core/slots/Intent/Intent.js';\nimport { defaultChartSize } from '../../../core/styles/defaultChartValues.sty.js';\nimport { DEFAULT_VALUE_ACCESSOR } from '../../core/constants.js';\nimport { ColorRule } from '../../core/slots/ColorRule.js';\nimport { ChartType } from '../../core/types/chart-types.js';\nimport type { ComponentWithName } from '../../core/types/component-with-name.js';\nimport { MeterBarChartFormattedValue } from '../shared/components/formatted-value/MeterBarChartFormattedValue.js';\nimport { MeterBarLayout } from '../shared/components/meter-bar-layout/MeterBarLayout.js';\nimport { Toolbar } from '../shared/slots/Toolbar.js';\nimport type { MeterBarChartElementRef } from '../shared/types/meter-bars.js';\nimport { getNumericValue } from '../shared/utils/get-numeric-value.js';\n\nconst COMPONENT_NAME = 'SingleMeterBarChart';\n/**\n * Single meter bar chart component */\nconst MeterBarChartRoot = forwardRef<\n  MeterBarChartElementRef,\n  PropsWithChildren<MeterBarChartProps>\n>((props, forwardedRef) => {\n  const {\n    width,\n    height,\n    value,\n    name,\n    color,\n    className,\n    style,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    'data-testid': dataTestId = 'single-meter-bar-chart-root',\n    prefixIcon,\n    valueAccessor,\n  } = props;\n\n  const [behavioralTrackingProps] = useBehavioralTrackingProps(props);\n\n  const config = useMeterBarChartConfig(props);\n  const {\n    size,\n    thresholds,\n    thresholdsIndicators,\n    loading,\n    min,\n    max,\n    minSlot,\n    maxSlot,\n    valueSlot,\n    labelSlot,\n    tooltip,\n    formatter,\n    unit,\n  } = config;\n\n  const meterBarChartRef = useRef<HTMLDivElement>(null);\n\n  const hasLegend = thresholds.legend ?? thresholdsIndicators.legend;\n\n  const consumerConfig: MeterBarChartConsumerConfig & {\n    type: ChartType.SingleMeterBar;\n  } = {\n    type: ChartType.SingleMeterBar,\n    thresholdsIndicators,\n    size,\n    min,\n    max,\n    formatter,\n    unit,\n    tooltip: {\n      hidden: tooltip.hidden,\n    } satisfies MeterBarChartTooltipConsumerConfig,\n    loading,\n  };\n\n  const displayValue = getNumericValue(\n    value,\n    valueAccessor ?? DEFAULT_VALUE_ACCESSOR,\n  );\n  const internalDataProvidersProps = {\n    value,\n    displayValue,\n    valueAccessor,\n    name,\n    color,\n  };\n\n  return (\n    <MeterBarChartProviders config={config} seriesActions={props.seriesActions}>\n      <MeterBarLayout\n        {...behavioralTrackingProps}\n        ref={meterBarChartRef}\n        size={size}\n        width={width}\n        height={height}\n        className={clsx(defaultChartSize, className)}\n        style={style}\n        data-dtrum-mask={dataDtrumMask}\n        data-dtrum-allow={dataDtrumAllow}\n        data-testid={dataTestId}\n        data-dt-component={COMPONENT_NAME}\n        aria-label={METER_BAR_CHART_ARIA_LABEL}\n        consumerConfig={consumerConfig}\n        userRef={forwardedRef}\n      >\n        <MeterBarLayout.Providers\n          providerName={MeterBarChartInternalDataProviders}\n          providerProps={internalDataProvidersProps}\n        />\n\n        {prefixIcon && <MeterBarLayout.Icon>{prefixIcon}</MeterBarLayout.Icon>}\n        {labelSlot && <MeterBarLayout.Label>{labelSlot}</MeterBarLayout.Label>}\n        {valueSlot && (\n          <MeterBarLayout.Value>\n            <MeterBarChartFormattedValue\n              value={displayValue}\n              total={max}\n              auto={valueSlot?.auto}\n            >\n              {valueSlot?.value}\n            </MeterBarChartFormattedValue>\n          </MeterBarLayout.Value>\n        )}\n        <MeterBarLayout.Chart>\n          <MeterBarChartPlotArea />\n        </MeterBarLayout.Chart>\n        {minSlot && (\n          <MeterBarLayout.Min>\n            <MeterBarChartFormattedValue value={min} auto={minSlot?.auto}>\n              {minSlot?.value}\n            </MeterBarChartFormattedValue>\n          </MeterBarLayout.Min>\n        )}\n        {maxSlot && (\n          <MeterBarLayout.Max>\n            <MeterBarChartFormattedValue value={max} auto={maxSlot?.auto}>\n              {maxSlot?.value}\n            </MeterBarChartFormattedValue>\n          </MeterBarLayout.Max>\n        )}\n        {hasLegend && (\n          <MeterBarLayout.Legend>\n            <MeterBarChartThresholdLegend />\n          </MeterBarLayout.Legend>\n        )}\n      </MeterBarLayout>\n    </MeterBarChartProviders>\n  );\n});\n\n(MeterBarChartRoot as ComponentWithName<typeof MeterBarChartRoot>).displayName =\n  'MeterBarChart';\n\n/**\n * The `MeterBarChart` provides a lightweight and simple visualization progress\n * toward a completion, consumption of a total, etc.  It consists of a horizontal\n * bar that gradually fills up with color or shading as it approaches the max value.\n * @public\n */\nexport const MeterBarChart = Object.assign(MeterBarChartRoot, {\n  Value,\n  Label,\n  Min,\n  Max,\n  ThresholdIndicator,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ThresholdLegend,\n  Legend,\n  Tooltip,\n  ColorRule,\n  Intent,\n  Toolbar,\n});\n"],
-  "mappings": "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",
+  "sourcesContent": ["import clsx from 'clsx';\nimport { forwardRef, type PropsWithChildren, useRef } from 'react';\n\nimport { MeterBarChartPlotArea } from './components/MeterBarChartPlotArea.js';\nimport { MeterBarChartThresholdIntervals } from './components/MeterBarChartThresholdIntervals/MeterBarChartThresholdIntervals.js';\nimport { MeterBarChartThresholdLegend } from './components/MeterBarChartThresholdLegend/MeterBarChartThresholdLegend.js';\nimport { METER_BAR_CHART_ARIA_LABEL } from './constants.js';\nimport { useMeterBarChartConfig } from './hooks/useMeterBarChartConfig.js';\nimport { MeterBarChartInternalDataProviders } from './providers/MeterBarChartInternalDataProviders.js';\nimport { MeterBarChartProviders } from './providers/MeterBarChartProviders.js';\nimport { Label } from './slots/Label.js';\nimport { Legend } from './slots/Legend.js';\nimport { Max } from './slots/Max.js';\nimport { Min } from './slots/Min.js';\nimport { ThresholdIndicator } from './slots/ThresholdIndicator.js';\nimport { ThresholdLegend } from './slots/ThresholdLegend.js';\nimport { Tooltip } from './slots/Tooltip.js';\nimport { Value } from './slots/Value.js';\nimport type {\n  MeterBarChartConsumerConfig,\n  MeterBarChartTooltipConsumerConfig,\n} from './types/meter-bar-chart-config.js';\nimport { type MeterBarChartProps } from './types/meter-bar-chart.js';\nimport { useBehavioralTrackingProps } from '../../../core/hooks/useBehavioralTrackingProps.js';\nimport { Intent } from '../../../core/slots/Intent/Intent.js';\nimport { defaultChartSize } from '../../../core/styles/defaultChartValues.sty.js';\nimport { DEFAULT_VALUE_ACCESSOR } from '../../core/constants.js';\nimport { ColorRule } from '../../core/slots/ColorRule.js';\nimport { ChartType } from '../../core/types/chart-types.js';\nimport type { ComponentWithName } from '../../core/types/component-with-name.js';\nimport { MeterBarChartFormattedValue } from '../shared/components/formatted-value/MeterBarChartFormattedValue.js';\nimport { MeterBarLayout } from '../shared/components/meter-bar-layout/MeterBarLayout.js';\nimport { Toolbar } from '../shared/slots/Toolbar.js';\nimport type { MeterBarChartElementRef } from '../shared/types/meter-bars.js';\nimport { getNumericValue } from '../shared/utils/get-numeric-value.js';\n\nconst COMPONENT_NAME = 'SingleMeterBarChart';\n/**\n * Single meter bar chart component */\nconst MeterBarChartRoot = forwardRef<\n  MeterBarChartElementRef,\n  PropsWithChildren<MeterBarChartProps>\n>((props, forwardedRef) => {\n  const {\n    width,\n    height,\n    value,\n    name,\n    color,\n    className,\n    style,\n    'data-dtrum-mask': dataDtrumMask,\n    'data-dtrum-allow': dataDtrumAllow,\n    'data-testid': dataTestId = 'single-meter-bar-chart-root',\n    'aria-label': ariaLabel,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-describedby': ariaDescribedBy,\n    'aria-details': ariaDetails,\n    prefixIcon,\n    valueAccessor,\n  } = props;\n\n  const [behavioralTrackingProps] = useBehavioralTrackingProps(props);\n\n  const config = useMeterBarChartConfig(props);\n  const {\n    size,\n    thresholds,\n    thresholdsIndicators,\n    loading,\n    min,\n    max,\n    minSlot,\n    maxSlot,\n    valueSlot,\n    labelSlot,\n    tooltip,\n    formatter,\n    unit,\n  } = config;\n\n  const meterBarChartRef = useRef<HTMLDivElement>(null);\n\n  const hasLegend = thresholds.legend ?? thresholdsIndicators.legend;\n\n  const consumerConfig: MeterBarChartConsumerConfig & {\n    type: ChartType.SingleMeterBar;\n  } = {\n    type: ChartType.SingleMeterBar,\n    thresholdsIndicators,\n    size,\n    min,\n    max,\n    formatter,\n    unit,\n    tooltip: {\n      hidden: tooltip.hidden,\n    } satisfies MeterBarChartTooltipConsumerConfig,\n    loading,\n  };\n\n  const displayValue = getNumericValue(\n    value,\n    valueAccessor ?? DEFAULT_VALUE_ACCESSOR,\n  );\n  const internalDataProvidersProps = {\n    value,\n    displayValue,\n    valueAccessor,\n    name,\n    color,\n  };\n\n  return (\n    <MeterBarChartProviders config={config} seriesActions={props.seriesActions}>\n      <MeterBarLayout\n        {...behavioralTrackingProps}\n        ref={meterBarChartRef}\n        size={size}\n        width={width}\n        height={height}\n        className={clsx(defaultChartSize, className)}\n        style={style}\n        data-dtrum-mask={dataDtrumMask}\n        data-dtrum-allow={dataDtrumAllow}\n        data-testid={dataTestId}\n        data-dt-component={COMPONENT_NAME}\n        aria-label={ariaLabel ?? METER_BAR_CHART_ARIA_LABEL}\n        aria-labelledby={ariaLabelledBy}\n        aria-describedby={ariaDescribedBy}\n        aria-details={ariaDetails}\n        consumerConfig={consumerConfig}\n        userRef={forwardedRef}\n      >\n        <MeterBarLayout.Providers\n          providerName={MeterBarChartInternalDataProviders}\n          providerProps={internalDataProvidersProps}\n        />\n\n        {prefixIcon && <MeterBarLayout.Icon>{prefixIcon}</MeterBarLayout.Icon>}\n        {labelSlot && <MeterBarLayout.Label>{labelSlot}</MeterBarLayout.Label>}\n        {valueSlot && (\n          <MeterBarLayout.Value>\n            <MeterBarChartFormattedValue\n              value={displayValue}\n              total={max}\n              auto={valueSlot?.auto}\n            >\n              {valueSlot?.value}\n            </MeterBarChartFormattedValue>\n          </MeterBarLayout.Value>\n        )}\n        <MeterBarLayout.Chart>\n          <MeterBarChartPlotArea />\n        </MeterBarLayout.Chart>\n        {thresholds.data.length > 0 && (\n          <MeterBarLayout.Thresholds>\n            <MeterBarChartThresholdIntervals />\n          </MeterBarLayout.Thresholds>\n        )}\n        {minSlot && (\n          <MeterBarLayout.Min>\n            <MeterBarChartFormattedValue value={min} auto={minSlot?.auto}>\n              {minSlot?.value}\n            </MeterBarChartFormattedValue>\n          </MeterBarLayout.Min>\n        )}\n        {maxSlot && (\n          <MeterBarLayout.Max>\n            <MeterBarChartFormattedValue value={max} auto={maxSlot?.auto}>\n              {maxSlot?.value}\n            </MeterBarChartFormattedValue>\n          </MeterBarLayout.Max>\n        )}\n        {hasLegend && (\n          <MeterBarLayout.Legend>\n            <MeterBarChartThresholdLegend />\n          </MeterBarLayout.Legend>\n        )}\n      </MeterBarLayout>\n    </MeterBarChartProviders>\n  );\n});\n\n(MeterBarChartRoot as ComponentWithName<typeof MeterBarChartRoot>).displayName =\n  'MeterBarChart';\n\n/**\n * The `MeterBarChart` provides a lightweight and simple visualization progress\n * toward a completion, consumption of a total, etc.  It consists of a horizontal\n * bar that gradually fills up with color or shading as it approaches the max value.\n * @public\n */\nexport const MeterBarChart = Object.assign(MeterBarChartRoot, {\n  Value,\n  Label,\n  Min,\n  Max,\n  ThresholdIndicator,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ThresholdLegend,\n  Legend,\n  Tooltip,\n  ColorRule,\n  Intent,\n  Toolbar,\n});\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/charts/meter-bar/single-meter-bar/components/MeterBarChartOverlay/MeterBarChartOverlayWithTooltip.js

@@ -36,7 +36,10 @@ const MeterBarCustomTooltip = ({
         max,
         color,
         name,
-        threshold: activeThreshold ? { label: activeThreshold.name, color: activeThreshold.color } : void 0
+        threshold: activeThreshold ? {
+          label: activeThreshold.name,
+          color: activeThreshold.color ?? color
+        } : void 0
       })
     }
   );