@charstudios/pallet 0.1.0 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (18) hide show
  1. package/README.md +28 -73
  2. package/dist/{chunk-4GSIZANE.js → chunk-3JRKA6NS.js} +124 -10
  3. package/dist/chunk-3JRKA6NS.js.map +1 -0
  4. package/dist/{index-DcC8QTrl.d.ts → index-wWkmeDkd.d.ts} +13 -6
  5. package/dist/index.d.ts +13 -6
  6. package/dist/index.js +124 -10
  7. package/dist/index.js.map +1 -1
  8. package/dist/presets/index.d.ts +1 -1
  9. package/dist/presets/index.js +1 -1
  10. package/dist/server.d.ts +2 -2
  11. package/dist/server.js +1 -1
  12. package/dist/styles/index.css +3 -2
  13. package/dist/styles/variant-flat.css +200 -17
  14. package/dist/styles/variant-frosted.css +361 -0
  15. package/dist/styles/variant-toon.css +277 -0
  16. package/package.json +3 -2
  17. package/dist/chunk-4GSIZANE.js.map +0 -1
  18. package/dist/styles/variant-launch.css +0 -75
package/README.md CHANGED
@@ -5,7 +5,7 @@ A runtime, hook-driven theming layer for **shadcn/ui** apps. Pallet gives you an
5
5
  Built for reuse across every Char Studios product: install it once, wrap your app, and every project shares the same theming system.
6
6
 
7
7
  - **Runtime theming** — change any token live; no rebuild, no CSS regeneration.
8
- - **Variants/skins** — ship `flat` (crisp, default shadcn look) and `launch` (soft, elevated, pill-shaped), or define your own.
8
+ - **Variants/skins** — ship `flat` (crisp), `toon` (soft pills), and `frosted` (glassmorphism), covering the full shadcn `data-slot` surface set — or define your own.
9
9
  - **Full token control** — colors (light + dark, OKLCH), typography (with Google Fonts auto-loading), radius scale, shadow ramp, density, and motion.
10
10
  - **Presets** — start from a named preset and layer overrides on top; `reset()` returns to baseline.
11
11
  - **SSR-safe** — inline the initial theme from a Server Component to avoid a flash of the wrong theme.
