@skye-ds/tokens-js 0.1.1

package/README.md

@@ -0,0 +1,22 @@
+# @skye-ds/tokens-js
+
+JS/TS token constants for the Antigravity design system.
+Auto-generated — do not edit by hand.
+
+## Install
+
+```bash
+pnpm add @skye-ds/tokens-js
+```
+
+## Usage
+
+```ts
+import { tokens } from '@skye-ds/tokens-js'
+
+tokens.color.text.primary           // '#111827'
+tokens.color.brand.primary.default  // '#2563eb'
+tokens.spacing.component.md         // '12px'
+tokens.radius.interactive           // '6px'
+tokens.motion.duration.normal       // '200ms'
+```

package/dist/index.d.mts

@@ -0,0 +1,196 @@
+declare const tokens: {
+    readonly typography: {
+        readonly display: {
+            readonly xl: {
+                readonly size: "48px";
+                readonly "line-height": "1.25";
+            };
+        };
+        readonly heading: {
+            readonly xl: {
+                readonly size: "24px";
+            };
+            readonly lg: {
+                readonly size: "20px";
+            };
+            readonly md: {
+                readonly size: "18px";
+            };
+        };
+        readonly body: {
+            readonly lg: {
+                readonly size: "16px";
+            };
+            readonly md: {
+                readonly size: "14px";
+            };
+            readonly sm: {
+                readonly size: "12px";
+            };
+        };
+        readonly label: {
+            readonly md: {
+                readonly size: "14px";
+                readonly weight: "500";
+            };
+        };
+        readonly code: {
+            readonly md: {
+                readonly size: "14px";
+            };
+        };
+    };
+    readonly color: {
+        readonly brand: {
+            readonly primary: {
+                readonly default: "#2563eb";
+                readonly hover: "#1d4ed8";
+                readonly subtle: "#eff6ff";
+            };
+            readonly secondary: {
+                readonly default: "#4b5563";
+            };
+        };
+        readonly feedback: {
+            readonly error: {
+                readonly default: "#dc2626";
+                readonly subtle: "#fef2f2";
+            };
+            readonly warning: {
+                readonly default: "#f59e0b";
+                readonly subtle: "#fffbeb";
+            };
+            readonly success: {
+                readonly default: "#16a34a";
+                readonly subtle: "#f0fdf4";
+            };
+            readonly info: {
+                readonly default: "#3b82f6";
+                readonly subtle: "#eff6ff";
+            };
+        };
+        readonly surface: {
+            readonly default: "#ffffff";
+            readonly subtle: "#f9fafb";
+            readonly raised: "#ffffff";
+        };
+        readonly text: {
+            readonly primary: "#111827";
+            readonly secondary: "#4b5563";
+            readonly tertiary: "#9ca3af";
+            readonly disabled: "#d1d5db";
+            readonly inverse: "#ffffff";
+            readonly "on-brand": "#ffffff";
+        };
+        readonly border: {
+            readonly default: "#e5e7eb";
+            readonly strong: "#9ca3af";
+            readonly focus: "#3b82f6";
+            readonly error: "#ef4444";
+        };
+    };
+    readonly motion: {
+        readonly duration: {
+            readonly instant: "0ms";
+            readonly fast: "100ms";
+            readonly normal: "200ms";
+            readonly slow: "300ms";
+            readonly slower: "500ms";
+        };
+        readonly easing: {
+            readonly default: "cubic-bezier(0.4, 0, 0.2, 1)";
+            readonly in: "cubic-bezier(0.4, 0, 1, 1)";
+            readonly out: "cubic-bezier(0, 0, 0.2, 1)";
+            readonly spring: "cubic-bezier(0.34, 1.56, 0.64, 1)";
+        };
+    };
+    readonly radius: {
+        readonly none: "0px";
+        readonly sm: "2px";
+        readonly md: "6px";
+        readonly lg: "8px";
+        readonly xl: "12px";
+        readonly full: "9999px";
+        readonly interactive: "6px";
+        readonly card: "8px";
+    };
+    readonly shadow: {
+        readonly "0": "none";
+        readonly "1": "0 1px 2px 0 rgb(0 0 0 / 0.05)";
+        readonly "2": "0 1px 3px 0 rgb(0 0 0 / 0.10), 0 1px 2px -1px rgb(0 0 0 / 0.10)";
+        readonly "3": "0 4px 6px -1px rgb(0 0 0 / 0.10), 0 2px 4px -2px rgb(0 0 0 / 0.10)";
+        readonly "4": "0 10px 15px -3px rgb(0 0 0 / 0.10), 0 4px 6px -4px rgb(0 0 0 / 0.10)";
+    };
+    readonly spacing: {
+        readonly layout: {
+            readonly xs: "8px";
+            readonly sm: "16px";
+            readonly md: "24px";
+            readonly lg: "32px";
+            readonly xl: "48px";
+        };
+        readonly component: {
+            readonly xs: "4px";
+            readonly sm: "8px";
+            readonly md: "12px";
+            readonly lg: "16px";
+            readonly xl: "24px";
+        };
+        readonly inline: {
+            readonly xs: "4px";
+            readonly sm: "8px";
+            readonly md: "12px";
+        };
+    };
+    readonly button: {
+        readonly bg: {
+            readonly default: "#2563eb";
+            readonly hover: "#1d4ed8";
+            readonly disabled: "#f9fafb";
+        };
+        readonly text: {
+            readonly default: "#ffffff";
+            readonly disabled: "#d1d5db";
+        };
+        readonly border: {
+            readonly default: "#2563eb";
+            readonly focus: "#3b82f6";
+        };
+        readonly padding: {
+            readonly x: "16px";
+            readonly y: "12px";
+        };
+        readonly radius: "6px";
+        readonly font: {
+            readonly size: "14px";
+            readonly weight: "500";
+        };
+    };
+    readonly input: {
+        readonly bg: {
+            readonly default: "#ffffff";
+            readonly disabled: "#f9fafb";
+        };
+        readonly text: {
+            readonly default: "#111827";
+            readonly placeholder: "#9ca3af";
+        };
+        readonly border: {
+            readonly default: "#e5e7eb";
+            readonly hover: "#9ca3af";
+            readonly focus: "#3b82f6";
+            readonly error: "#ef4444";
+        };
+        readonly padding: {
+            readonly x: "16px";
+            readonly y: "12px";
+        };
+        readonly radius: "6px";
+        readonly font: {
+            readonly size: "14px";
+        };
+    };
+};
+declare const tokenMap: Record<string, string>;
+
+export { tokenMap, tokens };

