@titan-design/react-ui 0.9.3 → 0.10.0

package/dist/index.js

@@ -339,6 +339,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",
@@ -806,10 +821,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],
@@ -825,6 +849,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)",
@@ -917,25 +946,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],
@@ -949,6 +999,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)",
@@ -1478,9 +1536,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"],
@@ -1537,6 +1597,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"],
@@ -1576,9 +1639,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"],
@@ -1635,6 +1700,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"],
@@ -2269,6 +2337,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"];
 }
@@ -2571,6 +2643,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",
@@ -2595,9 +2668,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";
@@ -5296,7 +5379,7 @@ function ToastProvider({
     return id;
   }, [defaultDuration, maxToasts]);
   const removeToast = React25.useCallback((id) => {
-    setToasts((prev) => prev.filter((t16) => t16.id !== id));
+    setToasts((prev) => prev.filter((t17) => t17.id !== id));
   }, []);
   const removeAllToasts = React25.useCallback(() => {
     setToasts([]);
@@ -6049,6 +6132,7 @@ function IconBox({
 function Surface({
   elevation = 0,
   level,
+  pressed = false,
   glowColor,
   glowIntensity,
   theme,
@@ -6062,13 +6146,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 = React25.useMemo(
-    () => ({ mode, level: level ?? inherited.level }),
-    [mode, level, inherited.level]
+    () => ({ mode, level: resolvedLevel }),
+    [mode, resolvedLevel]
   );
   return /* @__PURE__ */ jsx(SurfaceContext.Provider, { value, children: /* @__PURE__ */ jsx(
     reactNative.View,
@@ -7261,13 +7356,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)"
@@ -7507,11 +7603,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 = {
@@ -7551,8 +7647,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 = {
@@ -7873,19 +7969,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;
@@ -8037,7 +8133,7 @@ function TempoDisplay({
       style: {
         flexDirection: "row",
         alignItems: "center",
-        backgroundColor: "#1C1C1C",
+        backgroundColor: t3["surface-raised"],
         paddingHorizontal: chromePadX,
         paddingVertical: chromePadY,
         borderRadius: chromeRadius
@@ -8052,7 +8148,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)
@@ -8110,7 +8206,7 @@ function TempoDisplay({
                 reactNative.View,
                 {
                   style: {
-                    backgroundColor: "#191919",
+                    backgroundColor: t3["surface-overlay"],
                     borderRadius: 6,
                     paddingVertical: 8,
                     paddingHorizontal: 12,
@@ -8163,13 +8259,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";
@@ -8237,19 +8333,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
@@ -8418,12 +8514,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)"
 };
@@ -8436,9 +8532,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
@@ -9585,13 +9681,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,
@@ -10294,7 +10390,7 @@ function RestTimer({
     }
   );
 }
-var t7 = getSemanticColors("dark");
+var t8 = getSemanticColors("dark");
 var TIMES = "\xD7";
 var AT = "@";
 function SetsRepsLoad({
@@ -10306,8 +10402,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(
     reactNative.View,
     {
@@ -10420,14 +10516,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",
@@ -11089,7 +11185,7 @@ function SessionRail({
 var DEFAULTS = {
   label: "SS",
   color: getSemanticColors("dark")["brand-primary"],
-  bgBase: "#101010"
+  bgBase: getSemanticColors("dark")["background-base"]
 };
 function SupersetWrapper({
   label = DEFAULTS.label,
@@ -11348,10 +11444,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)"
 };
@@ -11835,12 +11931,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}"],
@@ -12030,13 +12126,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%)";
@@ -12407,8 +12503,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)}`;
@@ -12897,10 +12993,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)";
@@ -12943,8 +13039,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];
@@ -13274,13 +13370,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,
@@ -13463,7 +13559,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(
               reactNative.View,
@@ -13494,7 +13590,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(
                 reactNative.Text,
                 {
@@ -13680,7 +13776,7 @@ function VolumeLandmarkBar({
     }
   );
 }
-var t14 = getSemanticColors("dark");
+var t15 = getSemanticColors("dark");
 var statusToken = {
   productive: "status-success",
   threshold: "status-warning",
@@ -13697,7 +13793,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);
@@ -13730,7 +13826,7 @@ function StatusPill2({ status, label, className, style, ...props }) {
     }
   );
 }
-var t15 = getSemanticColors("dark");
+var t16 = getSemanticColors("dark");
 var categoryToken = {
   productive: null,
   threshold: "status-warning",
@@ -13743,7 +13839,7 @@ var floodOpacity = {
 };
 function liveAuraColor(category) {
   const token = categoryToken[category];
-  return token ? t15[token] : null;
+  return token ? t16[token] : null;
 }
 function LiveAuraFrame({
   category,
@@ -13772,9 +13868,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
       ],
@@ -14001,28 +14097,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(
               reactNative.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(reactNative.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(reactNative.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(
               reactNative.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(reactNative.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(reactNative.Text, { className: "text-[9px] text-text-tertiary", style: { position: "absolute", top: innerH + 4, left: -16, width: 32, textAlign: "center" }, children: formatTick(t17) })
               },
               `x-${i}`
             );
@@ -14157,23 +14253,23 @@ function Gauge2({
       testID: "gauge",
       ...props,
       children: [
-        ticks.map((t16) => /* @__PURE__ */ jsx(
+        ticks.map((t17) => /* @__PURE__ */ jsx(
           reactNative.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(reactNative.View, { style: { position: "absolute", top: 0, left: 0, width: size, height: size }, className: "items-center justify-center", children: [
           /* @__PURE__ */ jsxs(reactNative.View, { className: "flex-row items-baseline gap-0.5", children: [
@@ -14707,6 +14803,7 @@ exports.ModalTitle = ModalTitle;
 exports.MuscleGroupChip = MuscleGroupChip;
 exports.NavItem = NavItem;
 exports.Overline = Overline;
+exports.PRESSED_ELEVATION_LEVEL = PRESSED_ELEVATION_LEVEL;
 exports.Paragraph = Paragraph;
 exports.PasswordInput = PasswordInput;
 exports.PersonStandingIcon = PersonStandingIcon;
@@ -14810,6 +14907,7 @@ exports.ZoneTrack = ZoneTrack;
 exports.alpha = alpha;
 exports.applyThemePreset = applyThemePreset;
 exports.audiobookPreset = audiobookPreset;
+exports.backgroundFrameDark = backgroundFrameDark;
 exports.bestTextColor = bestTextColor;
 exports.buttonSizes = buttonSizes;
 exports.calculateMeanVelocity = calculateMeanVelocity;
@@ -14848,6 +14946,7 @@ exports.getFieldValidationProps = getFieldValidationProps;
 exports.getGlowShadow = getGlowShadow;
 exports.getHoverColors = getHoverColors;
 exports.getLuminance = getLuminance;
+exports.getPressedRecessShadow = getPressedRecessShadow;
 exports.getResultColor = getResultColor;
 exports.getSemanticColors = getSemanticColors;
 exports.getStatusColor = getStatusColor;
@@ -14872,6 +14971,7 @@ exports.neumorphicShadows = neumorphicShadows;
 exports.onSurfaceColors = onSurfaceColors;
 exports.paceTone = paceTone;
 exports.paceToneColor = paceToneColor;
+exports.pressedLevel = pressedLevel;
 exports.primitiveBorderRadius = primitiveBorderRadius;
 exports.primitiveBreakpoints = primitiveBreakpoints;
 exports.primitiveColors = primitiveColors;
@@ -14896,6 +14996,7 @@ exports.shadowColors = shadowColors;
 exports.statusPillColor = statusPillColor;
 exports.surfaceBackground = surfaceBackground;
 exports.surfaceGradient = surfaceGradient;
+exports.surfaceRampDark = surfaceRampDark;
 exports.useOnSurfaceColor = useOnSurfaceColor;
 exports.useSurface = useSurface;
 exports.useSurfaceMode = useSurfaceMode;