@cupped/tokens 0.1.0

package/dist/json/tokens.flat.json

@@ -0,0 +1,102 @@
+{
+  "canvas": "#F8FAFC",
+  "card": "#FFFFFF",
+  "canvas-border": "#E2E8F0",
+  "canvas-border-subtle": "#F1F5F9",
+  "ink": "#0F172A",
+  "ink-secondary": "#475569",
+  "ink-muted": "#94A3B8",
+  "ink-inverse": "#F8FAFC",
+  "primary": "#E07A5F",
+  "primary-strong": "#C05539",
+  "primary-strong-hover": "#AD4A30",
+  "primary-hover": "#D16A4F",
+  "primary-light": "#FDF2F0",
+  "primary-muted": "rgba(224, 122, 95, 0.12)",
+  "success": "#22C55E",
+  "success-light": "#F0FDF4",
+  "success-ink": "#15803D",
+  "error": "#EF4444",
+  "error-light": "#FEF2F2",
+  "error-ink": "#B91C1C",
+  "warning": "#F59E0B",
+  "warning-light": "#FFFBEB",
+  "warning-ink": "#B45309",
+  "info": "#3B82F6",
+  "info-light": "#EFF6FF",
+  "info-ink": "#1D4ED8",
+  "fruity": "#B44C54",
+  "floral": "#865CB2",
+  "nutty": "#876F49",
+  "chocolate": "#916951",
+  "spice": "#B4503A",
+  "sweet": "#8E6E09",
+  "citrus": "#A65F02",
+  "green": "#4E8429",
+  "berry": "#AC4D7B",
+  "roasted": "#896B5E",
+  "fruity-accessible": "#9B494E",
+  "berry-accessible": "#94496D",
+  "citrus-accessible": "#925512",
+  "sweet-accessible": "#7E6207",
+  "floral-accessible": "#755498",
+  "green-accessible": "#49742E",
+  "spice-accessible": "#9B4C3A",
+  "nutty-accessible": "#79623E",
+  "chocolate-accessible": "#825C46",
+  "roasted-accessible": "#7B5F52",
+  "on-flavor": "#FFFFFF",
+  "xp": "#8E6E09",
+  "xp-accessible": "#7E6207",
+  "ember": "#F97316",
+  "ember-accessible": "#C2410C",
+  "streak": "#F97316",
+  "streak-accessible": "#C2410C",
+  "badge": "#865CB2",
+  "badge-accessible": "#755498",
+  "zone-ideal": "#22C55E",
+  "zone-under": "#3B82F6",
+  "zone-over": "#EF4444",
+  "zone-strong": "#F59E0B",
+  "zone-weak": "#94A3B8",
+  "chart-sca": "#E07A5F",
+  "chart-ucdavis": "#865CB2",
+  "chart-grid": "#E2E8F0",
+  "shadow-sm": "0 1px 2px rgba(15,23,42,0.04), 0 1px 1px rgba(15,23,42,0.03)",
+  "shadow-md": "0 4px 12px rgba(15,23,42,0.06), 0 1px 3px rgba(15,23,42,0.04)",
+  "shadow-lg": "0 12px 32px rgba(15,23,42,0.08), 0 4px 8px rgba(15,23,42,0.04)",
+  "shadow-primary": "0 12px 28px rgba(224,122,95,0.28), 0 4px 10px rgba(224,122,95,0.18)",
+  "material-chrome-bg": "rgba(255, 255, 255, 0.95)",
+  "material-chrome-blur": "saturate(1.4) blur(20px)",
+  "scrim": "rgba(15, 23, 42, 0.45)",
+  "spring-response": "0.55s",
+  "spring-damping": 0.75,
+  "tap-scale": 0.95,
+  "tap-opacity": 0.8,
+  "stagger-delay": "0.08s",
+  "shimmer-duration": "1.5s",
+  "motion-reduced": "120ms",
+  "focus-ring": "0 0 0 2px #FFFFFF, 0 0 0 4px #C05539",
+  "hit-target-min": "44px",
+  "radius-sm": "8px",
+  "radius-md": "12px",
+  "radius-lg": "16px",
+  "radius-xl": "24px",
+  "radius-full": "9999px",
+  "space-xs": "4px",
+  "space-sm": "8px",
+  "space-md": "12px",
+  "space-base": "16px",
+  "space-lg": "20px",
+  "space-xl": "24px",
+  "space-xxl": "32px",
+  "ff-sans": "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif",
+  "ff-serif": "'Instrument Serif', Georgia, serif",
+  "ff-mono": "'JetBrains Mono', ui-monospace, SFMono-Regular, monospace",
+  "text-screen-title": "32px",
+  "text-sheet-title": "24px",
+  "text-card-title": "20px",
+  "text-body": "16px",
+  "text-body-sm": "14px",
+  "text-caption": "12px"
+}