package/dist/index.d.ts

@@ -0,0 +1,196 @@
+declare const tokens: {
+    readonly typography: {
+        readonly display: {
+            readonly xl: {
+                readonly size: "48px";
+                readonly "line-height": "1.25";
+            };
+        };
+        readonly heading: {
+            readonly xl: {
+                readonly size: "24px";
+            };
+            readonly lg: {
+                readonly size: "20px";
+            };
+            readonly md: {
+                readonly size: "18px";
+            };
+        };
+        readonly body: {
+            readonly lg: {
+                readonly size: "16px";
+            };
+            readonly md: {
+                readonly size: "14px";
+            };
+            readonly sm: {
+                readonly size: "12px";
+            };
+        };
+        readonly label: {
+            readonly md: {
+                readonly size: "14px";
+                readonly weight: "500";
+            };
+        };
+        readonly code: {
+            readonly md: {
+                readonly size: "14px";
+            };
+        };
+    };
+    readonly color: {
+        readonly brand: {
+            readonly primary: {
+                readonly default: "#2563eb";
+                readonly hover: "#1d4ed8";
+                readonly subtle: "#eff6ff";
+            };
+            readonly secondary: {
+                readonly default: "#4b5563";
+            };
+        };
+        readonly feedback: {
+            readonly error: {
+                readonly default: "#dc2626";
+                readonly subtle: "#fef2f2";
+            };
+            readonly warning: {
+                readonly default: "#f59e0b";
+                readonly subtle: "#fffbeb";
+            };
+            readonly success: {
+                readonly default: "#16a34a";
+                readonly subtle: "#f0fdf4";
+            };
+            readonly info: {
+                readonly default: "#3b82f6";
+                readonly subtle: "#eff6ff";
+            };
+        };
+        readonly surface: {
+            readonly default: "#ffffff";
+            readonly subtle: "#f9fafb";
+            readonly raised: "#ffffff";
+        };
+        readonly text: {
+            readonly primary: "#111827";
+            readonly secondary: "#4b5563";
+            readonly tertiary: "#9ca3af";
+            readonly disabled: "#d1d5db";
+            readonly inverse: "#ffffff";
+            readonly "on-brand": "#ffffff";
+        };
+        readonly border: {
+            readonly default: "#e5e7eb";
+            readonly strong: "#9ca3af";
+            readonly focus: "#3b82f6";
+            readonly error: "#ef4444";
+        };
+    };
+    readonly motion: {
+        readonly duration: {
+            readonly instant: "0ms";
+            readonly fast: "100ms";
+            readonly normal: "200ms";
+            readonly slow: "300ms";
+            readonly slower: "500ms";
+        };
+        readonly easing: {
+            readonly default: "cubic-bezier(0.4, 0, 0.2, 1)";
+            readonly in: "cubic-bezier(0.4, 0, 1, 1)";
+            readonly out: "cubic-bezier(0, 0, 0.2, 1)";
+            readonly spring: "cubic-bezier(0.34, 1.56, 0.64, 1)";
+        };
+    };
+    readonly radius: {
+        readonly none: "0px";
+        readonly sm: "2px";
+        readonly md: "6px";
+        readonly lg: "8px";
+        readonly xl: "12px";
+        readonly full: "9999px";
+        readonly interactive: "6px";
+        readonly card: "8px";
+    };
+    readonly shadow: {
+        readonly "0": "none";
+        readonly "1": "0 1px 2px 0 rgb(0 0 0 / 0.05)";
+        readonly "2": "0 1px 3px 0 rgb(0 0 0 / 0.10), 0 1px 2px -1px rgb(0 0 0 / 0.10)";
+        readonly "3": "0 4px 6px -1px rgb(0 0 0 / 0.10), 0 2px 4px -2px rgb(0 0 0 / 0.10)";
+        readonly "4": "0 10px 15px -3px rgb(0 0 0 / 0.10), 0 4px 6px -4px rgb(0 0 0 / 0.10)";
+    };
+    readonly spacing: {
+        readonly layout: {
+            readonly xs: "8px";
+            readonly sm: "16px";
+            readonly md: "24px";
+            readonly lg: "32px";
+            readonly xl: "48px";
+        };
+        readonly component: {
+            readonly xs: "4px";
+            readonly sm: "8px";
+            readonly md: "12px";
+            readonly lg: "16px";
+            readonly xl: "24px";
+        };
+        readonly inline: {
+            readonly xs: "4px";
+            readonly sm: "8px";
+            readonly md: "12px";
+        };
+    };
+    readonly button: {
+        readonly bg: {
+            readonly default: "#2563eb";
+            readonly hover: "#1d4ed8";
+            readonly disabled: "#f9fafb";
+        };
+        readonly text: {
+            readonly default: "#ffffff";
+            readonly disabled: "#d1d5db";
+        };
+        readonly border: {
+            readonly default: "#2563eb";
+            readonly focus: "#3b82f6";
+        };
+        readonly padding: {
+            readonly x: "16px";
+            readonly y: "12px";
+        };
+        readonly radius: "6px";
+        readonly font: {
+            readonly size: "14px";
+            readonly weight: "500";
+        };
+    };
+    readonly input: {
+        readonly bg: {
+            readonly default: "#ffffff";
+            readonly disabled: "#f9fafb";
+        };
+        readonly text: {
+            readonly default: "#111827";
+            readonly placeholder: "#9ca3af";
+        };
+        readonly border: {
+            readonly default: "#e5e7eb";
+            readonly hover: "#9ca3af";
+            readonly focus: "#3b82f6";
+            readonly error: "#ef4444";
+        };
+        readonly padding: {
+            readonly x: "16px";
+            readonly y: "12px";
+        };
+        readonly radius: "6px";
+        readonly font: {
+            readonly size: "14px";
+        };
+    };
+};
+declare const tokenMap: Record<string, string>;
+
+export { tokenMap, tokens };

