@phcdevworks/spectre-tokens 0.0.1 โ†’ 0.0.3

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.
package/README.md CHANGED
@@ -1,31 +1,18 @@
1
- # Spectre Tokens
1
+ # @phcdevworks/spectre-tokens
2
2
 
3
- **Spectre Tokens** is the foundational design layer of the **Spectre Suite** โ€” a token-driven design system that powers consistent styling across all Spectre projects.
3
+ Design-token source of truth that powers Spectre UI, Spectre Blocks, Spectre Astro, Spectre 11ty, and every future Spectre surface.
4
4
 
5
- It defines Spectre's visual identity through design tokens (colors, typography, spacing, radii, shadows, breakpoints, z-index, transitions) consumed by **Spectre UI**, **Spectre Blocks** (WordPress), **Spectre Astro**, **Spectre 11ty**, and future Spectre tools.
6
-
7
- > One token system. Many frameworks. Full consistency.
8
-
9
- ---
5
+ > ๐Ÿ“‹ **[View Roadmap](ROADMAP.md)** | ๐Ÿค **[Contributing Guide](CONTRIBUTING.md)** | ๐Ÿ“ **[Changelog](CHANGELOG.md)**
10
6
 
11
7
  ## Overview
12
8
 
13
- Spectre Tokens provides a centralized source of truth for design decisions across the entire Spectre ecosystem. Whether you're building WordPress blocks, static sites with Astro or 11ty, or future Spectre integrations, Spectre Tokens ensures your design language remains consistent and maintainable.
14
-
15
- ## Features
9
+ `@phcdevworks/spectre-tokens` defines Spectre's visual languageโ€”colors, typography, spacing, radii, shadows, breakpoints, z-index scales, transitions, and CRO-focused interaction states. The package turns the raw JSON tokens in `tokens/` into multiple consumption modes (JS, TS, Tailwind, CSS variables) so that teams can stay in sync regardless of framework. One token system runs the entire Spectre Suite; every other package simply consumes these values.
16
10
 
17
- - **Token-Driven Design**: Centralized design tokens for colors, typography, spacing, and more
18
- - **Cross-Platform**: Powers styling across WordPress, Astro, 11ty, and beyond
19
- - **Multiple Formats**: Export tokens as CSS variables, JSON, JavaScript, and more
20
- - **Type-Safe**: TypeScript definitions for all design tokens
21
- - **Themeable**: Easy customization and theming support
22
- - **Semantic Colors**: Built-in success, warning, error, and info color scales
23
- - **Responsive Design**: Consistent breakpoint tokens for all screen sizes
24
- - **Motion Design**: Transition duration and easing tokens for animations
25
- - **Z-Index Scale**: Organized layering system for consistent stacking
26
- - **CRO-Optimized**: Button variants, form states, and micro-interactions for higher conversions
27
- - **Accessibility First**: WCAG-compliant focus states and touch target guidelines
28
- - **Interaction States**: Opacity and state tokens for hover, active, disabled, and more
11
+ - โœ… Centralized token definitions and semantic naming
12
+ - โœ… JS/TS objects, Tailwind theme + preset, and CSS variable outputs
13
+ - โœ… CRO-focused surfaces (buttons, forms, states) and WCAG-first accessibility tokens
14
+ - โœ… Format-agnostic helpers for scoped CSS variable generation
15
+ - โœ… Type-safe outputs with bundled `.d.ts` files
29
16
 
30
17
  ## Installation
31
18
 
@@ -35,46 +22,71 @@ npm install @phcdevworks/spectre-tokens
35
22
 
36
23
  ## Usage
37
24
 
38
- Import Spectre Tokens into your project:
25
+ ### 1. Import tokens (JS/TS)
39
26
 
40
- ```javascript
41
- import tokens from "@phcdevworks/spectre-tokens";
27
+ ```ts
28
+ import tokens, {
29
+ tailwindTheme,
30
+ tailwindPreset,
31
+ generateCssVariables,
32
+ } from "@phcdevworks/spectre-tokens";
33
+
34
+ console.log(tokens.colors.brand["500"]); // Brand palette swatches
42
35
  ```
43
36
 
44
- Or use CSS variables directly:
37
+ - `tokens`: Raw structured tokens (colors, spacing, radii, typography, shadows, z-index, transitions, buttons, forms, accessibility, animations, opacity).
38
+ - `tailwindTheme`: Ready-to-use Tailwind theme object.
39
+ - `tailwindPreset`: Preset for Tailwind config (includes theme).
40
+ - `generateCssVariables()`: Generate custom `--sp-*` CSS variable strings with scoped selectors or prefixes.
41
+
42
+ ### 2. CSS variables
45
43
 
46
44
  ```css
47
- @import "@phcdevworks/spectre-tokens/css/tokens.css";
45
+ @import "@phcdevworks/spectre-tokens/dist/index.css";
48
46
 
