@soli92/solids 1.2.1 → 1.3.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 (8) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/css/base.css +7 -2
  3. package/dist/css/themes.css +140 -2
  4. package/dist/css/utilities.css +9 -0
  5. package/dist/css/variables.css +4 -0
  6. package/dist/tailwind/preset.cjs +1 -1
  7. package/dist/tokens/tokens.json +246 -48
  8. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ # [1.3.0](https://github.com/soli92/solids/compare/v1.2.1...v1.3.0) (2026-03-24)
2
+
3
+
4
+ ### Features
5
+
6
+ * fantasy/cyberpunk themes, icon set, Storybook Pages fixes ([3997055](https://github.com/soli92/solids/commit/3997055fc1f1ba0942857347c248fa61716ba665))
7
+
1
8
  ## [1.2.1](https://github.com/soli92/solids/compare/v1.2.0...v1.2.1) (2026-03-24)
2
9
 
3
10
 
package/dist/css/base.css CHANGED
@@ -5,12 +5,17 @@
5
5
  color-scheme: light;
6
6
  }
7
7
 
8
- [data-theme="dark"] {
8
+ [data-theme="dark"],
9
+ [data-theme="cyberpunk"] {
9
10
  color-scheme: dark;
10
11
  }
11
12
 
13
+ [data-theme="fantasy"] {
14
+ color-scheme: light;
15
+ }
16
+
12
17
  @media (prefers-color-scheme: dark) {
13
- :root:not([data-theme="light"]) {
18
+ :root:not([data-theme]) {
14
19
  color-scheme: dark;
15
20
  }
16
21
  }
package/dist/css/themes.css CHANGED
@@ -1,4 +1,4 @@
1
- /* SoliDS — Dark Theme (auto-generated, do not edit) */
1
+ /* SoliDS — Theme overrides (auto-generated, do not edit) */
2
2
 
3
3
  [data-theme="dark"] {
4
4
  --sd-color-text-primary: #F9FAFB;
@@ -47,10 +47,144 @@
47
47
  --sd-color-accent-foreground: #F9FAFB;
48
48
  --sd-color-destructive-default: #DC2626;
49
49
  --sd-color-destructive-foreground: #FFFFFF;
50
+ --sd-color-icon-default: #F9FAFB;
51
+ --sd-color-icon-muted: #9CA3AF;
52
+ --sd-color-icon-primary: #60A5FA;
53
+ --sd-color-icon-on-primary: #FFFFFF;
54
+ }
55
+
56
+ [data-theme="cyberpunk"] {
57
+ --sd-color-text-primary: #e8e9ff;
58
+ --sd-color-text-secondary: #a5b4fc;
59
+ --sd-color-text-tertiary: #818cf8;
60
+ --sd-color-text-disabled: #6366f1;
61
+ --sd-color-text-inverse: #070714;
62
+ --sd-color-text-link: #22d3ee;
63
+ --sd-color-text-link-hover: #67e8f9;
64
+ --sd-color-bg-canvas: #070714;
65
+ --sd-color-bg-surface: #0c0e22;
66
+ --sd-color-bg-elevated: #12152e;
67
+ --sd-color-bg-overlay: rgba(0, 0, 0, 0.75);
68
+ --sd-color-bg-hover: #1a1f3c;
69
+ --sd-color-bg-active: #252a4a;
70
+ --sd-color-bg-disabled: #12152e;
71
+ --sd-color-border-default: #312e81;
72
+ --sd-color-border-muted: #1e1b4b;
73
+ --sd-color-border-strong: #6366f1;
74
+ --sd-color-border-focus: #22d3ee;
75
+ --sd-color-border-disabled: #312e81;
76
+ --sd-color-intent-success: #4ade80;
77
+ --sd-color-intent-success-bg: #052e16;
78
+ --sd-color-intent-success-border: #166534;
79
+ --sd-color-intent-warning: #fbbf24;
80
+ --sd-color-intent-warning-bg: #1c1004;
81
+ --sd-color-intent-warning-border: #ca8a04;
82
+ --sd-color-intent-danger: #f472b6;
83
+ --sd-color-intent-danger-bg: #2a0a1a;
84
+ --sd-color-intent-danger-border: #db2777;
85
+ --sd-color-intent-info: #22d3ee;
86
+ --sd-color-intent-info-bg: #0c1a2e;
87
+ --sd-color-intent-info-border: #0891b2;
88
+ --sd-color-primary-default: #06b6d4;
89
+ --sd-color-primary-hover: #22d3ee;
90
+ --sd-color-primary-active: #67e8f9;
91
+ --sd-color-primary-subtle: #0e7490;
92
+ --sd-color-primary-foreground: #030712;
93
+ --sd-color-secondary-default: #581c87;
94
+ --sd-color-secondary-hover: #6b21a8;
95
+ --sd-color-secondary-active: #7e22ce;
96
+ --sd-color-secondary-foreground: #fae8ff;
97
+ --sd-color-muted-default: #1a1f3c;
98
+ --sd-color-muted-foreground: #a5b4fc;
99
+ --sd-color-accent-default: #db2777;
100
+ --sd-color-accent-foreground: #fdf2f8;
101
+ --sd-color-destructive-default: #f43f5e;
102
+ --sd-color-destructive-foreground: #fff1f2;
103
+ --sd-color-icon-default: #e0e7ff;
104
+ --sd-color-icon-muted: #818cf8;
105
+ --sd-color-icon-primary: #22d3ee;
106
+ --sd-color-icon-on-primary: #030712;
107
+ --sd-font-body: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
108
+ --sd-font-heading: 'Orbitron', ui-sans-serif, system-ui, sans-serif;
109
+ --sd-font-mono: 'Share Tech Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
110
+ --sd-radius-sm: 2px;
111
+ --sd-radius-md: 4px;
112
+ --sd-radius-lg: 6px;
113
+ --sd-radius-xl: 8px;
114
+ --sd-radius-full: 9999px;
115
+ --sd-shadow-sm: 0 0 16px rgb(34 211 238 / 0.12), 0 1px 3px rgb(0 0 0 / 0.45);
116
+ --sd-shadow-md: 0 0 28px rgb(34 211 238 / 0.14), 0 4px 14px rgb(0 0 0 / 0.5);
117
+ --sd-shadow-lg: 0 0 40px rgb(34 211 238 / 0.16), 0 10px 28px rgb(0 0 0 / 0.55);
118
+ --sd-shadow-xl: 0 0 56px rgb(244 114 182 / 0.12), 0 18px 40px rgb(0 0 0 / 0.6);
119
+ }
120
+
121
+ [data-theme="fantasy"] {
122
+ --sd-color-text-primary: #2c1810;
123
+ --sd-color-text-secondary: #5c4033;
124
+ --sd-color-text-tertiary: #7a6042;
125
+ --sd-color-text-disabled: #a89078;
126
+ --sd-color-text-inverse: #faf6ee;
127
+ --sd-color-text-link: #7c5a1c;
128
+ --sd-color-text-link-hover: #5c3d10;
129
+ --sd-color-bg-canvas: #f0e6d2;
130
+ --sd-color-bg-surface: #e4d5bc;
131
+ --sd-color-bg-elevated: #faf6ee;
132
+ --sd-color-bg-overlay: rgba(44, 24, 16, 0.45);
133
+ --sd-color-bg-hover: #dcc9a8;
134
+ --sd-color-bg-active: #cfba92;
135
+ --sd-color-bg-disabled: #e8dcc8;
136
+ --sd-color-border-default: #c4a574;
137
+ --sd-color-border-muted: #dcc9a8;
138
+ --sd-color-border-strong: #8b6914;
139
+ --sd-color-border-focus: #b45309;
140
+ --sd-color-border-disabled: #dcc9a8;
141
+ --sd-color-intent-success: #3f6212;
142
+ --sd-color-intent-success-bg: #ecf4d9;
143
+ --sd-color-intent-success-border: #84cc16;
144
+ --sd-color-intent-warning: #b45309;
145
+ --sd-color-intent-warning-bg: #fff7e6;
146
+ --sd-color-intent-warning-border: #f59e0b;
147
+ --sd-color-intent-danger: #9f1239;
148
+ --sd-color-intent-danger-bg: #ffe4e6;
149
+ --sd-color-intent-danger-border: #fb7185;
150
+ --sd-color-intent-info: #1e3a5f;
151
+ --sd-color-intent-info-bg: #e0ecff;
152
+ --sd-color-intent-info-border: #60a5fa;
153
+ --sd-color-primary-default: #8b6914;
154
+ --sd-color-primary-hover: #a67c00;
155
+ --sd-color-primary-active: #6b4f0f;
156
+ --sd-color-primary-subtle: #f5edd4;
157
+ --sd-color-primary-foreground: #1a0f08;
158
+ --sd-color-secondary-default: #d4c4a8;
159
+ --sd-color-secondary-hover: #c4b08c;
160
+ --sd-color-secondary-active: #a89078;
161
+ --sd-color-secondary-foreground: #2c1810;
162
+ --sd-color-muted-default: #e4d5bc;
163
+ --sd-color-muted-foreground: #5c4033;
164
+ --sd-color-accent-default: #3d2914;
165
+ --sd-color-accent-foreground: #faf6ee;
166
+ --sd-color-destructive-default: #9f1239;
167
+ --sd-color-destructive-foreground: #fff1f2;
168
+ --sd-color-icon-default: #3d2914;
169
+ --sd-color-icon-muted: #7a6042;
170
+ --sd-color-icon-primary: #a67c00;
171
+ --sd-color-icon-on-primary: #1a0f08;
172
+ --sd-font-body: 'Palatino Linotype', 'Book Antiqua', Palatino, 'Liberation Serif', Georgia, serif;
173
+ --sd-font-heading: 'Cinzel', 'Palatino Linotype', Palatino, Georgia, serif;
174
+ --sd-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', monospace;
175
+ --sd-radius-sm: 6px;
176
+ --sd-radius-md: 10px;
177
+ --sd-radius-lg: 14px;
178
+ --sd-radius-xl: 20px;
179
+ --sd-radius-full: 9999px;
180
+ --sd-shadow-sm: 0 1px 4px rgb(44 24 16 / 0.12), 0 1px 2px rgb(44 24 16 / 0.08);
181
+ --sd-shadow-md: 0 4px 14px rgb(44 24 16 / 0.12), 0 2px 6px rgb(44 24 16 / 0.08);
182
+ --sd-shadow-lg: 0 12px 32px rgb(44 24 16 / 0.14), 0 4px 12px rgb(44 24 16 / 0.1);
183
+ --sd-shadow-xl: 0 22px 48px rgb(44 24 16 / 0.16), 0 8px 20px rgb(44 24 16 / 0.12);
50
184
  }
51
185
 
52
186
  @media (prefers-color-scheme: dark) {
53
- :root:not([data-theme="light"]) {
187
+ :root:not([data-theme]) {
54
188
  --sd-color-text-primary: #F9FAFB;
55
189
  --sd-color-text-secondary: #D1D5DB;
56
190
  --sd-color-text-tertiary: #9CA3AF;
@@ -97,5 +231,9 @@
97
231
  --sd-color-accent-foreground: #F9FAFB;
98
232
  --sd-color-destructive-default: #DC2626;
99
233
  --sd-color-destructive-foreground: #FFFFFF;
234
+ --sd-color-icon-default: #F9FAFB;
235
+ --sd-color-icon-muted: #9CA3AF;
236
+ --sd-color-icon-primary: #60A5FA;
237
+ --sd-color-icon-on-primary: #FFFFFF;
100
238
  }
101
239
  }
package/dist/css/utilities.css CHANGED
@@ -129,6 +129,15 @@
129
129
  .sd-text-danger { color: var(--sd-color-intent-danger); }
130
130
  .sd-text-info { color: var(--sd-color-intent-info); }
131
131
 
132
+ /* Icons (stroke/fill via currentColor — pair with token-driven color) */
133
+ .sd-icon {
134
+ flex-shrink: 0;
135
+ color: var(--sd-color-icon-default);
136
+ }
137
+ .sd-icon-muted { color: var(--sd-color-icon-muted); }
138
+ .sd-icon-primary { color: var(--sd-color-icon-primary); }
139
+ .sd-icon-on-primary { color: var(--sd-color-icon-on-primary); }
140
+
132
141
  .sd-bg-canvas { background-color: var(--sd-color-bg-canvas); }
133
142
  .sd-bg-surface { background-color: var(--sd-color-bg-surface); }
134
143
  .sd-bg-elevated { background-color: var(--sd-color-bg-elevated); }
package/dist/css/variables.css CHANGED
@@ -190,6 +190,10 @@
190
190
  --sd-color-accent-foreground: #111827;
191
191
  --sd-color-destructive-default: #DC2626;
192
192
  --sd-color-destructive-foreground: #FFFFFF;
193
+ --sd-color-icon-default: #111827;
194
+ --sd-color-icon-muted: #6B7280;
195
+ --sd-color-icon-primary: #2563EB;
196
+ --sd-color-icon-on-primary: #FFFFFF;
193
197
  --sd-space-xs: 4px;
194
198
  --sd-space-sm: 8px;
195
199
  --sd-space-md: 16px;
package/dist/tailwind/preset.cjs CHANGED
@@ -8,7 +8,7 @@ const { fontFamily } = require("tailwindcss/defaultTheme");
8
8
 
9
9
  /** @type {import("tailwindcss").Config} */
10
10
  module.exports = {
11
- darkMode: ["class", '[data-theme="dark"]'],
11
+ darkMode: ["class", '[data-theme="dark"]', '[data-theme="cyberpunk"]'],
12
12
  theme: {
13
13
  extend: {
14
14
  colors: {
package/dist/tokens/tokens.json CHANGED
@@ -184,7 +184,7 @@
184
184
  }
185
185
  },
186
186
  "semantic": {
187
- "_comment": "Semantic tokens reference base values. These are overridden per-theme in themes/light.json and themes/dark.json. Default = light.",
187
+ "_comment": "Semantic tokens are overridden per theme in src/tokens/themes/*.json. Default = light baked into :root.",
188
188
  "color": {
189
189
  "text": {
190
190
  "primary": "#111827",
@@ -249,6 +249,12 @@
249
249
  "destructive": {
250
250
  "default": "#DC2626",
251
251
  "foreground": "#FFFFFF"
252
+ },
253
+ "icon": {
254
+ "default": "#111827",
255
+ "muted": "#6B7280",
256
+ "primary": "#2563EB",
257
+ "on-primary": "#FFFFFF"
252
258
  }
253
259
  },
254
260
  "space": {
@@ -280,72 +286,97 @@
280
286
  }
281
287
  },
282
288
  "themes": {
283
- "light": {
284
- "_comment": "Light theme overrides. All values here override the semantic defaults for [data-theme='light'] or :root.",
289
+ "cyberpunk": {
290
+ "_comment": "Tema cyberpunk: neon cyan/magenta su base profonda. data-theme=\"cyberpunk\" su html.",
285
291
  "color": {
286
292
  "text": {
287
- "primary": "#111827",
288
- "secondary": "#4B5563",
289
- "tertiary": "#6B7280",
290
- "disabled": "#9CA3AF",
291
- "inverse": "#FFFFFF",
292
- "link": "#2563EB",
293
- "link-hover": "#1D4ED8"
293
+ "primary": "#e8e9ff",
294
+ "secondary": "#a5b4fc",
295
+ "tertiary": "#818cf8",
296
+ "disabled": "#6366f1",
297
+ "inverse": "#070714",
298
+ "link": "#22d3ee",
299
+ "link-hover": "#67e8f9"
294
300
  },
295
301
  "bg": {
296
- "canvas": "#FFFFFF",
297
- "surface": "#F9FAFB",
298
- "elevated": "#FFFFFF",
299
- "hover": "#F3F4F6",
300
- "active": "#E5E7EB",
301
- "disabled": "#F3F4F6"
302
+ "canvas": "#070714",
303
+ "surface": "#0c0e22",
304
+ "elevated": "#12152e",
305
+ "overlay": "rgba(0, 0, 0, 0.75)",
306
+ "hover": "#1a1f3c",
307
+ "active": "#252a4a",
308
+ "disabled": "#12152e"
302
309
  },
303
310
  "border": {
304
- "default": "#E5E7EB",
305
- "muted": "#F3F4F6",
306
- "strong": "#9CA3AF",
307
- "focus": "#3B82F6",
308
- "disabled": "#E5E7EB"
311
+ "default": "#312e81",
312
+ "muted": "#1e1b4b",
313
+ "strong": "#6366f1",
314
+ "focus": "#22d3ee",
315
+ "disabled": "#312e81"
309
316
  },
310
317
  "intent": {
311
- "success": "#16A34A",
312
- "success-bg": "#F0FDF4",
313
- "success-border": "#4ADE80",
314
- "warning": "#D97706",
315
- "warning-bg": "#FFFBEB",
316
- "warning-border": "#FBBF24",
317
- "danger": "#DC2626",
318
- "danger-bg": "#FEF2F2",
319
- "danger-border": "#F87171",
320
- "info": "#2563EB",
321
- "info-bg": "#EFF6FF",
322
- "info-border": "#93C5FD"
318
+ "success": "#4ade80",
319
+ "success-bg": "#052e16",
320
+ "success-border": "#166534",
321
+ "warning": "#fbbf24",
322
+ "warning-bg": "#1c1004",
323
+ "warning-border": "#ca8a04",
324
+ "danger": "#f472b6",
325
+ "danger-bg": "#2a0a1a",
326
+ "danger-border": "#db2777",
327
+ "info": "#22d3ee",
328
+ "info-bg": "#0c1a2e",
329
+ "info-border": "#0891b2"
323
330
  },
324
331
  "primary": {
325
- "default": "#2563EB",
326
- "hover": "#1D4ED8",
327
- "active": "#1E40AF",
328
- "subtle": "#EFF6FF",
329
- "foreground": "#FFFFFF"
332
+ "default": "#06b6d4",
333
+ "hover": "#22d3ee",
334
+ "active": "#67e8f9",
335
+ "subtle": "#0e7490",
336
+ "foreground": "#030712"
330
337
  },
331
338
  "secondary": {
332
- "default": "#F3F4F6",
333
- "hover": "#E5E7EB",
334
- "active": "#D1D5DB",
335
- "foreground": "#111827"
339
+ "default": "#581c87",
340
+ "hover": "#6b21a8",
341
+ "active": "#7e22ce",
342
+ "foreground": "#fae8ff"
336
343
  },
337
344
  "muted": {
338
- "default": "#F3F4F6",
339
- "foreground": "#6B7280"
345
+ "default": "#1a1f3c",
346
+ "foreground": "#a5b4fc"
340
347
  },
341
348
  "accent": {
342
- "default": "#F3F4F6",
343
- "foreground": "#111827"
349
+ "default": "#db2777",
350
+ "foreground": "#fdf2f8"
344
351
  },
345
352
  "destructive": {
346
- "default": "#DC2626",
347
- "foreground": "#FFFFFF"
353
+ "default": "#f43f5e",
354
+ "foreground": "#fff1f2"
355
+ },
356
+ "icon": {
357
+ "default": "#e0e7ff",
358
+ "muted": "#818cf8",
359
+ "primary": "#22d3ee",
360
+ "on-primary": "#030712"
348
361
  }
362
+ },
363
+ "font": {
364
+ "body": "ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",
365
+ "heading": "'Orbitron', ui-sans-serif, system-ui, sans-serif",
366
+ "mono": "'Share Tech Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace"
367
+ },
368
+ "radius": {
369
+ "sm": "2px",
370
+ "md": "4px",
371
+ "lg": "6px",
372
+ "xl": "8px",
373
+ "full": "9999px"
374
+ },
375
+ "shadow": {
376
+ "sm": "0 0 16px rgb(34 211 238 / 0.12), 0 1px 3px rgb(0 0 0 / 0.45)",
377
+ "md": "0 0 28px rgb(34 211 238 / 0.14), 0 4px 14px rgb(0 0 0 / 0.5)",
378
+ "lg": "0 0 40px rgb(34 211 238 / 0.16), 0 10px 28px rgb(0 0 0 / 0.55)",
379
+ "xl": "0 0 56px rgb(244 114 182 / 0.12), 0 18px 40px rgb(0 0 0 / 0.6)"
349
380
  }
350
381
  },
351
382
  "dark": {
@@ -411,6 +442,173 @@
411
442
  "default": "#1F2937",
412
443
  "foreground": "#F9FAFB"
413
444
  },
445
+ "destructive": {
446
+ "default": "#DC2626",
447
+ "foreground": "#FFFFFF"
448
+ },
449
+ "icon": {
450
+ "default": "#F9FAFB",
451
+ "muted": "#9CA3AF",
452
+ "primary": "#60A5FA",
453
+ "on-primary": "#FFFFFF"
454
+ }
455
+ }
456
+ },
457
+ "fantasy": {
458
+ "_comment": "Tema fantasy: pergamena, inchiostro, ottone e bosco. data-theme=\"fantasy\" su html.",
459
+ "color": {
460
+ "text": {
461
+ "primary": "#2c1810",
462
+ "secondary": "#5c4033",
463
+ "tertiary": "#7a6042",
464
+ "disabled": "#a89078",
465
+ "inverse": "#faf6ee",
466
+ "link": "#7c5a1c",
467
+ "link-hover": "#5c3d10"
468
+ },
469
+ "bg": {
470
+ "canvas": "#f0e6d2",
471
+ "surface": "#e4d5bc",
472
+ "elevated": "#faf6ee",
473
+ "overlay": "rgba(44, 24, 16, 0.45)",
474
+ "hover": "#dcc9a8",
475
+ "active": "#cfba92",
476
+ "disabled": "#e8dcc8"
477
+ },
478
+ "border": {
479
+ "default": "#c4a574",
480
+ "muted": "#dcc9a8",
481
+ "strong": "#8b6914",
482
+ "focus": "#b45309",
483
+ "disabled": "#dcc9a8"
484
+ },
485
+ "intent": {
486
+ "success": "#3f6212",
487
+ "success-bg": "#ecf4d9",
488
+ "success-border": "#84cc16",
489
+ "warning": "#b45309",
490
+ "warning-bg": "#fff7e6",
491
+ "warning-border": "#f59e0b",
492
+ "danger": "#9f1239",
493
+ "danger-bg": "#ffe4e6",
494
+ "danger-border": "#fb7185",
495
+ "info": "#1e3a5f",
496
+ "info-bg": "#e0ecff",
497
+ "info-border": "#60a5fa"
498
+ },
499
+ "primary": {
500
+ "default": "#8b6914",
501
+ "hover": "#a67c00",
502
+ "active": "#6b4f0f",
503
+ "subtle": "#f5edd4",
504
+ "foreground": "#1a0f08"
505
+ },
506
+ "secondary": {
507
+ "default": "#d4c4a8",
508
+ "hover": "#c4b08c",
509
+ "active": "#a89078",
510
+ "foreground": "#2c1810"
511
+ },
512
+ "muted": {
513
+ "default": "#e4d5bc",
514
+ "foreground": "#5c4033"
515
+ },
516
+ "accent": {
517
+ "default": "#3d2914",
518
+ "foreground": "#faf6ee"
519
+ },
520
+ "destructive": {
521
+ "default": "#9f1239",
522
+ "foreground": "#fff1f2"
523
+ },
524
+ "icon": {
525
+ "default": "#3d2914",
526
+ "muted": "#7a6042",
527
+ "primary": "#a67c00",
528
+ "on-primary": "#1a0f08"
529
+ }
530
+ },
531
+ "font": {
532
+ "body": "'Palatino Linotype', 'Book Antiqua', Palatino, 'Liberation Serif', Georgia, serif",
533
+ "heading": "'Cinzel', 'Palatino Linotype', Palatino, Georgia, serif",
534
+ "mono": "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', monospace"
535
+ },
536
+ "radius": {
537
+ "sm": "6px",
538
+ "md": "10px",
539
+ "lg": "14px",
540
+ "xl": "20px",
541
+ "full": "9999px"
542
+ },
543
+ "shadow": {
544
+ "sm": "0 1px 4px rgb(44 24 16 / 0.12), 0 1px 2px rgb(44 24 16 / 0.08)",
545
+ "md": "0 4px 14px rgb(44 24 16 / 0.12), 0 2px 6px rgb(44 24 16 / 0.08)",
546
+ "lg": "0 12px 32px rgb(44 24 16 / 0.14), 0 4px 12px rgb(44 24 16 / 0.1)",
547
+ "xl": "0 22px 48px rgb(44 24 16 / 0.16), 0 8px 20px rgb(44 24 16 / 0.12)"
548
+ }
549
+ },
550
+ "light": {
551
+ "_comment": "Light theme overrides. All values here override the semantic defaults for [data-theme='light'] or :root.",
552
+ "color": {
553
+ "text": {
554
+ "primary": "#111827",
555
+ "secondary": "#4B5563",
556
+ "tertiary": "#6B7280",
557
+ "disabled": "#9CA3AF",
558
+ "inverse": "#FFFFFF",
559
+ "link": "#2563EB",
560
+ "link-hover": "#1D4ED8"
561
+ },
562
+ "bg": {
563
+ "canvas": "#FFFFFF",
564
+ "surface": "#F9FAFB",
565
+ "elevated": "#FFFFFF",
566
+ "hover": "#F3F4F6",
567
+ "active": "#E5E7EB",
568
+ "disabled": "#F3F4F6"
569
+ },
570
+ "border": {
571
+ "default": "#E5E7EB",
572
+ "muted": "#F3F4F6",
573
+ "strong": "#9CA3AF",
574
+ "focus": "#3B82F6",
575
+ "disabled": "#E5E7EB"
576
+ },
577
+ "intent": {
578
+ "success": "#16A34A",
579
+ "success-bg": "#F0FDF4",
580
+ "success-border": "#4ADE80",
581
+ "warning": "#D97706",
582
+ "warning-bg": "#FFFBEB",
583
+ "warning-border": "#FBBF24",
584
+ "danger": "#DC2626",
585
+ "danger-bg": "#FEF2F2",
586
+ "danger-border": "#F87171",
587
+ "info": "#2563EB",
588
+ "info-bg": "#EFF6FF",
589
+ "info-border": "#93C5FD"
590
+ },
591
+ "primary": {
592
+ "default": "#2563EB",
593
+ "hover": "#1D4ED8",
594
+ "active": "#1E40AF",
595
+ "subtle": "#EFF6FF",
596
+ "foreground": "#FFFFFF"
597
+ },
598
+ "secondary": {
599
+ "default": "#F3F4F6",
600
+ "hover": "#E5E7EB",
601
+ "active": "#D1D5DB",
602
+ "foreground": "#111827"
603
+ },
604
+ "muted": {
605
+ "default": "#F3F4F6",
606
+ "foreground": "#6B7280"
607
+ },
608
+ "accent": {
609
+ "default": "#F3F4F6",
610
+ "foreground": "#111827"
611
+ },
414
612
  "destructive": {
415
613
  "default": "#DC2626",
416
614
  "foreground": "#FFFFFF"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@soli92/solids",
3
- "version": "1.2.1",
3
+ "version": "1.3.0",
4
4
  "description": "SoliDS – agnostic design system foundations (tokens + CSS) with shadcn/ui compatibility.",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -52,7 +52,7 @@
52
52
  "build:storybook-css": "tailwindcss -c ./tailwind.config.cjs -i ./.storybook/preview-tw.input.css -o ./.storybook/preview-tw.built.css",
53
53
  "ui:stories": "node ./scripts/generate-ui-stories.mjs",
54
54
  "storybook": "npm run build && npm run build:storybook-css && npm run ui:stories && storybook dev -p 6006",
55
- "build-storybook": "npm run build && npm run build:storybook-css && npm run ui:stories && storybook build",
55
+ "build-storybook": "npm run build && npm run build:storybook-css && npm run ui:stories && storybook build && node ./scripts/inject-storybook-base.mjs",
56
56
  "registry:sync": "node ./scripts/sync-registry.mjs",
57
57
  "registry:build": "node ./scripts/sync-registry.mjs && shadcn build --output ./registry/r"
58
58
  },