package/dist/index.js

@@ -0,0 +1,320 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// index.ts
+var index_exports = {};
+__export(index_exports, {
+  tokenMap: () => tokenMap,
+  tokens: () => tokens
+});
+module.exports = __toCommonJS(index_exports);
+var tokens = {
+  "typography": {
+    "display": {
+      "xl": {
+        "size": "48px",
+        "line-height": "1.25"
+      }
+    },
+    "heading": {
+      "xl": {
+        "size": "24px"
+      },
+      "lg": {
+        "size": "20px"
+      },
+      "md": {
+        "size": "18px"
+      }
+    },
+    "body": {
+      "lg": {
+        "size": "16px"
+      },
+      "md": {
+        "size": "14px"
+      },
+      "sm": {
+        "size": "12px"
+      }
+    },
+    "label": {
+      "md": {
+        "size": "14px",
+        "weight": "500"
+      }
+    },
+    "code": {
+      "md": {
+        "size": "14px"
+      }
+    }
+  },
+  "color": {
+    "brand": {
+      "primary": {
+        "default": "#2563eb",
+        "hover": "#1d4ed8",
+        "subtle": "#eff6ff"
+      },
+      "secondary": {
+        "default": "#4b5563"
+      }
+    },
+    "feedback": {
+      "error": {
+        "default": "#dc2626",
+        "subtle": "#fef2f2"
+      },
+      "warning": {
+        "default": "#f59e0b",
+        "subtle": "#fffbeb"
+      },
+      "success": {
+        "default": "#16a34a",
+        "subtle": "#f0fdf4"
+      },
+      "info": {
+        "default": "#3b82f6",
+        "subtle": "#eff6ff"
+      }
+    },
+    "surface": {
+      "default": "#ffffff",
+      "subtle": "#f9fafb",
+      "raised": "#ffffff"
+    },
+    "text": {
+      "primary": "#111827",
+      "secondary": "#4b5563",
+      "tertiary": "#9ca3af",
+      "disabled": "#d1d5db",
+      "inverse": "#ffffff",
+      "on-brand": "#ffffff"
+    },
+    "border": {
+      "default": "#e5e7eb",
+      "strong": "#9ca3af",
+      "focus": "#3b82f6",
+      "error": "#ef4444"
+    }
+  },
+  "motion": {
+    "duration": {
+      "instant": "0ms",
+      "fast": "100ms",
+      "normal": "200ms",
+      "slow": "300ms",
+      "slower": "500ms"
+    },
+    "easing": {
+      "default": "cubic-bezier(0.4, 0, 0.2, 1)",
+      "in": "cubic-bezier(0.4, 0, 1, 1)",
+      "out": "cubic-bezier(0, 0, 0.2, 1)",
+      "spring": "cubic-bezier(0.34, 1.56, 0.64, 1)"
+    }
+  },
+  "radius": {
+    "none": "0px",
+    "sm": "2px",
+    "md": "6px",
+    "lg": "8px",
+    "xl": "12px",
+    "full": "9999px",
+    "interactive": "6px",
+    "card": "8px"
+  },
+  "shadow": {
+    "0": "none",
+    "1": "0 1px 2px 0 rgb(0 0 0 / 0.05)",
+    "2": "0 1px 3px 0 rgb(0 0 0 / 0.10), 0 1px 2px -1px rgb(0 0 0 / 0.10)",
+    "3": "0 4px 6px -1px rgb(0 0 0 / 0.10), 0 2px 4px -2px rgb(0 0 0 / 0.10)",
+    "4": "0 10px 15px -3px rgb(0 0 0 / 0.10), 0 4px 6px -4px rgb(0 0 0 / 0.10)"
+  },
+  "spacing": {
+    "layout": {
+      "xs": "8px",
+      "sm": "16px",
+      "md": "24px",
+      "lg": "32px",
+      "xl": "48px"
+    },
+    "component": {
+      "xs": "4px",
+      "sm": "8px",
+      "md": "12px",
+      "lg": "16px",
+      "xl": "24px"
+    },
+    "inline": {
+      "xs": "4px",
+      "sm": "8px",
+      "md": "12px"
+    }
+  },
+  "button": {
+    "bg": {
+      "default": "#2563eb",
+      "hover": "#1d4ed8",
+      "disabled": "#f9fafb"
+    },
+    "text": {
+      "default": "#ffffff",
+      "disabled": "#d1d5db"
+    },
+    "border": {
+      "default": "#2563eb",
+      "focus": "#3b82f6"
+    },
+    "padding": {
+      "x": "16px",
+      "y": "12px"
+    },
+    "radius": "6px",
+    "font": {
+      "size": "14px",
+      "weight": "500"
+    }
+  },
+  "input": {
+    "bg": {
+      "default": "#ffffff",
+      "disabled": "#f9fafb"
+    },
+    "text": {
+      "default": "#111827",
+      "placeholder": "#9ca3af"
+    },
+    "border": {
+      "default": "#e5e7eb",
+      "hover": "#9ca3af",
+      "focus": "#3b82f6",
+      "error": "#ef4444"
+    },
+    "padding": {
+      "x": "16px",
+      "y": "12px"
+    },
+    "radius": "6px",
+    "font": {
+      "size": "14px"
+    }
+  }
+};
+var tokenMap = {
+  "typography.display.xl.size": "48px",
+  "typography.display.xl.line.height": "1.25",
+  "typography.heading.xl.size": "24px",
+  "typography.heading.lg.size": "20px",
+  "typography.heading.md.size": "18px",
+  "typography.body.lg.size": "16px",
+  "typography.body.md.size": "14px",
+  "typography.body.sm.size": "12px",
+  "typography.label.md.size": "14px",
+  "typography.label.md.weight": "500",
+  "typography.code.md.size": "14px",
+  "color.brand.primary.default": "#2563eb",
+  "color.brand.primary.hover": "#1d4ed8",
+  "color.brand.primary.subtle": "#eff6ff",
+  "color.brand.secondary.default": "#4b5563",
+  "color.feedback.error.default": "#dc2626",
+  "color.feedback.error.subtle": "#fef2f2",
+  "color.feedback.warning.default": "#f59e0b",
+  "color.feedback.warning.subtle": "#fffbeb",
+  "color.feedback.success.default": "#16a34a",
+  "color.feedback.success.subtle": "#f0fdf4",
+  "color.feedback.info.default": "#3b82f6",
+  "color.feedback.info.subtle": "#eff6ff",
+  "color.surface.default": "#ffffff",
+  "color.surface.subtle": "#f9fafb",
+  "color.surface.raised": "#ffffff",
+  "color.text.primary": "#111827",
+  "color.text.secondary": "#4b5563",
+  "color.text.tertiary": "#9ca3af",
+  "color.text.disabled": "#d1d5db",
+  "color.text.inverse": "#ffffff",
+  "color.text.on.brand": "#ffffff",
+  "color.border.default": "#e5e7eb",
+  "color.border.strong": "#9ca3af",
+  "color.border.focus": "#3b82f6",
+  "color.border.error": "#ef4444",
+  "motion.duration.instant": "0ms",
+  "motion.duration.fast": "100ms",
+  "motion.duration.normal": "200ms",
+  "motion.duration.slow": "300ms",
+  "motion.duration.slower": "500ms",
+  "motion.easing.default": "cubic-bezier(0.4, 0, 0.2, 1)",
+  "motion.easing.in": "cubic-bezier(0.4, 0, 1, 1)",
+  "motion.easing.out": "cubic-bezier(0, 0, 0.2, 1)",
+  "motion.easing.spring": "cubic-bezier(0.34, 1.56, 0.64, 1)",
+  "radius.none": "0px",
+  "radius.sm": "2px",
+  "radius.md": "6px",
+  "radius.lg": "8px",
+  "radius.xl": "12px",
+  "radius.full": "9999px",
+  "radius.interactive": "6px",
+  "radius.card": "8px",
+  "shadow.0": "none",
+  "shadow.1": "0 1px 2px 0 rgb(0 0 0 / 0.05)",
+  "shadow.2": "0 1px 3px 0 rgb(0 0 0 / 0.10), 0 1px 2px -1px rgb(0 0 0 / 0.10)",
+  "shadow.3": "0 4px 6px -1px rgb(0 0 0 / 0.10), 0 2px 4px -2px rgb(0 0 0 / 0.10)",
+  "shadow.4": "0 10px 15px -3px rgb(0 0 0 / 0.10), 0 4px 6px -4px rgb(0 0 0 / 0.10)",
+  "spacing.layout.xs": "8px",
+  "spacing.layout.sm": "16px",
+  "spacing.layout.md": "24px",
+  "spacing.layout.lg": "32px",
+  "spacing.layout.xl": "48px",
+  "spacing.component.xs": "4px",
+  "spacing.component.sm": "8px",
+  "spacing.component.md": "12px",
+  "spacing.component.lg": "16px",
+  "spacing.component.xl": "24px",
+  "spacing.inline.xs": "4px",
+  "spacing.inline.sm": "8px",
+  "spacing.inline.md": "12px",
+  "button.bg.default": "#2563eb",
+  "button.bg.hover": "#1d4ed8",
+  "button.bg.disabled": "#f9fafb",
+  "button.text.default": "#ffffff",
+  "button.text.disabled": "#d1d5db",
+  "button.border.default": "#2563eb",
+  "button.border.focus": "#3b82f6",
+  "button.padding.x": "16px",
+  "button.padding.y": "12px",
+  "button.radius": "6px",
+  "button.font.size": "14px",
+  "button.font.weight": "500",
+  "input.bg.default": "#ffffff",
+  "input.bg.disabled": "#f9fafb",
+  "input.text.default": "#111827",
+  "input.text.placeholder": "#9ca3af",
+  "input.border.default": "#e5e7eb",
+  "input.border.hover": "#9ca3af",
+  "input.border.focus": "#3b82f6",
+  "input.border.error": "#ef4444",
+  "input.padding.x": "16px",
+  "input.padding.y": "12px",
+  "input.radius": "6px",
+  "input.font.size": "14px"
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  tokenMap,
+  tokens
+});