package/dist/native/index.cjs

@@ -0,0 +1,281 @@
+// GENERATED FILE — do not edit. Canonical source: tokens/**/*.tokens.json
+// (npm run build in @cupped/tokens). Dimensions are unitless RN dp numbers,
+// durations are ms, fontFamily is a single string. shadow.*.boxShadow targets
+// RN 0.76+/new architecture; shadow.*.ios/android are the legacy props.
+'use strict';
+const tokens = {
+  "color": {
+    "canvas": "#F8FAFC",
+    "card": "#FFFFFF",
+    "canvasBorder": "#E2E8F0",
+    "canvasBorderSubtle": "#F1F5F9",
+    "ink": {
+      "default": "#0F172A",
+      "secondary": "#475569",
+      "muted": "#94A3B8",
+      "inverse": "#F8FAFC"
+    },
+    "primary": {
+      "default": "#E07A5F",
+      "strong": "#C05539",
+      "strongHover": "#AD4A30",
+      "hover": "#D16A4F",
+      "light": "#FDF2F0",
+      "muted": "rgba(224, 122, 95, 0.12)"
+    },
+    "success": {
+      "default": "#22C55E",
+      "light": "#F0FDF4",
+      "ink": "#15803D"
+    },
+    "error": {
+      "default": "#EF4444",
+      "light": "#FEF2F2",
+      "ink": "#B91C1C"
+    },
+    "warning": {
+      "default": "#F59E0B",
+      "light": "#FFFBEB",
+      "ink": "#B45309"
+    },
+    "info": {
+      "default": "#3B82F6",
+      "light": "#EFF6FF",
+      "ink": "#1D4ED8"
+    },
+    "flavor": {
+      "fruity": {
+        "fill": "#B44C54",
+        "text": "#9B494E"
+      },
+      "berry": {
+        "fill": "#AC4D7B",
+        "text": "#94496D"
+      },
+      "citrus": {
+        "fill": "#A65F02",
+        "text": "#925512"
+      },
+      "sweet": {
+        "fill": "#8E6E09",
+        "text": "#7E6207"
+      },
+      "floral": {
+        "fill": "#865CB2",
+        "text": "#755498"
+      },
+      "green": {
+        "fill": "#4E8429",
+        "text": "#49742E"
+      },
+      "spice": {
+        "fill": "#B4503A",
+        "text": "#9B4C3A"
+      },
+      "nutty": {
+        "fill": "#876F49",
+        "text": "#79623E"
+      },
+      "chocolate": {
+        "fill": "#916951",
+        "text": "#825C46"
+      },
+      "roasted": {
+        "fill": "#896B5E",
+        "text": "#7B5F52"
+      }
+    },
+    "onFlavor": "#FFFFFF",
+    "xp": "#8E6E09",
+    "xpAccessible": "#7E6207",
+    "ember": "#F97316",
+    "emberAccessible": "#C2410C",
+    "streak": "#F97316",
+    "streakAccessible": "#C2410C",
+    "badge": "#865CB2",
+    "badgeAccessible": "#755498",
+    "zone": {
+      "ideal": "#22C55E",
+      "under": "#3B82F6",
+      "over": "#EF4444",
+      "strong": "#F59E0B",
+      "weak": "#94A3B8"
+    },
+    "chart": {
+      "sca": "#E07A5F",
+      "ucdavis": "#865CB2",
+      "grid": "#E2E8F0"
+    }
+  },
+  "space": {
+    "xs": 4,
+    "sm": 8,
+    "md": 12,
+    "base": 16,
+    "lg": 20,
+    "xl": 24,
+    "xxl": 32,
+    "hitTargetMin": 44
+  },
+  "radius": {
+    "sm": 8,
+    "md": 12,
+    "lg": 16,
+    "xl": 24,
+    "full": 9999
+  },
+  "font": {
+    "sans": "Inter",
+    "serif": "Instrument Serif",
+    "mono": "JetBrains Mono"
+  },
+  "type": {
+    "screenTitle": {
+      "fontFamily": "Inter",
+      "fontSize": 32,
+      "fontWeight": "700",
+      "lineHeight": 35
+    },
+    "sheetTitle": {
+      "fontFamily": "Inter",
+      "fontSize": 24,
+      "fontWeight": "600",
+      "lineHeight": 29
+    },
+    "cardTitle": {
+      "fontFamily": "Inter",
+      "fontSize": 20,
+      "fontWeight": "600",
+      "lineHeight": 25
+    },
+    "body": {
+      "fontFamily": "Inter",
+      "fontSize": 16,
+      "fontWeight": "400",
+      "lineHeight": 24
+    },
+    "bodySm": {
+      "fontFamily": "Inter",
+      "fontSize": 14,
+      "fontWeight": "400",
+      "lineHeight": 20
+    },
+    "caption": {
+      "fontFamily": "Inter",
+      "fontSize": 12,
+      "fontWeight": "500",
+      "lineHeight": 17
+    },
+    "display": {
+      "fontFamily": "Instrument Serif",
+      "fontSize": 56,
+      "fontWeight": "400",
+      "lineHeight": 56,
+      "letterSpacing": -0.84
+    },
+    "mono": {
+      "fontFamily": "JetBrains Mono",
+      "fontSize": 12,
+      "fontWeight": "500",
+      "lineHeight": 17
+    }
+  },
+  "shadow": {
+    "sm": {
+      "boxShadow": "0 1px 2px rgba(15,23,42,0.04), 0 1px 1px rgba(15,23,42,0.03)",
+      "ios": {
+        "shadowColor": "#0F172A",
+        "shadowOffset": {
+          "width": 0,
+          "height": 1
+        },
+        "shadowOpacity": 0.04,
+        "shadowRadius": 2
+      },
+      "android": {
+        "elevation": 1
+      }
+    },
+    "md": {
+      "boxShadow": "0 4px 12px rgba(15,23,42,0.06), 0 1px 3px rgba(15,23,42,0.04)",
+      "ios": {
+        "shadowColor": "#0F172A",
+        "shadowOffset": {
+          "width": 0,
+          "height": 4
+        },
+        "shadowOpacity": 0.06,
+        "shadowRadius": 12
+      },
+      "android": {
+        "elevation": 4
+      }
+    },
+    "lg": {
+      "boxShadow": "0 12px 32px rgba(15,23,42,0.08), 0 4px 8px rgba(15,23,42,0.04)",
+      "ios": {
+        "shadowColor": "#0F172A",
+        "shadowOffset": {
+          "width": 0,
+          "height": 12
+        },
+        "shadowOpacity": 0.08,
+        "shadowRadius": 32
+      },
+      "android": {
+        "elevation": 8
+      }
+    },
+    "primary": {
+      "boxShadow": "0 12px 28px rgba(224,122,95,0.28), 0 4px 10px rgba(224,122,95,0.18)",
+      "ios": {
+        "shadowColor": "#E07A5F",
+        "shadowOffset": {
+          "width": 0,
+          "height": 12
+        },
+        "shadowOpacity": 0.28,
+        "shadowRadius": 28
+      },
+      "android": {
+        "elevation": 8,
+        "shadowColor": "#E07A5F"
+      }
+    }
+  },
+  "motion": {
+    "spring": {
+      "response": 550,
+      "damping": 0.75,
+      "reanimated": {
+        "stiffness": 130.51,
+        "damping": 17.14,
+        "mass": 1
+      },
+      "durationBased": {
+        "duration": 550,
+        "dampingRatio": 0.75
+      }
+    },
+    "tap": {
+      "scale": 0.95,
+      "opacity": 0.8
+    },
+    "staggerDelay": 80,
+    "shimmerDuration": 1500,
+    "reduced": 120
+  },
+  "focusRing": {
+    "innerWidth": 2,
+    "outerWidth": 2,
+    "innerColor": "#FFFFFF",
+    "color": "#C05539"
+  },
+  "material": {
+    "chromeBg": "rgba(255, 255, 255, 0.95)",
+    "scrim": "rgba(15, 23, 42, 0.45)",
+    "blur": 20,
+    "saturate": 1.4
+  }
+};
+module.exports = { tokens };

