@titan-design/react-ui 0.9.2 → 0.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/dist/bodymap.js +78 -24
  2. package/dist/bodymap.js.map +1 -1
  3. package/dist/bodymap.mjs +78 -24
  4. package/dist/bodymap.mjs.map +1 -1
  5. package/dist/index.d.mts +215 -123
  6. package/dist/index.d.ts +215 -123
  7. package/dist/index.js +408 -259
  8. package/dist/index.js.map +1 -1
  9. package/dist/index.mjs +258 -121
  10. package/dist/index.mjs.map +1 -1
  11. package/dist/pages.js +214 -157
  12. package/dist/pages.js.map +1 -1
  13. package/dist/pages.mjs +214 -157
  14. package/dist/pages.mjs.map +1 -1
  15. package/dist/theme/index.d.mts +895 -795
  16. package/dist/theme/index.d.ts +895 -795
  17. package/dist/theme/index.js +101 -20
  18. package/dist/theme/index.js.map +1 -1
  19. package/dist/theme/index.mjs +99 -22
  20. package/dist/theme/index.mjs.map +1 -1
  21. package/dist/theme/tokens-css.js +88 -24
  22. package/dist/theme/tokens-css.js.map +1 -1
  23. package/dist/theme/tokens-css.mjs +88 -24
  24. package/dist/theme/tokens-css.mjs.map +1 -1
  25. package/package.json +1 -1
  26. package/src/components/custom/Workout/BaseBadge.tsx +5 -5
  27. package/src/components/custom/Workout/RowInventory.stories.tsx +5 -2
  28. package/src/components/custom/Workout/S3FullRail.stories.tsx +13 -1
  29. package/src/components/custom/Workout/SessionHeader.tsx +11 -13
  30. package/src/components/custom/Workout/SessionRail.stories.tsx +4 -1
  31. package/src/components/custom/Workout/SessionRail.tsx +16 -14
  32. package/src/components/custom/Workout/SupersetWrapper.stories.tsx +16 -25
  33. package/src/components/custom/Workout/SupersetWrapper.tsx +1 -1
  34. package/src/components/custom/Workout/TempoDisplay.tsx +3 -7
  35. package/src/components/custom/Workout/VolumeLandmarkBar.stories.tsx +4 -1
  36. package/src/components/custom/Workout/WorkoutPill.tsx +2 -2
  37. package/src/components/shell/DashboardShell.tsx +6 -3
  38. package/src/components/ui/surface/Surface.stories.tsx +244 -1
  39. package/src/components/ui/surface/Surface.test.tsx +244 -1
  40. package/src/components/ui/surface/Surface.tsx +98 -20
  41. package/src/components/ui/surface/SurfaceContext.ts +126 -0
  42. package/src/components/ui/surface/index.ts +13 -0
  43. package/src/components/ui/surface/surface.contract.test.ts +283 -0
  44. package/src/test/nativewind-stub.ts +13 -0
  45. package/src/theme/ColorSystem.stories.tsx +232 -47
  46. package/src/theme/ThemeProvider.test.tsx +24 -0
  47. package/src/theme/ThemeProvider.tsx +23 -6
  48. package/src/theme/config.ts +12 -0
  49. package/src/theme/elevation.ts +90 -67
  50. package/src/theme/global.css +35 -9
  51. package/src/theme/tokens/primitives.ts +40 -0
  52. package/src/theme/tokens/semantic.ts +63 -14
  53. package/tailwind.config.js +8 -0
package/dist/pages.js CHANGED
@@ -40,13 +40,24 @@ var primitiveColors = {
40
40
  200: "#3C3C3C",
41
41
  300: "#2C2C2C",
42
42
  400: "#1F1F1F",
43
- 500: "#1C1C1C",
44
- 600: "#191919",
45
- 700: "#161616",
46
- 900: "#101010"
47
- },
43
+ 500: "#1C1C1C"},
48
44
  // Pure colors
49
45
  white: "#FFFFFF"};
46
+ var surfaceRampDark = {
47
+ inset: "#13100D",
48
+ // L*4.5 — sub-shell well / pressed
49
+ background: "#1C1916",
50
+ // L*9 — shell / frame
51
+ base: "#252321",
52
+ // L*13.5 — main content plane
53
+ elevated: "#2C2A28",
54
+ // L*17 — nav / rail
55
+ raised: "#31302F",
56
+ // L*20 — cards
57
+ overlay: "#373635"
58
+ // L*22.5 — hero / popover
59
+ };
60
+ var backgroundFrameDark = "#100D0A";
50
61
  var primitiveRamps = {
51
62
  red: {
52
63
  50: "#FFF4F4",
@@ -1368,83 +1379,6 @@ function InfoIcon(props) {
1368
1379
  /* @__PURE__ */ jsx("path", { d: "M12 8h.01" })
1369
1380
  ] });