@@ -26,7 +26,6 @@ Built for reuse across every Char Studios product: install it once, wrap your ap
26
26
  - [Custom presets and variants](#custom-presets-and-variants)
27
27
  - [Token reference](#token-reference)
28
28
  - [TypeScript](#typescript)
29
- - [Publishing](#publishing)
30
29
  - [FAQ](#faq)
31
30
 
32
31
  ---
@@ -46,7 +45,7 @@ ThemeConfig (preset + overrides)
46
45
  ▼
47
46
  CSS variables ──inject──▶ :root / scope element
48
47
  │ │
49
- │ data-pallet-variant="launch"
48
+ │ data-pallet-variant="toon"
50
49
  ▼ ▼
51
50
  your shadcn components ◀── variant stylesheet skins
52
51
  ```
@@ -90,7 +89,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
90
89
  return (
91
90
  <html lang="en" suppressHydrationWarning>
92
91
  <body>
93
- <ThemeProvider defaultPreset="launch" defaultScheme="system" storageKey="app-theme">
92
+ <ThemeProvider defaultPreset="toon" defaultScheme="system" storageKey="app-theme">
94
93
  {children}
95
94
  </ThemeProvider>
96
95
  </body>
@@ -99,7 +98,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
99
98
  }
100
99
  ```
101
100
 
102
- That's it — your shadcn components now render with the `launch` theme, honoring system light/dark, and any user changes persist under `app-theme`.
101
+ That's it — your shadcn components now render with the `toon` theme, honoring system light/dark, and any user changes persist under `app-theme`.
103
102
 
104
103
  ### 3. Change the theme at runtime
105
104
 
@@ -114,7 +113,8 @@ export function ThemeButtons() {
114
113
 
115
114
  return (
116
115
  <div className="flex gap-2">
117
- <button onClick={() => applyPreset("launch")}>Launch</button>
116
+ <button onClick={() => applyPreset("toon")}>Toon</button>
117
+ <button onClick={() => applyPreset("frosted")}>Frosted</button>
118
118
  <button onClick={() => applyPreset("flat")}>Flat</button>
119
119
  <button onClick={() => setPrimary("oklch(0.7 0.15 300)")}>Purple</button>
120
120
  <button onClick={() => setRadius("0.25rem")}>Sharp corners</button>
@@ -132,13 +132,15 @@ export function ThemeButtons() {
132
132
  | Preset | Look |
133
133
  | -------- | ------------------------------------------------------------------- |
134
134
  | `flat` | Crisp hairline borders, minimal shadows, tighter radius. Default shadcn feel (mirrors Quill's current look). |
135
- | `launch` | Soft and elevated: pill-shaped controls, gentle tinted shadows, near-borderless filled inputs, glowing focus rings, periwinkle primary. |
135
+ | `toon` | Soft and elevated: pill-shaped controls, gentle tinted shadows, near-borderless filled inputs, glowing focus rings, periwinkle primary. |
136
+ | `frosted` | Frosted glass: translucent surfaces, backdrop blur, luminous borders, and icy sky-blue accents. |
136
137
 
137
138
  ```tsx
138
- import { presets, flat, launch, getPreset } from "@charstudios/pallet/presets";
139
+ import { presets, flat, toon, frosted, getPreset } from "@charstudios/pallet/presets";
139
140
 
140
141
  presets.flat; // ThemeConfig
141
- getPreset("launch"); // ThemeConfig | undefined
142
+ getPreset("toon"); // ThemeConfig | undefined
143
+ getPreset("frosted"); // ThemeConfig | undefined
142
144
  ```
143
145
 
144
146
  Set the starting preset via `defaultPreset` on the provider, or switch live with `usePreset().applyPreset(...)`.
@@ -247,7 +249,8 @@ export function ThemeEditor() {
247
249
  Variant
248
250
  <select onChange={(e) => c.setVariant(e.target.value)}>
249
251
  <option value="flat">Flat</option>
250
- <option value="launch">Launch</option>
252
+ <option value="toon">Toon</option>
253
+ <option value="frosted">Frosted</option>
251
254
  </select>
252
255
  </label>
253
256
 
@@ -263,7 +266,9 @@ export function ThemeEditor() {
263
266
 
264
267
  ## Variants (skins)
265
268
 
266
- A variant is a named "skin" applied via the `data-pallet-variant` attribute (set automatically by the provider). The shipped stylesheets restyle shadcn surfaces that tokens can't reach on their own — shadows, border treatment, and pill shaping.
269
+ A variant is a named "skin" applied via the `data-pallet-variant` attribute (set automatically by the provider). The shipped stylesheets restyle shadcn surfaces that tokens can't reach on their own — shadows, border treatment, pill shaping, and (for `frosted`) backdrop-blur glass.
270
+
271
+ Each built-in skin targets the full common shadcn `data-slot` set: controls, cards/alerts/tables/sidebar, overlays (dialogs, sheets, menus, popovers, tooltips), and chrome (badges, kbd, breadcrumbs, pagination, etc.).
267
272
 
268
273
  Import all skins:
269
274
 
@@ -275,13 +280,13 @@ Or cherry-pick to reduce CSS:
275
280
 
276
281
  ```css
277
282
  @import "@charstudios/pallet/styles/base";
278
- @import "@charstudios/pallet/styles/launch";
283
+ @import "@charstudios/pallet/styles/frosted";
279
284
  ```
280
285
 
281
286
  Switch at runtime:
282
287
 
283
288
  ```tsx
284
- useThemeControls().setVariant("launch");
289
+ useThemeControls().setVariant("frosted");
285
290
  ```
286
291
 
287
292
  The variant stylesheets are wrapped in the `pallet-variants` cascade layer, so your own app styles always take precedence.
@@ -295,7 +300,7 @@ For app-wide theming Pallet writes variables to `<html>` on mount. To avoid a br
295
300
  ```tsx
296
301
  // app/layout.tsx (Server Component)
297
302
  import { themeToCss } from "@charstudios/pallet/server";
298
- import { launch } from "@charstudios/pallet/presets";
303
+ import { toon } from "@charstudios/pallet/presets";
299
304
 
300
305
  export default function RootLayout({ children }: { children: React.ReactNode }) {
301
306
  return (
@@ -303,7 +308,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
303
308
  <head>
304
309
  <style
305
310
  id="pallet-ssr"
306
- dangerouslySetInnerHTML={{ __html: themeToCss(launch) }}
311
+ dangerouslySetInnerHTML={{ __html: themeToCss(toon) }}
307
312
  />
308
313
  </head>
309
314
  <body>{/* <ThemeProvider>…</ThemeProvider> */}</body>
@@ -317,7 +322,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
317
322
  **Scoped theming / previews:** use `scope="self"` on the provider to apply the theme to a wrapper `<div>` instead of the document root. This also emits SSR inline styles automatically — ideal for rendering a live preview of a different theme inside a settings page.
318
323
 
319
324
  ```tsx
320
- <ThemeProvider defaultPreset="launch" scope="self">
325
+ <ThemeProvider defaultPreset="toon" scope="self">
321
326
  <PreviewSurface />
322
327
  </ThemeProvider>
323
328
  ```
@@ -331,13 +336,13 @@ export default function RootLayout({ children }: { children: React.ReactNode })
331
336
  A preset is just a `ThemeConfig`. Start from a built-in and tweak:
332
337
 
333
338
  ```tsx
334
- import { launch } from "@charstudios/pallet/presets";
339
+ import { toon } from "@charstudios/pallet/presets";
335
340
  import { deepMerge } from "@charstudios/pallet/server";
336
341
  import type { ThemeConfig } from "@charstudios/pallet/server";
337
342
 
338
- export const brand: ThemeConfig = deepMerge(launch, {
343
+ export const brand: ThemeConfig = deepMerge(toon, {
339
344
  name: "brand",
340
- variant: "launch",
345
+ variant: "toon",
341
346
  colors: { light: { primary: "oklch(0.62 0.2 15)" }, dark: { primary: "oklch(0.6 0.2 15)" } },
342
347
  radius: { base: "0.75rem" },
343
348
  });
@@ -408,65 +413,15 @@ import type {
408
413
  | -------------------------------- | ---------------------------------------------------- | ---------------------- |
409
414
  | `@charstudios/pallet` | `ThemeProvider`, hooks (+ re-exports of the below) | Client components |
410
415
  | `@charstudios/pallet/server` | `themeToCss`, `resolveTheme`, `deepMerge`, types, … | Server or client |
411
- | `@charstudios/pallet/presets` | `flat`, `launch`, `presets`, `getPreset` | Server or client |
416
+ | `@charstudios/pallet/presets` | `flat`, `toon`, `frosted`, `presets`, `getPreset` | Server or client |
412
417
  | `@charstudios/pallet/styles` | All variant CSS | CSS `@import` |
413
-
414
- ---
415
-
416
- ## Publishing
417
-
418
- Publishes to npm as `@charstudios/pallet` via [trusted publishing](https://docs.npmjs.com/trusted-publishers) (OIDC) from GitHub Actions — no long-lived npm tokens.
419
-
420
- ### One-time setup on npmjs.com
421
-
422
- 1. Publish the package once (or create it on npm) so package settings exist.
423
- 2. Open **[@charstudios/pallet](https://www.npmjs.com/package/@charstudios/pallet) → Settings → Trusted Publisher**.
424
- 3. Choose **GitHub Actions** and set:
425
- - **Organization or user:** `Char-Studios`
426
- - **Repository:** `Pallet`
427
- - **Workflow filename:** `publish.yml` (filename only, not the path)
428
- - **Allowed actions:** `npm publish`
429
- 4. Optional hardening: **Settings → Publishing access → Require two-factor authentication and disallow tokens**.
430
-
431
- ### Release
432
-
433
- ```bash
434
- npm version patch # or minor | major — creates a commit + tag
435
- git push && git push --tags
436
- ```
437
-
438
- Pushing a `v*` tag runs [`.github/workflows/publish.yml`](.github/workflows/publish.yml), which authenticates with OIDC and runs `npm publish`.
439
-
440
- Notes:
441
-
442
- - Requires Node **22.14+** / npm **11.5.1+** in CI (the workflow uses Node 24).
443
- - `publishConfig.access: "public"` publishes the scoped package publicly on a free account.
444
- - Only `dist/` is published (see `.npmignore` / `files`).
445
- - Provenance attestations need a **public** GitHub repo; this repo is currently private.
446
-
447
- ### Local development / linking
448
-
449
- To use it in another project before publishing:
450
-
451
- ```bash
452
- # in the pallet folder
453
- npm run build
454
- npm link
455
- # in the consuming project
456
- npm link @charstudios/pallet
457
- ```
458
-
459
- Or reference it directly in the consumer's `package.json`:
460
-
461
- ```json
462
- { "dependencies": { "@charstudios/pallet": "file:../pallet" } }
463
- ```
418
+ | `@charstudios/pallet/styles/frosted` | Frosted glass skin only | CSS `@import` |
464
419
 
465
420
  ---
466
421
 
467
422
  ## FAQ
468
423
 
469
- **Does this modify my shadcn components?** No. It only injects CSS variables and adds a `data-pallet-variant` attribute; the variant stylesheets restyle via `data-slot` selectors.
424
+ **Does this modify my shadcn components?** No. It only injects CSS variables and adds a `data-pallet-variant` attribute; the variant stylesheets restyle via `data-slot` selectors across the common shadcn surface set. Components need modern shadcn `data-slot` attributes for the skins to attach.
470
425
 
471
426
  **Does it replace `next-themes`?** It can. Pallet manages the `.dark` class and light/dark/system itself. If you already use `next-themes`, use `scope="self"` or let one own the `.dark` class to avoid conflicts.
472
427
 
@@ -476,4 +431,4 @@ Or reference it directly in the consumer's `package.json`:
476
431
 
477
432
  ---
478
433
 
479
- MIT © Char Studios
434
+ MIT © Char Studios
package/dist/{chunk-4GSIZANE.js → chunk-3JRKA6NS.js} RENAMED
@@ -102,8 +102,121 @@ var flat = {
102
102
  }
103
103
  };
104
104
 
105
- // src/presets/launch.ts
105
+ // src/presets/frosted.ts
106
106
  var light2 = {
107
+ background: "oklch(0.94 0.02 240)",
108
+ foreground: "oklch(0.24 0.03 255)",
109
+ card: "oklch(1 0.01 240 / 55%)",
110
+ cardForeground: "oklch(0.24 0.03 255)",
111
+ popover: "oklch(1 0.01 240 / 62%)",
112
+ popoverForeground: "oklch(0.24 0.03 255)",
113
+ primary: "oklch(0.62 0.12 240)",
114
+ primaryForeground: "oklch(0.99 0.005 240)",
115
+ secondary: "oklch(0.92 0.02 240 / 70%)",
116
+ secondaryForeground: "oklch(0.3 0.04 255)",
117
+ muted: "oklch(0.93 0.015 240 / 65%)",
118
+ mutedForeground: "oklch(0.5 0.03 250)",
119
+ accent: "oklch(0.9 0.04 230 / 70%)",
120
+ accentForeground: "oklch(0.35 0.08 245)",
121
+ destructive: "oklch(0.6 0.2 25)",
122
+ destructiveForeground: "oklch(0.99 0 0)",
123
+ border: "oklch(0.85 0.02 240 / 55%)",
124
+ input: "oklch(0.97 0.01 240 / 50%)",
125
+ ring: "oklch(0.62 0.14 235)",
126
+ chart1: "oklch(0.62 0.12 240)",
127
+ chart2: "oklch(0.68 0.1 200)",
128
+ chart3: "oklch(0.58 0.14 280)",
129
+ chart4: "oklch(0.72 0.08 180)",
130
+ chart5: "oklch(0.66 0.11 320)",
131
+ sidebar: "oklch(0.96 0.015 240 / 55%)",
132
+ sidebarForeground: "oklch(0.24 0.03 255)",
133
+ sidebarPrimary: "oklch(0.62 0.12 240)",
134
+ sidebarPrimaryForeground: "oklch(0.99 0.005 240)",
135
+ sidebarAccent: "oklch(0.9 0.04 230 / 70%)",
136
+ sidebarAccentForeground: "oklch(0.35 0.08 245)",
137
+ sidebarBorder: "oklch(0.85 0.02 240 / 50%)",
138
+ sidebarRing: "oklch(0.62 0.14 235)"
139
+ };
140
+ var dark2 = {
141
+ background: "oklch(0.18 0.03 260)",
142
+ foreground: "oklch(0.96 0.01 240)",
143
+ card: "oklch(0.28 0.04 260 / 45%)",
144
+ cardForeground: "oklch(0.96 0.01 240)",
145
+ popover: "oklch(0.3 0.04 260 / 52%)",
146
+ popoverForeground: "oklch(0.96 0.01 240)",
147
+ primary: "oklch(0.72 0.12 230)",
148
+ primaryForeground: "oklch(0.18 0.03 260)",
149
+ secondary: "oklch(0.32 0.03 260 / 55%)",
150
+ secondaryForeground: "oklch(0.96 0.01 240)",
151
+ muted: "oklch(0.3 0.03 260 / 50%)",
152
+ mutedForeground: "oklch(0.72 0.03 250)",
153
+ accent: "oklch(0.36 0.05 250 / 55%)",
154
+ accentForeground: "oklch(0.92 0.03 230)",
155
+ destructive: "oklch(0.68 0.18 22)",
156
+ destructiveForeground: "oklch(0.99 0 0)",
157
+ border: "oklch(1 0 0 / 14%)",
158
+ input: "oklch(1 0 0 / 10%)",
159
+ ring: "oklch(0.7 0.12 230)",
160
+ chart1: "oklch(0.72 0.12 230)",
161
+ chart2: "oklch(0.7 0.1 200)",
162
+ chart3: "oklch(0.66 0.14 280)",
163
+ chart4: "oklch(0.74 0.08 180)",
164
+ chart5: "oklch(0.68 0.11 320)",
165
+ sidebar: "oklch(0.22 0.035 260 / 50%)",
166
+ sidebarForeground: "oklch(0.96 0.01 240)",
167
+ sidebarPrimary: "oklch(0.72 0.12 230)",
168
+ sidebarPrimaryForeground: "oklch(0.18 0.03 260)",
169
+ sidebarAccent: "oklch(0.36 0.05 250 / 55%)",
170
+ sidebarAccentForeground: "oklch(0.92 0.03 230)",
171
+ sidebarBorder: "oklch(1 0 0 / 12%)",
172
+ sidebarRing: "oklch(0.7 0.12 230)"
173
+ };
174
+ var frosted = {
175
+ name: "frosted",
176
+ variant: "frosted",
177
+ colors: { light: light2, dark: dark2 },
178
+ typography: {
179
+ sans: '"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif',
180
+ heading: '"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif',
181
+ mono: 'ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace',
182
+ googleFonts: ["Inter"]
183
+ },
184
+ radius: {
185
+ base: "1rem",
186
+ scale: {
187
+ sm: 0.5,
188
+ md: 0.75,
189
+ lg: 1,
190
+ xl: 1.25,
191
+ "2xl": 1.5,
192
+ "3xl": 1.75,
193
+ "4xl": 2
194
+ }
195
+ },
196
+ elevation: {
197
+ shadows: {
198
+ xs: "0 1px 2px 0 oklch(0.45 0.08 240 / 0.06)",
199
+ sm: "0 2px 10px -2px oklch(0.45 0.08 240 / 0.12), 0 1px 3px -1px oklch(0 0 0 / 0.04)",
200
+ md: "0 8px 24px -8px oklch(0.45 0.08 240 / 0.18), 0 2px 8px -2px oklch(0 0 0 / 0.05)",
201
+ lg: "0 18px 40px -12px oklch(0.45 0.08 240 / 0.22), 0 6px 14px -6px oklch(0 0 0 / 0.06)",
202
+ xl: "0 28px 56px -16px oklch(0.45 0.08 240 / 0.28), 0 10px 20px -8px oklch(0 0 0 / 0.07)"
203
+ },
204
+ borderStrength: 0.65,
205
+ level: "lg"
206
+ },
207
+ density: {
208
+ spacing: "0.25rem",
209
+ scale: 1.05
210
+ },
211
+ motion: {
212
+ duration: 260,
213
+ easing: "cubic-bezier(0.22, 1, 0.36, 1)",
214
+ intensity: 1
215
+ }
216
+ };
217
+
218
+ // src/presets/toon.ts
219
+ var light3 = {
107
220
  background: "oklch(0.98 0.003 264)",
108
221
  foreground: "oklch(0.21 0.03 264)",
109
222
  card: "oklch(1 0 0)",
@@ -137,7 +250,7 @@ var light2 = {
137
250
  sidebarBorder: "oklch(0.92 0.008 264)",
138
251
  sidebarRing: "oklch(0.6 0.19 264)"
139
252
  };
140
- var dark2 = {
253
+ var dark3 = {
141
254
  background: "oklch(0.19 0.02 264)",
142
255
  foreground: "oklch(0.97 0.005 264)",
143
256
  card: "oklch(0.23 0.024 264)",
@@ -171,10 +284,10 @@ var dark2 = {
171
284
  sidebarBorder: "oklch(1 0 0 / 10%)",
172
285
  sidebarRing: "oklch(0.65 0.17 264)"
173
286
  };
174
- var launch = {
175
- name: "launch",
176
- variant: "launch",
177
- colors: { light: light2, dark: dark2 },
287
+ var toon = {
288
+ name: "toon",
289
+ variant: "toon",
290
+ colors: { light: light3, dark: dark3 },
178
291
  typography: {
179
292
  sans: '"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif',
180
293
  heading: '"Plus Jakarta Sans", "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif',
@@ -219,13 +332,14 @@ var launch = {
219
332
  // src/presets/index.ts
220
333
  var presets = {
221
334
  flat,
222
- launch
335
+ toon,
336
+ frosted
223
337
  };
224
338
  function getPreset(name) {
225
339
  return presets[name];
226
340
  }
227
341
  var defaultPreset = flat;
228
342
 
229
- export { defaultPreset, flat, getPreset, launch, presets };
230
- //# sourceMappingURL=chunk-4GSIZANE.js.map
231
- //# sourceMappingURL=chunk-4GSIZANE.js.map
343
+ export { defaultPreset, flat, frosted, getPreset, presets, toon };
344
+ //# sourceMappingURL=chunk-3JRKA6NS.js.map
345
+ //# sourceMappingURL=chunk-3JRKA6NS.js.map
package/dist/chunk-3JRKA6NS.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/presets/flat.ts","../src/presets/frosted.ts","../src/presets/toon.ts","../src/presets/index.ts"],"names":["light","dark"],"mappings":"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","file":"chunk-3JRKA6NS.js","sourcesContent":["import type { ColorTokens, ThemeConfig } from \"../core/types\";\r\n\r\nconst light: ColorTokens = {\r\n background: \"oklch(1 0 0)\",\r\n foreground: \"oklch(0.148 0.004 228.8)\",\r\n card: \"oklch(1 0 0)\",\r\n cardForeground: \"oklch(0.148 0.004 228.8)\",\r\n popover: \"oklch(1 0 0)\",\r\n popoverForeground: \"oklch(0.148 0.004 228.8)\",\r\n primary: \"oklch(0.514 0.222 16.935)\",\r\n primaryForeground: \"oklch(0.969 0.015 12.422)\",\r\n secondary: \"oklch(0.967 0.001 286.375)\",\r\n secondaryForeground: \"oklch(0.21 0.006 285.885)\",\r\n muted: \"oklch(0.963 0.002 197.1)\",\r\n mutedForeground: \"oklch(0.56 0.021 213.5)\",\r\n accent: \"oklch(0.963 0.002 197.1)\",\r\n accentForeground: \"oklch(0.218 0.008 223.9)\",\r\n destructive: \"oklch(0.577 0.245 27.325)\",\r\n destructiveForeground: \"oklch(0.985 0 0)\",\r\n border: \"oklch(0.925 0.005 214.3)\",\r\n input: \"oklch(0.925 0.005 214.3)\",\r\n ring: \"oklch(0.723 0.014 214.4)\",\r\n chart1: \"oklch(0.81 0.117 11.638)\",\r\n chart2: \"oklch(0.645 0.246 16.439)\",\r\n chart3: \"oklch(0.586 0.253 17.585)\",\r\n chart4: \"oklch(0.514 0.222 16.935)\",\r\n chart5: \"oklch(0.455 0.188 13.697)\",\r\n sidebar: \"oklch(0.987 0.002 197.1)\",\r\n sidebarForeground: \"oklch(0.148 0.004 228.8)\",\r\n sidebarPrimary: \"oklch(0.586 0.253 17.585)\",\r\n sidebarPrimaryForeground: \"oklch(0.969 0.015 12.422)\",\r\n sidebarAccent: \"oklch(0.963 0.002 197.1)\",\r\n sidebarAccentForeground: \"oklch(0.218 0.008 223.9)\",\r\n sidebarBorder: \"oklch(0.925 0.005 214.3)\",\r\n sidebarRing: \"oklch(0.723 0.014 214.4)\",\r\n};\r\n\r\nconst dark: ColorTokens = {\r\n background: \"oklch(0.148 0.004 228.8)\",\r\n foreground: \"oklch(0.987 0.002 197.1)\",\r\n card: \"oklch(0.218 0.008 223.9)\",\r\n cardForeground: \"oklch(0.987 0.002 197.1)\",\r\n popover: \"oklch(0.218 0.008 223.9)\",\r\n popoverForeground: \"oklch(0.987 0.002 197.1)\",\r\n primary: \"oklch(0.455 0.188 13.697)\",\r\n primaryForeground: \"oklch(0.969 0.015 12.422)\",\r\n secondary: \"oklch(0.274 0.006 286.033)\",\r\n secondaryForeground: \"oklch(0.985 0 0)\",\r\n muted: \"oklch(0.275 0.011 216.9)\",\r\n mutedForeground: \"oklch(0.723 0.014 214.4)\",\r\n accent: \"oklch(0.275 0.011 216.9)\",\r\n accentForeground: \"oklch(0.987 0.002 197.1)\",\r\n destructive: \"oklch(0.704 0.191 22.216)\",\r\n destructiveForeground: \"oklch(0.985 0 0)\",\r\n border: \"oklch(1 0 0 / 10%)\",\r\n input: \"oklch(1 0 0 / 15%)\",\r\n ring: \"oklch(0.56 0.021 213.5)\",\r\n chart1: \"oklch(0.81 0.117 11.638)\",\r\n chart2: \"oklch(0.645 0.246 16.439)\",\r\n chart3: \"oklch(0.586 0.253 17.585)\",\r\n chart4: \"oklch(0.514 0.222 16.935)\",\r\n chart5: \"oklch(0.455 0.188 13.697)\",\r\n sidebar: \"oklch(0.17 0.006 228.8)\",\r\n sidebarForeground: \"oklch(0.987 0.002 197.1)\",\r\n sidebarPrimary: \"oklch(0.514 0.222 16.935)\",\r\n sidebarPrimaryForeground: \"oklch(0.969 0.015 12.422)\",\r\n sidebarAccent: \"oklch(0.24 0.008 228.8)\",\r\n sidebarAccentForeground: \"oklch(0.987 0.002 197.1)\",\r\n sidebarBorder: \"oklch(1 0 0 / 10%)\",\r\n sidebarRing: \"oklch(0.56 0.021 213.5)\",\r\n};\r\n\r\n/**\r\n * The \"flat\" preset: crisp hairline borders, minimal shadows, tighter radius.\r\n * Mirrors the default Quill look and serves as the baseline variant.\r\n */\r\nexport const flat: ThemeConfig = {\r\n name: \"flat\",\r\n variant: \"flat\",\r\n colors: { light, dark },\r\n typography: {\r\n sans: 'ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif',\r\n heading:\r\n 'ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif',\r\n mono: 'ui-monospace, SFMono-Regular, Menlo, Consolas, \"Liberation Mono\", monospace',\r\n googleFonts: [],\r\n },\r\n radius: {\r\n base: \"0.45rem\",\r\n },\r\n elevation: {\r\n shadows: {\r\n xs: \"0 1px 2px 0 oklch(0 0 0 / 0.04)\",\r\n sm: \"0 1px 3px 0 oklch(0 0 0 / 0.06), 0 1px 2px -1px oklch(0 0 0 / 0.06)\",\r\n md: \"0 2px 6px -1px oklch(0 0 0 / 0.07), 0 1px 4px -2px oklch(0 0 0 / 0.06)\",\r\n lg: \"0 8px 16px -4px oklch(0 0 0 / 0.08), 0 2px 6px -2px oklch(0 0 0 / 0.06)\",\r\n xl: \"0 16px 32px -8px oklch(0 0 0 / 0.10), 0 4px 10px -4px oklch(0 0 0 / 0.06)\",\r\n },\r\n borderStrength: 0.1,\r\n level: \"none\",\r\n },\r\n density: {\r\n spacing: \"0.25rem\",\r\n scale: 1,\r\n },\r\n motion: {\r\n duration: 200,\r\n easing: \"cubic-bezier(0.22, 1, 0.36, 1)\",\r\n intensity: 1,\r\n },\r\n};\r\n","import type { ColorTokens, ThemeConfig } from \"../core/types\";\r\n\r\n/**\r\n * Light palette for Frosted: cool icy neutrals with translucent surfaces and a\r\n * soft sky-blue accent — designed so backdrop-blur skins can show through.\r\n */\r\nconst light: ColorTokens = {\r\n background: \"oklch(0.94 0.02 240)\",\r\n foreground: \"oklch(0.24 0.03 255)\",\r\n card: \"oklch(1 0.01 240 / 55%)\",\r\n cardForeground: \"oklch(0.24 0.03 255)\",\r\n popover: \"oklch(1 0.01 240 / 62%)\",\r\n popoverForeground: \"oklch(0.24 0.03 255)\",\r\n primary: \"oklch(0.62 0.12 240)\",\r\n primaryForeground: \"oklch(0.99 0.005 240)\",\r\n secondary: \"oklch(0.92 0.02 240 / 70%)\",\r\n secondaryForeground: \"oklch(0.3 0.04 255)\",\r\n muted: \"oklch(0.93 0.015 240 / 65%)\",\r\n mutedForeground: \"oklch(0.5 0.03 250)\",\r\n accent: \"oklch(0.9 0.04 230 / 70%)\",\r\n accentForeground: \"oklch(0.35 0.08 245)\",\r\n destructive: \"oklch(0.6 0.2 25)\",\r\n destructiveForeground: \"oklch(0.99 0 0)\",\r\n border: \"oklch(0.85 0.02 240 / 55%)\",\r\n input: \"oklch(0.97 0.01 240 / 50%)\",\r\n ring: \"oklch(0.62 0.14 235)\",\r\n chart1: \"oklch(0.62 0.12 240)\",\r\n chart2: \"oklch(0.68 0.1 200)\",\r\n chart3: \"oklch(0.58 0.14 280)\",\r\n chart4: \"oklch(0.72 0.08 180)\",\r\n chart5: \"oklch(0.66 0.11 320)\",\r\n sidebar: \"oklch(0.96 0.015 240 / 55%)\",\r\n sidebarForeground: \"oklch(0.24 0.03 255)\",\r\n sidebarPrimary: \"oklch(0.62 0.12 240)\",\r\n sidebarPrimaryForeground: \"oklch(0.99 0.005 240)\",\r\n sidebarAccent: \"oklch(0.9 0.04 230 / 70%)\",\r\n sidebarAccentForeground: \"oklch(0.35 0.08 245)\",\r\n sidebarBorder: \"oklch(0.85 0.02 240 / 50%)\",\r\n sidebarRing: \"oklch(0.62 0.14 235)\",\r\n};\r\n\r\n/** Dark palette: deep indigo glass over a cool night background. */\r\nconst dark: ColorTokens = {\r\n background: \"oklch(0.18 0.03 260)\",\r\n foreground: \"oklch(0.96 0.01 240)\",\r\n card: \"oklch(0.28 0.04 260 / 45%)\",\r\n cardForeground: \"oklch(0.96 0.01 240)\",\r\n popover: \"oklch(0.3 0.04 260 / 52%)\",\r\n popoverForeground: \"oklch(0.96 0.01 240)\",\r\n primary: \"oklch(0.72 0.12 230)\",\r\n primaryForeground: \"oklch(0.18 0.03 260)\",\r\n secondary: \"oklch(0.32 0.03 260 / 55%)\",\r\n secondaryForeground: \"oklch(0.96 0.01 240)\",\r\n muted: \"oklch(0.3 0.03 260 / 50%)\",\r\n mutedForeground: \"oklch(0.72 0.03 250)\",\r\n accent: \"oklch(0.36 0.05 250 / 55%)\",\r\n accentForeground: \"oklch(0.92 0.03 230)\",\r\n destructive: \"oklch(0.68 0.18 22)\",\r\n destructiveForeground: \"oklch(0.99 0 0)\",\r\n border: \"oklch(1 0 0 / 14%)\",\r\n input: \"oklch(1 0 0 / 10%)\",\r\n ring: \"oklch(0.7 0.12 230)\",\r\n chart1: \"oklch(0.72 0.12 230)\",\r\n chart2: \"oklch(0.7 0.1 200)\",\r\n chart3: \"oklch(0.66 0.14 280)\",\r\n chart4: \"oklch(0.74 0.08 180)\",\r\n chart5: \"oklch(0.68 0.11 320)\",\r\n sidebar: \"oklch(0.22 0.035 260 / 50%)\",\r\n sidebarForeground: \"oklch(0.96 0.01 240)\",\r\n sidebarPrimary: \"oklch(0.72 0.12 230)\",\r\n sidebarPrimaryForeground: \"oklch(0.18 0.03 260)\",\r\n sidebarAccent: \"oklch(0.36 0.05 250 / 55%)\",\r\n sidebarAccentForeground: \"oklch(0.92 0.03 230)\",\r\n sidebarBorder: \"oklch(1 0 0 / 12%)\",\r\n sidebarRing: \"oklch(0.7 0.12 230)\",\r\n};\r\n\r\n/**\r\n * The \"frosted\" preset: icy translucent surfaces paired with\r\n * `styles/variant-frosted.css` for backdrop-blur glassmorphism across slots.\r\n */\r\nexport const frosted: ThemeConfig = {\r\n name: \"frosted\",\r\n variant: \"frosted\",\r\n colors: { light, dark },\r\n typography: {\r\n sans: '\"Inter\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif',\r\n heading:\r\n '\"Inter\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif',\r\n mono: 'ui-monospace, SFMono-Regular, Menlo, Consolas, \"Liberation Mono\", monospace',\r\n googleFonts: [\"Inter\"],\r\n },\r\n radius: {\r\n base: \"1rem\",\r\n scale: {\r\n sm: 0.5,\r\n md: 0.75,\r\n lg: 1,\r\n xl: 1.25,\r\n \"2xl\": 1.5,\r\n \"3xl\": 1.75,\r\n \"4xl\": 2,\r\n },\r\n },\r\n elevation: {\r\n shadows: {\r\n xs: \"0 1px 2px 0 oklch(0.45 0.08 240 / 0.06)\",\r\n sm: \"0 2px 10px -2px oklch(0.45 0.08 240 / 0.12), 0 1px 3px -1px oklch(0 0 0 / 0.04)\",\r\n md: \"0 8px 24px -8px oklch(0.45 0.08 240 / 0.18), 0 2px 8px -2px oklch(0 0 0 / 0.05)\",\r\n lg: \"0 18px 40px -12px oklch(0.45 0.08 240 / 0.22), 0 6px 14px -6px oklch(0 0 0 / 0.06)\",\r\n xl: \"0 28px 56px -16px oklch(0.45 0.08 240 / 0.28), 0 10px 20px -8px oklch(0 0 0 / 0.07)\",\r\n },\r\n borderStrength: 0.65,\r\n level: \"lg\",\r\n },\r\n density: {\r\n spacing: \"0.25rem\",\r\n scale: 1.05,\r\n },\r\n motion: {\r\n duration: 260,\r\n easing: \"cubic-bezier(0.22, 1, 0.36, 1)\",\r\n intensity: 1,\r\n },\r\n};\r\n","import type { ColorTokens, ThemeConfig } from \"../core/types\";\r\n\r\n/**\r\n * Light palette from the Toon reference: airy off-white surfaces, near\r\n * borderless inputs, and a soft periwinkle primary with a brighter blue focus\r\n * ring.\r\n */\r\nconst light: ColorTokens = {\r\n background: \"oklch(0.98 0.003 264)\",\r\n foreground: \"oklch(0.21 0.03 264)\",\r\n card: \"oklch(1 0 0)\",\r\n cardForeground: \"oklch(0.21 0.03 264)\",\r\n popover: \"oklch(1 0 0)\",\r\n popoverForeground: \"oklch(0.21 0.03 264)\",\r\n primary: \"oklch(0.7 0.11 264)\",\r\n primaryForeground: \"oklch(0.99 0.002 264)\",\r\n secondary: \"oklch(0.965 0.006 264)\",\r\n secondaryForeground: \"oklch(0.3 0.03 264)\",\r\n muted: \"oklch(0.965 0.006 264)\",\r\n mutedForeground: \"oklch(0.55 0.03 264)\",\r\n accent: \"oklch(0.95 0.03 264)\",\r\n accentForeground: \"oklch(0.42 0.11 264)\",\r\n destructive: \"oklch(0.62 0.22 25)\",\r\n destructiveForeground: \"oklch(0.99 0 0)\",\r\n border: \"oklch(0.92 0.008 264)\",\r\n input: \"oklch(0.965 0.006 264)\",\r\n ring: \"oklch(0.6 0.19 264)\",\r\n chart1: \"oklch(0.7 0.11 264)\",\r\n chart2: \"oklch(0.62 0.15 264)\",\r\n chart3: \"oklch(0.55 0.19 264)\",\r\n chart4: \"oklch(0.72 0.1 210)\",\r\n chart5: \"oklch(0.68 0.13 300)\",\r\n sidebar: \"oklch(0.985 0.003 264)\",\r\n sidebarForeground: \"oklch(0.21 0.03 264)\",\r\n sidebarPrimary: \"oklch(0.7 0.11 264)\",\r\n sidebarPrimaryForeground: \"oklch(0.99 0.002 264)\",\r\n sidebarAccent: \"oklch(0.95 0.03 264)\",\r\n sidebarAccentForeground: \"oklch(0.42 0.11 264)\",\r\n sidebarBorder: \"oklch(0.92 0.008 264)\",\r\n sidebarRing: \"oklch(0.6 0.19 264)\",\r\n};\r\n\r\n/** Dark palette: deep desaturated navy with the same periwinkle accent. */\r\nconst dark: ColorTokens = {\r\n background: \"oklch(0.19 0.02 264)\",\r\n foreground: \"oklch(0.97 0.005 264)\",\r\n card: \"oklch(0.23 0.024 264)\",\r\n cardForeground: \"oklch(0.97 0.005 264)\",\r\n popover: \"oklch(0.23 0.024 264)\",\r\n popoverForeground: \"oklch(0.97 0.005 264)\",\r\n primary: \"oklch(0.72 0.12 264)\",\r\n primaryForeground: \"oklch(0.16 0.03 264)\",\r\n secondary: \"oklch(0.28 0.02 264)\",\r\n secondaryForeground: \"oklch(0.97 0.005 264)\",\r\n muted: \"oklch(0.28 0.02 264)\",\r\n mutedForeground: \"oklch(0.72 0.02 264)\",\r\n accent: \"oklch(0.32 0.05 264)\",\r\n accentForeground: \"oklch(0.9 0.05 264)\",\r\n destructive: \"oklch(0.7 0.19 22)\",\r\n destructiveForeground: \"oklch(0.99 0 0)\",\r\n border: \"oklch(1 0 0 / 10%)\",\r\n input: \"oklch(1 0 0 / 12%)\",\r\n ring: \"oklch(0.65 0.17 264)\",\r\n chart1: \"oklch(0.72 0.12 264)\",\r\n chart2: \"oklch(0.64 0.15 264)\",\r\n chart3: \"oklch(0.58 0.18 264)\",\r\n chart4: \"oklch(0.74 0.1 210)\",\r\n chart5: \"oklch(0.7 0.13 300)\",\r\n sidebar: \"oklch(0.21 0.022 264)\",\r\n sidebarForeground: \"oklch(0.97 0.005 264)\",\r\n sidebarPrimary: \"oklch(0.72 0.12 264)\",\r\n sidebarPrimaryForeground: \"oklch(0.16 0.03 264)\",\r\n sidebarAccent: \"oklch(0.32 0.05 264)\",\r\n sidebarAccentForeground: \"oklch(0.9 0.05 264)\",\r\n sidebarBorder: \"oklch(1 0 0 / 10%)\",\r\n sidebarRing: \"oklch(0.65 0.17 264)\",\r\n};\r\n\r\n/**\r\n * The \"toon\" preset: soft, elevated, and pill-shaped. Large radius, gentle\r\n * layered shadows, subtle borders and a little extra breathing room. Pairs with\r\n * `styles/variant-toon.css` which rounds controls into pills.\r\n */\r\nexport const toon: ThemeConfig = {\r\n name: \"toon\",\r\n variant: \"toon\",\r\n colors: { light, dark },\r\n typography: {\r\n sans: '\"Inter\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, sans-serif',\r\n heading:\r\n '\"Plus Jakarta Sans\", \"Inter\", ui-sans-serif, system-ui, -apple-system, sans-serif',\r\n mono: 'ui-monospace, SFMono-Regular, Menlo, Consolas, \"Liberation Mono\", monospace',\r\n googleFonts: [\"Inter\", \"Plus Jakarta Sans\"],\r\n },\r\n radius: {\r\n base: \"1.25rem\",\r\n // A slightly gentler ramp so large elements do not over-round.\r\n scale: {\r\n sm: 0.4,\r\n md: 0.6,\r\n lg: 1,\r\n xl: 1.2,\r\n \"2xl\": 1.5,\r\n \"3xl\": 1.8,\r\n \"4xl\": 2.2,\r\n },\r\n },\r\n elevation: {\r\n shadows: {\r\n xs: \"0 1px 2px 0 oklch(0.55 0.19 264 / 0.06)\",\r\n sm: \"0 2px 8px -2px oklch(0.55 0.19 264 / 0.10), 0 1px 3px -1px oklch(0 0 0 / 0.05)\",\r\n md: \"0 6px 20px -6px oklch(0.55 0.19 264 / 0.16), 0 2px 6px -2px oklch(0 0 0 / 0.06)\",\r\n lg: \"0 14px 34px -10px oklch(0.55 0.19 264 / 0.20), 0 4px 10px -4px oklch(0 0 0 / 0.07)\",\r\n xl: \"0 24px 56px -16px oklch(0.55 0.19 264 / 0.26), 0 8px 18px -8px oklch(0 0 0 / 0.08)\",\r\n },\r\n borderStrength: 0.5,\r\n level: \"md\",\r\n },\r\n density: {\r\n spacing: \"0.26rem\",\r\n scale: 1.1,\r\n },\r\n motion: {\r\n duration: 240,\r\n easing: \"cubic-bezier(0.22, 1, 0.36, 1)\",\r\n intensity: 1,\r\n },\r\n};\r\n","import type { ThemeConfig, VariantName } from \"../core/types\";\r\nimport { flat } from \"./flat\";\r\nimport { frosted } from \"./frosted\";\r\nimport { toon } from \"./toon\";\r\n\r\nexport { flat } from \"./flat\";\r\nexport { frosted } from \"./frosted\";\r\nexport { toon } from \"./toon\";\r\n\r\n/** All built-in presets, keyed by name. */\r\nexport const presets = {\r\n flat,\r\n toon,\r\n frosted,\r\n} satisfies Record<string, ThemeConfig>;\r\n\r\nexport type PresetName = keyof typeof presets;\r\n\r\n/** Returns a built-in preset by name, or undefined if it is not registered. */\r\nexport function getPreset(name: VariantName): ThemeConfig | undefined {\r\n return (presets as Record<string, ThemeConfig>)[name];\r\n}\r\n\r\n/** The default preset used when none is specified. */\r\nexport const defaultPreset: ThemeConfig = flat;\r\n"]}
package/dist/{index-DcC8QTrl.d.ts → index-wWkmeDkd.d.ts} RENAMED
@@ -114,7 +114,7 @@ interface Motion {
114
114
  intensity: number;
115
115
  }
116
116
  /** Built-in visual variants ("skins"). Custom names are also allowed. */
117
- type VariantName = "flat" | "launch" | (string & {});
117
+ type VariantName = "flat" | "toon" | "frosted" | (string & {});
118
118
  /** A color scheme. */
119
119
  type ColorScheme = "light" | "dark";
120
120
  /**
@@ -152,16 +152,23 @@ type CssVarMap = Record<string, string>;
152
152
  declare const flat: ThemeConfig;
153
153
 
154
154
  /**
155
- * The "launch" preset: soft, elevated, and pill-shaped. Large radius, gentle
155
+ * The "frosted" preset: icy translucent surfaces paired with
156
+ * `styles/variant-frosted.css` for backdrop-blur glassmorphism across slots.
157
+ */
158
+ declare const frosted: ThemeConfig;
159
+
160
+ /**
161
+ * The "toon" preset: soft, elevated, and pill-shaped. Large radius, gentle
156
162
  * layered shadows, subtle borders and a little extra breathing room. Pairs with
157
- * `styles/variant-launch.css` which rounds controls into pills.
163
+ * `styles/variant-toon.css` which rounds controls into pills.
158
164
  */
159
- declare const launch: ThemeConfig;
165
+ declare const toon: ThemeConfig;
160
166
 
161
167
  /** All built-in presets, keyed by name. */
162
168
  declare const presets: {
163
169
  flat: ThemeConfig;
164
- launch: ThemeConfig;
170
+ toon: ThemeConfig;
171
+ frosted: ThemeConfig;
165
172
  };
166
173
  type PresetName = keyof typeof presets;
167
174
  /** Returns a built-in preset by name, or undefined if it is not registered. */
@@ -169,4 +176,4 @@ declare function getPreset(name: VariantName): ThemeConfig | undefined;
169
176
  /** The default preset used when none is specified. */
170
177
  declare const defaultPreset: ThemeConfig;
171
178
 
172
- export { type ColorTokens as C, type DeepPartial as D, type ElevationConfig as E, type Motion as M, type PresetName as P, type RadiusScale as R, type ThemeConfig as T, type VariantName as V, type CssVarMap as a, type ColorScheme as b, type ThemeOverride as c, type CssColor as d, type Density as e, type RadiusConfig as f, type Typography as g, defaultPreset as h, flat as i, getPreset as j, launch as l, presets as p };
179
+ export { type ColorTokens as C, type DeepPartial as D, type ElevationConfig as E, type Motion as M, type PresetName as P, type RadiusScale as R, type ThemeConfig as T, type VariantName as V, type CssVarMap as a, type ColorScheme as b, type ThemeOverride as c, type CssColor as d, type Density as e, type RadiusConfig as f, type Typography as g, defaultPreset as h, flat as i, frosted as j, getPreset as k, presets as p, toon as t };
package/dist/index.d.ts CHANGED
@@ -116,7 +116,7 @@ interface Motion {
116
116
  intensity: number;
117
117
  }
118
118
  /** Built-in visual variants ("skins"). Custom names are also allowed. */
119
- type VariantName = "flat" | "launch" | (string & {});
119
+ type VariantName = "flat" | "toon" | "frosted" | (string & {});
120
120
  /** A color scheme. */
121
121
  type ColorScheme = "light" | "dark";
122
122
  /**
@@ -380,16 +380,23 @@ declare function themeToInlineStyle(theme: ThemeConfig, scheme: ColorScheme): Re
380
380
  declare const flat: ThemeConfig;
381
381
 
382
382
  /**
383
- * The "launch" preset: soft, elevated, and pill-shaped. Large radius, gentle
383
+ * The "frosted" preset: icy translucent surfaces paired with
384
+ * `styles/variant-frosted.css` for backdrop-blur glassmorphism across slots.
385
+ */
386
+ declare const frosted: ThemeConfig;
387
+
388
+ /**
389
+ * The "toon" preset: soft, elevated, and pill-shaped. Large radius, gentle
384
390
  * layered shadows, subtle borders and a little extra breathing room. Pairs with
385
- * `styles/variant-launch.css` which rounds controls into pills.
391
+ * `styles/variant-toon.css` which rounds controls into pills.
386
392
  */
387
- declare const launch: ThemeConfig;
393
+ declare const toon: ThemeConfig;
388
394
 
389
395
  /** All built-in presets, keyed by name. */
390
396
  declare const presets: {
391
397
  flat: ThemeConfig;
392
- launch: ThemeConfig;
398
+ toon: ThemeConfig;
399
+ frosted: ThemeConfig;
393
400
  };
394
401
  type PresetName = keyof typeof presets;
395
402
  /** Returns a built-in preset by name, or undefined if it is not registered. */
@@ -397,4 +404,4 @@ declare function getPreset(name: VariantName): ThemeConfig | undefined;
397
404
  /** The default preset used when none is specified. */
398
405
  declare const defaultPreset: ThemeConfig;
399
406
 
400
- export { type ColorScheme, type ColorTokens, type CssColor, type CssVarMap, DEFAULT_RADIUS_SCALE, type DeepPartial, type Density, type ElevationConfig, type GoogleFontsOptions, type Motion, PalletContext, type PalletContextValue, type PresetName, type RadiusConfig, type RadiusScale, type SchemePreference, type SchemeTarget, type ThemeConfig, type ThemeControls, type ThemeOverride, ThemeProvider, type ThemeProviderProps, type ThemeToCssOptions, type Typography, type UseColorSchemeResult, type UsePresetResult, type VariantName, applyCssVars, buildGoogleFontsUrl, clearCssVars, colorTokensToVars, cssVarsToString, deepMerge, defaultPreset, deserializeTheme, flat, getPreset, launch, loadGoogleFonts, mergeAll, presets, resolveColors, resolveTheme, serializeTheme, structuralVars, themeToCss, themeToInlineStyle, useColorScheme, usePalletContext, usePreset, useTheme, useThemeControls };
407
+ export { type ColorScheme, type ColorTokens, type CssColor, type CssVarMap, DEFAULT_RADIUS_SCALE, type DeepPartial, type Density, type ElevationConfig, type GoogleFontsOptions, type Motion, PalletContext, type PalletContextValue, type PresetName, type RadiusConfig, type RadiusScale, type SchemePreference, type SchemeTarget, type ThemeConfig, type ThemeControls, type ThemeOverride, ThemeProvider, type ThemeProviderProps, type ThemeToCssOptions, type Typography, type UseColorSchemeResult, type UsePresetResult, type VariantName, applyCssVars, buildGoogleFontsUrl, clearCssVars, colorTokensToVars, cssVarsToString, deepMerge, defaultPreset, deserializeTheme, flat, frosted, getPreset, loadGoogleFonts, mergeAll, presets, resolveColors, resolveTheme, serializeTheme, structuralVars, themeToCss, themeToInlineStyle, toon, useColorScheme, usePalletContext, usePreset, useTheme, useThemeControls };