package/dist/native/index.d.ts

@@ -0,0 +1,285 @@
+// GENERATED FILE — do not edit. Canonical source: tokens/**/*.tokens.json
+// (npm run build in @cupped/tokens). Dimensions are unitless RN dp numbers,
+// durations are ms, fontFamily is a single string. shadow.*.boxShadow targets
+// RN 0.76+/new architecture; shadow.*.ios/android are the legacy props.
+
+export declare const tokens: {
+  readonly "color": {
+    readonly "canvas": "#F8FAFC";
+    readonly "card": "#FFFFFF";
+    readonly "canvasBorder": "#E2E8F0";
+    readonly "canvasBorderSubtle": "#F1F5F9";
+    readonly "ink": {
+      readonly "default": "#0F172A";
+      readonly "secondary": "#475569";
+      readonly "muted": "#94A3B8";
+      readonly "inverse": "#F8FAFC";
+    };
+    readonly "primary": {
+      readonly "default": "#E07A5F";
+      readonly "strong": "#C05539";
+      readonly "strongHover": "#AD4A30";
+      readonly "hover": "#D16A4F";
+      readonly "light": "#FDF2F0";
+      readonly "muted": "rgba(224, 122, 95, 0.12)";
+    };
+    readonly "success": {
+      readonly "default": "#22C55E";
+      readonly "light": "#F0FDF4";
+      readonly "ink": "#15803D";
+    };
+    readonly "error": {
+      readonly "default": "#EF4444";
+      readonly "light": "#FEF2F2";
+      readonly "ink": "#B91C1C";
+    };
+    readonly "warning": {
+      readonly "default": "#F59E0B";
+      readonly "light": "#FFFBEB";
+      readonly "ink": "#B45309";
+    };
+    readonly "info": {
+      readonly "default": "#3B82F6";
+      readonly "light": "#EFF6FF";
+      readonly "ink": "#1D4ED8";
+    };
+    readonly "flavor": {
+      readonly "fruity": {
+        readonly "fill": "#B44C54";
+        readonly "text": "#9B494E";
+      };
+      readonly "berry": {
+        readonly "fill": "#AC4D7B";
+        readonly "text": "#94496D";
+      };
+      readonly "citrus": {
+        readonly "fill": "#A65F02";
+        readonly "text": "#925512";
+      };
+      readonly "sweet": {
+        readonly "fill": "#8E6E09";
+        readonly "text": "#7E6207";
+      };
+      readonly "floral": {
+        readonly "fill": "#865CB2";
+        readonly "text": "#755498";
+      };
+      readonly "green": {
+        readonly "fill": "#4E8429";
+        readonly "text": "#49742E";
+      };
+      readonly "spice": {
+        readonly "fill": "#B4503A";
+        readonly "text": "#9B4C3A";
+      };
+      readonly "nutty": {
+        readonly "fill": "#876F49";
+        readonly "text": "#79623E";
+      };
+      readonly "chocolate": {
+        readonly "fill": "#916951";
+        readonly "text": "#825C46";
+      };
+      readonly "roasted": {
+        readonly "fill": "#896B5E";
+        readonly "text": "#7B5F52";
+      };
+    };
+    readonly "onFlavor": "#FFFFFF";
+    readonly "xp": "#8E6E09";
+    readonly "xpAccessible": "#7E6207";
+    readonly "ember": "#F97316";
+    readonly "emberAccessible": "#C2410C";
+    readonly "streak": "#F97316";
+    readonly "streakAccessible": "#C2410C";
+    readonly "badge": "#865CB2";
+    readonly "badgeAccessible": "#755498";
+    readonly "zone": {
+      readonly "ideal": "#22C55E";
+      readonly "under": "#3B82F6";
+      readonly "over": "#EF4444";
+      readonly "strong": "#F59E0B";
+      readonly "weak": "#94A3B8";
+    };
+    readonly "chart": {
+      readonly "sca": "#E07A5F";
+      readonly "ucdavis": "#865CB2";
+      readonly "grid": "#E2E8F0";
+    };
+  };
+  readonly "space": {
+    readonly "xs": 4;
+    readonly "sm": 8;
+    readonly "md": 12;
+    readonly "base": 16;
+    readonly "lg": 20;
+    readonly "xl": 24;
+    readonly "xxl": 32;
+    readonly "hitTargetMin": 44;
+  };
+  readonly "radius": {
+    readonly "sm": 8;
+    readonly "md": 12;
+    readonly "lg": 16;
+    readonly "xl": 24;
+    readonly "full": 9999;
+  };
+  readonly "font": {
+    readonly "sans": "Inter";
+    readonly "serif": "Instrument Serif";
+    readonly "mono": "JetBrains Mono";
+  };
+  readonly "type": {
+    readonly "screenTitle": {
+      readonly "fontFamily": "Inter";
+      readonly "fontSize": 32;
+      readonly "fontWeight": "700";
+      readonly "lineHeight": 35;
+    };
+    readonly "sheetTitle": {
+      readonly "fontFamily": "Inter";
+      readonly "fontSize": 24;
+      readonly "fontWeight": "600";
+      readonly "lineHeight": 29;
+    };
+    readonly "cardTitle": {
+      readonly "fontFamily": "Inter";
+      readonly "fontSize": 20;
+      readonly "fontWeight": "600";
+      readonly "lineHeight": 25;
+    };
+    readonly "body": {
+      readonly "fontFamily": "Inter";
+      readonly "fontSize": 16;
+      readonly "fontWeight": "400";
+      readonly "lineHeight": 24;
+    };
+    readonly "bodySm": {
+      readonly "fontFamily": "Inter";
+      readonly "fontSize": 14;
+      readonly "fontWeight": "400";
+      readonly "lineHeight": 20;
+    };
+    readonly "caption": {
+      readonly "fontFamily": "Inter";
+      readonly "fontSize": 12;
+      readonly "fontWeight": "500";
+      readonly "lineHeight": 17;
+    };
+    readonly "display": {
+      readonly "fontFamily": "Instrument Serif";
+      readonly "fontSize": 56;
+      readonly "fontWeight": "400";
+      readonly "lineHeight": 56;
+      readonly "letterSpacing": -0.84;
+    };
+    readonly "mono": {
+      readonly "fontFamily": "JetBrains Mono";
+      readonly "fontSize": 12;
+      readonly "fontWeight": "500";
+      readonly "lineHeight": 17;
+    };
+  };
+  readonly "shadow": {
+    readonly "sm": {
+      readonly "boxShadow": "0 1px 2px rgba(15,23,42,0.04), 0 1px 1px rgba(15,23,42,0.03)";
+      readonly "ios": {
+        readonly "shadowColor": "#0F172A";
+        readonly "shadowOffset": {
+          readonly "width": 0;
+          readonly "height": 1;
+        };
+        readonly "shadowOpacity": 0.04;
+        readonly "shadowRadius": 2;
+      };
+      readonly "android": {
+        readonly "elevation": 1;
+      };
+    };
+    readonly "md": {
+      readonly "boxShadow": "0 4px 12px rgba(15,23,42,0.06), 0 1px 3px rgba(15,23,42,0.04)";
+      readonly "ios": {
+        readonly "shadowColor": "#0F172A";
+        readonly "shadowOffset": {
+          readonly "width": 0;
+          readonly "height": 4;
+        };
+        readonly "shadowOpacity": 0.06;
+        readonly "shadowRadius": 12;
+      };
+      readonly "android": {
+        readonly "elevation": 4;
+      };
+    };
+    readonly "lg": {
+      readonly "boxShadow": "0 12px 32px rgba(15,23,42,0.08), 0 4px 8px rgba(15,23,42,0.04)";
+      readonly "ios": {
+        readonly "shadowColor": "#0F172A";
+        readonly "shadowOffset": {
+          readonly "width": 0;
+          readonly "height": 12;
+        };
+        readonly "shadowOpacity": 0.08;
+        readonly "shadowRadius": 32;
+      };
+      readonly "android": {
+        readonly "elevation": 8;
+      };
+    };
+    readonly "primary": {
+      readonly "boxShadow": "0 12px 28px rgba(224,122,95,0.28), 0 4px 10px rgba(224,122,95,0.18)";
+      readonly "ios": {
+        readonly "shadowColor": "#E07A5F";
+        readonly "shadowOffset": {
+          readonly "width": 0;
+          readonly "height": 12;
+        };
+        readonly "shadowOpacity": 0.28;
+        readonly "shadowRadius": 28;
+      };
+      readonly "android": {
+        readonly "elevation": 8;
+        readonly "shadowColor": "#E07A5F";
+      };
+    };
+  };
+  readonly "motion": {
+    readonly "spring": {
+      readonly "response": 550;
+      readonly "damping": 0.75;
+      readonly "reanimated": {
+        readonly "stiffness": 130.51;
+        readonly "damping": 17.14;
+        readonly "mass": 1;
+      };
+      readonly "durationBased": {
+        readonly "duration": 550;
+        readonly "dampingRatio": 0.75;
+      };
+    };
+    readonly "tap": {
+      readonly "scale": 0.95;
+      readonly "opacity": 0.8;
+    };
+    readonly "staggerDelay": 80;
+    readonly "shimmerDuration": 1500;
+    readonly "reduced": 120;
+  };
+  readonly "focusRing": {
+    readonly "innerWidth": 2;
+    readonly "outerWidth": 2;
+    readonly "innerColor": "#FFFFFF";
+    readonly "color": "#C05539";
+  };
+  readonly "material": {
+    readonly "chromeBg": "rgba(255, 255, 255, 0.95)";
+    readonly "scrim": "rgba(15, 23, 42, 0.45)";
+    readonly "blur": 20;
+    readonly "saturate": 1.4;
+  };
+};
+
+export type FlavorName = "fruity" | "berry" | "citrus" | "sweet" | "floral" | "green" | "spice" | "nutty" | "chocolate" | "roasted";
+export type SpacingKey = "xs" | "sm" | "md" | "base" | "lg" | "xl" | "xxl";
+export type RadiusKey = "sm" | "md" | "lg" | "xl" | "full";
+export type TypeStyleName = "screenTitle" | "sheetTitle" | "cardTitle" | "body" | "bodySm" | "caption" | "display" | "mono";