@aghents/tokens 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,80 @@
+declare const tokens: {
+    readonly void: "#0D1117";
+    readonly surface: "#161C24";
+    readonly hairline: "#2B323C";
+    readonly cream: "#D8D8D8";
+    readonly 'cream-dim': "#8A9199";
+    readonly lime: "#D6EA36";
+    readonly rose: "#E6B6AA";
+    readonly 'lime-glow': "0 0 0 4px rgba(214, 234, 54, 0.18)";
+    readonly 'font-display': "'Newsreader', Georgia, serif";
+    readonly 'font-mono': "'DM Mono', ui-monospace, Menlo, monospace";
+    readonly 'display-xl': "300 56px/1.05 var(--games-font-display)";
+    readonly 'display-l': "300 40px/1.1 var(--games-font-display)";
+    readonly 'display-m': "400 28px/1.2 var(--games-font-display)";
+    readonly body: "300 17px/1.5 var(--games-font-display)";
+    readonly label: "400 12px/1.4 var(--games-font-mono)";
+    readonly value: "400 14px/1.4 var(--games-font-mono)";
+    readonly 'tracking-label': "0.14em";
+    readonly 'space-1': "4px";
+    readonly 'space-2': "8px";
+    readonly 'space-3': "16px";
+    readonly 'space-4': "24px";
+    readonly 'space-5': "40px";
+    readonly 'space-6': "64px";
+    readonly 'space-7': "96px";
+    readonly radius: "2px";
+    readonly shadow: "none";
+    readonly 'motion-fast': "180ms";
+    readonly 'motion-base': "280ms";
+    readonly 'motion-reveal': "500ms";
+    readonly ease: "cubic-bezier(0.2, 0, 0, 1)";
+};
+type TokenName = keyof typeof tokens;
+declare const cssVariables = ":root {\n  --games-void: #0D1117;\n  --games-surface: #161C24;\n  --games-hairline: #2B323C;\n  --games-cream: #D8D8D8;\n  --games-cream-dim: #8A9199;\n  --games-lime: #D6EA36;\n  --games-rose: #E6B6AA;\n  --games-lime-glow: 0 0 0 4px rgba(214, 234, 54, 0.18);\n  --games-font-display: 'Newsreader', Georgia, serif;\n  --games-font-mono: 'DM Mono', ui-monospace, Menlo, monospace;\n  --games-display-xl: 300 56px/1.05 var(--games-font-display);\n  --games-display-l: 300 40px/1.1 var(--games-font-display);\n  --games-display-m: 400 28px/1.2 var(--games-font-display);\n  --games-body: 300 17px/1.5 var(--games-font-display);\n  --games-label: 400 12px/1.4 var(--games-font-mono);\n  --games-value: 400 14px/1.4 var(--games-font-mono);\n  --games-tracking-label: 0.14em;\n  --games-space-1: 4px;\n  --games-space-2: 8px;\n  --games-space-3: 16px;\n  --games-space-4: 24px;\n  --games-space-5: 40px;\n  --games-space-6: 64px;\n  --games-space-7: 96px;\n  --games-radius: 2px;\n  --games-shadow: none;\n  --games-motion-fast: 180ms;\n  --games-motion-base: 280ms;\n  --games-motion-reveal: 500ms;\n  --games-ease: cubic-bezier(0.2, 0, 0, 1);\n}";
+declare const fontImportUrl = "https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,300;0,6..72,400;1,6..72,300&family=DM+Mono:wght@300;400&display=swap";
+
+declare const colors: {
+    readonly void: "#0D1117";
+    readonly surface: "#161C24";
+    readonly hairline: "#2B323C";
+    readonly cream: "#D8D8D8";
+    readonly creamDim: "#8A9199";
+    readonly lime: "#D6EA36";
+    readonly rose: "#E6B6AA";
+};
+declare const fonts: {
+    readonly display: string;
+    readonly mono: string;
+};
+declare const rnTheme: {
+    readonly colors: {
+        readonly void: "#0D1117";
+        readonly surface: "#161C24";
+        readonly hairline: "#2B323C";
+        readonly cream: "#D8D8D8";
+        readonly creamDim: "#8A9199";
+        readonly lime: "#D6EA36";
+        readonly rose: "#E6B6AA";
+    };
+    readonly fonts: {
+        readonly display: string;
+        readonly mono: string;
+    };
+    readonly space: readonly [4, 8, 16, 24, 40, 64, 96];
+    readonly radius: 2;
+};
+declare const nativeFonts: {
+    readonly display: {
+        family: string;
+        package: string;
+        weights: number[];
+    };
+    readonly mono: {
+        family: string;
+        package: string;
+        weights: number[];
+    };
+};
+
+export { type TokenName, colors, cssVariables, fontImportUrl, fonts, nativeFonts, rnTheme, tokens };

package/dist/index.js

