fiboui 2.4.4 → 2.6.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.
@@ -1,441 +0,0 @@
1
- "use client";
2
- const s = {
3
- name: "material",
4
- colors: {
5
- primary: "#6750A4",
6
- primaryVariant: "#4F378B",
7
- secondary: "#625B71",
8
- secondaryVariant: "#4A4458",
9
- background: "#FFFBFE",
10
- surface: "#FFFBFE",
11
- error: "#B3261E",
12
- success: "#4CAF50",
13
- warning: "#FF9800",
14
- info: "#2196F3",
15
- onPrimary: "#FFFFFF",
16
- onSecondary: "#000000",
17
- onBackground: "#000000",
18
- onSurface: "#000000",
19
- onError: "#FFFFFF"
20
- },
21
- typography: {
22
- h1: {
23
- fontSize: "96px",
24
- fontWeight: 300,
25
- letterSpacing: "-1.5px"
26
- },
27
- h2: {
28
- fontSize: "60px",
29
- fontWeight: 300,
30
- letterSpacing: "-0.5px"
31
- },
32
- h3: {
33
- fontSize: "48px",
34
- fontWeight: 400
35
- },
36
- h4: {
37
- fontSize: "34px",
38
- fontWeight: 400,
39
- letterSpacing: "0.25px"
40
- },
41
- h5: {
42
- fontSize: "24px",
43
- fontWeight: 400
44
- },
45
- h6: {
46
- fontSize: "20px",
47
- fontWeight: 500,
48
- letterSpacing: "0.15px"
49
- },
50
- body: {
51
- fontSize: "16px",
52
- fontWeight: 400,
53
- letterSpacing: "0.5px"
54
- },
55
- caption: {
56
- fontSize: "12px",
57
- fontWeight: 400,
58
- letterSpacing: "0.4px"
59
- },
60
- label: {
61
- fontSize: "14px",
62
- fontWeight: 500,
63
- letterSpacing: "1.25px"
64
- }
65
- },
66
- spacing: {
67
- xs: "4px",
68
- sm: "8px",
69
- md: "16px",
70
- lg: "24px",
71
- xl: "32px"
72
- },
73
- borderRadius: {
74
- sm: "4px",
75
- md: "8px",
76
- lg: "16px",
77
- full: "9999px"
78
- },
79
- shadows: {
80
- sm: "0 2px 4px rgba(0,0,0,0.1)",
81
- md: "0 4px 8px rgba(0,0,0,0.12)",
82
- lg: "0 8px 16px rgba(0,0,0,0.14)"
83
- },
84
- fontFamily: "Roboto, sans-serif"
85
- }, p = {
86
- name: "cupertino",
87
- colors: {
88
- primary: "#007AFF",
89
- secondary: "#AF52DE",
90
- background: "#FFFFFF",
91
- surface: "#F2F2F7",
92
- error: "#FF3B30",
93
- success: "#34C759",
94
- warning: "#FF9500",
95
- info: "#5AC8FA",
96
- onPrimary: "#FFFFFF",
97
- onSecondary: "#FFFFFF",
98
- onBackground: "#000000",
99
- onSurface: "#000000",
100
- onError: "#FFFFFF"
101
- },
102
- typography: {
103
- h1: {
104
- fontSize: "34px",
105
- fontWeight: 700,
106
- letterSpacing: "0.37px"
107
- },
108
- h2: {
109
- fontSize: "28px",
110
- fontWeight: 700,
111
- letterSpacing: "0.36px"
112
- },
113
- h3: {
114
- fontSize: "22px",
115
- fontWeight: 600,
116
- letterSpacing: "0.35px"
117
- },
118
- h4: {
119
- fontSize: "20px",
120
- fontWeight: 600
121
- },
122
- h5: {
123
- fontSize: "17px",
124
- fontWeight: 600,
125
- letterSpacing: "-0.41px"
126
- },
127
- h6: {
128
- fontSize: "15px",
129
- fontWeight: 600,
130
- letterSpacing: "-0.24px"
131
- },
132
- body: {
133
- fontSize: "17px",
134
- fontWeight: 400,
135
- letterSpacing: "-0.41px"
136
- },
137
- caption: {
138
- fontSize: "13px",
139
- fontWeight: 400,
140
- letterSpacing: "-0.08px"
141
- },
142
- label: {
143
- fontSize: "15px",
144
- fontWeight: 500,
145
- letterSpacing: "-0.24px"
146
- }
147
- },
148
- spacing: {
149
- xs: "4px",
150
- sm: "8px",
151
- md: "12px",
152
- lg: "20px",
153
- xl: "32px"
154
- },
155
- borderRadius: {
156
- sm: "8px",
157
- md: "12px",
158
- lg: "20px",
159
- full: "9999px"
160
- },
161
- shadows: {
162
- sm: "0 1px 3px rgba(0,0,0,0.08)",
163
- md: "0 2px 8px rgba(0,0,0,0.1)",
164
- lg: "0 4px 16px rgba(0,0,0,0.12)"
165
- },
166
- fontFamily: '-apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif'
167
- }, c = {
168
- name: "web",
169
- colors: {
170
- primary: "#3B82F6",
171
- secondary: "#8B5CF6",
172
- background: "#FFFFFF",
173
- surface: "#F9FAFB",
174
- error: "#EF4444",
175
- success: "#10B981",
176
- warning: "#F59E0B",
177
- info: "#06B6D4",
178
- onPrimary: "#FFFFFF",
179
- onSecondary: "#FFFFFF",
180
- onBackground: "#111827",
181
- onSurface: "#374151",
182
- onError: "#FFFFFF"
183
- },
184
- typography: {
185
- h1: {
186
- fontSize: "60px",
187
- fontWeight: 800,
188
- letterSpacing: "-0.02em"
189
- },
190
- h2: {
191
- fontSize: "48px",
192
- fontWeight: 700,
193
- letterSpacing: "-0.01em"
194
- },
195
- h3: {
196
- fontSize: "36px",
197
- fontWeight: 700
198
- },
199
- h4: {
200
- fontSize: "30px",
201
- fontWeight: 600
202
- },
203
- h5: {
204
- fontSize: "24px",
205
- fontWeight: 600
206
- },
207
- h6: {
208
- fontSize: "20px",
209
- fontWeight: 600
210
- },
211
- body: {
212
- fontSize: "16px",
213
- fontWeight: 400,
214
- lineHeight: "1.5"
215
- },
216
- caption: {
217
- fontSize: "14px",
218
- fontWeight: 400,
219
- lineHeight: "1.4"
220
- },
221
- label: {
222
- fontSize: "14px",
223
- fontWeight: 500,
224
- letterSpacing: "0.01em"
225
- }
226
- },
227
- spacing: {
228
- xs: "4px",
229
- sm: "8px",
230
- md: "16px",
231
- lg: "24px",
232
- xl: "32px"
233
- },
234
- borderRadius: {
235
- sm: "6px",
236
- md: "8px",
237
- lg: "12px",
238
- full: "9999px"
239
- },
240
- shadows: {
241
- sm: "0 1px 2px rgba(0,0,0,0.05)",
242
- md: "0 4px 6px rgba(0,0,0,0.07)",
243
- lg: "0 10px 15px rgba(0,0,0,0.1)"
244
- },
245
- fontFamily: "Inter, system-ui, sans-serif"
246
- }, g = {
247
- name: "noir",
248
- colors: {
249
- primary: "#F4F4F6",
250
- onPrimary: "#0A0A0B",
251
- primaryVariant: "#C8C8D0",
252
- secondary: "#8E8E9A",
253
- onSecondary: "#F4F4F6",
254
- secondaryVariant: "#4E4E57",
255
- background: "#0A0A0B",
256
- onBackground: "#F4F4F6",
257
- surface: "#141417",
258
- onSurface: "#F4F4F6",
259
- error: "#F87171",
260
- success: "#34D399",
261
- warning: "#FBBF24",
262
- info: "#94A3B8",
263
- onError: "#0A0A0B",
264
- outline: "rgba(255, 255, 255, 0.12)"
265
- },
266
- typography: {
267
- h1: {
268
- fontSize: "clamp(38px, 4.4vw, 60px)",
269
- fontWeight: 300,
270
- letterSpacing: "0.03em",
271
- lineHeight: 1.12,
272
- color: "var(--fibo-on-background)"
273
- },
274
- h2: {
275
- fontSize: "clamp(28px, 3.2vw, 44px)",
276
- fontWeight: 300,
277
- letterSpacing: "0.03em",
278
- lineHeight: 1.18,
279
- color: "var(--fibo-on-background)"
280
- },
281
- h3: {
282
- fontSize: "16px",
283
- fontWeight: 500,
284
- letterSpacing: "0.01em",
285
- color: "var(--fibo-on-background)"
286
- },
287
- h4: {
288
- fontSize: "15px",
289
- fontWeight: 500,
290
- color: "var(--fibo-on-background)"
291
- },
292
- h5: {
293
- fontSize: "14px",
294
- fontWeight: 500,
295
- color: "var(--fibo-on-background)"
296
- },
297
- h6: {
298
- fontSize: "13px",
299
- fontWeight: 500,
300
- color: "var(--fibo-on-background)"
301
- },
302
- body: {
303
- fontSize: "13.5px",
304
- fontWeight: 400,
305
- lineHeight: 1.7,
306
- color: "var(--fibo-secondary)"
307
- },
308
- caption: {
309
- fontSize: "12.5px",
310
- fontWeight: 400,
311
- lineHeight: 1.4,
312
- color: "var(--fibo-secondary)"
313
- },
314
- label: {
315
- fontSize: "11.5px",
316
- fontWeight: 500,
317
- letterSpacing: "0.02em",
318
- color: "var(--fibo-secondary)"
319
- }
320
- },
321
- spacing: {
322
- xs: "4px",
323
- sm: "8px",
324
- md: "16px",
325
- lg: "24px",
326
- xl: "40px"
327
- },
328
- borderRadius: {
329
- sm: "6px",
330
- md: "14px",
331
- lg: "18px",
332
- full: "9999px"
333
- },
334
- shadows: {
335
- sm: "0 1px 0 rgba(255,255,255,0.04)",
336
- md: "0 12px 40px rgba(0,0,0,0.45)",
337
- lg: "0 30px 80px rgba(0,0,0,0.75)"
338
- },
339
- fontFamily: 'var(--font-sans-loaded, "Plus Jakarta Sans"), system-ui, -apple-system, sans-serif'
340
- }, l = {
341
- material: s,
342
- cupertino: p,
343
- web: c,
344
- noir: g
345
- };
346
- function y(n) {
347
- if (typeof n == "string") {
348
- const o = l[n];
349
- if (!o) throw new Error(`Unknown fiboui theme preset: ${n}`);
350
- return o;
351
- }
352
- return n;
353
- }
354
- function e(n, o) {
355
- return o ? { ...n, ...o } : n;
356
- }
357
- function x(n, o) {
358
- return o ? {
359
- h1: e(n.h1, o.h1),
360
- h2: e(n.h2, o.h2),
361
- h3: e(n.h3, o.h3),
362
- h4: e(n.h4, o.h4),
363
- h5: e(n.h5, o.h5),
364
- h6: e(n.h6, o.h6),
365
- body: e(n.body, o.body),
366
- caption: e(n.caption, o.caption),
367
- label: e(n.label, o.label)
368
- } : n;
369
- }
370
- function F(n, o) {
371
- return {
372
- name: o.name ?? n.name,
373
- colors: { ...n.colors, ...o.colors },
374
- typography: x(n.typography, o.typography),
375
- spacing: { ...n.spacing, ...o.spacing },
376
- borderRadius: { ...n.borderRadius, ...o.borderRadius },
377
- shadows: { ...n.shadows, ...o.shadows },
378
- fontFamily: o.fontFamily ?? n.fontFamily
379
- };
380
- }
381
- const m = F;
382
- function d(n) {
383
- return `--fibo-text-${n}`;
384
- }
385
- function f(n) {
386
- const o = n.colors, r = {
387
- "--fibo-primary": o.primary,
388
- "--fibo-on-primary": o.onPrimary,
389
- "--fibo-secondary": o.secondary,
390
- "--fibo-on-secondary": o.onSecondary,
391
- "--fibo-background": o.background,
392
- "--fibo-on-background": o.onBackground,
393
- "--fibo-surface": o.surface,
394
- "--fibo-on-surface": o.onSurface,
395
- "--fibo-error": o.error,
396
- "--fibo-font-family": n.fontFamily,
397
- "--fibo-space-xs": n.spacing.xs,
398
- "--fibo-space-sm": n.spacing.sm,
399
- "--fibo-space-md": n.spacing.md,
400
- "--fibo-space-lg": n.spacing.lg,
401
- "--fibo-space-xl": n.spacing.xl,
402
- "--fibo-radius-sm": n.borderRadius.sm,
403
- "--fibo-radius-md": n.borderRadius.md,
404
- "--fibo-radius-lg": n.borderRadius.lg,
405
- "--fibo-radius-full": n.borderRadius.full,
406
- "--fibo-shadow-sm": n.shadows.sm,
407
- "--fibo-shadow-md": n.shadows.md,
408
- "--fibo-shadow-lg": n.shadows.lg
409
- };
410
- return o.primaryVariant && (r["--fibo-primary-variant"] = o.primaryVariant), o.secondaryVariant && (r["--fibo-secondary-variant"] = o.secondaryVariant), o.success && (r["--fibo-success"] = o.success), o.warning && (r["--fibo-warning"] = o.warning), o.info && (r["--fibo-info"] = o.info), o.onError && (r["--fibo-on-error"] = o.onError), o.outline && (r["--fibo-outline"] = o.outline), r["--fibo-primary-container"] = o.primaryVariant ?? o.primary, r["--fibo-on-primary-container"] = o.onPrimary, r["--fibo-secondary-container"] = o.secondaryVariant ?? o.secondary, r["--fibo-on-secondary-container"] = o.onSecondary, r["--fibo-tertiary"] = o.secondary, r["--fibo-on-tertiary"] = o.onSecondary, r["--fibo-tertiary-container"] = o.secondaryVariant ?? o.secondary, r["--fibo-on-tertiary-container"] = o.onSecondary, r["--fibo-surface-variant"] = o.surface, r["--fibo-on-surface-variant"] = o.onSurface, Object.keys(n.typography).forEach((a) => {
411
- const i = n.typography[a], t = d(a);
412
- i.fontSize != null && (r[`${t}-size`] = String(i.fontSize)), i.fontWeight != null && (r[`${t}-weight`] = String(i.fontWeight)), i.letterSpacing != null && (r[`${t}-tracking`] = String(i.letterSpacing)), i.lineHeight != null && (r[`${t}-height`] = String(i.lineHeight)), i.color != null && (r[`${t}-color`] = String(i.color));
413
- }), r;
414
- }
415
- function h(n) {
416
- return f(n);
417
- }
418
- function u(n) {
419
- const o = f(n), r = Object.entries(o).map(([i, t]) => ` ${i}: ${t};`).join(`
420
- `);
421
- return `.fibo-theme-${n.name || "custom"} {
422
- ${r}
423
- }`;
424
- }
425
- function b(n) {
426
- return `fibo-theme-${n.name || "custom"}`;
427
- }
428
- export {
429
- l as F,
430
- F as a,
431
- h as b,
432
- p as c,
433
- u as d,
434
- m as e,
435
- b as f,
436
- s as m,
437
- g as n,
438
- y as r,
439
- f as t,
440
- c as w
441
- };