1370
1381
  }
1371
- var baseBadgeSizeConfig = {
1372
- sm: { fontSize: 9, paddingH: 6, paddingV: 2, iconSize: 10 },
1373
- md: { fontSize: 10, paddingH: 8, paddingV: 2, iconSize: 12 },
1374
- lg: { fontSize: 12, paddingH: 10, paddingV: 4, iconSize: 14 }
1375
- };
1376
- var variantColors = {
1377
- plain: { backgroundColor: "#1C1C1C", borderColor: "#1F1F1F" },
1378
- pr: {
1379
- backgroundColor: "rgba(255, 121, 0, 0.12)",
1380
- borderColor: "rgba(255, 121, 0, 0.3)"
1381
- }
1382
- };
1383
- function BaseBadge({
1384
- variant = "plain",
1385
- size = "md",
1386
- icon,
1387
- onPress,
1388
- className,
1389
- children,
1390
- ...props
1391
- }) {
1392
- const [scaleAnim] = react.useState(() => new reactNative.Animated.Value(1));
1393
- const config = baseBadgeSizeConfig[size];
1394
- const colors = variantColors[variant];
1395
- const handlePressIn = () => {
1396
- reactNative.Animated.timing(scaleAnim, {
1397
- toValue: 0.97,
1398
- duration: 150,
1399
- useNativeDriver: true
1400
- }).start();
1401
- };
1402
- const handlePressOut = () => {
1403
- reactNative.Animated.timing(scaleAnim, {
1404
- toValue: 1,
1405
- duration: 150,
1406
- useNativeDriver: true
1407
- }).start();
1408
- };
1409
- const badge = /* @__PURE__ */ jsxs(
1410
- reactNative.View,
1411
- {
1412
- className,
1413
- style: {
1414
- flexDirection: "row",
1415
- alignItems: "center",
1416
- gap: 3,
1417
- // borderRadius 2 is intentional per workout-tokens.ts (squared-off pill)
1418
- borderRadius: 2,
1419
- borderWidth: 1,
1420
- borderColor: colors.borderColor,
1421
- backgroundColor: colors.backgroundColor,
1422
- paddingHorizontal: config.paddingH,
1423
- paddingVertical: config.paddingV
1424
- },
1425
- ...props,
1426
- children: [
1427
- icon != null && /* @__PURE__ */ jsx(reactNative.View, { accessibilityElementsHidden: true, testID: "base-badge-icon", children: icon }),
1428
- children
1429
- ]
1430
- }
1431
- );
1432
- if (onPress) {
1433
- return /* @__PURE__ */ jsx(reactNative.Animated.View, { style: { transform: [{ scale: scaleAnim }] }, children: /* @__PURE__ */ jsx(
1434
- reactNative.Pressable,
1435
- {
1436
- onPress,
1437
- onPressIn: handlePressIn,
1438
- onPressOut: handlePressOut,
1439
- accessibilityRole: "button",
1440
- accessibilityLabel: props.accessibilityLabel,
1441
- testID: "base-badge-pressable",
1442
- children: badge
1443
- }
1444
- ) });
1445
- }
1446
- return badge;
1447
- }
1448
1382
 
1449
1383
  // src/theme/tokens/semantic.ts
