@titan-design/react-ui 0.9.3 → 0.10.0

package/dist/index.mjs

@@ -333,6 +333,21 @@ var primitiveColors = {
   black: "#000000",
   transparent: "transparent"
 };
+var surfaceRampDark = {
+  inset: "#13100D",
+  // L*4.5  — sub-shell well / pressed
+  background: "#1C1916",
+  // L*9    — shell / frame
+  base: "#252321",
+  // L*13.5 — main content plane
+  elevated: "#2C2A28",
+  // L*17   — nav / rail
+  raised: "#31302F",
+  // L*20   — cards
+  overlay: "#373635"
+  // L*22.5 — hero / popover
+};
+var backgroundFrameDark = "#100D0A";
 var primitiveRamps = {
   red: {
     50: "#FFF4F4",
@@ -800,10 +815,19 @@ var semanticColorsLight = {
   "surface-overlay": primitiveColors.white,
   "surface-input": primitiveColors.neutral[50],
   // Input field background (filled variant)
+  // Deepest pressed pit (TD-surface-tokens, S-3) — light-mode counterpart of
+  // the dark ramp's `inset` plane; a placeholder pairing, not part of the
+  // dark-ramp investigation (surface.contract.test.ts is dark-mode only).
+  "surface-inset": primitiveColors.neutral[300],
   // Background colors (background-*)
   "background-base": "#EBEBEB",
   "background-default": primitiveColors.white,
   "background-subtle": primitiveColors.neutral[50],
+  // Frame/bezel chrome (TD-surface-tokens, S-3) — top bar + side nav shell,
+  // one step below `background-base` (darker still than `surface-inset`
+  // above, mirroring the dark-mode ordering). Placeholder pairing for light
+  // mode (see dark-mode note on `surface-inset` above).
+  "background-frame": primitiveColors.neutral[400],
   // Border colors (border-*)
   "border-default": "#E8E9EB",
   "border-subtle": primitiveColors.neutral[100],
@@ -819,6 +843,11 @@ var semanticColorsLight = {
   // Input field border on focus
   "border-input-error": primitiveColors.red[600],
   // Input field border on error
+  // Alpha hairline separators (surface-independent — composite toward black on
+  // light surfaces, mirroring the dark-mode white-alpha family). See §4/S-2.
+  "hairline-subtle": "rgba(0, 0, 0, 0.06)",
+  "hairline-default": "rgba(0, 0, 0, 0.09)",
+  "hairline-strong": "rgba(0, 0, 0, 0.14)",
   // Interactive states (interactive-*)
   "interactive-hover": "rgba(55, 65, 81, 0.04)",
   "interactive-focus": "rgba(55, 65, 81, 0.12)",
@@ -911,25 +940,46 @@ var semanticColorsDark = {
   "text-inverse": primitiveColors.neutral[900],
   "text-link": "#828DF8",
   "text-link-hover": primitiveColors.blue[400],
-  // Surface colors - dark backgrounds
-  "surface-base": primitiveColors.charcoal[700],
-  // main surface
-  "surface-elevated": primitiveColors.charcoal[600],
-  // elevated surface
-  "surface-raised": primitiveColors.charcoal[500],
-  // raised surface
-  "surface-overlay": primitiveColors.charcoal[600],
-  // overlay surface
-  "surface-input": primitiveColors.charcoal[600],
-  // input surface
-  // Background colors
-  "background-base": primitiveColors.charcoal[900],
-  // darkest charcoal
-  "background-default": primitiveColors.charcoal[700],
-  // main background
-  "background-subtle": primitiveColors.charcoal[500],
-  // subtle background
-  // Border colors
+  // Surface colors - dark backgrounds — warm-tapered DERIVED ramp (TD-surface-tokens,
+  // S-1, re-spaced S-3). Shipped verbatim from `deriveSurfaceRamp()` — see
+  // `surfaceRampDark` in primitives.ts for the full derivation note. `surface-overlay`
+  // and `surface-elevated` are distinct (were both #191919 pre-S-1); `surface-input`
+  // tracks one plane above `surface-base`, same relative position as before the remap.
+  // `background-base` backs `Surface level="background"` (SurfaceContext.SURFACE_LEVEL_TOKEN),
+  // so it takes the ramp's `background` (shell/frame) role, NOT `inset`. The ramp's
+  // deepest `inset` plane is now promoted to `surface-inset` below (S-3) — still no
+  // `SurfaceLevel` member for it (follow-up, alongside the elevation.ts -1/-2 pressed
+  // levels — parallel workstream, not this branch).
+  "surface-base": surfaceRampDark.base,
+  // main surface        (#252321, L*13.5)
+  "surface-elevated": surfaceRampDark.elevated,
+  // elevated surface     (#2C2A28, L*17   — nav/rail)
+  "surface-raised": surfaceRampDark.raised,
+  // raised surface       (#31302F, L*20   — cards)
+  "surface-overlay": surfaceRampDark.overlay,
+  // overlay surface      (#373635, L*22.5 — hero/popover)
+  "surface-input": surfaceRampDark.elevated,
+  // input surface        (#2C2A28 — one plane above base)
+  "surface-inset": surfaceRampDark.inset,
+  // deepest pressed pit  (#13100D, L*4.5  — sub-shell well)
+  // Background colors — same ramp, the frame/shell end of it.
+  "background-base": surfaceRampDark.background,
+  // shell / frame        (#1C1916, L*9 — Surface level="background")
+  "background-default": surfaceRampDark.base,
+  // main background      (#252321, L*13.5 — matches surface-base)
+  "background-subtle": surfaceRampDark.elevated,
+  // subtle background    (#2C2A28, L*17 — matches surface-elevated)
+  // Frame/bezel chrome (S-3) — the top bar + side nav shell; one step BELOW
+  // `background-base`, darker even than `surface-inset` — it exits the content
+  // ramp entirely rather than sitting in it. See `backgroundFrameDark` in
+  // primitives.ts.
+  "background-frame": backgroundFrameDark,
+  // frame / bezel        (#100D0A, L*3.79)
+  // Border colors — `border-subtle` (#1C1C1C) previously collided with
+  // `surface-raised` (also #1C1C1C, an invisible border on raised cards). The
+  // re-spaced ramp above moved `surface-raised` to #2D2C2B, so this value is now
+  // distinct from every surface hex without needing to change it — see
+  // `surface.contract.test.ts` R2/R4.
   "border-default": primitiveColors.charcoal[400],
   // default border
   "border-subtle": primitiveColors.charcoal[500],
@@ -943,6 +993,14 @@ var semanticColorsDark = {
   "border-input-hover": primitiveColors.neutral[500],
   "border-input-focus": "#828DF8",
   "border-input-error": primitiveColors.red[500],
+  // Alpha hairline separators — the primary separation cue (§4/S-2). Self-
+  // normalizing: composites toward white by ~the same amount on ANY plane, so
+  // one family works at every elevation instead of per-surface border tokens.
+  // Shadows are demoted to floating-overlay use only (not shipped as a fill
+  // separator here — see elevation.ts, follow-up S-4).
+  "hairline-subtle": "rgba(255, 255, 255, 0.06)",
+  "hairline-default": "rgba(255, 255, 255, 0.09)",
+  "hairline-strong": "rgba(255, 255, 255, 0.14)",
   // Interactive states
   "interactive-hover": "rgba(255, 255, 255, 0.04)",
   "interactive-focus": "rgba(255, 255, 255, 0.12)",
@@ -1472,9 +1530,11 @@ var lightThemeCSSVars = {
   "--color-surface-base": semanticColorsLight["surface-base"],
   "--color-surface-elevated": semanticColorsLight["surface-elevated"],
   "--color-surface-raised": semanticColorsLight["surface-raised"],
+  "--color-surface-inset": semanticColorsLight["surface-inset"],
   "--color-background-base": semanticColorsLight["background-base"],
   "--color-background-default": semanticColorsLight["background-default"],
   "--color-background-subtle": semanticColorsLight["background-subtle"],
+  "--color-background-frame": semanticColorsLight["background-frame"],
   "--color-border-default": semanticColorsLight["border-default"],
   "--color-border-subtle": semanticColorsLight["border-subtle"],
   "--color-border-strong": semanticColorsLight["border-strong"],
@@ -1531,6 +1591,9 @@ var lightThemeCSSVars = {
   "--color-border-input-hover": semanticColorsLight["border-input-hover"],
   "--color-border-input-focus": semanticColorsLight["border-input-focus"],
   "--color-border-input-error": semanticColorsLight["border-input-error"],
+  "--color-hairline-subtle": semanticColorsLight["hairline-subtle"],
+  "--color-hairline-default": semanticColorsLight["hairline-default"],
+  "--color-hairline-strong": semanticColorsLight["hairline-strong"],
   "--color-interactive-disabled-text": semanticColorsLight["interactive-disabled-text"],
   "--color-avatar-background": semanticColorsLight["avatar-background"],
   "--color-avatar-text": semanticColorsLight["avatar-text"],
@@ -1570,9 +1633,11 @@ var darkThemeCSSVars = {
   "--color-surface-base": semanticColorsDark["surface-base"],
   "--color-surface-elevated": semanticColorsDark["surface-elevated"],
   "--color-surface-raised": semanticColorsDark["surface-raised"],
+  "--color-surface-inset": semanticColorsDark["surface-inset"],
   "--color-background-base": semanticColorsDark["background-base"],
   "--color-background-default": semanticColorsDark["background-default"],
   "--color-background-subtle": semanticColorsDark["background-subtle"],
+  "--color-background-frame": semanticColorsDark["background-frame"],
   "--color-border-default": semanticColorsDark["border-default"],
   "--color-border-subtle": semanticColorsDark["border-subtle"],
   "--color-border-strong": semanticColorsDark["border-strong"],
@@ -1629,6 +1694,9 @@ var darkThemeCSSVars = {
   "--color-border-input-hover": semanticColorsDark["border-input-hover"],
   "--color-border-input-focus": semanticColorsDark["border-input-focus"],
   "--color-border-input-error": semanticColorsDark["border-input-error"],
+  "--color-hairline-subtle": semanticColorsDark["hairline-subtle"],
+  "--color-hairline-default": semanticColorsDark["hairline-default"],
+  "--color-hairline-strong": semanticColorsDark["hairline-strong"],
   "--color-interactive-disabled-text": semanticColorsDark["interactive-disabled-text"],
   "--color-avatar-background": semanticColorsDark["avatar-background"],
   "--color-avatar-text": semanticColorsDark["avatar-text"],
@@ -2263,6 +2331,10 @@ function getElevationShadow(baseColor, level, theme, isHovered = false) {
   elevationShadowCache.set(cacheKey, result);
   return result;
 }
+var PRESSED_ELEVATION_LEVEL = -1;
+function getPressedRecessShadow(fillColor, theme) {
+  return getElevationShadow(fillColor, PRESSED_ELEVATION_LEVEL, theme);
+}
 function getBaseSurfaceColor(theme) {
   return theme === "light" ? semanticColorsLight["surface-raised"] : semanticColorsDark["surface-elevated"];
 }
@@ -2565,6 +2637,7 @@ var SURFACE_LEVEL_TOKEN = {
   raised: "surface-raised",
   overlay: "surface-overlay"
 };
+var PRESSED_RAMP = ["inset", "background", "base", "elevated", "raised", "overlay"];
 var ON_SURFACE_TOKEN = {
   primary: "text-primary",
   secondary: "text-secondary",
@@ -2589,9 +2662,19 @@ function onSurfaceColors(mode) {
 function useOnSurfaceColor(role = "primary") {
   return getSemanticColors(useSurfaceMode())[ON_SURFACE_TOKEN[role]];
 }
+function insetFloor(mode) {
+  const colors = getSemanticColors(mode);
+  return colors["surface-inset"] ?? surfaceRampDark.inset;
+}
 function surfaceBackground(level, mode) {
+  if (level === "inset") return insetFloor(mode);
   return getSemanticColors(mode)[SURFACE_LEVEL_TOKEN[level]];
 }
+function pressedLevel(parent) {
+  const index = PRESSED_RAMP.indexOf(parent);
+  const down = Math.max(0, index - 1);
+  return PRESSED_RAMP[down];
+}
 function getTheme() {
   if (typeof document === "undefined") return "dark";
   return document.documentElement.classList.contains("light") ? "light" : "dark";
@@ -5290,7 +5373,7 @@ function ToastProvider({
     return id;
   }, [defaultDuration, maxToasts]);
   const removeToast = useCallback((id) => {
-    setToasts((prev) => prev.filter((t16) => t16.id !== id));
+    setToasts((prev) => prev.filter((t17) => t17.id !== id));
   }, []);
   const removeAllToasts = useCallback(() => {
     setToasts([]);
@@ -6043,6 +6126,7 @@ function IconBox({
 function Surface({
   elevation = 0,
   level,
+  pressed = false,
   glowColor,
   glowIntensity,
   theme,
@@ -6056,13 +6140,24 @@ function Surface({
   const mode = theme ?? inherited.mode;
   const isPlane = level != null;
   const baseColor = getBaseSurfaceColor(mode);
-  const backgroundColor = isPlane ? surfaceBackground(level, mode) : getElevationSurface(baseColor, elevation, mode);
-  const shadowStyle = isPlane ? {} : getElevationShadow(baseColor, elevation, mode);
+  const resolvedLevel = pressed ? pressedLevel(inherited.level) : level ?? inherited.level;
+  let backgroundColor;
+  let shadowStyle;
+  if (pressed) {
+    backgroundColor = surfaceBackground(resolvedLevel, mode);
+    shadowStyle = getPressedRecessShadow(backgroundColor, mode);
+  } else if (isPlane) {
+    backgroundColor = surfaceBackground(level, mode);
+    shadowStyle = {};
+  } else {
+    backgroundColor = getElevationSurface(baseColor, elevation, mode);
+    shadowStyle = getElevationShadow(baseColor, elevation, mode);
+  }
   const glowStyle = glowColor ? getGlowShadow(glowColor, glowIntensity) : {};
-  const applyRounded = rounded ?? !isPlane;
+  const applyRounded = rounded ?? (pressed || !isPlane);
   const value = useMemo(
-    () => ({ mode, level: level ?? inherited.level }),
-    [mode, level, inherited.level]
+    () => ({ mode, level: resolvedLevel }),
+    [mode, resolvedLevel]
   );
   return /* @__PURE__ */ jsx(SurfaceContext.Provider, { value, children: /* @__PURE__ */ jsx(
     View,
@@ -7255,13 +7350,14 @@ function MetricGroup({
     )
   ] }, i)) });
 }
+var t = getSemanticColors("dark");
 var baseBadgeSizeConfig = {
   sm: { fontSize: 9, paddingH: 6, paddingV: 2, iconSize: 10 },
   md: { fontSize: 10, paddingH: 8, paddingV: 2, iconSize: 12 },
   lg: { fontSize: 12, paddingH: 10, paddingV: 4, iconSize: 14 }
 };
 var variantColors = {
-  plain: { backgroundColor: "#1C1C1C", borderColor: "#1F1F1F" },
+  plain: { backgroundColor: t["surface-raised"], borderColor: "#1F1F1F" },
   pr: {
     backgroundColor: "rgba(255, 121, 0, 0.12)",
     borderColor: "rgba(255, 121, 0, 0.3)"
@@ -7501,11 +7597,11 @@ function PrBadge({
   }
   return badge;
 }
-var t = getSemanticColors("dark");
+var t2 = getSemanticColors("dark");
 var solidVariantColors = {
-  success: t["status-success"],
-  warning: t["status-warning"],
-  error: t["status-error"],
+  success: t2["status-success"],
+  warning: t2["status-warning"],
+  error: t2["status-error"],
   neutral: "#6B7280"
 };
 var ringVariantStyles = {
@@ -7545,8 +7641,8 @@ var iconColors2 = {
   warning: "#6B4000",
   error: "#5C1A1A",
   neutral: "#D1D5DB",
-  "on-track": t["status-success"],
-  deviation: t["status-warning"],
+  "on-track": t2["status-success"],
+  deviation: t2["status-warning"],
   future: "#6B7280"
 };
 var sizeDimensions = {
@@ -7867,19 +7963,19 @@ function MetricCell({ children, color, fontSize = 11 }) {
 }
 
 // src/components/custom/Workout/TempoDisplay.tsx
-var t2 = getSemanticColors("dark");
+var t3 = getSemanticColors("dark");
 var INTER = "Inter, sans-serif";
 var TEXT_TERTIARY = "#6B7280";
-var STATUS_ERROR = t2["status-error"];
-var STATUS_SUCCESS = t2["status-success"];
-var STATUS_WARNING = t2["status-warning"];
+var STATUS_ERROR = t3["status-error"];
+var STATUS_SUCCESS = t3["status-success"];
+var STATUS_WARNING = t3["status-warning"];
 var ON_TARGET_MS = 100;
 function getTempoFillPct(elapsedMs, targetMs) {
   if (!targetMs) return 100;
   return Math.min(100, elapsedMs / targetMs * 100);
 }
 function activeNumberTone(elapsedMs, targetMs) {
-  if (targetMs == null) return t2["text-primary"];
+  if (targetMs == null) return t3["text-primary"];
   const remainingMs = targetMs - elapsedMs;
   if (remainingMs > ON_TARGET_MS) return STATUS_WARNING;
   if (remainingMs >= -ON_TARGET_MS) return STATUS_SUCCESS;
@@ -8031,7 +8127,7 @@ function TempoDisplay({
       style: {
         flexDirection: "row",
         alignItems: "center",
-        backgroundColor: "#1C1C1C",
+        backgroundColor: t3["surface-raised"],
         paddingHorizontal: chromePadX,
         paddingVertical: chromePadY,
         borderRadius: chromeRadius
@@ -8046,7 +8142,7 @@ function TempoDisplay({
               fontSize: labelFont,
               fontWeight: "500",
               // Live-muted green while a rep is running, tertiary at rest.
-              color: live ? t2["status-live-muted"] : TEXT_TERTIARY,
+              color: live ? t3["status-live-muted"] : TEXT_TERTIARY,
               letterSpacing: 0.5,
               textTransform: "uppercase",
               marginRight: Math.round(fontSize * 0.5)
@@ -8104,7 +8200,7 @@ function TempoDisplay({
                 View,
                 {
                   style: {
-                    backgroundColor: "#191919",
+                    backgroundColor: t3["surface-overlay"],
                     borderRadius: 6,
                     paddingVertical: 8,
                     paddingHorizontal: 12,
@@ -8157,13 +8253,13 @@ function TempoDisplay({
     }
   );
 }
-var t3 = getSemanticColors("dark");
+var t4 = getSemanticColors("dark");
 function getDotColor(deviation) {
   const abs = Math.abs(deviation);
-  if (deviation < -0.3) return t3["status-success"];
+  if (deviation < -0.3) return t4["status-success"];
   if (abs <= 0.3) return "#6B7280";
-  if (abs <= 0.7) return t3["status-warning"];
-  return t3["status-error"];
+  if (abs <= 0.7) return t4["status-warning"];
+  return t4["status-error"];
 }
 function getDeviationDescription(deviation) {
   if (deviation < -0.3) return "lighter than planned";
@@ -8231,19 +8327,19 @@ function DeviationBar({
     }
   );
 }
-var t4 = getSemanticColors("dark");
+var t5 = getSemanticColors("dark");
 var TRACK_BG = "#333333";
 var LABEL_COLOR = "#6B7280";
 var TARGET_LINE_COLOR = "rgba(33, 150, 243, 0.5)";
 var AT_TARGET_GLOW = "0 0 5px 1px rgba(33, 150, 243, 0.35), 0 0 10px 3px rgba(33, 150, 243, 0.15)";
 var ZONE = {
-  building: t4["status-success"],
+  building: t5["status-success"],
   // below target ramp-up
-  approaching: t4["status-warning"],
+  approaching: t5["status-warning"],
   // nearing target
-  target: t4["brand-primary"],
+  target: t5["brand-primary"],
   // exactly at target
-  over1: t4["status-error"],
+  over1: t5["status-error"],
   // mild over-target
   over2: WORKOUT_TOKENS.intensity.over2,
   // moderate over-target
@@ -8412,12 +8508,12 @@ var MESO_ACCENT_GRADIENT_LIGHT = primitiveRamps.orange[300];
 var WORKOUT_PILL_DELOAD = primitiveRamps.magenta[600];
 
 // src/components/custom/Workout/WorkoutPill.tsx
-var t5 = getSemanticColors("dark");
+var t6 = getSemanticColors("dark");
 var statusBgColors = {
   completed: "rgba(46,213,115,0.15)",
   current: "rgba(255,121,0,0.15)",
   next: "transparent",
-  upcoming: "#1C1C1C",
+  upcoming: t6["surface-raised"],
   missed: "rgba(209,67,67,0.1)",
   deload: "rgba(186,41,150,0.15)"
 };
@@ -8430,9 +8526,9 @@ var statusBorderStyles = {
   deload: { borderWidth: 1, borderColor: "rgba(186,41,150,0.3)" }
 };
 var textColors = {
-  completed: t5["status-success"],
-  current: t5["brand-primary"],
-  next: t5["brand-primary"],
+  completed: t6["status-success"],
+  current: t6["brand-primary"],
+  next: t6["brand-primary"],
   upcoming: "#6B7280",
   missed: "rgba(209,67,67,0.7)",
   deload: WORKOUT_PILL_DELOAD
@@ -9579,13 +9675,13 @@ function VelocityStrip({
   }
   return stripContent;
 }
-var t6 = getSemanticColors("dark");
+var t7 = getSemanticColors("dark");
 var dotColorMap = {
   untrained: "#2C2C2C",
-  behind: t6["brand-secondary"],
-  ontrack: t6["status-success"],
-  target: t6["brand-primary"],
-  over: t6["status-error"]
+  behind: t7["brand-secondary"],
+  ontrack: t7["status-success"],
+  target: t7["brand-primary"],
+  over: t7["status-error"]
 };
 function MuscleGroupChip({
   name,
@@ -10288,7 +10384,7 @@ function RestTimer({
     }
   );
 }
-var t7 = getSemanticColors("dark");
+var t8 = getSemanticColors("dark");
 var TIMES = "\xD7";
 var AT = "@";
 function SetsRepsLoad({
@@ -10300,8 +10396,8 @@ function SetsRepsLoad({
   className,
   ...props
 }) {
-  const value = t7["text-primary"];
-  const sep = t7["text-tertiary"];
+  const value = t8["text-primary"];
+  const sep = t8["text-tertiary"];
   return /* @__PURE__ */ jsxs(
     View,
     {
@@ -10414,14 +10510,14 @@ function ScheduleTiles({ when, now, gap = 1, ...props }) {
     )
   ] });
 }
-var t8 = getSemanticColors("dark");
+var t9 = getSemanticColors("dark");
 var INDICATOR_CONFIG = {
-  imbalance: { Icon: ScaleIcon, color: t8["status-error"], label: "Left/right imbalance" },
-  overshoot: { Icon: AlertTriangleIcon, color: t8["status-error"], label: "Load overshoot" },
-  "velocity-loss": { Icon: TrendingDownIcon, color: t8["status-warning"], label: "Velocity loss" },
-  "missed-reps": { Icon: CircleSlashIcon, color: t8["status-warning"], label: "Missed reps" },
-  pr: { Icon: AwardIcon, color: t8["status-success"], label: "Personal record" },
-  info: { Icon: InfoIcon, color: t8["status-info"], label: "More info" }
+  imbalance: { Icon: ScaleIcon, color: t9["status-error"], label: "Left/right imbalance" },
+  overshoot: { Icon: AlertTriangleIcon, color: t9["status-error"], label: "Load overshoot" },
+  "velocity-loss": { Icon: TrendingDownIcon, color: t9["status-warning"], label: "Velocity loss" },
+  "missed-reps": { Icon: CircleSlashIcon, color: t9["status-warning"], label: "Missed reps" },
+  pr: { Icon: AwardIcon, color: t9["status-success"], label: "Personal record" },
+  info: { Icon: InfoIcon, color: t9["status-info"], label: "More info" }
 };
 var INDICATOR_PRECEDENCE = [
   "imbalance",
@@ -11083,7 +11179,7 @@ function SessionRail({
 var DEFAULTS = {
   label: "SS",
   color: getSemanticColors("dark")["brand-primary"],
-  bgBase: "#101010"
+  bgBase: getSemanticColors("dark")["background-base"]
 };
 function SupersetWrapper({
   label = DEFAULTS.label,
@@ -11342,10 +11438,10 @@ function WeekRow({
     }
   );
 }
-var t9 = getSemanticColors("dark");
+var t10 = getSemanticColors("dark");
 var COLORS = {
-  statusSuccess: t9["status-success"],
-  brandPrimary: t9["brand-primary"],
+  statusSuccess: t10["status-success"],
+  brandPrimary: t10["brand-primary"],
   borderDefault: "#1F1F1F",
   brandPrimarySubtle: "rgba(255,121,0,0.06)"
 };
@@ -11829,12 +11925,12 @@ function PrHistoryModal({
     }
   );
 }
-var t10 = getSemanticColors("dark");
-var BRAND_PRIMARY9 = t10["brand-primary"];
+var t11 = getSemanticColors("dark");
+var BRAND_PRIMARY9 = t11["brand-primary"];
 var BRAND_PRIMARY_SUBTLE = "rgba(255,121,0,0.12)";
-var STATUS_SUCCESS2 = t10["status-success"];
-var STATUS_WARNING2 = t10["status-warning"];
-var STATUS_ERROR2 = t10["status-error"];
+var STATUS_SUCCESS2 = t11["status-success"];
+var STATUS_WARNING2 = t11["status-warning"];
+var STATUS_ERROR2 = t11["status-error"];
 var EMOJI_SETS = {
   sleep: ["\u{1F634}", "\u{1F610}", "\u{1F642}", "\u{1F60A}", "\u{1F929}"],
   soreness: ["\u{1F635}", "\u{1F623}", "\u{1F610}", "\u{1F642}", "\u{1F4AA}"],
@@ -12024,13 +12120,13 @@ function ReadinessCheck({
     )
   ] }) });
 }
-var t11 = getSemanticColors("dark");
-var BRAND_PRIMARY10 = t11["brand-primary"];
+var t12 = getSemanticColors("dark");
+var BRAND_PRIMARY10 = t12["brand-primary"];
 var BRAND_PRIMARY_DARK2 = MESO_ACCENT_GRADIENT_DARK;
 var BRAND_PRIMARY_LIGHT2 = MESO_ACCENT_GRADIENT_LIGHT;
-var SUCCESS = t11["status-success"];
-var WARNING = t11["status-warning"];
-var ERROR = t11["status-error"];
+var SUCCESS = t12["status-success"];
+var WARNING = t12["status-warning"];
+var ERROR = t12["status-error"];
 var ACCENT_STOPS2 = [BRAND_PRIMARY_DARK2, BRAND_PRIMARY10, BRAND_PRIMARY_LIGHT2];
 var CARD_GRADIENT = `linear-gradient(135deg, ${resolveColor("surface-elevated")} 0%, ${resolveColor("surface-raised")} 100%)`;
 var GAUGE_GRADIENT = "linear-gradient(90deg, rgba(46,213,115,0.25) 0%, rgba(249,180,21,0.25) 50%, rgba(209,67,67,0.25) 100%)";
@@ -12401,8 +12497,8 @@ var ERROR_PILL_BORDER = "rgba(209,67,67,0.20)";
 var PLOT_LEFT = 26;
 var TOOLTIP_WIDTH = 124;
 function timeOf(dateStr) {
-  const t16 = Date.parse(dateStr);
-  return Number.isNaN(t16) ? 0 : t16;
+  const t17 = Date.parse(dateStr);
+  return Number.isNaN(t17) ? 0 : t17;
 }
 function formatValue(value) {
   return `${Math.round(value)}`;
@@ -12891,10 +12987,10 @@ function StrengthTrendChart({
     }
   );
 }
-var t12 = getSemanticColors("dark");
-var STATUS_SUCCESS4 = t12["status-success"];
-var STATUS_WARNING4 = t12["status-warning"];
-var STATUS_INFO = t12["status-info"];
+var t13 = getSemanticColors("dark");
+var STATUS_SUCCESS4 = t13["status-success"];
+var STATUS_WARNING4 = t13["status-warning"];
+var STATUS_INFO = t13["status-info"];
 var DOT_BORDER = "#F3F4F6";
 var BAND_FILL = "rgba(46,213,115,0.1)";
 var BAND_EDGE = "rgba(46,213,115,0.45)";
@@ -12937,8 +13033,8 @@ function interpEdge(pixels, x, key) {
     const a = pixels[i];
     const b = pixels[i + 1];
     if (x >= a.x && x <= b.x) {
-      const t16 = b.x === a.x ? 0 : (x - a.x) / (b.x - a.x);
-      return a[key] + t16 * (b[key] - a[key]);
+      const t17 = b.x === a.x ? 0 : (x - a.x) / (b.x - a.x);
+      return a[key] + t17 * (b[key] - a[key]);
     }
   }
   return pixels[pixels.length - 1][key];
@@ -13268,13 +13364,13 @@ function CapacityBandChart({
     }
   );
 }
-var t13 = getSemanticColors("dark");
+var t14 = getSemanticColors("dark");
 function glowShadow(color) {
   return `0 0 5px 1px ${alpha(color, 0.3)}, 0 0 10px 3px ${alpha(color, 0.12)}`;
 }
 var DEFAULT_TRACK_COLOR = primitiveColors.charcoal[200];
 var DEFAULT_MARKER_COLOR2 = primitiveColors.white;
-var TICK_COLOR = t13["text-tertiary"];
+var TICK_COLOR = t14["text-tertiary"];
 var ZONE_SIZES = {
   default: {
     trackHeight: 14,
@@ -13457,7 +13553,7 @@ function ZoneTrack({
           ),
           ticks?.map((tick, i) => {
             const emphasized = tick.emphasized === true;
-            const lineColor = tick.color ?? (emphasized ? t13["brand-primary"] : TICK_COLOR);
+            const lineColor = tick.color ?? (emphasized ? t14["brand-primary"] : TICK_COLOR);
             const lineWidth = emphasized ? s.tickLineEmphasized : s.tickLineNormal;
             return /* @__PURE__ */ jsx(
               View,
@@ -13488,7 +13584,7 @@ function ZoneTrack({
               if (tick.label == null) return null;
               const emphasized = tick.emphasized === true;
               if (!showTickLabel(i, emphasized)) return null;
-              const labelColor = tick.color ?? (emphasized ? t13["brand-primary"] : TICK_COLOR);
+              const labelColor = tick.color ?? (emphasized ? t14["brand-primary"] : TICK_COLOR);
               const labelNode = /* @__PURE__ */ jsx(
                 Text,
                 {
@@ -13674,7 +13770,7 @@ function VolumeLandmarkBar({
     }
   );
 }
-var t14 = getSemanticColors("dark");
+var t15 = getSemanticColors("dark");
 var statusToken = {
   productive: "status-success",
   threshold: "status-warning",
@@ -13691,7 +13787,7 @@ var defaultLabel = {
   stop: "Stop"
 };
 function statusPillColor(status) {
-  return t14[statusToken[status]];
+  return t15[statusToken[status]];
 }
 function StatusPill2({ status, label, className, style, ...props }) {
   const color = statusPillColor(status);
@@ -13724,7 +13820,7 @@ function StatusPill2({ status, label, className, style, ...props }) {
     }
   );
 }
-var t15 = getSemanticColors("dark");
+var t16 = getSemanticColors("dark");
 var categoryToken = {
   productive: null,
   threshold: "status-warning",
@@ -13737,7 +13833,7 @@ var floodOpacity = {
 };
 function liveAuraColor(category) {
   const token = categoryToken[category];
-  return token ? t15[token] : null;
+  return token ? t16[token] : null;
 }
 function LiveAuraFrame({
   category,
@@ -13766,9 +13862,9 @@ function LiveAuraFrame({
           position: "relative",
           overflow: "hidden",
           borderRadius: 10,
-          backgroundColor: t15["background-base"],
+          backgroundColor: t16["background-base"],
           borderWidth: 1,
-          borderColor: t15["border-default"]
+          borderColor: t16["border-default"]
         },
         style
       ],
@@ -13995,28 +14091,28 @@ function Scatter({
         testID: "scatter-canvas",
         style: { position: "absolute", top: 0, left: 0, width, height, overflow: "hidden" },
         children: [
-          ticksOf(yd, TICK_COUNT).map((t16, i) => {
-            const y = toY(t16);
+          ticksOf(yd, TICK_COUNT).map((t17, i) => {
+            const y = toY(t17);
             return /* @__PURE__ */ jsx(
               View,
               {
                 accessibilityElementsHidden: true,
                 testID: "scatter-gridline-y",
                 style: { position: "absolute", left: PLOT_LEFT2, width: innerW, top: y, height: 1, backgroundColor: GRID_LINE2 },
-                children: /* @__PURE__ */ jsx(Text, { className: "text-[9px] text-text-tertiary", style: { position: "absolute", left: -PLOT_LEFT2, top: -6, width: PLOT_LEFT2 - 6, textAlign: "right" }, children: formatTick(t16) })
+                children: /* @__PURE__ */ jsx(Text, { className: "text-[9px] text-text-tertiary", style: { position: "absolute", left: -PLOT_LEFT2, top: -6, width: PLOT_LEFT2 - 6, textAlign: "right" }, children: formatTick(t17) })
               },
               `y-${i}`
             );
           }),
-          ticksOf(xd, TICK_COUNT).map((t16, i) => {
-            const x = toX(t16);
+          ticksOf(xd, TICK_COUNT).map((t17, i) => {
+            const x = toX(t17);
             return /* @__PURE__ */ jsx(
               View,
               {
                 accessibilityElementsHidden: true,
                 testID: "scatter-gridline-x",
                 style: { position: "absolute", top: PLOT_TOP, height: innerH, left: x, width: 1, backgroundColor: GRID_LINE2 },
-                children: /* @__PURE__ */ jsx(Text, { className: "text-[9px] text-text-tertiary", style: { position: "absolute", top: innerH + 4, left: -16, width: 32, textAlign: "center" }, children: formatTick(t16) })
+                children: /* @__PURE__ */ jsx(Text, { className: "text-[9px] text-text-tertiary", style: { position: "absolute", top: innerH + 4, left: -16, width: 32, textAlign: "center" }, children: formatTick(t17) })
               },
               `x-${i}`
             );
@@ -14151,23 +14247,23 @@ function Gauge2({
       testID: "gauge",
       ...props,
       children: [
-        ticks.map((t16) => /* @__PURE__ */ jsx(
+        ticks.map((t17) => /* @__PURE__ */ jsx(
           View,
           {
             accessibilityElementsHidden: true,
             testID: "gauge-segment",
             style: {
               position: "absolute",
-              left: t16.left - tickThickness / 2,
-              top: t16.top - tickLength / 2,
+              left: t17.left - tickThickness / 2,
+              top: t17.top - tickLength / 2,
               width: tickThickness,
               height: tickLength,
               borderRadius: tickThickness / 2,
-              backgroundColor: t16.color,
-              transform: [{ rotate: t16.rotate }]
+              backgroundColor: t17.color,
+              transform: [{ rotate: t17.rotate }]
             }
           },
-          t16.key
+          t17.key
         )),
         /* @__PURE__ */ jsxs(View, { style: { position: "absolute", top: 0, left: 0, width: size, height: size }, className: "items-center justify-center", children: [
           /* @__PURE__ */ jsxs(View, { className: "flex-row items-baseline gap-0.5", children: [
@@ -14587,6 +14683,6 @@ function composeValidators(...validators) {
   };
 }
 
-export { Accordion, AccordionButton, AccordionItem, AccordionPanel, ActivityIcon, Alert, AlertDescription, AlertTitle, AlertTriangleIcon, Autocomplete, Avatar, AvatarBadge, AvatarGroup, AwardIcon, Badge, BadgeText, BaseBadge, BluetoothIcon, BrandLockup, BreadcrumbItem, Breadcrumbs, Button, ButtonIcon, ButtonSpinner, ButtonText, CATEGORICAL_CVD_SAFE_MAX, CapacityBandChart, Caption, Card, CardContent, CardDescription, CardFooter, CardHeader, CardSkeleton, CardTitle, Checkbox, CheckboxGroup, Chip, CircleSlashIcon, CircularProgress, CircularTimer, Collapse, CollapseButton, CollapseContent, DashboardShell, DataRow, DateTime, DeviationBar, DeviceIndicator, DeviceMenu, DeviceRow, Divider, Drawer, DrawerBody, DrawerFooter, DrawerHeader, DumbbellIcon, EmptyState, ExerciseCard, ExerciseCardHeading, ExerciseHeading, ExerciseIndicator, FatigueMeter, FormActions, FormField, FormRow, FormSection, Gauge2 as Gauge, HStack, Heading, HelpTip, HistoryIcon, INDICATOR_PRECEDENCE, IconBox, Indicator, InfoIcon, Input, InputBar, InputGroup, IntensityBar, Label, LabelWithHelp, LayersIcon, Link, ListItem, ListItemContent, ListItemDivider, ListItemIcon, ListItemTrailing, LiveAuraFrame, METRIC_FONT, Menu, MenuDivider, MenuGroup, MenuItem, MenuList, MenuTrigger, MesoCard, MesoProgressBar, MesoStatusCard, Metric, MetricCell, MetricGroup, MetricTiles, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalTitle, MuscleGroupChip, NavItem, Overline, Paragraph, PasswordInput, PersonStandingIcon, Pill, PlaceholderStrip, Popover, PopoverCloseButton, PopoverContent, PopoverTrigger, PrBadge, PrHistoryModal, Progress, ProgressSteps, Radio, RadioGroup, ReadinessCheck, RestTimer, SET_STRIP_VARIABLE_COLOR, SET_STRIP_ZONES, SURFACE_LEVEL_TOKEN, ScaleIcon, Scatter, ScheduleTiles, Section, SectionContent, SectionHeader, SegmentedBar, SegmentedProgressBar, Select, SessionHeader, SessionRail, SessionStatePill, SetBar, SetRow, SetStrip, SetTableHeader, SetsRepsLoad, SideNav, Sidebar, SidebarContent, SidebarDivider, SidebarFooter, SidebarHeader, SidebarItem, SidebarSection, Skeleton, SkeletonCard, SkeletonCircle, SkeletonListItem, SkeletonText, Sparkline, Spinner, Stack, StarIcon, StatusDot, StatusPill2 as StatusPill, StepContent, StepIndicator, StepLabel, Stepper, Step as StepperStep, StrengthTrendChart, SupersetWrapper, Surface, SurfaceContext, SvgIcon, Switch, Tab, TabList, TabPanel, TabPanels, Table, TableBody, TableCell, TableHeader, TableHeaderCell, TablePagination, TableRow, Tabs, TempoDisplay, Tile, TimerReadout, Toast, ToastProvider, ToolbarButton, ToolbarButtonGroup, Tooltip, TopBar, Treemap, TrendingDownIcon, Typography, VStack, VelocityStrip, VoltrasMark, VolumeLandmarkBar, WeekRow, WeightBadge, WorkoutCard, WorkoutPill, ZoneTrack, alpha, applyThemePreset, audiobookPreset, bestTextColor, buttonSizes, calculateMeanVelocity, calculateVelocityLoss, categoricalPalette, cn, componentElevationRanges, composeValidators, createFieldId, createFlatShadow, createPressedHoverShadow, createPressedShadow, createRaisedHoverShadow, createRaisedShadow, darkThemeCSSVars, darken, defaultNavItems, defaultPreset, discreteRainbow, divergingScale, elevationSystem, formatDateTime, formatDuration, formatPrescription, formatSignedPct, formatVelocity, getBaseSurfaceColor, getCategoricalColor, getContrastText, getDiscreteRainbowColor, getElevationConfig, getElevationShadow, getElevationSurface, getFieldAriaProps, getFieldValidationProps, getGlowShadow, getHoverColors, getLuminance, getResultColor, getSemanticColors, getStatusColor, getThemeCSSVars, getValidatedElevation, getVelocityZoneColor, getVelocityZoneName, gluestackConfig, hasMaxLength, hasMinLength, hexToRgb, hsvToRgb, isCssPropertyManifest, isDark, isEmpty, isValidEmail, lightThemeCSSVars, lighten, linearGradient, liveAuraColor, neumorphicShadows, onSurfaceColors, paceTone, paceToneColor, primitiveBorderRadius, primitiveBreakpoints, primitiveColors, primitiveRamps, primitiveShadows, primitiveSpacing, primitiveTypography, primitiveZIndex, resolveColor, resolveIndicator, rgbToHex, rgbToHsv, roundRpe, roundTempo, roundWeight, rpeColor, semanticColorsDark, semanticColorsLight, semanticTypography, sequentialEffort, shadowColors, statusPillColor, surfaceBackground, surfaceGradient, useOnSurfaceColor, useSurface, useSurfaceMode, useTable, useTimer, useToast, useToolbarButton, validateCssPropertyManifest, validationRules, velocityZoneColor };
+export { Accordion, AccordionButton, AccordionItem, AccordionPanel, ActivityIcon, Alert, AlertDescription, AlertTitle, AlertTriangleIcon, Autocomplete, Avatar, AvatarBadge, AvatarGroup, AwardIcon, Badge, BadgeText, BaseBadge, BluetoothIcon, BrandLockup, BreadcrumbItem, Breadcrumbs, Button, ButtonIcon, ButtonSpinner, ButtonText, CATEGORICAL_CVD_SAFE_MAX, CapacityBandChart, Caption, Card, CardContent, CardDescription, CardFooter, CardHeader, CardSkeleton, CardTitle, Checkbox, CheckboxGroup, Chip, CircleSlashIcon, CircularProgress, CircularTimer, Collapse, CollapseButton, CollapseContent, DashboardShell, DataRow, DateTime, DeviationBar, DeviceIndicator, DeviceMenu, DeviceRow, Divider, Drawer, DrawerBody, DrawerFooter, DrawerHeader, DumbbellIcon, EmptyState, ExerciseCard, ExerciseCardHeading, ExerciseHeading, ExerciseIndicator, FatigueMeter, FormActions, FormField, FormRow, FormSection, Gauge2 as Gauge, HStack, Heading, HelpTip, HistoryIcon, INDICATOR_PRECEDENCE, IconBox, Indicator, InfoIcon, Input, InputBar, InputGroup, IntensityBar, Label, LabelWithHelp, LayersIcon, Link, ListItem, ListItemContent, ListItemDivider, ListItemIcon, ListItemTrailing, LiveAuraFrame, METRIC_FONT, Menu, MenuDivider, MenuGroup, MenuItem, MenuList, MenuTrigger, MesoCard, MesoProgressBar, MesoStatusCard, Metric, MetricCell, MetricGroup, MetricTiles, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalTitle, MuscleGroupChip, NavItem, Overline, PRESSED_ELEVATION_LEVEL, Paragraph, PasswordInput, PersonStandingIcon, Pill, PlaceholderStrip, Popover, PopoverCloseButton, PopoverContent, PopoverTrigger, PrBadge, PrHistoryModal, Progress, ProgressSteps, Radio, RadioGroup, ReadinessCheck, RestTimer, SET_STRIP_VARIABLE_COLOR, SET_STRIP_ZONES, SURFACE_LEVEL_TOKEN, ScaleIcon, Scatter, ScheduleTiles, Section, SectionContent, SectionHeader, SegmentedBar, SegmentedProgressBar, Select, SessionHeader, SessionRail, SessionStatePill, SetBar, SetRow, SetStrip, SetTableHeader, SetsRepsLoad, SideNav, Sidebar, SidebarContent, SidebarDivider, SidebarFooter, SidebarHeader, SidebarItem, SidebarSection, Skeleton, SkeletonCard, SkeletonCircle, SkeletonListItem, SkeletonText, Sparkline, Spinner, Stack, StarIcon, StatusDot, StatusPill2 as StatusPill, StepContent, StepIndicator, StepLabel, Stepper, Step as StepperStep, StrengthTrendChart, SupersetWrapper, Surface, SurfaceContext, SvgIcon, Switch, Tab, TabList, TabPanel, TabPanels, Table, TableBody, TableCell, TableHeader, TableHeaderCell, TablePagination, TableRow, Tabs, TempoDisplay, Tile, TimerReadout, Toast, ToastProvider, ToolbarButton, ToolbarButtonGroup, Tooltip, TopBar, Treemap, TrendingDownIcon, Typography, VStack, VelocityStrip, VoltrasMark, VolumeLandmarkBar, WeekRow, WeightBadge, WorkoutCard, WorkoutPill, ZoneTrack, alpha, applyThemePreset, audiobookPreset, backgroundFrameDark, bestTextColor, buttonSizes, calculateMeanVelocity, calculateVelocityLoss, categoricalPalette, cn, componentElevationRanges, composeValidators, createFieldId, createFlatShadow, createPressedHoverShadow, createPressedShadow, createRaisedHoverShadow, createRaisedShadow, darkThemeCSSVars, darken, defaultNavItems, defaultPreset, discreteRainbow, divergingScale, elevationSystem, formatDateTime, formatDuration, formatPrescription, formatSignedPct, formatVelocity, getBaseSurfaceColor, getCategoricalColor, getContrastText, getDiscreteRainbowColor, getElevationConfig, getElevationShadow, getElevationSurface, getFieldAriaProps, getFieldValidationProps, getGlowShadow, getHoverColors, getLuminance, getPressedRecessShadow, getResultColor, getSemanticColors, getStatusColor, getThemeCSSVars, getValidatedElevation, getVelocityZoneColor, getVelocityZoneName, gluestackConfig, hasMaxLength, hasMinLength, hexToRgb, hsvToRgb, isCssPropertyManifest, isDark, isEmpty, isValidEmail, lightThemeCSSVars, lighten, linearGradient, liveAuraColor, neumorphicShadows, onSurfaceColors, paceTone, paceToneColor, pressedLevel, primitiveBorderRadius, primitiveBreakpoints, primitiveColors, primitiveRamps, primitiveShadows, primitiveSpacing, primitiveTypography, primitiveZIndex, resolveColor, resolveIndicator, rgbToHex, rgbToHsv, roundRpe, roundTempo, roundWeight, rpeColor, semanticColorsDark, semanticColorsLight, semanticTypography, sequentialEffort, shadowColors, statusPillColor, surfaceBackground, surfaceGradient, surfaceRampDark, useOnSurfaceColor, useSurface, useSurfaceMode, useTable, useTimer, useToast, useToolbarButton, validateCssPropertyManifest, validationRules, velocityZoneColor };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map