package/dist/index.mjs

@@ -0,0 +1,295 @@
+// index.ts
+var tokens = {
+  "typography": {
+    "display": {
+      "xl": {
+        "size": "48px",
+        "line-height": "1.25"
+      }
+    },
+    "heading": {
+      "xl": {
+        "size": "24px"
+      },
+      "lg": {
+        "size": "20px"
+      },
+      "md": {
+        "size": "18px"
+      }
+    },
+    "body": {
+      "lg": {
+        "size": "16px"
+      },
+      "md": {
+        "size": "14px"
+      },
+      "sm": {
+        "size": "12px"
+      }
+    },
+    "label": {
+      "md": {
+        "size": "14px",
+        "weight": "500"
+      }
+    },
+    "code": {
+      "md": {
+        "size": "14px"
+      }
+    }
+  },
+  "color": {
+    "brand": {
+      "primary": {
+        "default": "#2563eb",
+        "hover": "#1d4ed8",
+        "subtle": "#eff6ff"
+      },
+      "secondary": {
+        "default": "#4b5563"
+      }
+    },
+    "feedback": {
+      "error": {
+        "default": "#dc2626",
+        "subtle": "#fef2f2"
+      },
+      "warning": {
+        "default": "#f59e0b",
+        "subtle": "#fffbeb"
+      },
+      "success": {
+        "default": "#16a34a",
+        "subtle": "#f0fdf4"
+      },
+      "info": {
+        "default": "#3b82f6",
+        "subtle": "#eff6ff"
+      }
+    },
+    "surface": {
+      "default": "#ffffff",
+      "subtle": "#f9fafb",
+      "raised": "#ffffff"
+    },
+    "text": {
+      "primary": "#111827",
+      "secondary": "#4b5563",
+      "tertiary": "#9ca3af",
+      "disabled": "#d1d5db",
+      "inverse": "#ffffff",
+      "on-brand": "#ffffff"
+    },
+    "border": {
+      "default": "#e5e7eb",
+      "strong": "#9ca3af",
+      "focus": "#3b82f6",
+      "error": "#ef4444"
+    }
+  },
+  "motion": {
+    "duration": {
+      "instant": "0ms",
+      "fast": "100ms",
+      "normal": "200ms",
+      "slow": "300ms",
+      "slower": "500ms"
+    },
+    "easing": {
+      "default": "cubic-bezier(0.4, 0, 0.2, 1)",
+      "in": "cubic-bezier(0.4, 0, 1, 1)",
+      "out": "cubic-bezier(0, 0, 0.2, 1)",
+      "spring": "cubic-bezier(0.34, 1.56, 0.64, 1)"
+    }
+  },
+  "radius": {
+    "none": "0px",
+    "sm": "2px",
+    "md": "6px",
+    "lg": "8px",
+    "xl": "12px",
+    "full": "9999px",
+    "interactive": "6px",
+    "card": "8px"
+  },
+  "shadow": {
+    "0": "none",
+    "1": "0 1px 2px 0 rgb(0 0 0 / 0.05)",
+    "2": "0 1px 3px 0 rgb(0 0 0 / 0.10), 0 1px 2px -1px rgb(0 0 0 / 0.10)",
+    "3": "0 4px 6px -1px rgb(0 0 0 / 0.10), 0 2px 4px -2px rgb(0 0 0 / 0.10)",
+    "4": "0 10px 15px -3px rgb(0 0 0 / 0.10), 0 4px 6px -4px rgb(0 0 0 / 0.10)"
+  },
+  "spacing": {
+    "layout": {
+      "xs": "8px",
+      "sm": "16px",
+      "md": "24px",
+      "lg": "32px",
+      "xl": "48px"
+    },
+    "component": {
+      "xs": "4px",
+      "sm": "8px",
+      "md": "12px",
+      "lg": "16px",
+      "xl": "24px"
+    },
+    "inline": {
+      "xs": "4px",
+      "sm": "8px",
+      "md": "12px"
+    }
+  },
+  "button": {
+    "bg": {
+      "default": "#2563eb",
+      "hover": "#1d4ed8",
+      "disabled": "#f9fafb"
+    },
+    "text": {
+      "default": "#ffffff",
+      "disabled": "#d1d5db"
+    },
+    "border": {
+      "default": "#2563eb",
+      "focus": "#3b82f6"
+    },
+    "padding": {
+      "x": "16px",
+      "y": "12px"
+    },
+    "radius": "6px",
+    "font": {
+      "size": "14px",
+      "weight": "500"
+    }
+  },
+  "input": {
+    "bg": {
+      "default": "#ffffff",
+      "disabled": "#f9fafb"
+    },
+    "text": {
+      "default": "#111827",
+      "placeholder": "#9ca3af"
+    },
+    "border": {
+      "default": "#e5e7eb",
+      "hover": "#9ca3af",
+      "focus": "#3b82f6",
+      "error": "#ef4444"
+    },
+    "padding": {
+      "x": "16px",
+      "y": "12px"
+    },
+    "radius": "6px",
+    "font": {
+      "size": "14px"
+    }
+  }
+};
+var tokenMap = {
+  "typography.display.xl.size": "48px",
+  "typography.display.xl.line.height": "1.25",
+  "typography.heading.xl.size": "24px",
+  "typography.heading.lg.size": "20px",
+  "typography.heading.md.size": "18px",
+  "typography.body.lg.size": "16px",
+  "typography.body.md.size": "14px",
+  "typography.body.sm.size": "12px",
+  "typography.label.md.size": "14px",
+  "typography.label.md.weight": "500",
+  "typography.code.md.size": "14px",
+  "color.brand.primary.default": "#2563eb",
+  "color.brand.primary.hover": "#1d4ed8",
+  "color.brand.primary.subtle": "#eff6ff",
+  "color.brand.secondary.default": "#4b5563",
+  "color.feedback.error.default": "#dc2626",
+  "color.feedback.error.subtle": "#fef2f2",
+  "color.feedback.warning.default": "#f59e0b",
+  "color.feedback.warning.subtle": "#fffbeb",
+  "color.feedback.success.default": "#16a34a",
+  "color.feedback.success.subtle": "#f0fdf4",
+  "color.feedback.info.default": "#3b82f6",
+  "color.feedback.info.subtle": "#eff6ff",
+  "color.surface.default": "#ffffff",
+  "color.surface.subtle": "#f9fafb",
+  "color.surface.raised": "#ffffff",
+  "color.text.primary": "#111827",
+  "color.text.secondary": "#4b5563",
+  "color.text.tertiary": "#9ca3af",
+  "color.text.disabled": "#d1d5db",
+  "color.text.inverse": "#ffffff",
+  "color.text.on.brand": "#ffffff",
+  "color.border.default": "#e5e7eb",
+  "color.border.strong": "#9ca3af",
+  "color.border.focus": "#3b82f6",
+  "color.border.error": "#ef4444",
+  "motion.duration.instant": "0ms",
+  "motion.duration.fast": "100ms",
+  "motion.duration.normal": "200ms",
+  "motion.duration.slow": "300ms",
+  "motion.duration.slower": "500ms",
+  "motion.easing.default": "cubic-bezier(0.4, 0, 0.2, 1)",
+  "motion.easing.in": "cubic-bezier(0.4, 0, 1, 1)",
+  "motion.easing.out": "cubic-bezier(0, 0, 0.2, 1)",
+  "motion.easing.spring": "cubic-bezier(0.34, 1.56, 0.64, 1)",
+  "radius.none": "0px",
+  "radius.sm": "2px",
+  "radius.md": "6px",
+  "radius.lg": "8px",
+  "radius.xl": "12px",
+  "radius.full": "9999px",
+  "radius.interactive": "6px",
+  "radius.card": "8px",
+  "shadow.0": "none",
+  "shadow.1": "0 1px 2px 0 rgb(0 0 0 / 0.05)",
+  "shadow.2": "0 1px 3px 0 rgb(0 0 0 / 0.10), 0 1px 2px -1px rgb(0 0 0 / 0.10)",
+  "shadow.3": "0 4px 6px -1px rgb(0 0 0 / 0.10), 0 2px 4px -2px rgb(0 0 0 / 0.10)",
+  "shadow.4": "0 10px 15px -3px rgb(0 0 0 / 0.10), 0 4px 6px -4px rgb(0 0 0 / 0.10)",
+  "spacing.layout.xs": "8px",
+  "spacing.layout.sm": "16px",
+  "spacing.layout.md": "24px",
+  "spacing.layout.lg": "32px",
+  "spacing.layout.xl": "48px",
+  "spacing.component.xs": "4px",
+  "spacing.component.sm": "8px",
+  "spacing.component.md": "12px",
+  "spacing.component.lg": "16px",
+  "spacing.component.xl": "24px",
+  "spacing.inline.xs": "4px",
+  "spacing.inline.sm": "8px",
+  "spacing.inline.md": "12px",
+  "button.bg.default": "#2563eb",
+  "button.bg.hover": "#1d4ed8",
+  "button.bg.disabled": "#f9fafb",
+  "button.text.default": "#ffffff",
+  "button.text.disabled": "#d1d5db",
+  "button.border.default": "#2563eb",
+  "button.border.focus": "#3b82f6",
+  "button.padding.x": "16px",
+  "button.padding.y": "12px",
+  "button.radius": "6px",
+  "button.font.size": "14px",
+  "button.font.weight": "500",
+  "input.bg.default": "#ffffff",
+  "input.bg.disabled": "#f9fafb",
+  "input.text.default": "#111827",
+  "input.text.placeholder": "#9ca3af",
+  "input.border.default": "#e5e7eb",
+  "input.border.hover": "#9ca3af",
+  "input.border.focus": "#3b82f6",
+  "input.border.error": "#ef4444",
+  "input.padding.x": "16px",
+  "input.padding.y": "12px",
+  "input.radius": "6px",
+  "input.font.size": "14px"
+};
+export {
+  tokenMap,
+  tokens
+};

package/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "@skye-ds/tokens-js",
+  "version": "0.1.1",
+  "description": "Antigravity design system — JS/TS token constants",
+  "license": "MIT",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    }
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsup"
+  }
+}