@zendir/ui 0.5.0 → 0.6.0

package/dist/react/core/inputs/LimitsBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"LimitsBar.js","sources":["../../../../src/react/core/inputs/LimitsBar.tsx"],"sourcesContent":["/**\n * @zendir/ui - LimitsBar Component\n * \n * Visual limits indicator for telemetry monitoring and spacecraft health assessment.\n * Displays a horizontal bar with colored zones (red-low, yellow-low, green, yellow-high, red-high)\n * and a marker showing the current value position within the range.\n * \n * Supports:\n * - 5-zone limits (red-low, yellow-low, green/normal, yellow-high, red-high)\n * - 3-zone limits (low, nominal, high) \n * - Blue zone for \"out of range\" / stale\n * - Animated value transitions\n * - Compact and full display modes\n * - Value label with units\n * - Configurable thresholds\n * \n * Astro UX Compliance:\n * - Uses official Astro status colors\n * - Consistent with Astro monitoring patterns\n * \n * @example\n * ```tsx\n * <LimitsBar\n *   value={72.5}\n *   redLow={10} yellowLow={25} greenLow={40}\n *   greenHigh={80} yellowHigh={90} redHigh={100}\n *   label=\"Temperature\" unit=\"°C\"\n * />\n * ```\n */\n\nimport React, { useMemo, memo } from 'react';\nimport { useTheme } from '../../theme';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type LimitsState = 'red_low' | 'yellow_low' | 'green' | 'yellow_high' | 'red_high' | 'blue' | 'stale';\n\nexport interface LimitsBarProps {\n  /** Current value */\n  value: number;\n  /** Red low threshold (minimum critical) */\n  redLow?: number;\n  /** Yellow low threshold (minimum warning) */\n  yellowLow?: number;\n  /** Green low threshold (start of nominal) */\n  greenLow?: number;\n  /** Green high threshold (end of nominal) */\n  greenHigh?: number;\n  /** Yellow high threshold (maximum warning) */\n  yellowHigh?: number;\n  /** Red high threshold (maximum critical) */\n  redHigh?: number;\n  /** Overall min for the bar (defaults to redLow - 10%) */\n  min?: number;\n  /** Overall max for the bar (defaults to redHigh + 10%) */\n  max?: number;\n  /** Label text */\n  label?: string;\n  /** Unit string */\n  unit?: string;\n  /** Whether the value is stale / not updating */\n  stale?: boolean;\n  /** Compact mode (thinner bar, less text) */\n  compact?: boolean;\n  /** Show the numeric value on the bar */\n  showValue?: boolean;\n  /** Show limit threshold labels */\n  showThresholds?: boolean;\n  /** Width (default: '100%') */\n  width?: number | string;\n  /** Height of the bar (default: 20 for normal, 12 for compact) */\n  barHeight?: number;\n  /** Custom status override (forces a specific status regardless of value) */\n  statusOverride?: LimitsState;\n  /** Called when status changes */\n  onStatusChange?: (status: LimitsState, value: number) => void;\n  /** When false, lower-limit zones (red-low, yellow-low, green-low) are hidden even if threshold values are provided */\n  showLower?: boolean;\n  /** When false, upper-limit zones (green-high, yellow-high, red-high) are hidden even if threshold values are provided */\n  showUpper?: boolean;\n  /** CSS class */\n  className?: string;\n}\n\n// =============================================================================\n// Helpers\n// =============================================================================\n\nfunction getLimitsState(\n  value: number,\n  redLow?: number,\n  yellowLow?: number,\n  greenLow?: number,\n  greenHigh?: number,\n  yellowHigh?: number,\n  redHigh?: number,\n): LimitsState {\n  if (redLow !== undefined && value < redLow) return 'red_low';\n  if (yellowLow !== undefined && value < yellowLow) return 'yellow_low';\n  if (greenLow !== undefined && value < greenLow) return 'yellow_low';\n  if (redHigh !== undefined && value > redHigh) return 'red_high';\n  if (yellowHigh !== undefined && value > yellowHigh) return 'yellow_high';\n  if (greenHigh !== undefined && value > greenHigh) return 'yellow_high';\n  return 'green';\n}\n\n// =============================================================================\n// Component\n// =============================================================================\n\nexport const LimitsBar = memo(function LimitsBar({\n  value,\n  redLow: redLowProp,\n  yellowLow: yellowLowProp,\n  greenLow: greenLowProp,\n  greenHigh: greenHighProp,\n  yellowHigh: yellowHighProp,\n  redHigh: redHighProp,\n  min: minProp,\n  max: maxProp,\n  label,\n  unit,\n  stale = false,\n  compact = false,\n  showValue = true,\n  showThresholds = false,\n  showLower = true,\n  showUpper = true,\n  width = '100%',\n  barHeight: barHeightProp,\n  statusOverride,\n  className = '',\n}: LimitsBarProps): React.ReactElement {\n  // Mask thresholds based on showLower / showUpper flags\n  const redLow    = showLower ? redLowProp    : undefined;\n  const yellowLow = showLower ? yellowLowProp : undefined;\n  const greenLow  = showLower ? greenLowProp  : undefined;\n  const greenHigh  = showUpper ? greenHighProp  : undefined;\n  const yellowHigh = showUpper ? yellowHighProp : undefined;\n  const redHigh    = showUpper ? redHighProp    : undefined;\n  const { tokens } = useTheme();\n  const softStatusColors = useMemo(() => ({\n    normal: tokens.colors.status.normal,\n    caution: tokens.colors.status.caution,\n    serious: tokens.colors.status.serious,\n    critical: tokens.colors.status.critical,\n    off: tokens.colors.status.off,\n    standby: tokens.colors.status.standby,\n  }), [tokens]);\n\n  const barHeight = barHeightProp ?? (compact ? 12 : 20);\n  \n  const _thresholds = useMemo(() => {\n    const rl = redLow ?? -Infinity;\n    const yl = yellowLow ?? redLow ?? -Infinity;\n    const gl = greenLow ?? yellowLow ?? redLow ?? -Infinity;\n    const gh = greenHigh ?? yellowHigh ?? redHigh ?? Infinity;\n    const yh = yellowHigh ?? redHigh ?? Infinity;\n    const rh = redHigh ?? Infinity;\n    return { rl, yl, gl, gh, yh, rh };\n  }, [redLow, yellowLow, greenLow, greenHigh, yellowHigh, redHigh]);\n\n  const rangeMin = minProp ?? (redLow !== undefined ? redLow - (redHigh !== undefined ? (redHigh - redLow) * 0.1 : 10) : 0);\n  const rangeMax = maxProp ?? (redHigh !== undefined ? redHigh + (redLow !== undefined ? (redHigh - redLow) * 0.1 : 10) : 100);\n  const range = rangeMax - rangeMin;\n\n  const status = stale ? 'stale' : (statusOverride ?? getLimitsState(value, redLow, yellowLow, greenLow, greenHigh, yellowHigh, redHigh));\n\n  const statusColors: Record<LimitsState, string> = {\n    red_low: softStatusColors.critical,\n    red_high: softStatusColors.critical,\n    yellow_low: softStatusColors.caution,\n    yellow_high: softStatusColors.caution,\n    green: softStatusColors.normal,\n    blue: softStatusColors.standby,\n    stale: softStatusColors.off,\n  };\n\n  const valuePercent = range > 0 ? Math.max(0, Math.min(100, ((value - rangeMin) / range) * 100)) : 50;\n\n  // Build zone segments\n  const zones = useMemo(() => {\n    const segs: { start: number; end: number; color: string }[] = [];\n    const toPercent = (v: number) => Math.max(0, Math.min(100, ((v - rangeMin) / range) * 100));\n\n    const critical = softStatusColors.critical;\n    const caution = softStatusColors.caution;\n    const normal = softStatusColors.normal;\n\n    if (redLow !== undefined) {\n      segs.push({ start: 0, end: toPercent(redLow), color: `${critical}66` });\n    }\n    if (yellowLow !== undefined) {\n      const s = redLow !== undefined ? toPercent(redLow) : 0;\n      segs.push({ start: s, end: toPercent(yellowLow), color: `${caution}66` });\n    }\n    {\n      const s = yellowLow !== undefined ? toPercent(yellowLow) : (redLow !== undefined ? toPercent(redLow) : 0);\n      const e = yellowHigh !== undefined ? toPercent(yellowHigh) : (redHigh !== undefined ? toPercent(redHigh) : 100);\n      segs.push({ start: s, end: e, color: `${normal}44` });\n    }\n    if (yellowHigh !== undefined) {\n      const e = redHigh !== undefined ? toPercent(redHigh) : 100;\n      segs.push({ start: toPercent(yellowHigh), end: e, color: `${caution}66` });\n    }\n    if (redHigh !== undefined) {\n      segs.push({ start: toPercent(redHigh), end: 100, color: `${critical}66` });\n    }\n\n    return segs;\n  }, [redLow, yellowLow, yellowHigh, redHigh, rangeMin, range, softStatusColors]);\n\n  const markerColor = statusColors[status];\n\n  return (\n    <div\n      className={`limits-bar ${className}`}\n      role=\"meter\"\n      aria-valuenow={value}\n      aria-valuemin={rangeMin}\n      aria-valuemax={rangeMax}\n      aria-label={label ? `${label}: ${value}${unit ? ' ' + unit : ''}` : `${value}${unit ? ' ' + unit : ''}`}\n      style={{ width, fontFamily: tokens.typography.fontFamily.primary }}\n    >\n      {/* Label row */}\n      {(label || showValue) && !compact && (\n        <div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: tokens.spacing.xs, fontSize: tokens.typography.fontSize.sm }}>\n          {label && <span style={{ color: tokens.colors.text.secondary, fontWeight: tokens.typography.fontWeight.medium }}>{label}</span>}\n          {showValue && (\n            <span style={{ color: markerColor, fontWeight: tokens.typography.fontWeight.medium, fontFamily: tokens.typography.fontFamily.mono }}>\n              {typeof value === 'number' ? value.toFixed(2) : value}\n              {unit && <span style={{ fontSize: tokens.typography.fontSize.xxs, marginLeft: tokens.spacing.xxs, color: tokens.colors.text.muted }}>{unit}</span>}\n            </span>\n          )}\n        </div>\n      )}\n\n      {/* Bar */}\n      <div style={{\n        position: 'relative',\n        height: barHeight,\n        borderRadius: tokens.borderRadius.full,\n        background: tokens.colors.background.base,\n        border: `1px solid ${tokens.colors.border.muted}`,\n        overflow: 'hidden',\n      }}>\n        {/* Zone segments */}\n        {zones.map((z, i) => (\n          <div\n            key={i}\n            style={{\n              position: 'absolute',\n              left: `${z.start}%`,\n              width: `${z.end - z.start}%`,\n              height: '100%',\n              background: z.color,\n            }}\n          />\n        ))}\n\n        {/* Value marker */}\n        <div style={{\n          position: 'absolute',\n          left: `${valuePercent}%`,\n          top: 0,\n          bottom: 0,\n          width: compact ? 3 : 4,\n          marginLeft: compact ? -1.5 : -2,\n          background: markerColor,\n          borderRadius: tokens.borderRadius.sm,\n          boxShadow: `0 0 8px ${markerColor}66, 0 0 3px ${markerColor}44`,\n          transition: 'left 300ms cubic-bezier(0.4, 0, 0.2, 1), background 300ms ease',\n        }} />\n\n        {/* Compact label */}\n        {compact && showValue && (\n          <div style={{\n            position: 'absolute',\n            right: tokens.spacing.xs,\n            top: '50%',\n            transform: 'translateY(-50%)',\n            fontSize: tokens.typography.fontSize.micro,\n            fontWeight: tokens.typography.fontWeight.medium,\n            color: markerColor,\n            fontFamily: tokens.typography.fontFamily.mono,\n            textShadow: `0 0 4px ${tokens.colors.background.base}`,\n          }}>\n            {typeof value === 'number' ? value.toFixed(1) : value}{unit || ''}\n          </div>\n        )}\n      </div>\n\n      {/* Threshold labels */}\n      {showThresholds && !compact && (\n        <div style={{ position: 'relative', height: 14, marginTop: tokens.spacing.xxs }}>\n          {[\n            { val: redLow, color: softStatusColors.critical },\n            { val: yellowLow, color: softStatusColors.caution },\n            { val: greenHigh ?? yellowHigh, color: softStatusColors.caution },\n            { val: redHigh, color: softStatusColors.critical },\n          ].filter(t => t.val !== undefined).map((t, i) => {\n            const pct = range > 0 ? ((t.val! - rangeMin) / range) * 100 : 0;\n            return (\n              <span\n                key={i}\n                aria-label={`Threshold: ${t.val}`}\n                style={{\n                  position: 'absolute',\n                  left: `${pct}%`,\n                  transform: 'translateX(-50%)',\n                  fontSize: tokens.typography.fontSize.micro,\n                  color: t.color,\n                  fontFamily: tokens.typography.fontFamily.mono,\n                }}\n              >\n                {t.val}\n              </span>\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n});\n\nexport default LimitsBar;\n"],"names":["LimitsBar"],"mappings":"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"}
+{"version":3,"file":"LimitsBar.js","names":[],"sources":["../../../../src/react/core/inputs/LimitsBar.tsx"],"sourcesContent":["/**\n * @zendir/ui - LimitsBar Component\n *\n * Visual limits indicator for telemetry monitoring and spacecraft health assessment.\n * Displays a horizontal bar with colored zones (red-low, yellow-low, green, yellow-high, red-high)\n * and a marker showing the current value position within the range.\n *\n * Supports:\n * - 5-zone limits (red-low, yellow-low, green/normal, yellow-high, red-high)\n * - 3-zone limits (low, nominal, high)\n * - Blue zone for \"out of range\" / stale\n * - Animated value transitions\n * - Compact and full display modes\n * - Value label with units\n * - Configurable thresholds\n *\n * Astro UX Compliance:\n * - Uses official Astro status colors\n * - Consistent with Astro monitoring patterns\n *\n * @example\n * ```tsx\n * <LimitsBar\n *   value={72.5}\n *   redLow={10} yellowLow={25} greenLow={40}\n *   greenHigh={80} yellowHigh={90} redHigh={100}\n *   label=\"Temperature\" unit=\"°C\"\n * />\n * ```\n */\n\nimport React, { useMemo, memo } from \"react\";\nimport { useTheme } from \"../../theme\";\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type LimitsState =\n  | \"red_low\"\n  | \"yellow_low\"\n  | \"green\"\n  | \"yellow_high\"\n  | \"red_high\"\n  | \"blue\"\n  | \"stale\";\n\nexport interface LimitsBarProps {\n  /** Current value */\n  value: number;\n  /** Red low threshold (minimum critical) */\n  redLow?: number;\n  /** Yellow low threshold (minimum warning) */\n  yellowLow?: number;\n  /** Green low threshold (start of nominal) */\n  greenLow?: number;\n  /** Green high threshold (end of nominal) */\n  greenHigh?: number;\n  /** Yellow high threshold (maximum warning) */\n  yellowHigh?: number;\n  /** Red high threshold (maximum critical) */\n  redHigh?: number;\n  /** Overall min for the bar (defaults to redLow - 10%) */\n  min?: number;\n  /** Overall max for the bar (defaults to redHigh + 10%) */\n  max?: number;\n  /** Label text */\n  label?: string;\n  /** Unit string */\n  unit?: string;\n  /** Whether the value is stale / not updating */\n  stale?: boolean;\n  /** Compact mode (thinner bar, less text) */\n  compact?: boolean;\n  /** Show the numeric value on the bar */\n  showValue?: boolean;\n  /** Show limit threshold labels */\n  showThresholds?: boolean;\n  /** Width (default: '100%') */\n  width?: number | string;\n  /** Height of the bar (default: 20 for normal, 12 for compact) */\n  barHeight?: number;\n  /** Custom status override (forces a specific status regardless of value) */\n  statusOverride?: LimitsState;\n  /** Called when status changes */\n  onStatusChange?: (status: LimitsState, value: number) => void;\n  /** When false, lower-limit zones (red-low, yellow-low, green-low) are hidden even if threshold values are provided */\n  showLower?: boolean;\n  /** When false, upper-limit zones (green-high, yellow-high, red-high) are hidden even if threshold values are provided */\n  showUpper?: boolean;\n  /** CSS class */\n  className?: string;\n}\n\n// =============================================================================\n// Helpers\n// =============================================================================\n\nfunction getLimitsState(\n  value: number,\n  redLow?: number,\n  yellowLow?: number,\n  greenLow?: number,\n  greenHigh?: number,\n  yellowHigh?: number,\n  redHigh?: number,\n): LimitsState {\n  if (redLow !== undefined && value < redLow) return \"red_low\";\n  if (yellowLow !== undefined && value < yellowLow) return \"yellow_low\";\n  if (greenLow !== undefined && value < greenLow) return \"yellow_low\";\n  if (redHigh !== undefined && value > redHigh) return \"red_high\";\n  if (yellowHigh !== undefined && value > yellowHigh) return \"yellow_high\";\n  if (greenHigh !== undefined && value > greenHigh) return \"yellow_high\";\n  return \"green\";\n}\n\n// =============================================================================\n// Component\n// =============================================================================\n\nexport const LimitsBar = memo(function LimitsBar({\n  value,\n  redLow: redLowProp,\n  yellowLow: yellowLowProp,\n  greenLow: greenLowProp,\n  greenHigh: greenHighProp,\n  yellowHigh: yellowHighProp,\n  redHigh: redHighProp,\n  min: minProp,\n  max: maxProp,\n  label,\n  unit,\n  stale = false,\n  compact = false,\n  showValue = true,\n  showThresholds = false,\n  showLower = true,\n  showUpper = true,\n  width = \"100%\",\n  barHeight: barHeightProp,\n  statusOverride,\n  className = \"\",\n}: LimitsBarProps): React.ReactElement {\n  // Mask thresholds based on showLower / showUpper flags\n  const redLow = showLower ? redLowProp : undefined;\n  const yellowLow = showLower ? yellowLowProp : undefined;\n  const greenLow = showLower ? greenLowProp : undefined;\n  const greenHigh = showUpper ? greenHighProp : undefined;\n  const yellowHigh = showUpper ? yellowHighProp : undefined;\n  const redHigh = showUpper ? redHighProp : undefined;\n  const { tokens } = useTheme();\n  const softStatusColors = useMemo(\n    () => ({\n      normal: tokens.colors.status.normal,\n      caution: tokens.colors.status.caution,\n      serious: tokens.colors.status.serious,\n      critical: tokens.colors.status.critical,\n      off: tokens.colors.status.off,\n      standby: tokens.colors.status.standby,\n    }),\n    [tokens],\n  );\n\n  const barHeight = barHeightProp ?? (compact ? 12 : 20);\n\n  const _thresholds = useMemo(() => {\n    const rl = redLow ?? -Infinity;\n    const yl = yellowLow ?? redLow ?? -Infinity;\n    const gl = greenLow ?? yellowLow ?? redLow ?? -Infinity;\n    const gh = greenHigh ?? yellowHigh ?? redHigh ?? Infinity;\n    const yh = yellowHigh ?? redHigh ?? Infinity;\n    const rh = redHigh ?? Infinity;\n    return { rl, yl, gl, gh, yh, rh };\n  }, [redLow, yellowLow, greenLow, greenHigh, yellowHigh, redHigh]);\n\n  const rangeMin =\n    minProp ??\n    (redLow !== undefined\n      ? redLow - (redHigh !== undefined ? (redHigh - redLow) * 0.1 : 10)\n      : 0);\n  const rangeMax =\n    maxProp ??\n    (redHigh !== undefined\n      ? redHigh + (redLow !== undefined ? (redHigh - redLow) * 0.1 : 10)\n      : 100);\n  const range = rangeMax - rangeMin;\n\n  const status = stale\n    ? \"stale\"\n    : (statusOverride ??\n      getLimitsState(\n        value,\n        redLow,\n        yellowLow,\n        greenLow,\n        greenHigh,\n        yellowHigh,\n        redHigh,\n      ));\n\n  const statusColors: Record<LimitsState, string> = {\n    red_low: softStatusColors.critical,\n    red_high: softStatusColors.critical,\n    yellow_low: softStatusColors.caution,\n    yellow_high: softStatusColors.caution,\n    green: softStatusColors.normal,\n    blue: softStatusColors.standby,\n    stale: softStatusColors.off,\n  };\n\n  const valuePercent =\n    range > 0\n      ? Math.max(0, Math.min(100, ((value - rangeMin) / range) * 100))\n      : 50;\n\n  // Build zone segments\n  const zones = useMemo(() => {\n    const segs: { start: number; end: number; color: string }[] = [];\n    const toPercent = (v: number) =>\n      Math.max(0, Math.min(100, ((v - rangeMin) / range) * 100));\n\n    const critical = softStatusColors.critical;\n    const caution = softStatusColors.caution;\n    const normal = softStatusColors.normal;\n\n    if (redLow !== undefined) {\n      segs.push({ start: 0, end: toPercent(redLow), color: `${critical}66` });\n    }\n    if (yellowLow !== undefined) {\n      const s = redLow !== undefined ? toPercent(redLow) : 0;\n      segs.push({ start: s, end: toPercent(yellowLow), color: `${caution}66` });\n    }\n    {\n      const s =\n        yellowLow !== undefined\n          ? toPercent(yellowLow)\n          : redLow !== undefined\n            ? toPercent(redLow)\n            : 0;\n      const e =\n        yellowHigh !== undefined\n          ? toPercent(yellowHigh)\n          : redHigh !== undefined\n            ? toPercent(redHigh)\n            : 100;\n      segs.push({ start: s, end: e, color: `${normal}44` });\n    }\n    if (yellowHigh !== undefined) {\n      const e = redHigh !== undefined ? toPercent(redHigh) : 100;\n      segs.push({\n        start: toPercent(yellowHigh),\n        end: e,\n        color: `${caution}66`,\n      });\n    }\n    if (redHigh !== undefined) {\n      segs.push({\n        start: toPercent(redHigh),\n        end: 100,\n        color: `${critical}66`,\n      });\n    }\n\n    return segs;\n  }, [\n    redLow,\n    yellowLow,\n    yellowHigh,\n    redHigh,\n    rangeMin,\n    range,\n    softStatusColors,\n  ]);\n\n  const markerColor = statusColors[status];\n\n  return (\n    <div\n      className={`limits-bar ${className}`}\n      role=\"meter\"\n      aria-valuenow={value}\n      aria-valuemin={rangeMin}\n      aria-valuemax={rangeMax}\n      aria-label={\n        label\n          ? `${label}: ${value}${unit ? \" \" + unit : \"\"}`\n          : `${value}${unit ? \" \" + unit : \"\"}`\n      }\n      style={{ width, fontFamily: tokens.typography.fontFamily.primary }}\n    >\n      {/* Label row */}\n      {(label || showValue) && !compact && (\n        <div\n          style={{\n            display: \"flex\",\n            justifyContent: \"space-between\",\n            marginBottom: tokens.spacing.xs,\n            fontSize: tokens.typography.fontSize.sm,\n          }}\n        >\n          {label && (\n            <span\n              style={{\n                color: tokens.colors.text.secondary,\n                fontWeight: tokens.typography.fontWeight.medium,\n              }}\n            >\n              {label}\n            </span>\n          )}\n          {showValue && (\n            <span\n              style={{\n                color: markerColor,\n                fontWeight: tokens.typography.fontWeight.medium,\n                fontFamily: tokens.typography.fontFamily.mono,\n              }}\n            >\n              {typeof value === \"number\" ? value.toFixed(2) : value}\n              {unit && (\n                <span\n                  style={{\n                    fontSize: tokens.typography.fontSize.xxs,\n                    marginLeft: tokens.spacing.xxs,\n                    color: tokens.colors.text.muted,\n                  }}\n                >\n                  {unit}\n                </span>\n              )}\n            </span>\n          )}\n        </div>\n      )}\n\n      {/* Bar */}\n      <div\n        style={{\n          position: \"relative\",\n          height: barHeight,\n          borderRadius: tokens.borderRadius.full,\n          background: tokens.colors.background.base,\n          border: `1px solid ${tokens.colors.border.muted}`,\n          overflow: \"hidden\",\n        }}\n      >\n        {/* Zone segments */}\n        {zones.map((z, i) => (\n          <div\n            key={i}\n            style={{\n              position: \"absolute\",\n              left: `${z.start}%`,\n              width: `${z.end - z.start}%`,\n              height: \"100%\",\n              background: z.color,\n            }}\n          />\n        ))}\n\n        {/* Value marker */}\n        <div\n          style={{\n            position: \"absolute\",\n            left: `${valuePercent}%`,\n            top: 0,\n            bottom: 0,\n            width: compact ? 3 : 4,\n            marginLeft: compact ? -1.5 : -2,\n            background: markerColor,\n            borderRadius: tokens.borderRadius.sm,\n            boxShadow: `0 0 8px ${markerColor}66, 0 0 3px ${markerColor}44`,\n            transition:\n              \"left 300ms cubic-bezier(0.4, 0, 0.2, 1), background 300ms ease\",\n          }}\n        />\n\n        {/* Compact label */}\n        {compact && showValue && (\n          <div\n            style={{\n              position: \"absolute\",\n              right: tokens.spacing.xs,\n              top: \"50%\",\n              transform: \"translateY(-50%)\",\n              fontSize: tokens.typography.fontSize.micro,\n              fontWeight: tokens.typography.fontWeight.medium,\n              color: markerColor,\n              fontFamily: tokens.typography.fontFamily.mono,\n              textShadow: `0 0 4px ${tokens.colors.background.base}`,\n            }}\n          >\n            {typeof value === \"number\" ? value.toFixed(1) : value}\n            {unit || \"\"}\n          </div>\n        )}\n      </div>\n\n      {/* Threshold labels */}\n      {showThresholds && !compact && (\n        <div\n          style={{\n            position: \"relative\",\n            height: 14,\n            marginTop: tokens.spacing.xxs,\n          }}\n        >\n          {[\n            { val: redLow, color: softStatusColors.critical },\n            { val: yellowLow, color: softStatusColors.caution },\n            { val: greenHigh ?? yellowHigh, color: softStatusColors.caution },\n            { val: redHigh, color: softStatusColors.critical },\n          ]\n            .filter((t) => t.val !== undefined)\n            .map((t, i) => {\n              const pct = range > 0 ? ((t.val! - rangeMin) / range) * 100 : 0;\n              return (\n                <span\n                  key={i}\n                  aria-label={`Threshold: ${t.val}`}\n                  style={{\n                    position: \"absolute\",\n                    left: `${pct}%`,\n                    transform: \"translateX(-50%)\",\n                    fontSize: tokens.typography.fontSize.micro,\n                    color: t.color,\n                    fontFamily: tokens.typography.fontFamily.mono,\n                  }}\n                >\n                  {t.val}\n                </span>\n              );\n            })}\n        </div>\n      )}\n    </div>\n  );\n});\n\nexport default LimitsBar;\n"],"mappings":"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"}

package/dist/react/core/inputs/NumberInput.d.ts

@@ -2,8 +2,7 @@ import { default as React } from 'react';
 import { LabelPlacement } from './Input';
 import { StatusLevel } from '../../utils';
 import { StatusThresholds } from '../data/propertyConfig';
-
-export type NumberInputSize = 'small' | 'medium' | 'large';
+export type NumberInputSize = "small" | "medium" | "large";
 /**
  * Re-export SliderStatus as an alias for StatusLevel for convenience.
  * Includes: 'normal' | 'standby' | 'caution' | 'serious' | 'critical' | 'off'
@@ -47,7 +46,7 @@ export interface NumberInputProps {
     /** Custom style */
     style?: React.CSSProperties;
     /** Text alignment inside the input field */
-    textAlign?: 'left' | 'center' | 'right';
+    textAlign?: "left" | "center" | "right";
     /**
      * Label placement style.
      * - `'outlined'` — label sits on the input border (notched/Material-style). **Default.**