@ember-home/unbound-styleguide 0.0.3 → 0.0.5

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 (7) hide show
  1. package/dist/chunk-VXTSN7DP.js +383 -0
  2. package/dist/preset.d.ts +353 -0
  3. package/dist/preset.js +6 -0
  4. package/dist/tailwind.config.d.ts +337 -0
  5. package/dist/tailwind.config.js +13 -0
  6. package/dist/{styles.css → theme.css} +698 -830
  7. package/package.json +14 -4
package/dist/chunk-VXTSN7DP.js ADDED
@@ -0,0 +1,383 @@
1
+ // src/preset.ts
2
+ var preset = {
3
+ darkMode: "class",
4
+ theme: {
5
+ extend: {
6
+ /* ─────────────────────────────────────────────────────────────────────────
7
+ * Radius Scale
8
+ * ───────────────────────────────────────────────────────────────────────── */
9
+ borderRadius: {
10
+ xs: "var(--radius-xs)",
11
+ sm: "var(--radius-sm)",
12
+ md: "var(--radius-md)",
13
+ lg: "var(--radius-lg)",
14
+ xl: "var(--radius-xl)",
15
+ "2xl": "var(--radius-2xl)",
16
+ "3xl": "var(--radius-3xl)",
17
+ "4xl": "var(--radius-4xl)"
18
+ },
19
+ /* ─────────────────────────────────────────────────────────────────────────
20
+ * Typography
21
+ * ───────────────────────────────────────────────────────────────────────── */
22
+ fontFamily: {
23
+ sans: ["var(--font-sans)"],
24
+ mono: ["var(--font-mono)"]
25
+ },
26
+ /* ─────────────────────────────────────────────────────────────────────────
27
+ * Motion Tokens
28
+ * ───────────────────────────────────────────────────────────────────────── */
29
+ transitionDuration: {
30
+ fast: "var(--motion-fast)",
31
+ normal: "var(--motion-normal)",
32
+ slow: "var(--motion-slow)"
33
+ },
34
+ transitionTimingFunction: {
35
+ DEFAULT: "var(--motion-easing)"
36
+ },
37
+ /* ─────────────────────────────────────────────────────────────────────────
38
+ * Colors (shared across text, bg, border, etc.)
39
+ * ───────────────────────────────────────────────────────────────────────── */
40
+ colors: {
41
+ /* ─────────────────────────────────────────────────────────────────────
42
+ * shadcn Compatibility
43
+ * ─────────────────────────────────────────────────────────────────────*/
44
+ background: "var(--background)",
45
+ foreground: "var(--foreground)",
46
+ card: {
47
+ DEFAULT: "var(--card)",
48
+ foreground: "var(--card-foreground)"
49
+ },
50
+ popover: {
51
+ DEFAULT: "var(--popover)",
52
+ foreground: "var(--popover-foreground)"
53
+ },
54
+ primary: {
55
+ DEFAULT: "var(--primary)",
56
+ foreground: "var(--primary-foreground)"
57
+ },
58
+ secondary: {
59
+ DEFAULT: "var(--secondary)",
60
+ foreground: "var(--secondary-foreground)"
61
+ },
62
+ muted: {
63
+ DEFAULT: "var(--muted)",
64
+ foreground: "var(--muted-foreground)"
65
+ },
66
+ accent: {
67
+ DEFAULT: "var(--accent)",
68
+ foreground: "var(--accent-foreground)"
69
+ },
70
+ destructive: {
71
+ DEFAULT: "var(--destructive)",
72
+ foreground: "var(--destructive-foreground)"
73
+ },
74
+ border: "var(--border)",
75
+ input: "var(--input)",
76
+ ring: "var(--ring)",
77
+ success: {
78
+ DEFAULT: "var(--success)",
79
+ soft: "var(--success-soft)"
80
+ },
81
+ warning: {
82
+ DEFAULT: "var(--warning)",
83
+ soft: "var(--warning-soft)"
84
+ },
85
+ danger: {
86
+ DEFAULT: "var(--danger)",
87
+ soft: "var(--danger-soft)"
88
+ },
89
+ happy: {
90
+ DEFAULT: "var(--happy)",
91
+ soft: "var(--happy-soft)",
92
+ foreground: "var(--happy-foreground)"
93
+ },
94
+ sidebar: {
95
+ DEFAULT: "var(--sidebar)",
96
+ foreground: "var(--sidebar-foreground)",
97
+ primary: "var(--sidebar-primary)",
98
+ "primary-foreground": "var(--sidebar-primary-foreground)",
99
+ accent: "var(--sidebar-accent)",
100
+ "accent-foreground": "var(--sidebar-accent-foreground)",
101
+ border: "var(--sidebar-border)",
102
+ ring: "var(--sidebar-ring)"
103
+ },
104
+ chart: {
105
+ 1: "var(--chart-1)",
106
+ 2: "var(--chart-2)",
107
+ 3: "var(--chart-3)",
108
+ 4: "var(--chart-4)",
109
+ 5: "var(--chart-5)"
110
+ }
111
+ },
112
+ /* ═══════════════════════════════════════════════════════════════════════
113
+ * TEXT COLORS
114
+ * Usage: text-white, text-default, text-link, text-critical, etc.
115
+ * ═══════════════════════════════════════════════════════════════════════ */
116
+ textColor: {
117
+ white: "var(--color-text-white)",
118
+ default: {
119
+ DEFAULT: "var(--color-text-default)",
120
+ hover: "var(--color-text-default-hover)",
121
+ active: "var(--color-text-default-active)",
122
+ selected: "var(--color-text-default-selected)",
123
+ disabled: "var(--color-text-default-disabled)",
124
+ secondary: {
125
+ DEFAULT: "var(--color-text-default-secondary)",
126
+ hover: "var(--color-text-default-secondary-hover)",
127
+ disabled: "var(--color-text-default-secondary-disabled)"
128
+ },
129
+ tertiary: "var(--color-text-default-tertiary)"
130
+ },
131
+ link: {
132
+ DEFAULT: "var(--color-text-link)",
133
+ hover: "var(--color-text-link-hover)",
134
+ active: "var(--color-text-link-active)"
135
+ },
136
+ brand: {
137
+ DEFAULT: "var(--color-text-brand)",
138
+ "on-bg-fill": "var(--color-text-brand-on-bg-fill)",
139
+ "on-bg-fill-disabled": "var(--color-text-brand-on-bg-fill-disabled)"
140
+ },
141
+ info: {
142
+ DEFAULT: "var(--color-text-info)",
143
+ secondary: {
144
+ DEFAULT: "var(--color-text-info-secondary)",
145
+ "on-bg-fill": "var(--color-text-info-secondary-on-bg-fill)"
146
+ }
147
+ },
148
+ critical: {
149
+ DEFAULT: "var(--color-text-critical)",
150
+ "on-bg-fill": "var(--color-text-critical-on-bg-fill)",
151
+ "on-bg-fill-hover": "var(--color-text-critical-on-bg-fill-hover)",
152
+ "on-bg-fill-active": "var(--color-text-critical-on-bg-fill-active)",
153
+ "on-bg-fill-selected": "var(--color-text-critical-on-bg-fill-selected)",
154
+ "on-bg-fill-disabled": "var(--color-text-critical-on-bg-fill-disabled)",
155
+ secondary: {
156
+ DEFAULT: "var(--color-text-critical-secondary)",
157
+ "on-bg-fill": "var(--color-text-critical-secondary-on-bg-fill)"
158
+ }
159
+ },
160
+ success: {
161
+ DEFAULT: "var(--color-text-success)",
162
+ hover: "var(--color-text-success-hover)",
163
+ "on-bg-fill": "var(--color-text-success-on-bg-fill)",
164
+ secondary: {
165
+ DEFAULT: "var(--color-text-success-secondary)",
166
+ "on-bg-fill": "var(--color-text-success-secondary-on-bg-fill)"
167
+ }
168
+ },
169
+ warning: {
170
+ DEFAULT: "var(--color-text-warning)",
171
+ secondary: {
172
+ DEFAULT: "var(--color-text-warning-secondary)",
173
+ "on-bg-fill": "var(--color-text-warning-secondary-on-bg-fill)"
174
+ }
175
+ },
176
+ magic: {
177
+ DEFAULT: "var(--color-text-magic)",
178
+ "on-bg-fill": "var(--color-text-magic-on-bg-fill)"
179
+ }
180
+ },
181
+ /* ═══════════════════════════════════════════════════════════════════════
182
+ * BACKGROUND COLORS
183
+ * Usage: bg-surface-default, bg-fill-brand, etc.
184
+ * ═══════════════════════════════════════════════════════════════════════ */
185
+ backgroundColor: {
186
+ /* Surface colors */
187
+ surface: {
188
+ default: {
189
+ DEFAULT: "var(--color-bg-surface-default)",
190
+ active: "var(--color-bg-surface-default-active)",
191
+ hover: "var(--color-bg-surface-default-hover)",
192
+ focus: "var(--color-bg-surface-default-focus)",
193
+ secondary: {
194
+ DEFAULT: "var(--color-bg-surface-default-secondary)",
195
+ hover: "var(--color-bg-surface-default-secondary-hover)"
196
+ },
197
+ tertiary: "var(--color-bg-surface-default-tertiary)"
198
+ },
199
+ white: "var(--color-bg-surface-white)",
200
+ success: {
201
+ DEFAULT: "var(--color-bg-surface-success)",
202
+ tertiary: "var(--color-bg-surface-success-tertiary)"
203
+ },
204
+ info: {
205
+ DEFAULT: "var(--color-bg-surface-info)",
206
+ tertiary: "var(--color-bg-surface-info-tertiary)"
207
+ },
208
+ critical: {
209
+ DEFAULT: "var(--color-bg-surface-critical)",
210
+ tertiary: "var(--color-bg-surface-critical-tertiary)"
211
+ },
212
+ warning: {
213
+ DEFAULT: "var(--color-bg-surface-warning)",
214
+ tertiary: "var(--color-bg-surface-warning-tertiary)"
215
+ },
216
+ transparent: "var(--color-bg-surface-transparent)",
217
+ brand: {
218
+ DEFAULT: "var(--color-bg-surface-brand)",
219
+ hover: "var(--color-bg-surface-brand-hover)",
220
+ active: "var(--color-bg-surface-brand-active)",
221
+ disabled: "var(--color-bg-surface-brand-disabled)"
222
+ }
223
+ },
224
+ /* Fill colors */
225
+ fill: {
226
+ default: {
227
+ DEFAULT: "var(--color-bg-fill-default)",
228
+ secondary: {
229
+ DEFAULT: "var(--color-bg-fill-default-secondary)",
230
+ hover: "var(--color-bg-fill-default-secondary-hover)",
231
+ active: "var(--color-bg-fill-default-secondary-active)",
232
+ selected: "var(--color-bg-fill-default-secondary-selected)"
233
+ },
234
+ tertiary: "var(--color-bg-fill-default-tertiary)"
235
+ },
236
+ brand: {
237
+ DEFAULT: "var(--color-bg-fill-brand)",
238
+ hover: "var(--color-bg-fill-brand-hover)",
239
+ active: "var(--color-bg-fill-brand-active)",
240
+ disabled: "var(--color-bg-fill-brand-disabled)"
241
+ },
242
+ success: {
243
+ DEFAULT: "var(--color-bg-fill-success)",
244
+ hover: "var(--color-bg-fill-success-hover)",
245
+ active: "var(--color-bg-fill-success-active)",
246
+ secondary: {
247
+ DEFAULT: "var(--color-bg-fill-success-secondary)",
248
+ hover: "var(--color-bg-fill-success-secondary-hover)"
249
+ }
250
+ },
251
+ critical: {
252
+ DEFAULT: "var(--color-bg-fill-critical)",
253
+ hover: "var(--color-bg-fill-critical-hover)",
254
+ disabled: "var(--color-bg-fill-critical-disabled)",
255
+ secondary: {
256
+ DEFAULT: "var(--color-bg-fill-critical-secondary)",
257
+ hover: "var(--color-bg-fill-critical-secondary-hover)"
258
+ }
259
+ },
260
+ warning: {
261
+ DEFAULT: "var(--color-bg-fill-warning)",
262
+ secondary: {
263
+ DEFAULT: "var(--color-bg-fill-warning-secondary)",
264
+ hover: "var(--color-bg-fill-warning-secondary-hover)"
265
+ }
266
+ },
267
+ info: {
268
+ DEFAULT: "var(--color-bg-fill-info)",
269
+ hover: "var(--color-bg-fill-info-hover)",
270
+ secondary: {
271
+ DEFAULT: "var(--color-bg-fill-info-secondary)",
272
+ hover: "var(--color-bg-fill-info-secondary-hover)"
273
+ }
274
+ },
275
+ magic: {
276
+ DEFAULT: "var(--color-bg-fill-magic)",
277
+ hover: "var(--color-bg-fill-magic-hover)",
278
+ active: "var(--color-bg-fill-magic-active)"
279
+ },
280
+ transparent: "var(--color-bg-fill-transparent)",
281
+ white: "var(--color-bg-fill-white)"
282
+ }
283
+ },
284
+ /* ═══════════════════════════════════════════════════════════════════════
285
+ * BORDER COLORS
286
+ * Usage: border-default, border-critical, etc.
287
+ * ═══════════════════════════════════════════════════════════════════════ */
288
+ borderColor: {
289
+ default: {
290
+ DEFAULT: "var(--color-border-default)",
291
+ hover: "var(--color-border-default-hover)",
292
+ active: "var(--color-border-default-active)",
293
+ disabled: "var(--color-border-default-disabled)",
294
+ secondary: "var(--color-border-default-secondary)",
295
+ tertiary: "var(--color-border-default-tertiary)"
296
+ },
297
+ white: "var(--color-border-white)",
298
+ success: "var(--color-border-success)",
299
+ critical: "var(--color-border-critical)",
300
+ warning: "var(--color-border-warning)",
301
+ info: "var(--color-border-info)",
302
+ transparent: "var(--color-border-transparent)",
303
+ magic: {
304
+ DEFAULT: "var(--color-border-magic)",
305
+ secondary: "var(--color-border-magic-secondary)"
306
+ }
307
+ },
308
+ /* ═══════════════════════════════════════════════════════════════════════
309
+ * RING COLORS
310
+ * Usage: ring-default, ring-critical, etc.
311
+ * ═══════════════════════════════════════════════════════════════════════ */
312
+ ringColor: {
313
+ default: {
314
+ DEFAULT: "var(--color-ring-default)",
315
+ secondary: "var(--color-ring-default-secondary)",
316
+ tertiary: "var(--color-ring-default-tertiary)"
317
+ },
318
+ success: "var(--color-ring-success)",
319
+ critical: {
320
+ DEFAULT: "var(--color-ring-critical)",
321
+ secondary: "var(--color-ring-critical-secondary)"
322
+ },
323
+ warning: "var(--color-ring-warning)",
324
+ magic: "var(--color-ring-magic)",
325
+ white: "var(--color-ring-white)"
326
+ },
327
+ /* ═══════════════════════════════════════════════════════════════════════
328
+ * OUTLINE COLORS
329
+ * Usage: outline-default, outline-info, etc.
330
+ * ═══════════════════════════════════════════════════════════════════════ */
331
+ outlineColor: {
332
+ default: {
333
+ DEFAULT: "var(--color-outline-default)",
334
+ secondary: "var(--color-outline-default-secondary)",
335
+ tertiary: "var(--color-outline-default-tertiary)"
336
+ },
337
+ info: "var(--color-outline-info)",
338
+ transparent: "var(--color-outline-transparent)"
339
+ },
340
+ /* ═══════════════════════════════════════════════════════════════════════
341
+ * SVG FILL COLORS
342
+ * Usage: fill-default, fill-success, etc.
343
+ * ═══════════════════════════════════════════════════════════════════════ */
344
+ fill: {
345
+ default: {
346
+ DEFAULT: "var(--color-svg-fill-default)",
347
+ secondary: "var(--color-svg-fill-default-secondary)"
348
+ },
349
+ success: {
350
+ DEFAULT: "var(--color-svg-fill-success)",
351
+ selected: "var(--color-svg-fill-success-selected)",
352
+ active: "var(--color-svg-fill-success-active)"
353
+ },
354
+ info: {
355
+ DEFAULT: "var(--color-svg-fill-info)",
356
+ hover: "var(--color-svg-fill-info-hover)"
357
+ },
358
+ magic: {
359
+ DEFAULT: "var(--color-svg-fill-magic)",
360
+ disabled: "var(--color-svg-fill-magic-disabled)"
361
+ }
362
+ },
363
+ /* ═══════════════════════════════════════════════════════════════════════
364
+ * SVG STROKE COLORS
365
+ * Usage: stroke-default, stroke-success, etc.
366
+ * ═══════════════════════════════════════════════════════════════════════ */
367
+ stroke: {
368
+ default: {
369
+ DEFAULT: "var(--color-svg-stroke-default)",
370
+ hover: "var(--color-svg-stroke-default-hover)",
371
+ secondary: "var(--color-svg-stroke-default-secondary)",
372
+ tertiary: "var(--color-svg-stroke-default-tertiary)"
373
+ },
374
+ success: "var(--color-svg-stroke-success)"
375
+ }
376
+ }
377
+ }
378
+ };
379
+ var preset_default = preset;
380
+
381
+ export {
382
+ preset_default
383
+ };