@@ -0,0 +1,82 @@
+// src/generated.ts
+var tokens = {
+  "void": "#0D1117",
+  "surface": "#161C24",
+  "hairline": "#2B323C",
+  "cream": "#D8D8D8",
+  "cream-dim": "#8A9199",
+  "lime": "#D6EA36",
+  "rose": "#E6B6AA",
+  "lime-glow": "0 0 0 4px rgba(214, 234, 54, 0.18)",
+  "font-display": "'Newsreader', Georgia, serif",
+  "font-mono": "'DM Mono', ui-monospace, Menlo, monospace",
+  "display-xl": "300 56px/1.05 var(--games-font-display)",
+  "display-l": "300 40px/1.1 var(--games-font-display)",
+  "display-m": "400 28px/1.2 var(--games-font-display)",
+  "body": "300 17px/1.5 var(--games-font-display)",
+  "label": "400 12px/1.4 var(--games-font-mono)",
+  "value": "400 14px/1.4 var(--games-font-mono)",
+  "tracking-label": "0.14em",
+  "space-1": "4px",
+  "space-2": "8px",
+  "space-3": "16px",
+  "space-4": "24px",
+  "space-5": "40px",
+  "space-6": "64px",
+  "space-7": "96px",
+  "radius": "2px",
+  "shadow": "none",
+  "motion-fast": "180ms",
+  "motion-base": "280ms",
+  "motion-reveal": "500ms",
+  "ease": "cubic-bezier(0.2, 0, 0, 1)"
+};
+var cssVariables = ":root {\n  --games-void: #0D1117;\n  --games-surface: #161C24;\n  --games-hairline: #2B323C;\n  --games-cream: #D8D8D8;\n  --games-cream-dim: #8A9199;\n  --games-lime: #D6EA36;\n  --games-rose: #E6B6AA;\n  --games-lime-glow: 0 0 0 4px rgba(214, 234, 54, 0.18);\n  --games-font-display: 'Newsreader', Georgia, serif;\n  --games-font-mono: 'DM Mono', ui-monospace, Menlo, monospace;\n  --games-display-xl: 300 56px/1.05 var(--games-font-display);\n  --games-display-l: 300 40px/1.1 var(--games-font-display);\n  --games-display-m: 400 28px/1.2 var(--games-font-display);\n  --games-body: 300 17px/1.5 var(--games-font-display);\n  --games-label: 400 12px/1.4 var(--games-font-mono);\n  --games-value: 400 14px/1.4 var(--games-font-mono);\n  --games-tracking-label: 0.14em;\n  --games-space-1: 4px;\n  --games-space-2: 8px;\n  --games-space-3: 16px;\n  --games-space-4: 24px;\n  --games-space-5: 40px;\n  --games-space-6: 64px;\n  --games-space-7: 96px;\n  --games-radius: 2px;\n  --games-shadow: none;\n  --games-motion-fast: 180ms;\n  --games-motion-base: 280ms;\n  --games-motion-reveal: 500ms;\n  --games-ease: cubic-bezier(0.2, 0, 0, 1);\n}";
+var fontImportUrl = "https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,300;0,6..72,400;1,6..72,300&family=DM+Mono:wght@300;400&display=swap";
+
+// src/index.ts
+var colors = {
+  void: tokens.void,
+  surface: tokens.surface,
+  hairline: tokens.hairline,
+  cream: tokens.cream,
+  creamDim: tokens["cream-dim"],
+  lime: tokens.lime,
+  rose: tokens.rose
+};
+var firstFamily = (stack) => (stack.split(",")[0] ?? "").trim().replace(/^['"]|['"]$/g, "");
+var fonts = {
+  display: firstFamily(tokens["font-display"]),
+  mono: firstFamily(tokens["font-mono"])
+};
+var rnTheme = {
+  colors,
+  fonts,
+  space: [4, 8, 16, 24, 40, 64, 96],
+  radius: 2
+};
+var weightsFor = (family) => {
+  const spec = new URL(fontImportUrl).searchParams.getAll("family").find((f) => f.startsWith(`${family}:`));
+  const [axes = "", tuples = ""] = (spec?.split(":")[1] ?? "").split("@");
+  const i = axes.split(",").indexOf("wght");
+  if (i < 0) return [];
+  return [...new Set(tuples.split(";").map((t) => Number(t.split(",")[i])))];
+};
+var nativeFont = (family) => ({
+  family,
+  package: `@expo-google-fonts/${family.toLowerCase().replace(/\s+/g, "-")}`,
+  weights: weightsFor(family)
+});
+var nativeFonts = {
+  display: nativeFont(fonts.display),
+  mono: nativeFont(fonts.mono)
+};
+export {
+  colors,
+  cssVariables,
+  fontImportUrl,
+  fonts,
+  nativeFonts,
+  rnTheme,
+  tokens
+};

package/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "@aghents/tokens",
+  "version": "0.1.0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "devDependencies": {
+    "@types/node": "^22.10.2",
+    "tsx": "^4.19.2",
+    "typescript": "^5.9.3",
+    "vitest": "^2.1.9"
+  },
+  "scripts": {
+    "build": "tsup src/index.ts --format esm --dts --clean",
+    "gen": "tsx scripts/gen.ts",
+    "typecheck": "tsc --noEmit -p tsconfig.json",
+    "test": "vitest run"
+  }
+}