49
- .my-component {
50
- color: var(--spectre-color-primary);
51
- padding: var(--spectre-spacing-4);
52
- border-radius: var(--spectre-radius-md);
47
+ .button {
48
+ color: var(--sp-color-brand-500);
49
+ padding-inline: var(--sp-space-md);
50
+ border-radius: var(--sp-radius-pill);
51
+ box-shadow: var(--sp-shadow-md);
53
52
  }
54
53
  ```
55
54
 
56
- ## CRO & Accessibility Features
55
+ To scope or re-prefix variables:
56
+
57
+ ```ts
58
+ const css = generateCssVariables(tokens, {
59
+ selector: ".spectre-scope",
60
+ prefix: "sp",
61
+ });
62
+ ```
57
63
 
58
- ### Button Variants (Conversion-Optimized)
64
+ ### 3. Tailwind integration
59
65
 
60
- Spectre Tokens includes pre-designed button variants optimized for conversion rate optimization:
66
+ ```ts
67
+ // tailwind.config.ts
68
+ import { tailwindPreset } from "@phcdevworks/spectre-tokens";
61
69
 
62
- ```javascript
63
- // Available button variants
64
- tokens.buttons.primary; // High-contrast primary CTA
65
- tokens.buttons.secondary; // Outlined secondary action
66
- tokens.buttons.ghost; // Minimal tertiary action
67
- tokens.buttons.danger; // Destructive actions
68
- tokens.buttons.success; // Positive confirmation
70
+ export default {
71
+ presets: [tailwindPreset],
72
+ };
69
73
  ```
70
74
 
71
- Each variant includes full state coverage:
75
+ Works with Tailwind 3.x and 4.x through the classic config API; no Oxide lock-in required.
76
+
77
+ ## Token Surfaces
72
78
 
73
- - `bg`, `bgHover`, `bgActive`, `bgDisabled`
74
- - `text`, `textDisabled`
75
- - `border`, `borderDisabled` (for outlined variants)
79
+ ### Conversion-ready button variants
80
+
81
+ ```ts
82
+ tokens.buttons.primary; // CTA baseline
83
+ tokens.buttons.secondary; // Outlined
84
+ tokens.buttons.ghost; // Low-emphasis
85
+ tokens.buttons.danger; // Destructive
86
+ tokens.buttons.success; // Confirmations
87
+ ```
76
88
 
77
- **CSS Usage:**
89
+ Each variant ships with `bg`, `bgHover`, `bgActive`, `bgDisabled`, `text`, `textDisabled`, `border`, and `borderDisabled`, ensuring consistent CRO states.
78
90
 
79
91
  ```css
80
92
  .cta-button {
@@ -86,26 +98,18 @@ Each variant includes full state coverage:
86
98
  }
87
99
  ```
88
100
 
89
- ### Form States (Validation & Feedback)
101
+ ### Form states (validation + UX)
90
102
 
91
- Complete form state tokens for clear user feedback:
92
-
93
- ```javascript
94
- tokens.forms.default; // Initial state
95
- tokens.forms.hover; // Mouse hover
96
- tokens.forms.focus; // Keyboard focus
97
- tokens.forms.valid; // Successful validation
98
- tokens.forms.invalid; // Error state
99
- tokens.forms.disabled; // Non-interactive
103
+ ```ts
104
+ tokens.forms.default;
105
+ tokens.forms.hover;
106
+ tokens.forms.focus;
107
+ tokens.forms.valid;
108
+ tokens.forms.invalid;
109
+ tokens.forms.disabled;
100
110
  ```
101
111
 
102
- **CSS Usage:**
103
-
104
112
  ```css
105
- .input {
106
- background: var(--sp-form-default-bg);
107
- border: 1px solid var(--sp-form-default-border);
108
- }
109
113
  .input:focus {
110
114
  border-color: var(--sp-form-focus-border);
111
115
  outline: var(--sp-focus-ring-width) var(--sp-focus-ring-style) var(--sp-form-focus-ring);
@@ -116,49 +120,30 @@ tokens.forms.disabled; // Non-interactive
116
120
  }
117
121
  ```
118
122
 
119
- ### Accessibility Standards
120
-
121
- Built-in WCAG compliance helpers:
123
+ ### Accessibility helpers
122
124
 
123
- ```javascript
125
+ ```ts
124
126
  tokens.accessibility.focusRing.width; // 2px
125
127
  tokens.accessibility.focusRing.offset; // 2px
126
128
  tokens.accessibility.minTouchTarget; // 44px (WCAG 2.5.5)
127
129
  tokens.accessibility.minTextSize; // 16px
128
- ```
129
-
130
- **Focus Colors:**
131
-
132
- ```javascript
133
- tokens.colors.focus.primary; // Brand-aligned focus ring
130
+ tokens.colors.focus.primary; // Brand-aligned focus
134
131
  tokens.colors.focus.error; // Error state focus
135
132
  tokens.colors.focus.info; // Info state focus
136
133
  ```
137
134
 
138
- ### Micro-Interactions & Animations
135
+ ### Motion & micro-interactions
139
136
 
140
- Pre-configured animations for engagement:
141
-
142
- ```javascript
143
- tokens.animations.fadeIn; // Subtle entrance
144
- tokens.animations.slideDown; // Dropdown reveal
145
- tokens.animations.scaleIn; // Modal/tooltip appearance
146
- tokens.animations.bounce; // Success feedback
147
- tokens.animations.shake; // Error feedback
148
- tokens.animations.pulse; // Loading state
137
+ ```ts
138
+ tokens.animations.fadeIn;
139
+ tokens.animations.slideDown;
140
+ tokens.animations.scaleIn;
141
+ tokens.animations.bounce;
142
+ tokens.animations.shake;
143
+ tokens.animations.pulse;
149
144
  ```
150
145
 
151
- **CSS Usage:**
152
-
153
146
  ```css
154
- @keyframes fade-in {
155
- from {
156
- opacity: 0;
157
- }
158
- to {
159
- opacity: 1;
160
- }
161
- }
162
147
  .modal {
163
148
  animation: fade-in var(--sp-animation-fade-in-duration) var(
164
149
  --sp-animation-fade-in-easing
@@ -166,133 +151,103 @@ tokens.animations.pulse; // Loading state
166
151
  }
167
152
  ```
168
153
 
169
- ### Opacity Tokens
170
-
171
- Consistent interaction opacity:
154
+ ### Opacity scale
172
155
 
173
- ```javascript
174
- tokens.opacity.hover; // 0.92 - Subtle hover
175
- tokens.opacity.active; // 0.84 - Active press
176
- tokens.opacity.disabled; // 0.38 - Disabled state (WCAG compliant)
177
- tokens.opacity.overlay; // 0.5 - Modal overlays
156
+ ```ts
157
+ tokens.opacity.hover; // 0.92
158
+ tokens.opacity.active; // 0.84
159
+ tokens.opacity.disabled; // 0.38
160
+ tokens.opacity.overlay; // 0.5
178
161
  ```
179
162
 
180
- ### WCAG Contrast Guidelines
163
+ ### WCAG targets
181
164
 
182
- **Primary Colors:**
165
+ - Brand 500 on white โ†’ โœ… AAA (4.8:1)
166
+ - Success 600 on white โ†’ โœ… AAA (4.7:1)
167
+ - Error 600 on white โ†’ โœ… AAA (5.2:1)
168
+ - Neutral 900 on white โ†’ โœ… AAA (16.1:1)
169
+ - Neutral 700 on white โ†’ โœ… AA (8.4:1)
170
+ - Focus rings meet WCAG 2.4.7 (2px solid, high contrast)
183
171
 
184
- - Brand 500 on white: โœ… AAA (contrast ratio 4.8:1)
185
- - Success 600 on white: โœ… AAA (contrast ratio 4.7:1)
186
- - Error 600 on white: โœ… AAA (contrast ratio 5.2:1)
172
+ Always re-run final UI implementations through tools like [WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/).
187
173
 
188
- **Text Colors:**
174
+ ## Surface & Typography Roles
189
175
 
190
- - Neutral 900 on white: โœ… AAA (contrast ratio 16.1:1)
191
- - Neutral 700 on white: โœ… AA (contrast ratio 8.4:1)
176
+ - `surface.page`, `surface.card`, `surface.input`, `surface.overlay`: semantic backgrounds for the app canvas, containers/tiles, form fields, and modal/dropdown layers.
177
+ - `text.onPage.*` vs `text.onSurface.*`: use `onPage` for copy sitting directly on the page canvas; use `onSurface` for text inside cards, tiles, inputs, overlays, and other elevated surfaces.
178
+ - `component.card.text`/`textMuted`, `component.input.text`/`placeholder`, and `component.button.textDefault`/`textOnPrimary` alias the underlying `text.onSurface` roles (with `textOnPrimary` pairing white against the primary button background) to keep component defaults aligned.
192
179
 
193
- **Focus Indicators:**
194
-
195
- - All focus rings meet WCAG 2.4.7 (2px solid, high contrast)
196
-
197
- > **Note:** Always test final implementations with contrast checking tools like [WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/).
198
-
199
- ---
200
-
201
- ## Part of the Spectre Suite
202
-
203
- - **Spectre Tokens**: Design token foundation (this package)
204
- - **Spectre UI**: Core styling layer
205
- - **Spectre Blocks**: WordPress block library
206
- - **Spectre Astro**: Astro integration
207
- - **Spectre 11ty**: Eleventy integration
208
-
209
- ## License
210
-
211
- MIT
212
-
213
- ## Contributing
214
-
215
- Contributions are welcome! Please open an issue or submit a pull request.
216
-
217
- ---
218
-
219
- ## Repository layout
180
+ ## Repository Layout
220
181
 
221
182
  | Folder | Responsibility |
222
183
  | ---------- | ------------------------------------------------------------------------------------------------------------- |
223
- | `tokens/` | Raw JSON tokens owned by design. `core.json` holds colors, spacing, radii, typography scale, and shadows. |
224
- | `src/` | TypeScript source that turns JSON into reusable formats (JS/TS objects, Tailwind theme, CSS helpers). |
184
+ | `tokens/` | Raw JSON tokens owned by design. `core.json` holds colors, spacing, radii, typography scales, and shadows. |
185
+ | `src/` | TypeScript source that turns JSON into reusable formats (JS/TS exports, Tailwind theme, CSS helpers). |
225
186
  | `scripts/` | Build utilities. `build-css.js` consumes the compiled library and writes `dist/index.css`. |
226
187
  | `dist/` | Generated artifacts: `index.js`, `index.cjs`, `index.d.ts`, and `index.css`. Regenerated via `npm run build`. |
227
188
 
228
- Designers only edit `tokens/`. Engineering evolves `src/` + `scripts/` when structure changes.
189
+ Designers only touch the JSON under `tokens/`. Engineering evolves `src/` + `scripts/` when structure changes.
229
190
 
230
- ---
191
+ ## Build & Release
231
192
 
232
- ## Consuming the tokens
193
+ ```bash
194
+ npm run build
195
+ ```
233
196
 
234
- ### Programmatic access (JS/TS)
197
+ `tsup` compiles the TypeScript library (ESM, CJS, `.d.ts`) and `scripts/build-css.js` emits `dist/index.css`. Because `dist/` is generated, releases are reproducible from `tokens/` + `src/`.
235
198
 
236
- ```ts
237
- import tokens, {
238
- tailwindTheme,
239
- tailwindPreset,
240
- generateCssVariables,
241
- } from "@phcdevworks/spectre-tokens";
199
+ For release history and version notes, see the **[Changelog](CHANGELOG.md)**.
242
200
 
243
- // Raw structured tokens (colors, spacing, radii, typography, shadows)
244
- console.log(tokens.colors.brand["500"]);
201
+ ## Design Principles
245
202
 
246
- // Tailwind-ready theme or preset drop-in
247
- export default {
248
- theme: tailwindTheme,
249
- presets: [tailwindPreset],
250
- };
251
-
252
- // Generic CSS variable string if you want custom selectors or prefixes
253
- const css = generateCssVariables(tokens, {
254
- selector: ".spectre-scope",
255
- prefix: "sp",
256
- });
257
- ```
203
+ 1. **Single source of truth** โ€“ Tokens originate in JSON and flow into every runtime surface.
204
+ 2. **Format-agnostic** โ€“ Consumers choose JS objects, CSS variables, Tailwind presets, or generated strings.
205
+ 3. **Framework-neutral** โ€“ Works in WordPress, Astro, 11ty, React, or any environment that can ingest CSS/JS.
206
+ 4. **Accessibility-first** โ€“ Focus rings, touch targets, and contrast targets are encoded directly in tokens.
207
+ 5. **CRO-aware** โ€“ Buttons, forms, and state tokens are tuned for real-world conversion funnels.
258
208
 
259
- ### CSS variables
209
+ ## TypeScript Support
260
210
 
261
- Include the generated CSS file to get `--sp-*` variables anywhere:
211
+ Type definitions are bundled automatically:
262
212
 
263
- ```css
264
- @import "@phcdevworks/spectre-tokens/index.css";
213
+ ```ts
214
+ import type {
215
+ Tokens,
216
+ SpectreTokens,
217
+ TailwindTheme,
218
+ ColorScale,
219
+ ButtonStateTokens,
220
+ FormStateTokens,
221
+ } from "@phcdevworks/spectre-tokens";
265
222
 
266
- .button {
267
- color: var(--sp-color-brand-500);
268
- padding-inline: var(--sp-space-md);
269
- border-radius: var(--sp-radius-pill);
270
- box-shadow: var(--sp-shadow-md);
271
- }
223
+ const allTokens: SpectreTokens = tokens;
272
224
  ```
273
225
 
274
- ---
226
+ ## Part of the Spectre Suite
275
227
 
276
- ## Tailwind compatibility
228
+ - **Spectre Tokens** โ€“ Design-token foundation (this package)
229
+ - **Spectre UI** โ€“ Core styling layer
230
+ - **Spectre Blocks** โ€“ WordPress block library
231
+ - **Spectre Astro** โ€“ Astro integration
232
+ - **Spectre 11ty** โ€“ Eleventy integration
277
233
 
278
- This package exposes a Tailwind-style theme object and a preset wrapper built with the classic Tailwind config shape (`theme.extend` with colors, spacing, font families, etc.). Tailwind CSS v4 introduces the Oxide engine and optional token-centric workflows, but it still supports the traditional `tailwind.config.(js|cjs|mjs|ts)` file, theme configuration, and presets. You can continue to consume `tailwindPreset` or spread `tailwindTheme` in both Tailwind 3 and Tailwind 4 projects without changes.
234
+ For the project's future direction, see the **[Roadmap](ROADMAP.md)**.
279
235
 
280
- When Tailwindโ€™s new token-first features stabilize, we may add an additional export that serializes `tokens/core.json` into whatever public token schema Tailwind ships. Until then, treat this library as a conventional Tailwind theme/preset provider that uses the stable config-based API.
236
+ ## Contributing
237
+
238
+ Issues and pull requests are welcome. If you are proposing token changes, update `tokens/` and include regenerated builds.
281
239
 
282
- Engineering guidance:
240
+ For detailed contribution guidelines, see **[CONTRIBUTING.md](CONTRIBUTING.md)**.
283
241
 
284
- - Primary integration: keep exporting `tailwindTheme` (Spectre theme contents) and `tailwindPreset` (for `presets: []`).
285
- - Support Tailwind 3.x and 4.x via the classic config API; avoid depending on v4-specific internals or JSON token formats.
286
- - Future (optional): layer on a token-native export once Tailwindโ€™s token workflows are documented and stable, without removing the preset interface.
242
+ ## License
287
243
 
288
- Public messaging across Spectre projects should stay simple: โ€œWorks with Tailwind 3 and 4 via the standard config-based API. We export a theme and preset; plug it in like any other Tailwind preset. When Tailwindโ€™s token workflow is ready, weโ€™ll offer an additional integration.โ€
244
+ MIT ยฉ PHCDevworks โ€” See **[LICENSE](LICENSE)** for details.
289
245
 
290
246
  ---
291
247
 
292
- ## Build & release
248
+ ## โค๏ธ Support Spectre
293
249
 
294
- ```
295
- npm run build
296
- ```
250
+ If Spectre Tokens helps your workflow, consider sponsoring:
297
251
 
298
- This command bundles the TypeScript library with `tsup` (ESM + CJS + `.d.ts`) and then calls `scripts/build-css.js` to emit `dist/index.css`. Because `dist/` is fully generated, publishing is reproducible from `tokens/` + `src/`.
252
+ - [GitHub Sponsors](https://github.com/sponsors/phcdevworks)
253
+ - [Buy Me a Coffee](https://buymeacoffee.com/phcdevworks)
package/dist/index.cjs CHANGED
@@ -20,8 +20,6 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
20
20
  // src/index.ts
21
21
  var index_exports = {};
22
22
  __export(index_exports, {
23
- createCssVariableMap: () => createCssVariableMap,
24
- createTailwindTheme: () => createTailwindTheme,
25
23
  default: () => index_default,
26
24
  generateCssVariables: () => generateCssVariables,
27
25
  tailwindPreset: () => tailwindPreset,
@@ -123,6 +121,60 @@ var core_default = {
123
121
  info: "#3b82f6"
124
122
  }
125
123
  },
124
+ surface: {
125
+ page: {
126
+ value: "#0f172a",
127
+ description: "primary app background"
128
+ },
129
+ card: {
130
+ value: "#1e293b",
131
+ description: "containers and tiles"
132
+ },
133
+ input: {
134
+ value: "#334155",
135
+ description: "form inputs, textareas"
136
+ },
137
+ overlay: {
138
+ value: "#1e293b",
139
+ description: "modals, dropdowns, flyouts"
140
+ }
141
+ },
142
+ text: {
143
+ onPage: {
144
+ default: "#f8fafc",
145
+ muted: "#cbd5f5",
146
+ subtle: "#94a3b8"
147
+ },
148
+ onSurface: {
149
+ default: "#f1f5f9",
150
+ muted: "#cbd5f5",
151
+ subtle: "#94a3b8"
152
+ }
153
+ },
154
+ component: {
155
+ card: {
156
+ text: "#f1f5f9",
157
+ textMuted: "#cbd5f5"
158
+ },
159
+ input: {
160
+ text: "#f1f5f9",
161
+ placeholder: "#94a3b8"
162
+ },
163
+ button: {
164
+ textDefault: "#f1f5f9",
165
+ textOnPrimary: "#ffffff"
166
+ }
167
+ },
168
+ modes: {
169
+ default: {
170
+ surface: {},
171
+ text: {}
172
+ },
173
+ dark: {
174
+ surface: {},
175
+ text: {}
176
+ }
177
+ },
126
178
  opacity: {
127
179
  disabled: "0.38",
128
180
  hover: "0.92",
@@ -233,6 +285,10 @@ var core_default = {
233
285
  lg: "8px",
234
286
  pill: "999px"
235
287
  },
288
+ borders: {
289
+ card: "#334155",
290
+ input: "#cbd5f5"
291
+ },
236
292
  typography: {
237
293
  families: {
238
294
  sans: "'Inter', 'Helvetica Neue', Arial, sans-serif",
@@ -491,8 +547,6 @@ var tailwindPreset = {
491
547
  var index_default = tokens;
492
548
  // Annotate the CommonJS export names for ESM import in node:
493
549
  0 && (module.exports = {
494
- createCssVariableMap,
495
- createTailwindTheme,
496
550
  generateCssVariables,
497
551
  tailwindPreset,
498
552
  tailwindTheme,
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../tokens/core.json","../src/css.ts"],"sourcesContent":["import coreTokens from '../tokens/core.json';\n\nimport { createCssVariableMap, generateCssVariables } from './css';\nimport type { TailwindTheme, Tokens } from './types';\n\nexport type { TailwindTheme, Tokens, ColorScale, TokenScale, TypographyTokens, TransitionTokens, AccessibilityTokens, ButtonStateTokens, FormStateTokens, AnimationEntry } from './types';\n\nconst tokens: Tokens = coreTokens as Tokens;\n\nconst sanitizeFontFamily = (value: string): string[] =>\n value\n .split(',')\n .map((segment) => segment.trim().replace(/^['\"]|['\"]$/g, ''))\n .filter(Boolean);\n\nexport const createTailwindTheme = (source: Tokens = tokens): TailwindTheme => {\n const colors: TailwindTheme['colors'] = {};\n Object.entries(source.colors).forEach(([group, scale]) => {\n colors[group] = { ...scale };\n });\n\n const fontFamily = Object.entries(source.typography.families).reduce<Record<string, string[]>>((acc, [key, value]) => {\n acc[key] = sanitizeFontFamily(value);\n return acc;\n }, {});\n\n const fontSize = Object.entries(source.typography.scale).reduce<TailwindTheme['fontSize']>((acc, [key, entry]) => {\n acc[key] = [\n entry.fontSize,\n {\n lineHeight: entry.lineHeight,\n ...(entry.fontWeight ? { fontWeight: entry.fontWeight } : {}),\n ...(entry.letterSpacing ? { letterSpacing: entry.letterSpacing } : {})\n }\n ];\n return acc;\n }, {});\n\n return {\n colors,\n spacing: { ...source.spacing },\n borderRadius: { ...source.radii },\n fontFamily,\n fontSize,\n boxShadow: { ...source.shadows },\n screens: { ...source.breakpoints },\n zIndex: { ...source.zIndex },\n transitionDuration: { ...source.transitions.duration },\n transitionTimingFunction: { ...source.transitions.easing },\n opacity: { ...source.opacity }\n };\n};\n\nexport const tailwindTheme = createTailwindTheme(tokens);\nexport const tailwindPreset = {\n theme: tailwindTheme\n};\n\nexport { tokens, createCssVariableMap, generateCssVariables };\nexport default tokens;\n","{\n \"colors\": {\n \"brand\": {\n \"50\": \"#f5f0ff\",\n \"100\": \"#ebe2ff\",\n \"200\": \"#d7c6ff\",\n \"300\": \"#bfa1ff\",\n \"400\": \"#a37aff\",\n \"500\": \"#8652ff\",\n \"600\": \"#6c32e6\",\n \"700\": \"#5626b4\",\n \"800\": \"#3d1b7f\",\n \"900\": \"#241147\"\n },\n \"neutral\": {\n \"50\": \"#f8fafc\",\n \"100\": \"#f1f5f9\",\n \"200\": \"#e2e8f0\",\n \"300\": \"#cbd5f5\",\n \"400\": \"#94a3b8\",\n \"500\": \"#64748b\",\n \"600\": \"#475569\",\n \"700\": \"#334155\",\n \"800\": \"#1e293b\",\n \"900\": \"#0f172a\"\n },\n \"accent\": {\n \"50\": \"#e5fff8\",\n \"100\": \"#b8ffed\",\n \"200\": \"#89ffe1\",\n \"300\": \"#59ffd6\",\n \"400\": \"#29ffca\",\n \"500\": \"#03e6b3\",\n \"600\": \"#00b389\",\n \"700\": \"#008060\",\n \"800\": \"#004d38\",\n \"900\": \"#002a20\"\n },\n \"success\": {\n \"50\": \"#f0fdf4\",\n \"100\": \"#dcfce7\",\n \"200\": \"#bbf7d0\",\n \"300\": \"#86efac\",\n \"400\": \"#4ade80\",\n \"500\": \"#22c55e\",\n \"600\": \"#16a34a\",\n \"700\": \"#15803d\",\n \"800\": \"#166534\",\n \"900\": \"#14532d\"\n },\n \"warning\": {\n \"50\": \"#fffbeb\",\n \"100\": \"#fef3c7\",\n \"200\": \"#fde68a\",\n \"300\": \"#fcd34d\",\n \"400\": \"#fbbf24\",\n \"500\": \"#f59e0b\",\n \"600\": \"#d97706\",\n \"700\": \"#b45309\",\n \"800\": \"#92400e\",\n \"900\": \"#78350f\"\n },\n \"error\": {\n \"50\": \"#fef2f2\",\n \"100\": \"#fee2e2\",\n \"200\": \"#fecaca\",\n \"300\": \"#fca5a5\",\n \"400\": \"#f87171\",\n \"500\": \"#ef4444\",\n \"600\": \"#dc2626\",\n \"700\": \"#b91c1c\",\n \"800\": \"#991b1b\",\n \"900\": \"#7f1d1d\"\n },\n \"info\": {\n \"50\": \"#eff6ff\",\n \"100\": \"#dbeafe\",\n \"200\": \"#bfdbfe\",\n \"300\": \"#93c5fd\",\n \"400\": \"#60a5fa\",\n \"500\": \"#3b82f6\",\n \"600\": \"#2563eb\",\n \"700\": \"#1d4ed8\",\n \"800\": \"#1e40af\",\n \"900\": \"#1e3a8a\"\n },\n \"focus\": {\n \"primary\": \"#8652ff\",\n \"error\": \"#ef4444\",\n \"info\": \"#3b82f6\"\n }\n },\n \"opacity\": {\n \"disabled\": \"0.38\",\n \"hover\": \"0.92\",\n \"active\": \"0.84\",\n \"focus\": \"1\",\n \"overlay\": \"0.5\",\n \"tooltip\": \"0.95\"\n },\n \"accessibility\": {\n \"focusRing\": {\n \"width\": \"2px\",\n \"offset\": \"2px\",\n \"style\": \"solid\"\n },\n \"minTouchTarget\": \"44px\",\n \"minTextSize\": \"16px\"\n },\n \"buttons\": {\n \"primary\": {\n \"bg\": \"#8652ff\",\n \"bgHover\": \"#6c32e6\",\n \"bgActive\": \"#5626b4\",\n \"bgDisabled\": \"#cbd5f5\",\n \"text\": \"#ffffff\",\n \"textDisabled\": \"#94a3b8\"\n },\n \"secondary\": {\n \"bg\": \"#ffffff\",\n \"bgHover\": \"#f1f5f9\",\n \"bgActive\": \"#e2e8f0\",\n \"bgDisabled\": \"#f8fafc\",\n \"text\": \"#8652ff\",\n \"textDisabled\": \"#94a3b8\",\n \"border\": \"#8652ff\",\n \"borderDisabled\": \"#cbd5f5\"\n },\n \"ghost\": {\n \"bg\": \"transparent\",\n \"bgHover\": \"#f5f0ff\",\n \"bgActive\": \"#ebe2ff\",\n \"bgDisabled\": \"transparent\",\n \"text\": \"#8652ff\",\n \"textDisabled\": \"#94a3b8\"\n },\n \"danger\": {\n \"bg\": \"#ef4444\",\n \"bgHover\": \"#dc2626\",\n \"bgActive\": \"#b91c1c\",\n \"bgDisabled\": \"#fecaca\",\n \"text\": \"#ffffff\",\n \"textDisabled\": \"#94a3b8\"\n },\n \"success\": {\n \"bg\": \"#22c55e\",\n \"bgHover\": \"#16a34a\",\n \"bgActive\": \"#15803d\",\n \"bgDisabled\": \"#bbf7d0\",\n \"text\": \"#ffffff\",\n \"textDisabled\": \"#94a3b8\"\n }\n },\n \"forms\": {\n \"default\": {\n \"bg\": \"#ffffff\",\n \"border\": \"#cbd5f5\",\n \"text\": \"#0f172a\",\n \"placeholder\": \"#94a3b8\"\n },\n \"hover\": {\n \"border\": \"#8652ff\"\n },\n \"focus\": {\n \"border\": \"#8652ff\",\n \"ring\": \"#8652ff\"\n },\n \"valid\": {\n \"border\": \"#22c55e\",\n \"bg\": \"#f0fdf4\",\n \"text\": \"#15803d\"\n },\n \"invalid\": {\n \"border\": \"#ef4444\",\n \"bg\": \"#fef2f2\",\n \"text\": \"#b91c1c\"\n },\n \"disabled\": {\n \"bg\": \"#f8fafc\",\n \"border\": \"#e2e8f0\",\n \"text\": \"#94a3b8\"\n }\n },\n \"spacing\": {\n \"none\": \"0rem\",\n \"3xs\": \"0.125rem\",\n \"2xs\": \"0.25rem\",\n \"xs\": \"0.5rem\",\n \"sm\": \"0.75rem\",\n \"md\": \"1rem\",\n \"lg\": \"1.5rem\",\n \"xl\": \"2rem\",\n \"2xl\": \"3rem\",\n \"3xl\": \"4rem\"\n },\n \"radii\": {\n \"none\": \"0\",\n \"sm\": \"2px\",\n \"md\": \"4px\",\n \"lg\": \"8px\",\n \"pill\": \"999px\"\n },\n \"typography\": {\n \"families\": {\n \"sans\": \"'Inter', 'Helvetica Neue', Arial, sans-serif\",\n \"serif\": \"'Spectre Serif', 'Georgia', serif\",\n \"mono\": \"'JetBrains Mono', 'SFMono-Regular', Consolas, monospace\"\n },\n \"scale\": {\n \"xs\": {\n \"fontSize\": \"0.75rem\",\n \"lineHeight\": \"1.25rem\",\n \"fontWeight\": 400,\n \"letterSpacing\": \"0.02em\"\n },\n \"sm\": {\n \"fontSize\": \"0.875rem\",\n \"lineHeight\": \"1.5rem\",\n \"fontWeight\": 400\n },\n \"md\": {\n \"fontSize\": \"1rem\",\n \"lineHeight\": \"1.75rem\",\n \"fontWeight\": 500\n },\n \"lg\": {\n \"fontSize\": \"1.25rem\",\n \"lineHeight\": \"2rem\",\n \"fontWeight\": 600\n },\n \"xl\": {\n \"fontSize\": \"1.5rem\",\n \"lineHeight\": \"2.125rem\",\n \"fontWeight\": 600\n },\n \"2xl\": {\n \"fontSize\": \"1.875rem\",\n \"lineHeight\": \"2.5rem\",\n \"fontWeight\": 700\n },\n \"3xl\": {\n \"fontSize\": \"2.25rem\",\n \"lineHeight\": \"2.75rem\",\n \"fontWeight\": 700\n }\n }\n },\n \"shadows\": {\n \"none\": \"none\",\n \"sm\": \"0 1px 2px 0 rgba(15, 23, 42, 0.08)\",\n \"md\": \"0 3px 8px -1px rgba(15, 23, 42, 0.1)\",\n \"lg\": \"0 8px 20px -4px rgba(15, 23, 42, 0.18)\"\n },\n \"breakpoints\": {\n \"sm\": \"640px\",\n \"md\": \"768px\",\n \"lg\": \"1024px\",\n \"xl\": \"1280px\",\n \"2xl\": \"1536px\"\n },\n \"zIndex\": {\n \"base\": \"0\",\n \"dropdown\": \"1000\",\n \"sticky\": \"1100\",\n \"fixed\": \"1200\",\n \"overlay\": \"1300\",\n \"modal\": \"1400\",\n \"popover\": \"1500\",\n \"tooltip\": \"1600\"\n },\n \"transitions\": {\n \"duration\": {\n \"instant\": \"75ms\",\n \"fast\": \"150ms\",\n \"base\": \"200ms\",\n \"moderate\": \"300ms\",\n \"slow\": \"500ms\",\n \"slower\": \"700ms\"\n },\n \"easing\": {\n \"linear\": \"linear\",\n \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"spring\": \"cubic-bezier(0.34, 1.56, 0.64, 1)\"\n }\n },\n \"animations\": {\n \"fadeIn\": {\n \"duration\": \"200ms\",\n \"easing\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"keyframes\": \"fade-in\"\n },\n \"fadeOut\": {\n \"duration\": \"150ms\",\n \"easing\": \"cubic-bezier(0.4, 0, 1, 1)\",\n \"keyframes\": \"fade-out\"\n },\n \"slideUp\": {\n \"duration\": \"300ms\",\n \"easing\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"keyframes\": \"slide-up\"\n },\n \"slideDown\": {\n \"duration\": \"300ms\",\n \"easing\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"keyframes\": \"slide-down\"\n },\n \"scaleIn\": {\n \"duration\": \"200ms\",\n \"easing\": \"cubic-bezier(0.34, 1.56, 0.64, 1)\",\n \"keyframes\": \"scale-in\"\n },\n \"bounce\": {\n \"duration\": \"500ms\",\n \"easing\": \"cubic-bezier(0.34, 1.56, 0.64, 1)\",\n \"keyframes\": \"bounce\"\n },\n \"shake\": {\n \"duration\": \"400ms\",\n \"easing\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"keyframes\": \"shake\"\n },\n \"pulse\": {\n \"duration\": \"1500ms\",\n \"easing\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"keyframes\": \"pulse\"\n }\n }\n}\n","import type { CssVariableMap, CssVariableOptions, Tokens } from './types';\n\nconst DEFAULT_PREFIX = 'sp';\nexport const DEFAULT_SELECTOR = ':root';\n\nconst formatKey = (segment: string): string =>\n segment\n .replace(/[^a-z0-9]+/gi, '-')\n .replace(/^-+|-+$/g, '')\n .toLowerCase();\n\nconst toVariableName = (prefix: string, ...parts: string[]): string => {\n const filtered = parts.filter(Boolean).map(formatKey);\n return `--${prefix}-${filtered.join('-')}`;\n};\n\nexport const createCssVariableMap = (tokens: Tokens, options: CssVariableOptions = {}): CssVariableMap => {\n const prefix = options.prefix ?? DEFAULT_PREFIX;\n const map: CssVariableMap = {};\n\n const assign = (name: string, value: string | number | undefined) => {\n if (value === undefined) return;\n map[name] = String(value);\n };\n\n Object.entries(tokens.colors).forEach(([group, scale]) => {\n Object.entries(scale).forEach(([step, value]) => {\n assign(toVariableName(prefix, 'color', group, step), value);\n });\n });\n\n Object.entries(tokens.spacing).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'space', key), value);\n });\n\n Object.entries(tokens.radii).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'radius', key), value);\n });\n\n Object.entries(tokens.typography.families).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'font-family', key), value);\n });\n\n Object.entries(tokens.typography.scale).forEach(([key, entry]) => {\n assign(toVariableName(prefix, 'font', key, 'size'), entry.fontSize);\n assign(toVariableName(prefix, 'font', key, 'line-height'), entry.lineHeight);\n assign(toVariableName(prefix, 'font', key, 'weight'), entry.fontWeight);\n assign(toVariableName(prefix, 'font', key, 'letter-spacing'), entry.letterSpacing);\n });\n\n Object.entries(tokens.shadows).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'shadow', key), value);\n });\n\n Object.entries(tokens.breakpoints).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'breakpoint', key), value);\n });\n\n Object.entries(tokens.zIndex).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'z-index', key), value);\n });\n\n Object.entries(tokens.transitions.duration).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'duration', key), value);\n });\n\n Object.entries(tokens.transitions.easing).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'easing', key), value);\n });\n\n Object.entries(tokens.opacity).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'opacity', key), value);\n });\n\n // Accessibility tokens\n assign(toVariableName(prefix, 'focus-ring-width'), tokens.accessibility.focusRing.width);\n assign(toVariableName(prefix, 'focus-ring-offset'), tokens.accessibility.focusRing.offset);\n assign(toVariableName(prefix, 'focus-ring-style'), tokens.accessibility.focusRing.style);\n assign(toVariableName(prefix, 'min-touch-target'), tokens.accessibility.minTouchTarget);\n assign(toVariableName(prefix, 'min-text-size'), tokens.accessibility.minTextSize);\n\n // Button tokens\n Object.entries(tokens.buttons).forEach(([variant, states]) => {\n Object.entries(states).forEach(([state, value]) => {\n assign(toVariableName(prefix, 'button', variant, state), value);\n });\n });\n\n // Form tokens\n Object.entries(tokens.forms).forEach(([state, properties]) => {\n Object.entries(properties).forEach(([prop, value]) => {\n if (value) assign(toVariableName(prefix, 'form', state, prop), value);\n });\n });\n\n // Animation tokens\n Object.entries(tokens.animations).forEach(([name, animation]) => {\n assign(toVariableName(prefix, 'animation', name, 'duration'), animation.duration);\n assign(toVariableName(prefix, 'animation', name, 'easing'), animation.easing);\n assign(toVariableName(prefix, 'animation', name, 'keyframes'), animation.keyframes);\n });\n\n return map;\n};\n\nexport const generateCssVariables = (tokens: Tokens, options: CssVariableOptions = {}): string => {\n const selector = options.selector ?? DEFAULT_SELECTOR;\n const declarations = createCssVariableMap(tokens, options);\n const lines = Object.entries(declarations)\n .map(([name, value]) => ` ${name}: ${value};`)\n .join('\\n');\n\n return `${selector} {\\n${lines}\\n}\\n`;\n};\n"],"mappings":"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","names":["tokens"]}
1
+ {"version":3,"sources":["../src/index.ts","../tokens/core.json","../src/css.ts"],"sourcesContent":["import coreTokens from '../tokens/core.json';\n\nimport { generateCssVariables } from './css';\nimport type { SpectreTokens, TailwindTheme, Tokens } from './types';\n\nexport type { TailwindTheme, Tokens, SpectreTokens, ColorScale, TokenScale, TypographyTokens, TransitionTokens, AccessibilityTokens, ButtonStateTokens, FormStateTokens, AnimationEntry } from './types';\n\nconst tokens: SpectreTokens = coreTokens as SpectreTokens;\n\nconst sanitizeFontFamily = (value: string): string[] =>\n value\n .split(',')\n .map((segment) => segment.trim().replace(/^['\"]|['\"]$/g, ''))\n .filter(Boolean);\n\nconst createTailwindTheme = (source: Tokens = tokens as Tokens): TailwindTheme => {\n const colors: TailwindTheme['colors'] = {};\n Object.entries(source.colors).forEach(([group, scale]) => {\n colors[group] = { ...scale };\n });\n\n const fontFamily = Object.entries(source.typography.families).reduce<Record<string, string[]>>((acc, [key, value]) => {\n acc[key] = sanitizeFontFamily(value);\n return acc;\n }, {});\n\n const fontSize = Object.entries(source.typography.scale).reduce<TailwindTheme['fontSize']>((acc, [key, entry]) => {\n acc[key] = [\n entry.fontSize,\n {\n lineHeight: entry.lineHeight,\n ...(entry.fontWeight ? { fontWeight: entry.fontWeight } : {}),\n ...(entry.letterSpacing ? { letterSpacing: entry.letterSpacing } : {})\n }\n ];\n return acc;\n }, {});\n\n return {\n colors,\n spacing: { ...source.spacing },\n borderRadius: { ...source.radii },\n fontFamily,\n fontSize,\n boxShadow: { ...source.shadows },\n screens: { ...source.breakpoints },\n zIndex: { ...source.zIndex },\n transitionDuration: { ...source.transitions.duration },\n transitionTimingFunction: { ...source.transitions.easing },\n opacity: { ...source.opacity }\n };\n};\n\nexport const tailwindTheme = createTailwindTheme(tokens as Tokens);\nexport const tailwindPreset = {\n theme: tailwindTheme\n};\n\nexport { tokens, generateCssVariables };\nexport default tokens;\n","{\n \"colors\": {\n \"brand\": {\n \"50\": \"#f5f0ff\",\n \"100\": \"#ebe2ff\",\n \"200\": \"#d7c6ff\",\n \"300\": \"#bfa1ff\",\n \"400\": \"#a37aff\",\n \"500\": \"#8652ff\",\n \"600\": \"#6c32e6\",\n \"700\": \"#5626b4\",\n \"800\": \"#3d1b7f\",\n \"900\": \"#241147\"\n },\n \"neutral\": {\n \"50\": \"#f8fafc\",\n \"100\": \"#f1f5f9\",\n \"200\": \"#e2e8f0\",\n \"300\": \"#cbd5f5\",\n \"400\": \"#94a3b8\",\n \"500\": \"#64748b\",\n \"600\": \"#475569\",\n \"700\": \"#334155\",\n \"800\": \"#1e293b\",\n \"900\": \"#0f172a\"\n },\n \"accent\": {\n \"50\": \"#e5fff8\",\n \"100\": \"#b8ffed\",\n \"200\": \"#89ffe1\",\n \"300\": \"#59ffd6\",\n \"400\": \"#29ffca\",\n \"500\": \"#03e6b3\",\n \"600\": \"#00b389\",\n \"700\": \"#008060\",\n \"800\": \"#004d38\",\n \"900\": \"#002a20\"\n },\n \"success\": {\n \"50\": \"#f0fdf4\",\n \"100\": \"#dcfce7\",\n \"200\": \"#bbf7d0\",\n \"300\": \"#86efac\",\n \"400\": \"#4ade80\",\n \"500\": \"#22c55e\",\n \"600\": \"#16a34a\",\n \"700\": \"#15803d\",\n \"800\": \"#166534\",\n \"900\": \"#14532d\"\n },\n \"warning\": {\n \"50\": \"#fffbeb\",\n \"100\": \"#fef3c7\",\n \"200\": \"#fde68a\",\n \"300\": \"#fcd34d\",\n \"400\": \"#fbbf24\",\n \"500\": \"#f59e0b\",\n \"600\": \"#d97706\",\n \"700\": \"#b45309\",\n \"800\": \"#92400e\",\n \"900\": \"#78350f\"\n },\n \"error\": {\n \"50\": \"#fef2f2\",\n \"100\": \"#fee2e2\",\n \"200\": \"#fecaca\",\n \"300\": \"#fca5a5\",\n \"400\": \"#f87171\",\n \"500\": \"#ef4444\",\n \"600\": \"#dc2626\",\n \"700\": \"#b91c1c\",\n \"800\": \"#991b1b\",\n \"900\": \"#7f1d1d\"\n },\n \"info\": {\n \"50\": \"#eff6ff\",\n \"100\": \"#dbeafe\",\n \"200\": \"#bfdbfe\",\n \"300\": \"#93c5fd\",\n \"400\": \"#60a5fa\",\n \"500\": \"#3b82f6\",\n \"600\": \"#2563eb\",\n \"700\": \"#1d4ed8\",\n \"800\": \"#1e40af\",\n \"900\": \"#1e3a8a\"\n },\n \"focus\": {\n \"primary\": \"#8652ff\",\n \"error\": \"#ef4444\",\n \"info\": \"#3b82f6\"\n }\n },\n \"surface\": {\n \"page\": {\n \"value\": \"#0f172a\",\n \"description\": \"primary app background\"\n },\n \"card\": {\n \"value\": \"#1e293b\",\n \"description\": \"containers and tiles\"\n },\n \"input\": {\n \"value\": \"#334155\",\n \"description\": \"form inputs, textareas\"\n },\n \"overlay\": {\n \"value\": \"#1e293b\",\n \"description\": \"modals, dropdowns, flyouts\"\n }\n },\n \"text\": {\n \"onPage\": {\n \"default\": \"#f8fafc\",\n \"muted\": \"#cbd5f5\",\n \"subtle\": \"#94a3b8\"\n },\n \"onSurface\": {\n \"default\": \"#f1f5f9\",\n \"muted\": \"#cbd5f5\",\n \"subtle\": \"#94a3b8\"\n }\n },\n \"component\": {\n \"card\": {\n \"text\": \"#f1f5f9\",\n \"textMuted\": \"#cbd5f5\"\n },\n \"input\": {\n \"text\": \"#f1f5f9\",\n \"placeholder\": \"#94a3b8\"\n },\n \"button\": {\n \"textDefault\": \"#f1f5f9\",\n \"textOnPrimary\": \"#ffffff\"\n }\n },\n \"modes\": {\n \"default\": {\n \"surface\": {},\n \"text\": {}\n },\n \"dark\": {\n \"surface\": {},\n \"text\": {}\n }\n },\n \"opacity\": {\n \"disabled\": \"0.38\",\n \"hover\": \"0.92\",\n \"active\": \"0.84\",\n \"focus\": \"1\",\n \"overlay\": \"0.5\",\n \"tooltip\": \"0.95\"\n },\n \"accessibility\": {\n \"focusRing\": {\n \"width\": \"2px\",\n \"offset\": \"2px\",\n \"style\": \"solid\"\n },\n \"minTouchTarget\": \"44px\",\n \"minTextSize\": \"16px\"\n },\n \"buttons\": {\n \"primary\": {\n \"bg\": \"#8652ff\",\n \"bgHover\": \"#6c32e6\",\n \"bgActive\": \"#5626b4\",\n \"bgDisabled\": \"#cbd5f5\",\n \"text\": \"#ffffff\",\n \"textDisabled\": \"#94a3b8\"\n },\n \"secondary\": {\n \"bg\": \"#ffffff\",\n \"bgHover\": \"#f1f5f9\",\n \"bgActive\": \"#e2e8f0\",\n \"bgDisabled\": \"#f8fafc\",\n \"text\": \"#8652ff\",\n \"textDisabled\": \"#94a3b8\",\n \"border\": \"#8652ff\",\n \"borderDisabled\": \"#cbd5f5\"\n },\n \"ghost\": {\n \"bg\": \"transparent\",\n \"bgHover\": \"#f5f0ff\",\n \"bgActive\": \"#ebe2ff\",\n \"bgDisabled\": \"transparent\",\n \"text\": \"#8652ff\",\n \"textDisabled\": \"#94a3b8\"\n },\n \"danger\": {\n \"bg\": \"#ef4444\",\n \"bgHover\": \"#dc2626\",\n \"bgActive\": \"#b91c1c\",\n \"bgDisabled\": \"#fecaca\",\n \"text\": \"#ffffff\",\n \"textDisabled\": \"#94a3b8\"\n },\n \"success\": {\n \"bg\": \"#22c55e\",\n \"bgHover\": \"#16a34a\",\n \"bgActive\": \"#15803d\",\n \"bgDisabled\": \"#bbf7d0\",\n \"text\": \"#ffffff\",\n \"textDisabled\": \"#94a3b8\"\n }\n },\n \"forms\": {\n \"default\": {\n \"bg\": \"#ffffff\",\n \"border\": \"#cbd5f5\",\n \"text\": \"#0f172a\",\n \"placeholder\": \"#94a3b8\"\n },\n \"hover\": {\n \"border\": \"#8652ff\"\n },\n \"focus\": {\n \"border\": \"#8652ff\",\n \"ring\": \"#8652ff\"\n },\n \"valid\": {\n \"border\": \"#22c55e\",\n \"bg\": \"#f0fdf4\",\n \"text\": \"#15803d\"\n },\n \"invalid\": {\n \"border\": \"#ef4444\",\n \"bg\": \"#fef2f2\",\n \"text\": \"#b91c1c\"\n },\n \"disabled\": {\n \"bg\": \"#f8fafc\",\n \"border\": \"#e2e8f0\",\n \"text\": \"#94a3b8\"\n }\n },\n \"spacing\": {\n \"none\": \"0rem\",\n \"3xs\": \"0.125rem\",\n \"2xs\": \"0.25rem\",\n \"xs\": \"0.5rem\",\n \"sm\": \"0.75rem\",\n \"md\": \"1rem\",\n \"lg\": \"1.5rem\",\n \"xl\": \"2rem\",\n \"2xl\": \"3rem\",\n \"3xl\": \"4rem\"\n },\n \"radii\": {\n \"none\": \"0\",\n \"sm\": \"2px\",\n \"md\": \"4px\",\n \"lg\": \"8px\",\n \"pill\": \"999px\"\n },\n \"borders\": {\n \"card\": \"#334155\",\n \"input\": \"#cbd5f5\"\n },\n \"typography\": {\n \"families\": {\n \"sans\": \"'Inter', 'Helvetica Neue', Arial, sans-serif\",\n \"serif\": \"'Spectre Serif', 'Georgia', serif\",\n \"mono\": \"'JetBrains Mono', 'SFMono-Regular', Consolas, monospace\"\n },\n \"scale\": {\n \"xs\": {\n \"fontSize\": \"0.75rem\",\n \"lineHeight\": \"1.25rem\",\n \"fontWeight\": 400,\n \"letterSpacing\": \"0.02em\"\n },\n \"sm\": {\n \"fontSize\": \"0.875rem\",\n \"lineHeight\": \"1.5rem\",\n \"fontWeight\": 400\n },\n \"md\": {\n \"fontSize\": \"1rem\",\n \"lineHeight\": \"1.75rem\",\n \"fontWeight\": 500\n },\n \"lg\": {\n \"fontSize\": \"1.25rem\",\n \"lineHeight\": \"2rem\",\n \"fontWeight\": 600\n },\n \"xl\": {\n \"fontSize\": \"1.5rem\",\n \"lineHeight\": \"2.125rem\",\n \"fontWeight\": 600\n },\n \"2xl\": {\n \"fontSize\": \"1.875rem\",\n \"lineHeight\": \"2.5rem\",\n \"fontWeight\": 700\n },\n \"3xl\": {\n \"fontSize\": \"2.25rem\",\n \"lineHeight\": \"2.75rem\",\n \"fontWeight\": 700\n }\n }\n },\n \"shadows\": {\n \"none\": \"none\",\n \"sm\": \"0 1px 2px 0 rgba(15, 23, 42, 0.08)\",\n \"md\": \"0 3px 8px -1px rgba(15, 23, 42, 0.1)\",\n \"lg\": \"0 8px 20px -4px rgba(15, 23, 42, 0.18)\"\n },\n \"breakpoints\": {\n \"sm\": \"640px\",\n \"md\": \"768px\",\n \"lg\": \"1024px\",\n \"xl\": \"1280px\",\n \"2xl\": \"1536px\"\n },\n \"zIndex\": {\n \"base\": \"0\",\n \"dropdown\": \"1000\",\n \"sticky\": \"1100\",\n \"fixed\": \"1200\",\n \"overlay\": \"1300\",\n \"modal\": \"1400\",\n \"popover\": \"1500\",\n \"tooltip\": \"1600\"\n },\n \"transitions\": {\n \"duration\": {\n \"instant\": \"75ms\",\n \"fast\": \"150ms\",\n \"base\": \"200ms\",\n \"moderate\": \"300ms\",\n \"slow\": \"500ms\",\n \"slower\": \"700ms\"\n },\n \"easing\": {\n \"linear\": \"linear\",\n \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"spring\": \"cubic-bezier(0.34, 1.56, 0.64, 1)\"\n }\n },\n \"animations\": {\n \"fadeIn\": {\n \"duration\": \"200ms\",\n \"easing\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"keyframes\": \"fade-in\"\n },\n \"fadeOut\": {\n \"duration\": \"150ms\",\n \"easing\": \"cubic-bezier(0.4, 0, 1, 1)\",\n \"keyframes\": \"fade-out\"\n },\n \"slideUp\": {\n \"duration\": \"300ms\",\n \"easing\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"keyframes\": \"slide-up\"\n },\n \"slideDown\": {\n \"duration\": \"300ms\",\n \"easing\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"keyframes\": \"slide-down\"\n },\n \"scaleIn\": {\n \"duration\": \"200ms\",\n \"easing\": \"cubic-bezier(0.34, 1.56, 0.64, 1)\",\n \"keyframes\": \"scale-in\"\n },\n \"bounce\": {\n \"duration\": \"500ms\",\n \"easing\": \"cubic-bezier(0.34, 1.56, 0.64, 1)\",\n \"keyframes\": \"bounce\"\n },\n \"shake\": {\n \"duration\": \"400ms\",\n \"easing\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"keyframes\": \"shake\"\n },\n \"pulse\": {\n \"duration\": \"1500ms\",\n \"easing\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"keyframes\": \"pulse\"\n }\n }\n}\n","import type { CssVariableMap, CssVariableOptions, Tokens } from './types';\n\nconst DEFAULT_PREFIX = 'sp';\nexport const DEFAULT_SELECTOR = ':root';\n\nconst formatKey = (segment: string): string =>\n segment\n .replace(/[^a-z0-9]+/gi, '-')\n .replace(/^-+|-+$/g, '')\n .toLowerCase();\n\nconst toVariableName = (prefix: string, ...parts: string[]): string => {\n const filtered = parts.filter(Boolean).map(formatKey);\n return `--${prefix}-${filtered.join('-')}`;\n};\n\nexport const createCssVariableMap = (tokens: Tokens, options: CssVariableOptions = {}): CssVariableMap => {\n const prefix = options.prefix ?? DEFAULT_PREFIX;\n const map: CssVariableMap = {};\n\n const assign = (name: string, value: string | number | undefined) => {\n if (value === undefined) return;\n map[name] = String(value);\n };\n\n Object.entries(tokens.colors).forEach(([group, scale]) => {\n Object.entries(scale).forEach(([step, value]) => {\n assign(toVariableName(prefix, 'color', group, step), value);\n });\n });\n\n Object.entries(tokens.spacing).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'space', key), value);\n });\n\n Object.entries(tokens.radii).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'radius', key), value);\n });\n\n Object.entries(tokens.typography.families).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'font-family', key), value);\n });\n\n Object.entries(tokens.typography.scale).forEach(([key, entry]) => {\n assign(toVariableName(prefix, 'font', key, 'size'), entry.fontSize);\n assign(toVariableName(prefix, 'font', key, 'line-height'), entry.lineHeight);\n assign(toVariableName(prefix, 'font', key, 'weight'), entry.fontWeight);\n assign(toVariableName(prefix, 'font', key, 'letter-spacing'), entry.letterSpacing);\n });\n\n Object.entries(tokens.shadows).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'shadow', key), value);\n });\n\n Object.entries(tokens.breakpoints).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'breakpoint', key), value);\n });\n\n Object.entries(tokens.zIndex).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'z-index', key), value);\n });\n\n Object.entries(tokens.transitions.duration).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'duration', key), value);\n });\n\n Object.entries(tokens.transitions.easing).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'easing', key), value);\n });\n\n Object.entries(tokens.opacity).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'opacity', key), value);\n });\n\n // Accessibility tokens\n assign(toVariableName(prefix, 'focus-ring-width'), tokens.accessibility.focusRing.width);\n assign(toVariableName(prefix, 'focus-ring-offset'), tokens.accessibility.focusRing.offset);\n assign(toVariableName(prefix, 'focus-ring-style'), tokens.accessibility.focusRing.style);\n assign(toVariableName(prefix, 'min-touch-target'), tokens.accessibility.minTouchTarget);\n assign(toVariableName(prefix, 'min-text-size'), tokens.accessibility.minTextSize);\n\n // Button tokens\n Object.entries(tokens.buttons).forEach(([variant, states]) => {\n Object.entries(states).forEach(([state, value]) => {\n assign(toVariableName(prefix, 'button', variant, state), value);\n });\n });\n\n // Form tokens\n Object.entries(tokens.forms).forEach(([state, properties]) => {\n Object.entries(properties).forEach(([prop, value]) => {\n if (value) assign(toVariableName(prefix, 'form', state, prop), value);\n });\n });\n\n // Animation tokens\n Object.entries(tokens.animations).forEach(([name, animation]) => {\n assign(toVariableName(prefix, 'animation', name, 'duration'), animation.duration);\n assign(toVariableName(prefix, 'animation', name, 'easing'), animation.easing);\n assign(toVariableName(prefix, 'animation', name, 'keyframes'), animation.keyframes);\n });\n\n return map;\n};\n\nexport const generateCssVariables = (tokens: Tokens, options: CssVariableOptions = {}): string => {\n const selector = options.selector ?? DEFAULT_SELECTOR;\n const declarations = createCssVariableMap(tokens, options);\n const lines = Object.entries(declarations)\n .map(([name, value]) => ` ${name}: ${value};`)\n .join('\\n');\n\n return `${selector} {\\n${lines}\\n}\\n`;\n};\n"],"mappings":"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","names":["tokens"]}
package/dist/index.d.cts CHANGED
@@ -45,6 +45,24 @@ interface FormStateTokens {
45
45
  placeholder?: string;
46
46
  ring?: string;
47
47
  }
48
+ interface SpectreTokens {
49
+ colors: any;
50
+ spacing: any;
51
+ radii: any;
52
+ typography: any;
53
+ shadows: any;
54
+ breakpoints: any;
55
+ zIndex: any;
56
+ transitions: any;
57
+ buttons?: any;
58
+ forms?: any;
59
+ accessibility?: any;
60
+ opacity?: any;
61
+ animations?: any;
62
+ surface?: any;
63
+ text?: any;
64
+ component?: any;
65
+ }
48
66
  interface Tokens {
49
67
  colors: Record<string, ColorScale>;
50
68
  opacity: TokenScale;
@@ -60,7 +78,6 @@ interface Tokens {
60
78
  transitions: TransitionTokens;
61
79
  animations: Record<string, AnimationEntry>;
62
80
  }
63
- type CssVariableMap = Record<string, string>;
64
81
  interface CssVariableOptions {
65
82
  selector?: string;
66
83
  prefix?: string;
@@ -83,14 +100,12 @@ interface TailwindTheme {
83
100
  opacity: TokenScale;
84
101
  }
85
102
 
86
- declare const createCssVariableMap: (tokens: Tokens, options?: CssVariableOptions) => CssVariableMap;
87
103
  declare const generateCssVariables: (tokens: Tokens, options?: CssVariableOptions) => string;
88
104
 
89
- declare const tokens: Tokens;
90
- declare const createTailwindTheme: (source?: Tokens) => TailwindTheme;
105
+ declare const tokens: SpectreTokens;
91
106
  declare const tailwindTheme: TailwindTheme;
92
107
  declare const tailwindPreset: {
93
108
  theme: TailwindTheme;
94
109
  };
95
110
 
96
- export { type AccessibilityTokens, type AnimationEntry, type ButtonStateTokens, type ColorScale, type FormStateTokens, type TailwindTheme, type TokenScale, type Tokens, type TransitionTokens, type TypographyTokens, createCssVariableMap, createTailwindTheme, tokens as default, generateCssVariables, tailwindPreset, tailwindTheme, tokens };
111
+ export { type AccessibilityTokens, type AnimationEntry, type ButtonStateTokens, type ColorScale, type FormStateTokens, type SpectreTokens, type TailwindTheme, type TokenScale, type Tokens, type TransitionTokens, type TypographyTokens, tokens as default, generateCssVariables, tailwindPreset, tailwindTheme, tokens };
package/dist/index.d.ts CHANGED
@@ -45,6 +45,24 @@ interface FormStateTokens {
45
45
  placeholder?: string;
46
46
  ring?: string;
47
47
  }
48
+ interface SpectreTokens {
49
+ colors: any;
50
+ spacing: any;
51
+ radii: any;
52
+ typography: any;
53
+ shadows: any;
54
+ breakpoints: any;
55
+ zIndex: any;
56
+ transitions: any;
57
+ buttons?: any;
58
+ forms?: any;
59
+ accessibility?: any;
60
+ opacity?: any;
61
+ animations?: any;
62
+ surface?: any;
63
+ text?: any;
64
+ component?: any;
65
+ }
48
66
  interface Tokens {
49
67
  colors: Record<string, ColorScale>;
50
68
  opacity: TokenScale;
@@ -60,7 +78,6 @@ interface Tokens {
60
78
  transitions: TransitionTokens;
61
79
  animations: Record<string, AnimationEntry>;
62
80
  }
63
- type CssVariableMap = Record<string, string>;
64
81
  interface CssVariableOptions {
65
82
  selector?: string;
66
83
  prefix?: string;
@@ -83,14 +100,12 @@ interface TailwindTheme {
83
100
  opacity: TokenScale;
84
101
  }
85
102
 
86
- declare const createCssVariableMap: (tokens: Tokens, options?: CssVariableOptions) => CssVariableMap;
87
103
  declare const generateCssVariables: (tokens: Tokens, options?: CssVariableOptions) => string;
88
104
 
89
- declare const tokens: Tokens;
90
- declare const createTailwindTheme: (source?: Tokens) => TailwindTheme;
105
+ declare const tokens: SpectreTokens;
91
106
  declare const tailwindTheme: TailwindTheme;
92
107
  declare const tailwindPreset: {
93
108
  theme: TailwindTheme;
94
109
  };
95
110
 
96
- export { type AccessibilityTokens, type AnimationEntry, type ButtonStateTokens, type ColorScale, type FormStateTokens, type TailwindTheme, type TokenScale, type Tokens, type TransitionTokens, type TypographyTokens, createCssVariableMap, createTailwindTheme, tokens as default, generateCssVariables, tailwindPreset, tailwindTheme, tokens };
111
+ export { type AccessibilityTokens, type AnimationEntry, type ButtonStateTokens, type ColorScale, type FormStateTokens, type SpectreTokens, type TailwindTheme, type TokenScale, type Tokens, type TransitionTokens, type TypographyTokens, tokens as default, generateCssVariables, tailwindPreset, tailwindTheme, tokens };
package/dist/index.js CHANGED
@@ -91,6 +91,60 @@ var core_default = {
91
91
  info: "#3b82f6"
92
92
  }
93
93
  },
94
+ surface: {
95
+ page: {
96
+ value: "#0f172a",
97
+ description: "primary app background"
98
+ },
99
+ card: {
100
+ value: "#1e293b",
101
+ description: "containers and tiles"
102
+ },
103
+ input: {
104
+ value: "#334155",
105
+ description: "form inputs, textareas"
106
+ },
107
+ overlay: {
108
+ value: "#1e293b",
109
+ description: "modals, dropdowns, flyouts"
110
+ }
111
+ },
112
+ text: {
113
+ onPage: {
114
+ default: "#f8fafc",
115
+ muted: "#cbd5f5",
116
+ subtle: "#94a3b8"
117
+ },
118
+ onSurface: {
119
+ default: "#f1f5f9",
120
+ muted: "#cbd5f5",
121
+ subtle: "#94a3b8"
122
+ }
123
+ },
124
+ component: {
125
+ card: {
126
+ text: "#f1f5f9",
127
+ textMuted: "#cbd5f5"
128
+ },
129
+ input: {
130
+ text: "#f1f5f9",
131
+ placeholder: "#94a3b8"
132
+ },
133
+ button: {
134
+ textDefault: "#f1f5f9",
135
+ textOnPrimary: "#ffffff"
136
+ }
137
+ },
138
+ modes: {
139
+ default: {
140
+ surface: {},
141
+ text: {}
142
+ },
143
+ dark: {
144
+ surface: {},
145
+ text: {}
146
+ }
147
+ },
94
148
  opacity: {
95
149
  disabled: "0.38",
96
150
  hover: "0.92",
@@ -201,6 +255,10 @@ var core_default = {
201
255
  lg: "8px",
202
256
  pill: "999px"
203
257
  },
258
+ borders: {
259
+ card: "#334155",
260
+ input: "#cbd5f5"
261
+ },
204
262
  typography: {
205
263
  families: {
206
264
  sans: "'Inter', 'Helvetica Neue', Arial, sans-serif",
@@ -458,8 +516,6 @@ var tailwindPreset = {
458
516
  };
459
517
  var index_default = tokens;
460
518
  export {
461
- createCssVariableMap,
462
- createTailwindTheme,
463
519
  index_default as default,
464
520
  generateCssVariables,
465
521
  tailwindPreset,
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../tokens/core.json","../src/css.ts","../src/index.ts"],"sourcesContent":["{\n \"colors\": {\n \"brand\": {\n \"50\": \"#f5f0ff\",\n \"100\": \"#ebe2ff\",\n \"200\": \"#d7c6ff\",\n \"300\": \"#bfa1ff\",\n \"400\": \"#a37aff\",\n \"500\": \"#8652ff\",\n \"600\": \"#6c32e6\",\n \"700\": \"#5626b4\",\n \"800\": \"#3d1b7f\",\n \"900\": \"#241147\"\n },\n \"neutral\": {\n \"50\": \"#f8fafc\",\n \"100\": \"#f1f5f9\",\n \"200\": \"#e2e8f0\",\n \"300\": \"#cbd5f5\",\n \"400\": \"#94a3b8\",\n \"500\": \"#64748b\",\n \"600\": \"#475569\",\n \"700\": \"#334155\",\n \"800\": \"#1e293b\",\n \"900\": \"#0f172a\"\n },\n \"accent\": {\n \"50\": \"#e5fff8\",\n \"100\": \"#b8ffed\",\n \"200\": \"#89ffe1\",\n \"300\": \"#59ffd6\",\n \"400\": \"#29ffca\",\n \"500\": \"#03e6b3\",\n \"600\": \"#00b389\",\n \"700\": \"#008060\",\n \"800\": \"#004d38\",\n \"900\": \"#002a20\"\n },\n \"success\": {\n \"50\": \"#f0fdf4\",\n \"100\": \"#dcfce7\",\n \"200\": \"#bbf7d0\",\n \"300\": \"#86efac\",\n \"400\": \"#4ade80\",\n \"500\": \"#22c55e\",\n \"600\": \"#16a34a\",\n \"700\": \"#15803d\",\n \"800\": \"#166534\",\n \"900\": \"#14532d\"\n },\n \"warning\": {\n \"50\": \"#fffbeb\",\n \"100\": \"#fef3c7\",\n \"200\": \"#fde68a\",\n \"300\": \"#fcd34d\",\n \"400\": \"#fbbf24\",\n \"500\": \"#f59e0b\",\n \"600\": \"#d97706\",\n \"700\": \"#b45309\",\n \"800\": \"#92400e\",\n \"900\": \"#78350f\"\n },\n \"error\": {\n \"50\": \"#fef2f2\",\n \"100\": \"#fee2e2\",\n \"200\": \"#fecaca\",\n \"300\": \"#fca5a5\",\n \"400\": \"#f87171\",\n \"500\": \"#ef4444\",\n \"600\": \"#dc2626\",\n \"700\": \"#b91c1c\",\n \"800\": \"#991b1b\",\n \"900\": \"#7f1d1d\"\n },\n \"info\": {\n \"50\": \"#eff6ff\",\n \"100\": \"#dbeafe\",\n \"200\": \"#bfdbfe\",\n \"300\": \"#93c5fd\",\n \"400\": \"#60a5fa\",\n \"500\": \"#3b82f6\",\n \"600\": \"#2563eb\",\n \"700\": \"#1d4ed8\",\n \"800\": \"#1e40af\",\n \"900\": \"#1e3a8a\"\n },\n \"focus\": {\n \"primary\": \"#8652ff\",\n \"error\": \"#ef4444\",\n \"info\": \"#3b82f6\"\n }\n },\n \"opacity\": {\n \"disabled\": \"0.38\",\n \"hover\": \"0.92\",\n \"active\": \"0.84\",\n \"focus\": \"1\",\n \"overlay\": \"0.5\",\n \"tooltip\": \"0.95\"\n },\n \"accessibility\": {\n \"focusRing\": {\n \"width\": \"2px\",\n \"offset\": \"2px\",\n \"style\": \"solid\"\n },\n \"minTouchTarget\": \"44px\",\n \"minTextSize\": \"16px\"\n },\n \"buttons\": {\n \"primary\": {\n \"bg\": \"#8652ff\",\n \"bgHover\": \"#6c32e6\",\n \"bgActive\": \"#5626b4\",\n \"bgDisabled\": \"#cbd5f5\",\n \"text\": \"#ffffff\",\n \"textDisabled\": \"#94a3b8\"\n },\n \"secondary\": {\n \"bg\": \"#ffffff\",\n \"bgHover\": \"#f1f5f9\",\n \"bgActive\": \"#e2e8f0\",\n \"bgDisabled\": \"#f8fafc\",\n \"text\": \"#8652ff\",\n \"textDisabled\": \"#94a3b8\",\n \"border\": \"#8652ff\",\n \"borderDisabled\": \"#cbd5f5\"\n },\n \"ghost\": {\n \"bg\": \"transparent\",\n \"bgHover\": \"#f5f0ff\",\n \"bgActive\": \"#ebe2ff\",\n \"bgDisabled\": \"transparent\",\n \"text\": \"#8652ff\",\n \"textDisabled\": \"#94a3b8\"\n },\n \"danger\": {\n \"bg\": \"#ef4444\",\n \"bgHover\": \"#dc2626\",\n \"bgActive\": \"#b91c1c\",\n \"bgDisabled\": \"#fecaca\",\n \"text\": \"#ffffff\",\n \"textDisabled\": \"#94a3b8\"\n },\n \"success\": {\n \"bg\": \"#22c55e\",\n \"bgHover\": \"#16a34a\",\n \"bgActive\": \"#15803d\",\n \"bgDisabled\": \"#bbf7d0\",\n \"text\": \"#ffffff\",\n \"textDisabled\": \"#94a3b8\"\n }\n },\n \"forms\": {\n \"default\": {\n \"bg\": \"#ffffff\",\n \"border\": \"#cbd5f5\",\n \"text\": \"#0f172a\",\n \"placeholder\": \"#94a3b8\"\n },\n \"hover\": {\n \"border\": \"#8652ff\"\n },\n \"focus\": {\n \"border\": \"#8652ff\",\n \"ring\": \"#8652ff\"\n },\n \"valid\": {\n \"border\": \"#22c55e\",\n \"bg\": \"#f0fdf4\",\n \"text\": \"#15803d\"\n },\n \"invalid\": {\n \"border\": \"#ef4444\",\n \"bg\": \"#fef2f2\",\n \"text\": \"#b91c1c\"\n },\n \"disabled\": {\n \"bg\": \"#f8fafc\",\n \"border\": \"#e2e8f0\",\n \"text\": \"#94a3b8\"\n }\n },\n \"spacing\": {\n \"none\": \"0rem\",\n \"3xs\": \"0.125rem\",\n \"2xs\": \"0.25rem\",\n \"xs\": \"0.5rem\",\n \"sm\": \"0.75rem\",\n \"md\": \"1rem\",\n \"lg\": \"1.5rem\",\n \"xl\": \"2rem\",\n \"2xl\": \"3rem\",\n \"3xl\": \"4rem\"\n },\n \"radii\": {\n \"none\": \"0\",\n \"sm\": \"2px\",\n \"md\": \"4px\",\n \"lg\": \"8px\",\n \"pill\": \"999px\"\n },\n \"typography\": {\n \"families\": {\n \"sans\": \"'Inter', 'Helvetica Neue', Arial, sans-serif\",\n \"serif\": \"'Spectre Serif', 'Georgia', serif\",\n \"mono\": \"'JetBrains Mono', 'SFMono-Regular', Consolas, monospace\"\n },\n \"scale\": {\n \"xs\": {\n \"fontSize\": \"0.75rem\",\n \"lineHeight\": \"1.25rem\",\n \"fontWeight\": 400,\n \"letterSpacing\": \"0.02em\"\n },\n \"sm\": {\n \"fontSize\": \"0.875rem\",\n \"lineHeight\": \"1.5rem\",\n \"fontWeight\": 400\n },\n \"md\": {\n \"fontSize\": \"1rem\",\n \"lineHeight\": \"1.75rem\",\n \"fontWeight\": 500\n },\n \"lg\": {\n \"fontSize\": \"1.25rem\",\n \"lineHeight\": \"2rem\",\n \"fontWeight\": 600\n },\n \"xl\": {\n \"fontSize\": \"1.5rem\",\n \"lineHeight\": \"2.125rem\",\n \"fontWeight\": 600\n },\n \"2xl\": {\n \"fontSize\": \"1.875rem\",\n \"lineHeight\": \"2.5rem\",\n \"fontWeight\": 700\n },\n \"3xl\": {\n \"fontSize\": \"2.25rem\",\n \"lineHeight\": \"2.75rem\",\n \"fontWeight\": 700\n }\n }\n },\n \"shadows\": {\n \"none\": \"none\",\n \"sm\": \"0 1px 2px 0 rgba(15, 23, 42, 0.08)\",\n \"md\": \"0 3px 8px -1px rgba(15, 23, 42, 0.1)\",\n \"lg\": \"0 8px 20px -4px rgba(15, 23, 42, 0.18)\"\n },\n \"breakpoints\": {\n \"sm\": \"640px\",\n \"md\": \"768px\",\n \"lg\": \"1024px\",\n \"xl\": \"1280px\",\n \"2xl\": \"1536px\"\n },\n \"zIndex\": {\n \"base\": \"0\",\n \"dropdown\": \"1000\",\n \"sticky\": \"1100\",\n \"fixed\": \"1200\",\n \"overlay\": \"1300\",\n \"modal\": \"1400\",\n \"popover\": \"1500\",\n \"tooltip\": \"1600\"\n },\n \"transitions\": {\n \"duration\": {\n \"instant\": \"75ms\",\n \"fast\": \"150ms\",\n \"base\": \"200ms\",\n \"moderate\": \"300ms\",\n \"slow\": \"500ms\",\n \"slower\": \"700ms\"\n },\n \"easing\": {\n \"linear\": \"linear\",\n \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"spring\": \"cubic-bezier(0.34, 1.56, 0.64, 1)\"\n }\n },\n \"animations\": {\n \"fadeIn\": {\n \"duration\": \"200ms\",\n \"easing\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"keyframes\": \"fade-in\"\n },\n \"fadeOut\": {\n \"duration\": \"150ms\",\n \"easing\": \"cubic-bezier(0.4, 0, 1, 1)\",\n \"keyframes\": \"fade-out\"\n },\n \"slideUp\": {\n \"duration\": \"300ms\",\n \"easing\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"keyframes\": \"slide-up\"\n },\n \"slideDown\": {\n \"duration\": \"300ms\",\n \"easing\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"keyframes\": \"slide-down\"\n },\n \"scaleIn\": {\n \"duration\": \"200ms\",\n \"easing\": \"cubic-bezier(0.34, 1.56, 0.64, 1)\",\n \"keyframes\": \"scale-in\"\n },\n \"bounce\": {\n \"duration\": \"500ms\",\n \"easing\": \"cubic-bezier(0.34, 1.56, 0.64, 1)\",\n \"keyframes\": \"bounce\"\n },\n \"shake\": {\n \"duration\": \"400ms\",\n \"easing\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"keyframes\": \"shake\"\n },\n \"pulse\": {\n \"duration\": \"1500ms\",\n \"easing\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"keyframes\": \"pulse\"\n }\n }\n}\n","import type { CssVariableMap, CssVariableOptions, Tokens } from './types';\n\nconst DEFAULT_PREFIX = 'sp';\nexport const DEFAULT_SELECTOR = ':root';\n\nconst formatKey = (segment: string): string =>\n segment\n .replace(/[^a-z0-9]+/gi, '-')\n .replace(/^-+|-+$/g, '')\n .toLowerCase();\n\nconst toVariableName = (prefix: string, ...parts: string[]): string => {\n const filtered = parts.filter(Boolean).map(formatKey);\n return `--${prefix}-${filtered.join('-')}`;\n};\n\nexport const createCssVariableMap = (tokens: Tokens, options: CssVariableOptions = {}): CssVariableMap => {\n const prefix = options.prefix ?? DEFAULT_PREFIX;\n const map: CssVariableMap = {};\n\n const assign = (name: string, value: string | number | undefined) => {\n if (value === undefined) return;\n map[name] = String(value);\n };\n\n Object.entries(tokens.colors).forEach(([group, scale]) => {\n Object.entries(scale).forEach(([step, value]) => {\n assign(toVariableName(prefix, 'color', group, step), value);\n });\n });\n\n Object.entries(tokens.spacing).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'space', key), value);\n });\n\n Object.entries(tokens.radii).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'radius', key), value);\n });\n\n Object.entries(tokens.typography.families).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'font-family', key), value);\n });\n\n Object.entries(tokens.typography.scale).forEach(([key, entry]) => {\n assign(toVariableName(prefix, 'font', key, 'size'), entry.fontSize);\n assign(toVariableName(prefix, 'font', key, 'line-height'), entry.lineHeight);\n assign(toVariableName(prefix, 'font', key, 'weight'), entry.fontWeight);\n assign(toVariableName(prefix, 'font', key, 'letter-spacing'), entry.letterSpacing);\n });\n\n Object.entries(tokens.shadows).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'shadow', key), value);\n });\n\n Object.entries(tokens.breakpoints).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'breakpoint', key), value);\n });\n\n Object.entries(tokens.zIndex).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'z-index', key), value);\n });\n\n Object.entries(tokens.transitions.duration).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'duration', key), value);\n });\n\n Object.entries(tokens.transitions.easing).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'easing', key), value);\n });\n\n Object.entries(tokens.opacity).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'opacity', key), value);\n });\n\n // Accessibility tokens\n assign(toVariableName(prefix, 'focus-ring-width'), tokens.accessibility.focusRing.width);\n assign(toVariableName(prefix, 'focus-ring-offset'), tokens.accessibility.focusRing.offset);\n assign(toVariableName(prefix, 'focus-ring-style'), tokens.accessibility.focusRing.style);\n assign(toVariableName(prefix, 'min-touch-target'), tokens.accessibility.minTouchTarget);\n assign(toVariableName(prefix, 'min-text-size'), tokens.accessibility.minTextSize);\n\n // Button tokens\n Object.entries(tokens.buttons).forEach(([variant, states]) => {\n Object.entries(states).forEach(([state, value]) => {\n assign(toVariableName(prefix, 'button', variant, state), value);\n });\n });\n\n // Form tokens\n Object.entries(tokens.forms).forEach(([state, properties]) => {\n Object.entries(properties).forEach(([prop, value]) => {\n if (value) assign(toVariableName(prefix, 'form', state, prop), value);\n });\n });\n\n // Animation tokens\n Object.entries(tokens.animations).forEach(([name, animation]) => {\n assign(toVariableName(prefix, 'animation', name, 'duration'), animation.duration);\n assign(toVariableName(prefix, 'animation', name, 'easing'), animation.easing);\n assign(toVariableName(prefix, 'animation', name, 'keyframes'), animation.keyframes);\n });\n\n return map;\n};\n\nexport const generateCssVariables = (tokens: Tokens, options: CssVariableOptions = {}): string => {\n const selector = options.selector ?? DEFAULT_SELECTOR;\n const declarations = createCssVariableMap(tokens, options);\n const lines = Object.entries(declarations)\n .map(([name, value]) => ` ${name}: ${value};`)\n .join('\\n');\n\n return `${selector} {\\n${lines}\\n}\\n`;\n};\n","import coreTokens from '../tokens/core.json';\n\nimport { createCssVariableMap, generateCssVariables } from './css';\nimport type { TailwindTheme, Tokens } from './types';\n\nexport type { TailwindTheme, Tokens, ColorScale, TokenScale, TypographyTokens, TransitionTokens, AccessibilityTokens, ButtonStateTokens, FormStateTokens, AnimationEntry } from './types';\n\nconst tokens: Tokens = coreTokens as Tokens;\n\nconst sanitizeFontFamily = (value: string): string[] =>\n value\n .split(',')\n .map((segment) => segment.trim().replace(/^['\"]|['\"]$/g, ''))\n .filter(Boolean);\n\nexport const createTailwindTheme = (source: Tokens = tokens): TailwindTheme => {\n const colors: TailwindTheme['colors'] = {};\n Object.entries(source.colors).forEach(([group, scale]) => {\n colors[group] = { ...scale };\n });\n\n const fontFamily = Object.entries(source.typography.families).reduce<Record<string, string[]>>((acc, [key, value]) => {\n acc[key] = sanitizeFontFamily(value);\n return acc;\n }, {});\n\n const fontSize = Object.entries(source.typography.scale).reduce<TailwindTheme['fontSize']>((acc, [key, entry]) => {\n acc[key] = [\n entry.fontSize,\n {\n lineHeight: entry.lineHeight,\n ...(entry.fontWeight ? { fontWeight: entry.fontWeight } : {}),\n ...(entry.letterSpacing ? { letterSpacing: entry.letterSpacing } : {})\n }\n ];\n return acc;\n }, {});\n\n return {\n colors,\n spacing: { ...source.spacing },\n borderRadius: { ...source.radii },\n fontFamily,\n fontSize,\n boxShadow: { ...source.shadows },\n screens: { ...source.breakpoints },\n zIndex: { ...source.zIndex },\n transitionDuration: { ...source.transitions.duration },\n transitionTimingFunction: { ...source.transitions.easing },\n opacity: { ...source.opacity }\n };\n};\n\nexport const tailwindTheme = createTailwindTheme(tokens);\nexport const tailwindPreset = {\n theme: tailwindTheme\n};\n\nexport { tokens, createCssVariableMap, generateCssVariables };\nexport default tokens;\n"],"mappings":"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","names":["tokens"]}
1
+ {"version":3,"sources":["../tokens/core.json","../src/css.ts","../src/index.ts"],"sourcesContent":["{\n \"colors\": {\n \"brand\": {\n \"50\": \"#f5f0ff\",\n \"100\": \"#ebe2ff\",\n \"200\": \"#d7c6ff\",\n \"300\": \"#bfa1ff\",\n \"400\": \"#a37aff\",\n \"500\": \"#8652ff\",\n \"600\": \"#6c32e6\",\n \"700\": \"#5626b4\",\n \"800\": \"#3d1b7f\",\n \"900\": \"#241147\"\n },\n \"neutral\": {\n \"50\": \"#f8fafc\",\n \"100\": \"#f1f5f9\",\n \"200\": \"#e2e8f0\",\n \"300\": \"#cbd5f5\",\n \"400\": \"#94a3b8\",\n \"500\": \"#64748b\",\n \"600\": \"#475569\",\n \"700\": \"#334155\",\n \"800\": \"#1e293b\",\n \"900\": \"#0f172a\"\n },\n \"accent\": {\n \"50\": \"#e5fff8\",\n \"100\": \"#b8ffed\",\n \"200\": \"#89ffe1\",\n \"300\": \"#59ffd6\",\n \"400\": \"#29ffca\",\n \"500\": \"#03e6b3\",\n \"600\": \"#00b389\",\n \"700\": \"#008060\",\n \"800\": \"#004d38\",\n \"900\": \"#002a20\"\n },\n \"success\": {\n \"50\": \"#f0fdf4\",\n \"100\": \"#dcfce7\",\n \"200\": \"#bbf7d0\",\n \"300\": \"#86efac\",\n \"400\": \"#4ade80\",\n \"500\": \"#22c55e\",\n \"600\": \"#16a34a\",\n \"700\": \"#15803d\",\n \"800\": \"#166534\",\n \"900\": \"#14532d\"\n },\n \"warning\": {\n \"50\": \"#fffbeb\",\n \"100\": \"#fef3c7\",\n \"200\": \"#fde68a\",\n \"300\": \"#fcd34d\",\n \"400\": \"#fbbf24\",\n \"500\": \"#f59e0b\",\n \"600\": \"#d97706\",\n \"700\": \"#b45309\",\n \"800\": \"#92400e\",\n \"900\": \"#78350f\"\n },\n \"error\": {\n \"50\": \"#fef2f2\",\n \"100\": \"#fee2e2\",\n \"200\": \"#fecaca\",\n \"300\": \"#fca5a5\",\n \"400\": \"#f87171\",\n \"500\": \"#ef4444\",\n \"600\": \"#dc2626\",\n \"700\": \"#b91c1c\",\n \"800\": \"#991b1b\",\n \"900\": \"#7f1d1d\"\n },\n \"info\": {\n \"50\": \"#eff6ff\",\n \"100\": \"#dbeafe\",\n \"200\": \"#bfdbfe\",\n \"300\": \"#93c5fd\",\n \"400\": \"#60a5fa\",\n \"500\": \"#3b82f6\",\n \"600\": \"#2563eb\",\n \"700\": \"#1d4ed8\",\n \"800\": \"#1e40af\",\n \"900\": \"#1e3a8a\"\n },\n \"focus\": {\n \"primary\": \"#8652ff\",\n \"error\": \"#ef4444\",\n \"info\": \"#3b82f6\"\n }\n },\n \"surface\": {\n \"page\": {\n \"value\": \"#0f172a\",\n \"description\": \"primary app background\"\n },\n \"card\": {\n \"value\": \"#1e293b\",\n \"description\": \"containers and tiles\"\n },\n \"input\": {\n \"value\": \"#334155\",\n \"description\": \"form inputs, textareas\"\n },\n \"overlay\": {\n \"value\": \"#1e293b\",\n \"description\": \"modals, dropdowns, flyouts\"\n }\n },\n \"text\": {\n \"onPage\": {\n \"default\": \"#f8fafc\",\n \"muted\": \"#cbd5f5\",\n \"subtle\": \"#94a3b8\"\n },\n \"onSurface\": {\n \"default\": \"#f1f5f9\",\n \"muted\": \"#cbd5f5\",\n \"subtle\": \"#94a3b8\"\n }\n },\n \"component\": {\n \"card\": {\n \"text\": \"#f1f5f9\",\n \"textMuted\": \"#cbd5f5\"\n },\n \"input\": {\n \"text\": \"#f1f5f9\",\n \"placeholder\": \"#94a3b8\"\n },\n \"button\": {\n \"textDefault\": \"#f1f5f9\",\n \"textOnPrimary\": \"#ffffff\"\n }\n },\n \"modes\": {\n \"default\": {\n \"surface\": {},\n \"text\": {}\n },\n \"dark\": {\n \"surface\": {},\n \"text\": {}\n }\n },\n \"opacity\": {\n \"disabled\": \"0.38\",\n \"hover\": \"0.92\",\n \"active\": \"0.84\",\n \"focus\": \"1\",\n \"overlay\": \"0.5\",\n \"tooltip\": \"0.95\"\n },\n \"accessibility\": {\n \"focusRing\": {\n \"width\": \"2px\",\n \"offset\": \"2px\",\n \"style\": \"solid\"\n },\n \"minTouchTarget\": \"44px\",\n \"minTextSize\": \"16px\"\n },\n \"buttons\": {\n \"primary\": {\n \"bg\": \"#8652ff\",\n \"bgHover\": \"#6c32e6\",\n \"bgActive\": \"#5626b4\",\n \"bgDisabled\": \"#cbd5f5\",\n \"text\": \"#ffffff\",\n \"textDisabled\": \"#94a3b8\"\n },\n \"secondary\": {\n \"bg\": \"#ffffff\",\n \"bgHover\": \"#f1f5f9\",\n \"bgActive\": \"#e2e8f0\",\n \"bgDisabled\": \"#f8fafc\",\n \"text\": \"#8652ff\",\n \"textDisabled\": \"#94a3b8\",\n \"border\": \"#8652ff\",\n \"borderDisabled\": \"#cbd5f5\"\n },\n \"ghost\": {\n \"bg\": \"transparent\",\n \"bgHover\": \"#f5f0ff\",\n \"bgActive\": \"#ebe2ff\",\n \"bgDisabled\": \"transparent\",\n \"text\": \"#8652ff\",\n \"textDisabled\": \"#94a3b8\"\n },\n \"danger\": {\n \"bg\": \"#ef4444\",\n \"bgHover\": \"#dc2626\",\n \"bgActive\": \"#b91c1c\",\n \"bgDisabled\": \"#fecaca\",\n \"text\": \"#ffffff\",\n \"textDisabled\": \"#94a3b8\"\n },\n \"success\": {\n \"bg\": \"#22c55e\",\n \"bgHover\": \"#16a34a\",\n \"bgActive\": \"#15803d\",\n \"bgDisabled\": \"#bbf7d0\",\n \"text\": \"#ffffff\",\n \"textDisabled\": \"#94a3b8\"\n }\n },\n \"forms\": {\n \"default\": {\n \"bg\": \"#ffffff\",\n \"border\": \"#cbd5f5\",\n \"text\": \"#0f172a\",\n \"placeholder\": \"#94a3b8\"\n },\n \"hover\": {\n \"border\": \"#8652ff\"\n },\n \"focus\": {\n \"border\": \"#8652ff\",\n \"ring\": \"#8652ff\"\n },\n \"valid\": {\n \"border\": \"#22c55e\",\n \"bg\": \"#f0fdf4\",\n \"text\": \"#15803d\"\n },\n \"invalid\": {\n \"border\": \"#ef4444\",\n \"bg\": \"#fef2f2\",\n \"text\": \"#b91c1c\"\n },\n \"disabled\": {\n \"bg\": \"#f8fafc\",\n \"border\": \"#e2e8f0\",\n \"text\": \"#94a3b8\"\n }\n },\n \"spacing\": {\n \"none\": \"0rem\",\n \"3xs\": \"0.125rem\",\n \"2xs\": \"0.25rem\",\n \"xs\": \"0.5rem\",\n \"sm\": \"0.75rem\",\n \"md\": \"1rem\",\n \"lg\": \"1.5rem\",\n \"xl\": \"2rem\",\n \"2xl\": \"3rem\",\n \"3xl\": \"4rem\"\n },\n \"radii\": {\n \"none\": \"0\",\n \"sm\": \"2px\",\n \"md\": \"4px\",\n \"lg\": \"8px\",\n \"pill\": \"999px\"\n },\n \"borders\": {\n \"card\": \"#334155\",\n \"input\": \"#cbd5f5\"\n },\n \"typography\": {\n \"families\": {\n \"sans\": \"'Inter', 'Helvetica Neue', Arial, sans-serif\",\n \"serif\": \"'Spectre Serif', 'Georgia', serif\",\n \"mono\": \"'JetBrains Mono', 'SFMono-Regular', Consolas, monospace\"\n },\n \"scale\": {\n \"xs\": {\n \"fontSize\": \"0.75rem\",\n \"lineHeight\": \"1.25rem\",\n \"fontWeight\": 400,\n \"letterSpacing\": \"0.02em\"\n },\n \"sm\": {\n \"fontSize\": \"0.875rem\",\n \"lineHeight\": \"1.5rem\",\n \"fontWeight\": 400\n },\n \"md\": {\n \"fontSize\": \"1rem\",\n \"lineHeight\": \"1.75rem\",\n \"fontWeight\": 500\n },\n \"lg\": {\n \"fontSize\": \"1.25rem\",\n \"lineHeight\": \"2rem\",\n \"fontWeight\": 600\n },\n \"xl\": {\n \"fontSize\": \"1.5rem\",\n \"lineHeight\": \"2.125rem\",\n \"fontWeight\": 600\n },\n \"2xl\": {\n \"fontSize\": \"1.875rem\",\n \"lineHeight\": \"2.5rem\",\n \"fontWeight\": 700\n },\n \"3xl\": {\n \"fontSize\": \"2.25rem\",\n \"lineHeight\": \"2.75rem\",\n \"fontWeight\": 700\n }\n }\n },\n \"shadows\": {\n \"none\": \"none\",\n \"sm\": \"0 1px 2px 0 rgba(15, 23, 42, 0.08)\",\n \"md\": \"0 3px 8px -1px rgba(15, 23, 42, 0.1)\",\n \"lg\": \"0 8px 20px -4px rgba(15, 23, 42, 0.18)\"\n },\n \"breakpoints\": {\n \"sm\": \"640px\",\n \"md\": \"768px\",\n \"lg\": \"1024px\",\n \"xl\": \"1280px\",\n \"2xl\": \"1536px\"\n },\n \"zIndex\": {\n \"base\": \"0\",\n \"dropdown\": \"1000\",\n \"sticky\": \"1100\",\n \"fixed\": \"1200\",\n \"overlay\": \"1300\",\n \"modal\": \"1400\",\n \"popover\": \"1500\",\n \"tooltip\": \"1600\"\n },\n \"transitions\": {\n \"duration\": {\n \"instant\": \"75ms\",\n \"fast\": \"150ms\",\n \"base\": \"200ms\",\n \"moderate\": \"300ms\",\n \"slow\": \"500ms\",\n \"slower\": \"700ms\"\n },\n \"easing\": {\n \"linear\": \"linear\",\n \"in\": \"cubic-bezier(0.4, 0, 1, 1)\",\n \"out\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"inOut\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"spring\": \"cubic-bezier(0.34, 1.56, 0.64, 1)\"\n }\n },\n \"animations\": {\n \"fadeIn\": {\n \"duration\": \"200ms\",\n \"easing\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"keyframes\": \"fade-in\"\n },\n \"fadeOut\": {\n \"duration\": \"150ms\",\n \"easing\": \"cubic-bezier(0.4, 0, 1, 1)\",\n \"keyframes\": \"fade-out\"\n },\n \"slideUp\": {\n \"duration\": \"300ms\",\n \"easing\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"keyframes\": \"slide-up\"\n },\n \"slideDown\": {\n \"duration\": \"300ms\",\n \"easing\": \"cubic-bezier(0, 0, 0.2, 1)\",\n \"keyframes\": \"slide-down\"\n },\n \"scaleIn\": {\n \"duration\": \"200ms\",\n \"easing\": \"cubic-bezier(0.34, 1.56, 0.64, 1)\",\n \"keyframes\": \"scale-in\"\n },\n \"bounce\": {\n \"duration\": \"500ms\",\n \"easing\": \"cubic-bezier(0.34, 1.56, 0.64, 1)\",\n \"keyframes\": \"bounce\"\n },\n \"shake\": {\n \"duration\": \"400ms\",\n \"easing\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"keyframes\": \"shake\"\n },\n \"pulse\": {\n \"duration\": \"1500ms\",\n \"easing\": \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"keyframes\": \"pulse\"\n }\n }\n}\n","import type { CssVariableMap, CssVariableOptions, Tokens } from './types';\n\nconst DEFAULT_PREFIX = 'sp';\nexport const DEFAULT_SELECTOR = ':root';\n\nconst formatKey = (segment: string): string =>\n segment\n .replace(/[^a-z0-9]+/gi, '-')\n .replace(/^-+|-+$/g, '')\n .toLowerCase();\n\nconst toVariableName = (prefix: string, ...parts: string[]): string => {\n const filtered = parts.filter(Boolean).map(formatKey);\n return `--${prefix}-${filtered.join('-')}`;\n};\n\nexport const createCssVariableMap = (tokens: Tokens, options: CssVariableOptions = {}): CssVariableMap => {\n const prefix = options.prefix ?? DEFAULT_PREFIX;\n const map: CssVariableMap = {};\n\n const assign = (name: string, value: string | number | undefined) => {\n if (value === undefined) return;\n map[name] = String(value);\n };\n\n Object.entries(tokens.colors).forEach(([group, scale]) => {\n Object.entries(scale).forEach(([step, value]) => {\n assign(toVariableName(prefix, 'color', group, step), value);\n });\n });\n\n Object.entries(tokens.spacing).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'space', key), value);\n });\n\n Object.entries(tokens.radii).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'radius', key), value);\n });\n\n Object.entries(tokens.typography.families).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'font-family', key), value);\n });\n\n Object.entries(tokens.typography.scale).forEach(([key, entry]) => {\n assign(toVariableName(prefix, 'font', key, 'size'), entry.fontSize);\n assign(toVariableName(prefix, 'font', key, 'line-height'), entry.lineHeight);\n assign(toVariableName(prefix, 'font', key, 'weight'), entry.fontWeight);\n assign(toVariableName(prefix, 'font', key, 'letter-spacing'), entry.letterSpacing);\n });\n\n Object.entries(tokens.shadows).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'shadow', key), value);\n });\n\n Object.entries(tokens.breakpoints).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'breakpoint', key), value);\n });\n\n Object.entries(tokens.zIndex).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'z-index', key), value);\n });\n\n Object.entries(tokens.transitions.duration).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'duration', key), value);\n });\n\n Object.entries(tokens.transitions.easing).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'easing', key), value);\n });\n\n Object.entries(tokens.opacity).forEach(([key, value]) => {\n assign(toVariableName(prefix, 'opacity', key), value);\n });\n\n // Accessibility tokens\n assign(toVariableName(prefix, 'focus-ring-width'), tokens.accessibility.focusRing.width);\n assign(toVariableName(prefix, 'focus-ring-offset'), tokens.accessibility.focusRing.offset);\n assign(toVariableName(prefix, 'focus-ring-style'), tokens.accessibility.focusRing.style);\n assign(toVariableName(prefix, 'min-touch-target'), tokens.accessibility.minTouchTarget);\n assign(toVariableName(prefix, 'min-text-size'), tokens.accessibility.minTextSize);\n\n // Button tokens\n Object.entries(tokens.buttons).forEach(([variant, states]) => {\n Object.entries(states).forEach(([state, value]) => {\n assign(toVariableName(prefix, 'button', variant, state), value);\n });\n });\n\n // Form tokens\n Object.entries(tokens.forms).forEach(([state, properties]) => {\n Object.entries(properties).forEach(([prop, value]) => {\n if (value) assign(toVariableName(prefix, 'form', state, prop), value);\n });\n });\n\n // Animation tokens\n Object.entries(tokens.animations).forEach(([name, animation]) => {\n assign(toVariableName(prefix, 'animation', name, 'duration'), animation.duration);\n assign(toVariableName(prefix, 'animation', name, 'easing'), animation.easing);\n assign(toVariableName(prefix, 'animation', name, 'keyframes'), animation.keyframes);\n });\n\n return map;\n};\n\nexport const generateCssVariables = (tokens: Tokens, options: CssVariableOptions = {}): string => {\n const selector = options.selector ?? DEFAULT_SELECTOR;\n const declarations = createCssVariableMap(tokens, options);\n const lines = Object.entries(declarations)\n .map(([name, value]) => ` ${name}: ${value};`)\n .join('\\n');\n\n return `${selector} {\\n${lines}\\n}\\n`;\n};\n","import coreTokens from '../tokens/core.json';\n\nimport { generateCssVariables } from './css';\nimport type { SpectreTokens, TailwindTheme, Tokens } from './types';\n\nexport type { TailwindTheme, Tokens, SpectreTokens, ColorScale, TokenScale, TypographyTokens, TransitionTokens, AccessibilityTokens, ButtonStateTokens, FormStateTokens, AnimationEntry } from './types';\n\nconst tokens: SpectreTokens = coreTokens as SpectreTokens;\n\nconst sanitizeFontFamily = (value: string): string[] =>\n value\n .split(',')\n .map((segment) => segment.trim().replace(/^['\"]|['\"]$/g, ''))\n .filter(Boolean);\n\nconst createTailwindTheme = (source: Tokens = tokens as Tokens): TailwindTheme => {\n const colors: TailwindTheme['colors'] = {};\n Object.entries(source.colors).forEach(([group, scale]) => {\n colors[group] = { ...scale };\n });\n\n const fontFamily = Object.entries(source.typography.families).reduce<Record<string, string[]>>((acc, [key, value]) => {\n acc[key] = sanitizeFontFamily(value);\n return acc;\n }, {});\n\n const fontSize = Object.entries(source.typography.scale).reduce<TailwindTheme['fontSize']>((acc, [key, entry]) => {\n acc[key] = [\n entry.fontSize,\n {\n lineHeight: entry.lineHeight,\n ...(entry.fontWeight ? { fontWeight: entry.fontWeight } : {}),\n ...(entry.letterSpacing ? { letterSpacing: entry.letterSpacing } : {})\n }\n ];\n return acc;\n }, {});\n\n return {\n colors,\n spacing: { ...source.spacing },\n borderRadius: { ...source.radii },\n fontFamily,\n fontSize,\n boxShadow: { ...source.shadows },\n screens: { ...source.breakpoints },\n zIndex: { ...source.zIndex },\n transitionDuration: { ...source.transitions.duration },\n transitionTimingFunction: { ...source.transitions.easing },\n opacity: { ...source.opacity }\n };\n};\n\nexport const tailwindTheme = createTailwindTheme(tokens as Tokens);\nexport const tailwindPreset = {\n theme: tailwindTheme\n};\n\nexport { tokens, generateCssVariables };\nexport default tokens;\n"],"mappings":"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","names":["tokens"]}
package/package.json CHANGED
@@ -1,20 +1,51 @@
1
1
  {
2
2
  "name": "@phcdevworks/spectre-tokens",
3
- "version": "0.0.1",
3
+ "version": "0.0.3",
4
4
  "description": "Spectre design tokens with JS, TS, Tailwind, and CSS variable outputs.",
5
+ "keywords": [
6
+ "phcdevworks",
7
+ "spectre",
8
+ "spectre-tokens",
9
+ "design-tokens",
10
+ "tokens",
11
+ "css-variables",
12
+ "css-custom-properties",
13
+ "tailwindcss",
14
+ "tailwind-theme",
15
+ "theming",
16
+ "ui-design",
17
+ "typescript",
18
+ "javascript"
19
+ ],
20
+ "author": "PHCDevworks",
21
+ "license": "MIT",
22
+ "funding": [
23
+ {
24
+ "type": "github",
25
+ "url": "https://github.com/sponsors/phcdevworks"
26
+ },
27
+ {
28
+ "type": "buymeacoffee",
29
+ "url": "https://buymeacoffee.com/phcdevworks"
30
+ }
31
+ ],
32
+ "repository": {
33
+ "type": "git",
34
+ "url": "https://github.com/phcdevworks/spectre-tokens.git"
35
+ },
36
+ "bugs": {
37
+ "url": "https://github.com/phcdevworks/spectre-tokens/issues"
38
+ },
39
+ "homepage": "https://github.com/phcdevworks/spectre-tokens#readme",
40
+ "type": "module",
5
41
  "main": "./dist/index.cjs",
6
42
  "module": "./dist/index.js",
7
43
  "types": "./dist/index.d.ts",
8
- "scripts": {
9
- "build": "npm run build:ts && npm run build:css",
10
- "build:ts": "tsup",
11
- "build:css": "node scripts/build-css.js"
12
- },
13
44
  "exports": {
14
45
  ".": {
15
- "types": "./dist/index.d.ts",
16
46
  "import": "./dist/index.js",
17
- "require": "./dist/index.cjs"
47
+ "require": "./dist/index.cjs",
48
+ "types": "./dist/index.d.ts"
18
49
  },
19
50
  "./index.css": "./dist/index.css"
20
51
  },
@@ -23,19 +54,18 @@
23
54
  "tokens"
24
55
  ],
25
56
  "sideEffects": false,
26
- "repository": {
27
- "type": "git",
28
- "url": "git+https://github.com/phcdevworks/spectre-tokens.git"
57
+ "scripts": {
58
+ "build": "npm run build:ts && npm run build:css",
59
+ "build:ts": "tsup",
60
+ "build:css": "node scripts/build-css.js",
61
+ "check:tokens": "tsx scripts/check-tokens-regression.ts"
29
62
  },
30
- "keywords": [],
31
- "author": "",
32
- "license": "MIT",
33
- "bugs": {
34
- "url": "https://github.com/phcdevworks/spectre-tokens/issues"
63
+ "publishConfig": {
64
+ "access": "public"
35
65
  },
36
- "homepage": "https://github.com/phcdevworks/spectre-tokens#readme",
37
- "type": "module",
38
66
  "devDependencies": {
67
+ "ts-node": "^10.9.2",
68
+ "tsx": "^4.16.2",
39
69
  "tsup": "^8.5.1",
40
70
  "typescript": "^5.9.3"
41
71
  }
package/tokens/core.json CHANGED
@@ -90,6 +90,60 @@
90
90
  "info": "#3b82f6"
91
91
  }
92
92
  },
93
+ "surface": {
94
+ "page": {
95
+ "value": "#0f172a",
96
+ "description": "primary app background"
97
+ },
98
+ "card": {
99
+ "value": "#1e293b",
100
+ "description": "containers and tiles"
101
+ },
102
+ "input": {
103
+ "value": "#334155",
104
+ "description": "form inputs, textareas"
105
+ },
106
+ "overlay": {
107
+ "value": "#1e293b",
108
+ "description": "modals, dropdowns, flyouts"
109
+ }
110
+ },
111
+ "text": {
112
+ "onPage": {
113
+ "default": "#f8fafc",
114
+ "muted": "#cbd5f5",
115
+ "subtle": "#94a3b8"
116
+ },
117
+ "onSurface": {
118
+ "default": "#f1f5f9",
119
+ "muted": "#cbd5f5",
120
+ "subtle": "#94a3b8"
121
+ }
122
+ },
123
+ "component": {
124
+ "card": {
125
+ "text": "#f1f5f9",
126
+ "textMuted": "#cbd5f5"
127
+ },
128
+ "input": {
129
+ "text": "#f1f5f9",
130
+ "placeholder": "#94a3b8"
131
+ },
132
+ "button": {
133
+ "textDefault": "#f1f5f9",
134
+ "textOnPrimary": "#ffffff"
135
+ }
136
+ },
137
+ "modes": {
138
+ "default": {
139
+ "surface": {},
140
+ "text": {}
141
+ },
142
+ "dark": {
143
+ "surface": {},
144
+ "text": {}
145
+ }
146
+ },
93
147
  "opacity": {
94
148
  "disabled": "0.38",
95
149
  "hover": "0.92",
@@ -200,6 +254,10 @@
200
254
  "lg": "8px",
201
255
  "pill": "999px"
202
256
  },
257
+ "borders": {
258
+ "card": "#334155",
259
+ "input": "#cbd5f5"
260
+ },
203
261
  "typography": {
204
262
  "families": {
205
263
  "sans": "'Inter', 'Helvetica Neue', Arial, sans-serif",