1450
1384
  var semanticColorsLight = {
@@ -1551,10 +1485,19 @@ var semanticColorsLight = {
1551
1485
  "surface-overlay": primitiveColors.white,
1552
1486
  "surface-input": primitiveColors.neutral[50],
1553
1487
  // Input field background (filled variant)
1488
+ // Deepest pressed pit (TD-surface-tokens, S-3) — light-mode counterpart of
1489
+ // the dark ramp's `inset` plane; a placeholder pairing, not part of the
1490
+ // dark-ramp investigation (surface.contract.test.ts is dark-mode only).
1491
+ "surface-inset": primitiveColors.neutral[300],
1554
1492
  // Background colors (background-*)
1555
1493
  "background-base": "#EBEBEB",
1556
1494
  "background-default": primitiveColors.white,
1557
1495
  "background-subtle": primitiveColors.neutral[50],
1496
+ // Frame/bezel chrome (TD-surface-tokens, S-3) — top bar + side nav shell,
1497
+ // one step below `background-base` (darker still than `surface-inset`
1498
+ // above, mirroring the dark-mode ordering). Placeholder pairing for light
1499
+ // mode (see dark-mode note on `surface-inset` above).
1500
+ "background-frame": primitiveColors.neutral[400],
1558
1501
  // Border colors (border-*)
1559
1502
  "border-default": "#E8E9EB",
1560
1503
  "border-subtle": primitiveColors.neutral[100],
@@ -1570,6 +1513,11 @@ var semanticColorsLight = {
1570
1513
  // Input field border on focus
1571
1514
  "border-input-error": primitiveColors.red[600],
1572
1515
  // Input field border on error
1516
+ // Alpha hairline separators (surface-independent — composite toward black on
1517
+ // light surfaces, mirroring the dark-mode white-alpha family). See §4/S-2.
1518
+ "hairline-subtle": "rgba(0, 0, 0, 0.06)",
1519
+ "hairline-default": "rgba(0, 0, 0, 0.09)",
1520
+ "hairline-strong": "rgba(0, 0, 0, 0.14)",
1573
1521
  // Interactive states (interactive-*)
1574
1522
  "interactive-hover": "rgba(55, 65, 81, 0.04)",
1575
1523
  "interactive-focus": "rgba(55, 65, 81, 0.12)",
@@ -1662,25 +1610,46 @@ var semanticColorsDark = {
1662
1610
  "text-inverse": primitiveColors.neutral[900],
1663
1611
  "text-link": "#828DF8",
1664
1612
  "text-link-hover": primitiveColors.blue[400],
1665
- // Surface colors - dark backgrounds
1666
- "surface-base": primitiveColors.charcoal[700],
1667
- // main surface
1668
- "surface-elevated": primitiveColors.charcoal[600],
1669
- // elevated surface
1670
- "surface-raised": primitiveColors.charcoal[500],
1671
- // raised surface
1672
- "surface-overlay": primitiveColors.charcoal[600],
1673
- // overlay surface
1674
- "surface-input": primitiveColors.charcoal[600],
1675
- // input surface
1676
- // Background colors
1677
- "background-base": primitiveColors.charcoal[900],
1678
- // darkest charcoal
1679
- "background-default": primitiveColors.charcoal[700],
1680
- // main background
1681
- "background-subtle": primitiveColors.charcoal[500],
1682
- // subtle background
1683
- // Border colors
1613
+ // Surface colors - dark backgrounds — warm-tapered DERIVED ramp (TD-surface-tokens,
1614
+ // S-1, re-spaced S-3). Shipped verbatim from `deriveSurfaceRamp()` — see
1615
+ // `surfaceRampDark` in primitives.ts for the full derivation note. `surface-overlay`
1616
+ // and `surface-elevated` are distinct (were both #191919 pre-S-1); `surface-input`
1617
+ // tracks one plane above `surface-base`, same relative position as before the remap.
1618
+ // `background-base` backs `Surface level="background"` (SurfaceContext.SURFACE_LEVEL_TOKEN),
1619
+ // so it takes the ramp's `background` (shell/frame) role, NOT `inset`. The ramp's
1620
+ // deepest `inset` plane is now promoted to `surface-inset` below (S-3) — still no
1621
+ // `SurfaceLevel` member for it (follow-up, alongside the elevation.ts -1/-2 pressed
1622
+ // levels — parallel workstream, not this branch).
1623
+ "surface-base": surfaceRampDark.base,
1624
+ // main surface (#252321, L*13.5)
1625
+ "surface-elevated": surfaceRampDark.elevated,
1626
+ // elevated surface (#2C2A28, L*17 — nav/rail)
1627
+ "surface-raised": surfaceRampDark.raised,
1628
+ // raised surface (#31302F, L*20 — cards)
1629
+ "surface-overlay": surfaceRampDark.overlay,
1630
+ // overlay surface (#373635, L*22.5 — hero/popover)
1631
+ "surface-input": surfaceRampDark.elevated,
1632
+ // input surface (#2C2A28 — one plane above base)
1633
+ "surface-inset": surfaceRampDark.inset,
1634
+ // deepest pressed pit (#13100D, L*4.5 — sub-shell well)
1635
+ // Background colors — same ramp, the frame/shell end of it.
1636
+ "background-base": surfaceRampDark.background,
1637
+ // shell / frame (#1C1916, L*9 — Surface level="background")
1638
+ "background-default": surfaceRampDark.base,
1639
+ // main background (#252321, L*13.5 — matches surface-base)
1640
+ "background-subtle": surfaceRampDark.elevated,
1641
+ // subtle background (#2C2A28, L*17 — matches surface-elevated)
1642
+ // Frame/bezel chrome (S-3) — the top bar + side nav shell; one step BELOW
1643
+ // `background-base`, darker even than `surface-inset` — it exits the content
1644
+ // ramp entirely rather than sitting in it. See `backgroundFrameDark` in
1645
+ // primitives.ts.
1646
+ "background-frame": backgroundFrameDark,
1647
+ // frame / bezel (#100D0A, L*3.79)
1648
+ // Border colors — `border-subtle` (#1C1C1C) previously collided with
1649
+ // `surface-raised` (also #1C1C1C, an invisible border on raised cards). The
1650
+ // re-spaced ramp above moved `surface-raised` to #2D2C2B, so this value is now
1651
+ // distinct from every surface hex without needing to change it — see
1652
+ // `surface.contract.test.ts` R2/R4.
1684
1653
  "border-default": primitiveColors.charcoal[400],
1685
1654
  // default border
1686
1655
  "border-subtle": primitiveColors.charcoal[500],
@@ -1694,6 +1663,14 @@ var semanticColorsDark = {
1694
1663
  "border-input-hover": primitiveColors.neutral[500],
1695
1664
  "border-input-focus": "#828DF8",
1696
1665
  "border-input-error": primitiveColors.red[500],
1666
+ // Alpha hairline separators — the primary separation cue (§4/S-2). Self-
1667
+ // normalizing: composites toward white by ~the same amount on ANY plane, so
1668
+ // one family works at every elevation instead of per-surface border tokens.
1669
+ // Shadows are demoted to floating-overlay use only (not shipped as a fill
1670
+ // separator here — see elevation.ts, follow-up S-4).
1671
+ "hairline-subtle": "rgba(255, 255, 255, 0.06)",
1672
+ "hairline-default": "rgba(255, 255, 255, 0.09)",
1673
+ "hairline-strong": "rgba(255, 255, 255, 0.14)",
1697
1674
  // Interactive states
1698
1675
  "interactive-hover": "rgba(255, 255, 255, 0.04)",
1699
1676
  "interactive-focus": "rgba(255, 255, 255, 0.12)",
@@ -1712,6 +1689,86 @@ function getSemanticColors(mode) {
1712
1689
  return mode === "dark" ? semanticColorsDark : semanticColorsLight;
1713
1690
  }
1714
1691
 
1692
+ // src/components/custom/Workout/BaseBadge.tsx
1693
+ var t = getSemanticColors("dark");
1694
+ var baseBadgeSizeConfig = {
1695
+ sm: { fontSize: 9, paddingH: 6, paddingV: 2, iconSize: 10 },
1696
+ md: { fontSize: 10, paddingH: 8, paddingV: 2, iconSize: 12 },
1697
+ lg: { fontSize: 12, paddingH: 10, paddingV: 4, iconSize: 14 }
1698
+ };
1699
+ var variantColors = {
1700
+ plain: { backgroundColor: t["surface-raised"], borderColor: "#1F1F1F" },
1701
+ pr: {
1702
+ backgroundColor: "rgba(255, 121, 0, 0.12)",
1703
+ borderColor: "rgba(255, 121, 0, 0.3)"
1704
+ }
1705
+ };
1706
+ function BaseBadge({
1707
+ variant = "plain",
1708
+ size = "md",
1709
+ icon,
1710
+ onPress,
1711
+ className,
1712
+ children,
1713
+ ...props
1714
+ }) {
1715
+ const [scaleAnim] = react.useState(() => new reactNative.Animated.Value(1));
1716
+ const config = baseBadgeSizeConfig[size];
1717
+ const colors = variantColors[variant];
1718
+ const handlePressIn = () => {
1719
+ reactNative.Animated.timing(scaleAnim, {
1720
+ toValue: 0.97,
1721
+ duration: 150,
1722
+ useNativeDriver: true
1723
+ }).start();
1724
+ };
1725
+ const handlePressOut = () => {
1726
+ reactNative.Animated.timing(scaleAnim, {
1727
+ toValue: 1,
1728
+ duration: 150,
1729
+ useNativeDriver: true
1730
+ }).start();
1731
+ };
1732
+ const badge = /* @__PURE__ */ jsxs(
1733
+ reactNative.View,
1734
+ {
1735
+ className,
1736
+ style: {
1737
+ flexDirection: "row",
1738
+ alignItems: "center",
1739
+ gap: 3,
1740
+ // borderRadius 2 is intentional per workout-tokens.ts (squared-off pill)
1741
+ borderRadius: 2,
1742
+ borderWidth: 1,
1743
+ borderColor: colors.borderColor,
1744
+ backgroundColor: colors.backgroundColor,
1745
+ paddingHorizontal: config.paddingH,
1746
+ paddingVertical: config.paddingV
1747
+ },
1748
+ ...props,
1749
+ children: [
1750
+ icon != null && /* @__PURE__ */ jsx(reactNative.View, { accessibilityElementsHidden: true, testID: "base-badge-icon", children: icon }),
1751
+ children
1752
+ ]
1753
+ }
1754
+ );
1755
+ if (onPress) {
1756
+ return /* @__PURE__ */ jsx(reactNative.Animated.View, { style: { transform: [{ scale: scaleAnim }] }, children: /* @__PURE__ */ jsx(
1757
+ reactNative.Pressable,
1758
+ {
1759
+ onPress,
1760
+ onPressIn: handlePressIn,
1761
+ onPressOut: handlePressOut,
1762
+ accessibilityRole: "button",
1763
+ accessibilityLabel: props.accessibilityLabel,
1764
+ testID: "base-badge-pressable",
1765
+ children: badge
1766
+ }
1767
+ ) });
1768
+ }
1769
+ return badge;
1770
+ }
1771
+
1715
1772
  // src/components/custom/Workout/PrBadge.tsx
1716
1773
  var BRAND_PRIMARY = getSemanticColors("dark")["brand-primary"];
1717
1774
  var typeLabels = {
@@ -1962,7 +2019,7 @@ function MetricCell({ children, color, fontSize = 11 }) {
1962
2019
  }
1963
2020
 
1964
2021
  // src/components/custom/Workout/SetsRepsLoad.tsx
1965
- var t = getSemanticColors("dark");
2022
+ var t2 = getSemanticColors("dark");
1966
2023
  var TIMES = "\xD7";
1967
2024
  var AT = "@";
1968
2025
  function SetsRepsLoad({
@@ -1974,8 +2031,8 @@ function SetsRepsLoad({
1974
2031
  className,
1975
2032
  ...props
1976
2033
  }) {
1977
- const value = t["text-primary"];
1978
- const sep = t["text-tertiary"];
2034
+ const value = t2["text-primary"];
2035
+ const sep = t2["text-tertiary"];
1979
2036
  return /* @__PURE__ */ jsxs(
1980
2037
  reactNative.View,
1981
2038
  {
@@ -2306,19 +2363,19 @@ function alpha(color, opacity) {
2306
2363
  }
2307
2364
 
2308
2365
  // src/components/custom/Workout/TempoDisplay.tsx
2309
- var t2 = getSemanticColors("dark");
2366
+ var t3 = getSemanticColors("dark");
2310
2367
  var INTER = "Inter, sans-serif";
2311
2368
  var TEXT_TERTIARY = "#6B7280";
2312
- var STATUS_ERROR = t2["status-error"];
2313
- var STATUS_SUCCESS = t2["status-success"];
2314
- var STATUS_WARNING = t2["status-warning"];
2369
+ var STATUS_ERROR = t3["status-error"];
2370
+ var STATUS_SUCCESS = t3["status-success"];
2371
+ var STATUS_WARNING = t3["status-warning"];
2315
2372
  var ON_TARGET_MS = 100;
2316
2373
  function getTempoFillPct(elapsedMs, targetMs) {
2317
2374
  if (!targetMs) return 100;
2318
2375
  return Math.min(100, elapsedMs / targetMs * 100);
2319
2376
  }
2320
2377
  function activeNumberTone(elapsedMs, targetMs) {
2321
- if (targetMs == null) return t2["text-primary"];
2378
+ if (targetMs == null) return t3["text-primary"];
2322
2379
  const remainingMs = targetMs - elapsedMs;
2323
2380
  if (remainingMs > ON_TARGET_MS) return STATUS_WARNING;
2324
2381
  if (remainingMs >= -ON_TARGET_MS) return STATUS_SUCCESS;
@@ -2470,7 +2527,7 @@ function TempoDisplay({
2470
2527
  style: {
2471
2528
  flexDirection: "row",
2472
2529
  alignItems: "center",
2473
- backgroundColor: "#1C1C1C",
2530
+ backgroundColor: t3["surface-raised"],
2474
2531
  paddingHorizontal: chromePadX,
2475
2532
  paddingVertical: chromePadY,
2476
2533
  borderRadius: chromeRadius
@@ -2485,7 +2542,7 @@ function TempoDisplay({
2485
2542
  fontSize: labelFont,
2486
2543
  fontWeight: "500",
2487
2544
  // Live-muted green while a rep is running, tertiary at rest.
2488
- color: live ? t2["status-live-muted"] : TEXT_TERTIARY,
2545
+ color: live ? t3["status-live-muted"] : TEXT_TERTIARY,
2489
2546
  letterSpacing: 0.5,
2490
2547
  textTransform: "uppercase",
2491
2548
  marginRight: Math.round(fontSize * 0.5)
@@ -2543,7 +2600,7 @@ function TempoDisplay({
2543
2600
  reactNative.View,
2544
2601
  {
2545
2602
  style: {
2546
- backgroundColor: "#191919",
2603
+ backgroundColor: t3["surface-overlay"],
2547
2604
  borderRadius: 6,
2548
2605
  paddingVertical: 8,
2549
2606
  paddingHorizontal: 12,
@@ -2596,14 +2653,14 @@ function TempoDisplay({
2596
2653
  }
2597
2654
  );
2598
2655
  }
2599
- var t3 = getSemanticColors("dark");
2656
+ var t4 = getSemanticColors("dark");
2600
2657
  var INDICATOR_CONFIG = {
2601
- imbalance: { Icon: ScaleIcon, color: t3["status-error"], label: "Left/right imbalance" },
2602
- overshoot: { Icon: AlertTriangleIcon, color: t3["status-error"], label: "Load overshoot" },
2603
- "velocity-loss": { Icon: TrendingDownIcon, color: t3["status-warning"], label: "Velocity loss" },
2604
- "missed-reps": { Icon: CircleSlashIcon, color: t3["status-warning"], label: "Missed reps" },
2605
- pr: { Icon: AwardIcon, color: t3["status-success"], label: "Personal record" },
2606
- info: { Icon: InfoIcon, color: t3["status-info"], label: "More info" }
2658
+ imbalance: { Icon: ScaleIcon, color: t4["status-error"], label: "Left/right imbalance" },
2659
+ overshoot: { Icon: AlertTriangleIcon, color: t4["status-error"], label: "Load overshoot" },
2660
+ "velocity-loss": { Icon: TrendingDownIcon, color: t4["status-warning"], label: "Velocity loss" },
2661
+ "missed-reps": { Icon: CircleSlashIcon, color: t4["status-warning"], label: "Missed reps" },
2662
+ pr: { Icon: AwardIcon, color: t4["status-success"], label: "Personal record" },
2663
+ info: { Icon: InfoIcon, color: t4["status-info"], label: "More info" }
2607
2664
  };
2608
2665
  function ExerciseIndicator({ kind, onPress, className, ...props }) {
2609
2666
  const { Icon, color, label } = INDICATOR_CONFIG[kind];
@@ -3619,7 +3676,7 @@ function RestTimer({
3619
3676
  var DEFAULTS = {
3620
3677
  label: "SS",
3621
3678
  color: getSemanticColors("dark")["brand-primary"],
3622
- bgBase: "#101010"
3679
+ bgBase: getSemanticColors("dark")["background-base"]
3623
3680
  };
3624
3681
  function SupersetWrapper({
3625
3682
  label = DEFAULTS.label,
@@ -4401,11 +4458,11 @@ function CardContent({ children, className }) {
4401
4458
  function CardFooter({ children, className }) {
4402
4459
  return /* @__PURE__ */ jsx(reactNative.View, { className: cn("px-6 py-4 flex-row items-center gap-2", className), children });
4403
4460
  }
4404
- var t4 = getSemanticColors("dark");
4461
+ var t5 = getSemanticColors("dark");
4405
4462
  var solidVariantColors = {
4406
- success: t4["status-success"],
4407
- warning: t4["status-warning"],
4408
- error: t4["status-error"],
4463
+ success: t5["status-success"],
4464
+ warning: t5["status-warning"],
4465
+ error: t5["status-error"],
4409
4466
  neutral: "#6B7280"
4410
4467
  };
4411
4468
  var ringVariantStyles = {
@@ -4445,8 +4502,8 @@ var iconColors = {
4445
4502
  warning: "#6B4000",
4446
4503
  error: "#5C1A1A",
4447
4504
  neutral: "#D1D5DB",
4448
- "on-track": t4["status-success"],
4449
- deviation: t4["status-warning"],
4505
+ "on-track": t5["status-success"],
4506
+ deviation: t5["status-warning"],
4450
4507
  future: "#6B7280"
4451
4508
  };
4452
4509
  var sizeDimensions = {
@@ -4532,13 +4589,13 @@ var MESO_ACCENT_GRADIENT_LIGHT = primitiveRamps.orange[300];
4532
4589
  var WORKOUT_PILL_DELOAD = primitiveRamps.magenta[600];
4533
4590
 
4534
4591
  // src/components/custom/Workout/MesoStatusCard.tsx
4535
- var t5 = getSemanticColors("dark");
4536
- var BRAND_PRIMARY5 = t5["brand-primary"];
4592
+ var t6 = getSemanticColors("dark");
4593
+ var BRAND_PRIMARY5 = t6["brand-primary"];
4537
4594
  var BRAND_PRIMARY_DARK = MESO_ACCENT_GRADIENT_DARK;
4538
4595
  var BRAND_PRIMARY_LIGHT = MESO_ACCENT_GRADIENT_LIGHT;
4539
- var SUCCESS = t5["status-success"];
4540
- var WARNING = t5["status-warning"];
4541
- var ERROR = t5["status-error"];
4596
+ var SUCCESS = t6["status-success"];
4597
+ var WARNING = t6["status-warning"];
4598
+ var ERROR = t6["status-error"];
4542
4599
  var ACCENT_STOPS = [BRAND_PRIMARY_DARK, BRAND_PRIMARY5, BRAND_PRIMARY_LIGHT];
4543
4600
  var CARD_GRADIENT = `linear-gradient(135deg, ${resolveColor("surface-elevated")} 0%, ${resolveColor("surface-raised")} 100%)`;
4544
4601
  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%)";
@@ -4909,8 +4966,8 @@ var ERROR_PILL_BORDER = "rgba(209,67,67,0.20)";
4909
4966
  var PLOT_LEFT = 26;
4910
4967
  var TOOLTIP_WIDTH = 124;
4911
4968
  function timeOf(dateStr) {
4912
- const t11 = Date.parse(dateStr);
4913
- return Number.isNaN(t11) ? 0 : t11;
4969
+ const t12 = Date.parse(dateStr);
4970
+ return Number.isNaN(t12) ? 0 : t12;
4914
4971
  }
4915
4972
  function formatValue(value) {
4916
4973
  return `${Math.round(value)}`;
@@ -5399,10 +5456,10 @@ function StrengthTrendChart({
5399
5456
  }
5400
5457
  );
5401
5458
  }
5402
- var t6 = getSemanticColors("dark");
5403
- var STATUS_SUCCESS3 = t6["status-success"];
5404
- var STATUS_WARNING3 = t6["status-warning"];
5405
- var STATUS_INFO = t6["status-info"];
5459
+ var t7 = getSemanticColors("dark");
5460
+ var STATUS_SUCCESS3 = t7["status-success"];
5461
+ var STATUS_WARNING3 = t7["status-warning"];
5462
+ var STATUS_INFO = t7["status-info"];
5406
5463
  var DOT_BORDER = "#F3F4F6";
5407
5464
  var BAND_FILL = "rgba(46,213,115,0.1)";
5408
5465
  var BAND_EDGE = "rgba(46,213,115,0.45)";
@@ -5445,8 +5502,8 @@ function interpEdge(pixels, x, key) {
5445
5502
  const a = pixels[i];
5446
5503
  const b = pixels[i + 1];
5447
5504
  if (x >= a.x && x <= b.x) {
5448
- const t11 = b.x === a.x ? 0 : (x - a.x) / (b.x - a.x);
5449
- return a[key] + t11 * (b[key] - a[key]);
5505
+ const t12 = b.x === a.x ? 0 : (x - a.x) / (b.x - a.x);
5506
+ return a[key] + t12 * (b[key] - a[key]);
5450
5507
  }
5451
5508
  }
5452
5509
  return pixels[pixels.length - 1][key];
@@ -6485,12 +6542,12 @@ function Badge({
6485
6542
  }
6486
6543
  );
6487
6544
  }
6488
- var t7 = getSemanticColors("dark");
6545
+ var t8 = getSemanticColors("dark");
6489
6546
  var statusBgColors = {
6490
6547
  completed: "rgba(46,213,115,0.15)",
6491
6548
  current: "rgba(255,121,0,0.15)",
6492
6549
  next: "transparent",
6493
- upcoming: "#1C1C1C",
6550
+ upcoming: t8["surface-raised"],
6494
6551
  missed: "rgba(209,67,67,0.1)",
6495
6552
  deload: "rgba(186,41,150,0.15)"
6496
6553
  };
@@ -6503,9 +6560,9 @@ var statusBorderStyles = {
6503
6560
  deload: { borderWidth: 1, borderColor: "rgba(186,41,150,0.3)" }
6504
6561
  };
6505
6562
  var textColors = {
6506
- completed: t7["status-success"],
6507
- current: t7["brand-primary"],
6508
- next: t7["brand-primary"],
6563
+ completed: t8["status-success"],
6564
+ current: t8["brand-primary"],
6565
+ next: t8["brand-primary"],
6509
6566
  upcoming: "#6B7280",
6510
6567
  missed: "rgba(209,67,67,0.7)",
6511
6568
  deload: WORKOUT_PILL_DELOAD
@@ -6638,19 +6695,19 @@ function WorkoutPill({
6638
6695
  }
6639
6696
  return pill;
6640
6697
  }
6641
- var t8 = getSemanticColors("dark");
6698
+ var t9 = getSemanticColors("dark");
6642
6699
  var TRACK_BG = "#333333";
6643
6700
  var LABEL_COLOR = "#6B7280";
6644
6701
  var TARGET_LINE_COLOR = "rgba(33, 150, 243, 0.5)";
6645
6702
  var AT_TARGET_GLOW = "0 0 5px 1px rgba(33, 150, 243, 0.35), 0 0 10px 3px rgba(33, 150, 243, 0.15)";
6646
6703
  var ZONE = {
6647
- building: t8["status-success"],
6704
+ building: t9["status-success"],
6648
6705
  // below target ramp-up
6649
- approaching: t8["status-warning"],
6706
+ approaching: t9["status-warning"],
6650
6707
  // nearing target
6651
- target: t8["brand-primary"],
6708
+ target: t9["brand-primary"],
6652
6709
  // exactly at target
6653
- over1: t8["status-error"],
6710
+ over1: t9["status-error"],
6654
6711
  // mild over-target
6655
6712
  over2: WORKOUT_TOKENS.intensity.over2,
6656
6713
  // moderate over-target
@@ -7073,13 +7130,13 @@ function MesoCard({
7073
7130
  }
7074
7131
  ) });
7075
7132
  }
7076
- var t9 = getSemanticColors("dark");
7133
+ var t10 = getSemanticColors("dark");
7077
7134
  var dotColorMap = {
7078
7135
  untrained: "#2C2C2C",
7079
- behind: t9["brand-secondary"],
7080
- ontrack: t9["status-success"],
7081
- target: t9["brand-primary"],
7082
- over: t9["status-error"]
7136
+ behind: t10["brand-secondary"],
7137
+ ontrack: t10["status-success"],
7138
+ target: t10["brand-primary"],
7139
+ over: t10["status-error"]
7083
7140
  };
7084
7141
  function MuscleGroupChip({
7085
7142
  name,
@@ -7153,10 +7210,10 @@ function MuscleGroupChip({
7153
7210
  }
7154
7211
 
7155
7212
  // src/components/custom/Workout/WorkoutCard.tsx
7156
- var t10 = getSemanticColors("dark");
7213
+ var t11 = getSemanticColors("dark");
7157
7214
  var COLORS = {
7158
- statusSuccess: t10["status-success"],
7159
- brandPrimary: t10["brand-primary"],
7215
+ statusSuccess: t11["status-success"],
7216
+ brandPrimary: t11["brand-primary"],
7160
7217
  borderDefault: "#1F1F1F",
7161
7218
  brandPrimarySubtle: "rgba(255,121,0,0.06)"
7162
7219
  };