fiboui 2.2.4 → 2.4.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,2517 +0,0 @@
1
- "use client";
2
- var gt = Object.defineProperty;
3
- var bt = (r, t, e) => t in r ? gt(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
4
- var c = (r, t, e) => bt(r, typeof t != "symbol" ? t + "" : t, e);
5
- import g, { useRef as w, createContext as j, useContext as B, useCallback as E, useSyncExternalStore as O, useEffect as A, useState as Z, cloneElement as yt } from "react";
6
- import { jsx as C, Fragment as W } from "react/jsx-runtime";
7
- class J {
8
- constructor() {
9
- c(this, "activeEffect", null);
10
- }
11
- }
12
- const Q = new J(), z = [Q];
13
- function tt() {
14
- return new J();
15
- }
16
- function et() {
17
- return z[z.length - 1] ?? Q;
18
- }
19
- function D() {
20
- return et().activeEffect;
21
- }
22
- function kt(r, t) {
23
- z.push(r);
24
- try {
25
- return t();
26
- } finally {
27
- z.pop();
28
- }
29
- }
30
- function M(r) {
31
- const t = et(), e = t.activeEffect;
32
- return t.activeEffect = r, e;
33
- }
34
- class _t {
35
- constructor(t) {
36
- c(this, "dependencies", /* @__PURE__ */ new Set());
37
- c(this, "_onDispose");
38
- this.fn = t, this.run();
39
- }
40
- run() {
41
- const t = M(this);
42
- try {
43
- this.cleanup(), this.fn();
44
- } finally {
45
- M(t);
46
- }
47
- }
48
- track(t) {
49
- this.dependencies.add(t), t.subscribeEffect(this);
50
- }
51
- trigger() {
52
- this.run();
53
- }
54
- cleanup() {
55
- this.dependencies.forEach((t) => t.unsubscribeEffect(this)), this.dependencies.clear();
56
- }
57
- dispose() {
58
- var t;
59
- this.cleanup(), (t = this._onDispose) == null || t.call(this);
60
- }
61
- }
62
- class xt {
63
- constructor(t) {
64
- c(this, "dependencies", /* @__PURE__ */ new Set());
65
- this._onInvalidate = t;
66
- }
67
- execute(t) {
68
- const e = M(this);
69
- try {
70
- return this.cleanup(), t();
71
- } finally {
72
- M(e);
73
- }
74
- }
75
- track(t) {
76
- this.dependencies.add(t), t.subscribeEffect(this);
77
- }
78
- trigger() {
79
- this._onInvalidate();
80
- }
81
- cleanup() {
82
- this.dependencies.forEach((t) => t.unsubscribeEffect(this)), this.dependencies.clear();
83
- }
84
- dispose() {
85
- this.cleanup();
86
- }
87
- }
88
- class R {
89
- constructor(t) {
90
- c(this, "listeners", /* @__PURE__ */ new Set());
91
- c(this, "effects", /* @__PURE__ */ new Set());
92
- this._value = t;
93
- }
94
- get value() {
95
- const t = D();
96
- return t && t.track(this), this._value;
97
- }
98
- set value(t) {
99
- this._value !== t && (this._value = t, this.notify());
100
- }
101
- subscribe(t) {
102
- return this.listeners.add(t), () => this.listeners.delete(t);
103
- }
104
- subscribeEffect(t) {
105
- this.effects.add(t);
106
- }
107
- unsubscribeEffect(t) {
108
- this.effects.delete(t);
109
- }
110
- notify() {
111
- const t = Array.from(this.effects), e = Array.from(this.listeners);
112
- t.forEach((s) => s.trigger()), e.forEach((s) => s(this._value));
113
- }
114
- }
115
- function ge(r) {
116
- return new R(r);
117
- }
118
- class $t {
119
- constructor(t) {
120
- c(this, "listeners", /* @__PURE__ */ new Set());
121
- c(this, "effects", /* @__PURE__ */ new Set());
122
- c(this, "_value");
123
- c(this, "_dirty", !0);
124
- c(this, "internalEffect");
125
- this.fn = t, this.internalEffect = new _t(() => {
126
- this._dirty || (this._dirty = !0, this.notify());
127
- });
128
- }
129
- get value() {
130
- const t = D();
131
- if (t && t.track(this), this._dirty) {
132
- const e = M(this.internalEffect);
133
- try {
134
- this.internalEffect.cleanup(), this._value = this.fn(), this._dirty = !1;
135
- } finally {
136
- M(e);
137
- }
138
- }
139
- return this._value;
140
- }
141
- subscribe(t) {
142
- return this.listeners.add(t), () => this.listeners.delete(t);
143
- }
144
- subscribeEffect(t) {
145
- this.effects.add(t);
146
- }
147
- unsubscribeEffect(t) {
148
- this.effects.delete(t);
149
- }
150
- notify() {
151
- const t = Array.from(this.effects), e = Array.from(this.listeners);
152
- t.forEach((s) => s.trigger()), e.forEach((s) => s(this._value));
153
- }
154
- }
155
- function be(r) {
156
- return new $t(r);
157
- }
158
- class wt {
159
- constructor(t) {
160
- c(this, "listeners", /* @__PURE__ */ new Set());
161
- c(this, "effects", /* @__PURE__ */ new Set());
162
- this._value = t;
163
- }
164
- get() {
165
- const t = D();
166
- return t && t.track(this), this._value;
167
- }
168
- set(t) {
169
- this._value !== t && (this._value = t, this.notify());
170
- }
171
- subscribe(t) {
172
- return this.listeners.add(t), () => this.listeners.delete(t);
173
- }
174
- subscribeEffect(t) {
175
- this.effects.add(t);
176
- }
177
- unsubscribeEffect(t) {
178
- this.effects.delete(t);
179
- }
180
- notify() {
181
- Array.from(this.effects).forEach((t) => t.trigger()), Array.from(this.listeners).forEach((t) => t(this._value));
182
- }
183
- }
184
- function ye(r) {
185
- return new wt(r);
186
- }
187
- class St {
188
- constructor(t) {
189
- c(this, "listeners", /* @__PURE__ */ new Set());
190
- c(this, "effects", /* @__PURE__ */ new Set());
191
- this.state = t;
192
- }
193
- getState() {
194
- const t = D();
195
- return t && t.track(this), this.state;
196
- }
197
- setState(t) {
198
- const e = typeof t == "function" ? t(this.state) : t, s = { ...this.state, ...e }, o = Object.keys(this.state), i = Object.keys(s);
199
- o.length === i.length && i.every((a) => Object.is(s[a], this.state[a])) || (this.state = s, this.notify());
200
- }
201
- subscribe(t) {
202
- return this.listeners.add(t), () => this.listeners.delete(t);
203
- }
204
- subscribeEffect(t) {
205
- this.effects.add(t);
206
- }
207
- unsubscribeEffect(t) {
208
- this.effects.delete(t);
209
- }
210
- notify() {
211
- Array.from(this.effects).forEach((t) => t.trigger()), Array.from(this.listeners).forEach((t) => t(this.state));
212
- }
213
- }
214
- function ke(r) {
215
- return new St(r);
216
- }
217
- const vt = tt(), st = j(vt);
218
- function Ct() {
219
- return B(st);
220
- }
221
- function _e({ children: r, scope: t }) {
222
- const e = w(t ?? tt()).current;
223
- return /* @__PURE__ */ C(st.Provider, { value: e, children: r });
224
- }
225
- function Nt({ children: r }) {
226
- const t = w(0), e = w(/* @__PURE__ */ new Set()), s = w(null);
227
- s.current || (s.current = new xt(() => {
228
- t.current += 1, e.current.forEach((l) => l());
229
- }));
230
- const o = E((l) => (e.current.add(l), () => {
231
- e.current.delete(l);
232
- }), []), i = E(() => t.current, []);
233
- O(o, i, i), A(() => () => {
234
- var l;
235
- (l = s.current) == null || l.dispose();
236
- }, []);
237
- const n = Ct();
238
- let a = null;
239
- try {
240
- a = kt(n, () => s.current.execute(r));
241
- } catch {
242
- a = null;
243
- }
244
- return /* @__PURE__ */ C(W, { children: a });
245
- }
246
- const Et = j(/* @__PURE__ */ new Map()), rt = j(null);
247
- function xe(r) {
248
- const t = B(rt);
249
- if (!t)
250
- throw new Error("useBuilderState must be used under a builder that called .state()");
251
- return [t.get(r), (e) => t.set(r, e)];
252
- }
253
- function Mt({ stateMap: r = /* @__PURE__ */ new Map(), children: t }) {
254
- const [e, s] = Z(() => new Map(r)), o = {
255
- map: e,
256
- get: (i) => e.get(i),
257
- set: (i, n) => {
258
- s((a) => {
259
- if (Object.is(a.get(i), n))
260
- return a;
261
- const l = new Map(a);
262
- return l.set(i, n), l;
263
- });
264
- }
265
- };
266
- return /* @__PURE__ */ C(rt.Provider, { value: o, children: /* @__PURE__ */ C(Et.Provider, { value: e, children: t }) });
267
- }
268
- function Tt({ observables: r, children: t }) {
269
- const e = w(0), s = E((i) => {
270
- const n = Array.from(r).map(
271
- (a) => a.subscribe(() => {
272
- e.current += 1, i();
273
- })
274
- );
275
- return () => n.forEach((a) => a());
276
- }, [r]), o = E(() => e.current, []);
277
- return O(s, o, o), /* @__PURE__ */ C(W, { children: typeof t == "function" ? t() : t });
278
- }
279
- function It({ signals: r, children: t }) {
280
- const e = w(0), s = E((i) => {
281
- const n = Array.from(r).map(
282
- (a) => a.subscribe(() => {
283
- e.current += 1, i();
284
- })
285
- );
286
- return () => n.forEach((a) => a());
287
- }, [r]), o = E(() => e.current, []);
288
- return O(s, o, o), /* @__PURE__ */ C(W, { children: typeof t == "function" ? t() : t });
289
- }
290
- const ot = j(/* @__PURE__ */ new Map());
291
- function $e(r) {
292
- const t = B(ot);
293
- return t == null ? void 0 : t.get(r);
294
- }
295
- function Rt({ providers: r = /* @__PURE__ */ new Map(), children: t }) {
296
- return /* @__PURE__ */ C(ot.Provider, { value: r, children: t });
297
- }
298
- function zt(r) {
299
- return !!r && typeof r == "object" && "build" in r && typeof r.build == "function";
300
- }
301
- function jt(r) {
302
- return g.isValidElement(r) ? r : zt(r) ? r.build() : r;
303
- }
304
- function H(r) {
305
- return typeof r == "string" || typeof r == "number";
306
- }
307
- function At(r, t) {
308
- return g.isValidElement(r) && H(r.key) && r.key !== "" ? r.key : `.$fibo-${t}`;
309
- }
310
- function Dt(r, t) {
311
- return !g.isValidElement(r) || H(r.key) && r.key !== "" ? r : g.cloneElement(r, { key: At(r, t) });
312
- }
313
- function K(r) {
314
- if (r == null)
315
- return [];
316
- const t = typeof r == "function" ? r() : r;
317
- return (Array.isArray(t) ? t : [t]).map((s, o) => Dt(jt(s), o));
318
- }
319
- const Y = /* @__PURE__ */ new Map(), Lt = {
320
- easeIn: "ease-in",
321
- easeOut: "ease-out",
322
- easeInOut: "ease-in-out",
323
- linear: "linear",
324
- ease: "ease"
325
- };
326
- function it(r = {}) {
327
- const t = r.stiffness ?? 170, e = r.damping ?? 26, s = r.mass ?? 1, o = `${t}:${e}:${s}`, i = Y.get(o);
328
- if (i) return i;
329
- const n = 1 / 60, a = 1;
330
- let l = 0, d = 0;
331
- const h = [0];
332
- for (let b = 0; b < 180; b += 1) {
333
- const x = -t * (l - a) - e * d;
334
- if (d += x / s * n, l += d * n, h.push(l), b > 8 && Math.abs(l - a) < 2e-3 && Math.abs(d) < 2e-3) break;
335
- }
336
- h[h.length - 1] !== 1 && h.push(1);
337
- const m = Math.max(1, Math.floor((h.length - 1) / 24)), p = [];
338
- for (let b = 0; b < h.length; b += m) {
339
- const x = b / (h.length - 1), S = Math.round(h[b] * 1e4) / 1e4;
340
- p.push(b === 0 ? `${S}` : `${S} ${Math.round(x * 1e4) / 100}%`);
341
- }
342
- const y = `linear(${p.join(", ")})`;
343
- return Y.set(o, y), y;
344
- }
345
- function v(r, t) {
346
- return r === "spring" ? it(t) : Lt[r] ?? r;
347
- }
348
- const U = [
349
- "fadeIn",
350
- "fadeOut",
351
- "fade",
352
- "slideUp",
353
- "slideDown",
354
- "slideLeft",
355
- "slideRight",
356
- "scaleIn",
357
- "scaleOut",
358
- "scale",
359
- "blurIn",
360
- "blurOut",
361
- "blur",
362
- "pop",
363
- "bounce"
364
- ], Vt = {
365
- fade: "fadeIn",
366
- scale: "scaleIn",
367
- blur: "blurIn"
368
- };
369
- function Pt(r) {
370
- if (!r || typeof r != "object") return !1;
371
- const t = r;
372
- return typeof t.from == "object" && t.from !== null && typeof t.to == "object" && t.to !== null;
373
- }
374
- function G(r) {
375
- const t = /* @__PURE__ */ new Set(["opacity", "zIndex", "z-index", "flex", "fontWeight", "lineHeight"]);
376
- return Object.entries(r).map(([e, s]) => {
377
- const o = e.replace(/[A-Z]/g, (n) => `-${n.toLowerCase()}`), i = typeof s == "number" && !t.has(e) ? `${s}px` : String(s);
378
- return `${o}: ${i}`;
379
- }).join("; ");
380
- }
381
- function Ft(r) {
382
- let t = 5381;
383
- for (let e = 0; e < r.length; e += 1) t = (t << 5) + t ^ r.charCodeAt(e);
384
- return (t >>> 0).toString(36);
385
- }
386
- function Bt(r) {
387
- const t = Vt[r] ?? r;
388
- if (!U.includes(t))
389
- throw new Error(`Unknown motion preset "${r}". Use: ${U.join(", ")}`);
390
- return t;
391
- }
392
- const F = `
393
- .fibo-anim {
394
- animation-duration: var(--fibo-dur, 300ms);
395
- animation-timing-function: var(--fibo-ease, ease);
396
- animation-delay: calc(var(--fibo-i, 0) * var(--fibo-stagger, 0ms) + var(--fibo-delay, 0ms));
397
- animation-fill-mode: both;
398
- animation-iteration-count: 1;
399
- }
400
- .fibo-anim-fadeIn, .fibo-anim-fade { animation-name: fibo-fadeIn; }
401
- .fibo-anim-fadeOut { animation-name: fibo-fadeOut; }
402
- .fibo-anim-slideUp { animation-name: fibo-slideUp; }
403
- .fibo-anim-slideDown { animation-name: fibo-slideDown; }
404
- .fibo-anim-slideLeft { animation-name: fibo-slideLeft; }
405
- .fibo-anim-slideRight { animation-name: fibo-slideRight; }
406
- .fibo-anim-scaleIn, .fibo-anim-scale { animation-name: fibo-scaleIn; }
407
- .fibo-anim-scaleOut { animation-name: fibo-scaleOut; }
408
- .fibo-anim-blurIn, .fibo-anim-blur { animation-name: fibo-blurIn; }
409
- .fibo-anim-blurOut { animation-name: fibo-blurOut; }
410
- .fibo-anim-pop { animation-name: fibo-pop; }
411
- .fibo-anim-bounce { animation-name: fibo-bounce; }
412
-
413
- @keyframes fibo-fadeIn { from { opacity: 0; } to { opacity: 1; } }
414
- @keyframes fibo-fadeOut { from { opacity: 1; } to { opacity: 0; } }
415
- @keyframes fibo-slideUp {
416
- from { opacity: 0; transform: translate3d(0, var(--fibo-from, 16px), 0); }
417
- to { opacity: 1; transform: none; }
418
- }
419
- @keyframes fibo-slideDown {
420
- from { opacity: 0; transform: translate3d(0, calc(var(--fibo-from, 16px) * -1), 0); }
421
- to { opacity: 1; transform: none; }
422
- }
423
- @keyframes fibo-slideLeft {
424
- from { opacity: 0; transform: translate3d(var(--fibo-from, 16px), 0, 0); }
425
- to { opacity: 1; transform: none; }
426
- }
427
- @keyframes fibo-slideRight {
428
- from { opacity: 0; transform: translate3d(calc(var(--fibo-from, 16px) * -1), 0, 0); }
429
- to { opacity: 1; transform: none; }
430
- }
431
- @keyframes fibo-scaleIn {
432
- from { opacity: 0; transform: scale(0.94); }
433
- to { opacity: 1; transform: none; }
434
- }
435
- @keyframes fibo-scaleOut {
436
- from { opacity: 1; transform: none; }
437
- to { opacity: 0; transform: scale(0.94); }
438
- }
439
- @keyframes fibo-blurIn {
440
- from { opacity: 0; filter: blur(var(--fibo-from, 8px)); }
441
- to { opacity: 1; filter: none; }
442
- }
443
- @keyframes fibo-blurOut {
444
- from { opacity: 1; filter: none; }
445
- to { opacity: 0; filter: blur(var(--fibo-from, 8px)); }
446
- }
447
- @keyframes fibo-pop {
448
- from { opacity: 0; transform: scale(0.92); }
449
- to { opacity: 1; transform: none; }
450
- }
451
- @keyframes fibo-bounce {
452
- 0% { opacity: 0; transform: translate3d(0, var(--fibo-from, 16px), 0); }
453
- 60% { opacity: 1; transform: translate3d(0, -6px, 0); }
454
- 80% { transform: translate3d(0, 2px, 0); }
455
- 100% { opacity: 1; transform: none; }
456
- }
457
-
458
- @keyframes stripes {
459
- from { background-position: 0 0; }
460
- to { background-position: 40px 0; }
461
- }
462
-
463
- .fibo-stagger-item { display: contents; }
464
-
465
- .fibo-reveal {
466
- min-width: 0;
467
- max-width: 100%;
468
- opacity: 0;
469
- transform: translate3d(0, 12px, 0);
470
- transition-property: opacity, transform, filter;
471
- transition-duration: var(--fibo-dur, 500ms);
472
- transition-timing-function: var(--fibo-ease, ease);
473
- transition-delay: calc(var(--fibo-i, 0) * var(--fibo-stagger, 0ms) + var(--fibo-delay, 0ms));
474
- }
475
- .fibo-reveal-fade { transform: none; }
476
- .fibo-reveal-fadeUp, .fibo-reveal-fadeIn, .fibo-reveal-slideUp { transform: translate3d(0, 16px, 0); }
477
- .fibo-reveal-slideDown { transform: translate3d(0, -16px, 0); }
478
- .fibo-reveal-slideLeft { transform: translate3d(16px, 0, 0); }
479
- .fibo-reveal-slideRight { transform: translate3d(-16px, 0, 0); }
480
- .fibo-reveal-scale, .fibo-reveal-scaleIn { transform: scale(0.96); }
481
- .fibo-reveal-blur { filter: blur(8px); transform: none; }
482
- .fibo-reveal.fibo-inview {
483
- opacity: 1;
484
- transform: none;
485
- filter: none;
486
- }
487
-
488
- .fibo-view-timeline {
489
- animation-timeline: view();
490
- animation-range: entry 0% cover 35%;
491
- }
492
- .fibo-scroll-timeline {
493
- animation-timeline: scroll();
494
- }
495
- .fibo-scroll-progress {
496
- transform: scaleX(var(--fibo-progress, 0));
497
- transform-origin: left center;
498
- animation-name: fibo-progress-grow;
499
- animation-duration: 1s;
500
- animation-timing-function: linear;
501
- animation-fill-mode: both;
502
- animation-timeline: scroll();
503
- }
504
- @keyframes fibo-progress-grow {
505
- from { transform: scaleX(0); }
506
- to { transform: scaleX(1); }
507
- }
508
- @supports not (animation-timeline: scroll()) {
509
- .fibo-scroll-progress {
510
- animation: none;
511
- transform: scaleX(var(--fibo-progress, 0));
512
- }
513
- }
514
-
515
- .fibo-snap-y { scroll-snap-type: y mandatory; }
516
- .fibo-snap-x { scroll-snap-type: x mandatory; }
517
- .fibo-snap-both { scroll-snap-type: both mandatory; }
518
- .fibo-snap-start { scroll-snap-align: start; }
519
- .fibo-snap-center { scroll-snap-align: center; }
520
- .fibo-snap-end { scroll-snap-align: end; }
521
-
522
- @media (prefers-reduced-motion: reduce) {
523
- .fibo-anim:not(.fibo-motion-force),
524
- .fibo-reveal:not(.fibo-motion-force),
525
- .fibo-scroll-progress:not(.fibo-motion-force) {
526
- animation: none !important;
527
- transition: none !important;
528
- opacity: 1 !important;
529
- transform: none !important;
530
- filter: none !important;
531
- }
532
- }
533
- `.trim();
534
- function q(r) {
535
- let t = 5381;
536
- for (let e = 0; e < r.length; e += 1)
537
- t = (t << 5) + t ^ r.charCodeAt(e);
538
- return (t >>> 0).toString(36);
539
- }
540
- const $ = class $ {
541
- constructor() {
542
- c(this, "sheet", null);
543
- c(this, "cache", /* @__PURE__ */ new Map());
544
- c(this, "extras", []);
545
- c(this, "defaultsReady", !1);
546
- this.attachSheet(), this.ensureDefaults();
547
- }
548
- static getInstance() {
549
- return $.instance || ($.instance = new $()), $.instance;
550
- }
551
- /** Test-only: empty cache/sheet so a simulated client starts cold. */
552
- reset() {
553
- this.cache.clear(), this.extras = [], this.defaultsReady = !1, this.sheet = null, this.attachSheet(), this.ensureDefaults();
554
- }
555
- static resetForTests() {
556
- $.getInstance().reset();
557
- }
558
- attachSheet() {
559
- if (typeof document > "u") return;
560
- const t = document.getElementById("fibo-dynamic-styles");
561
- if (t) {
562
- this.sheet = t, this.defaultsReady = !0;
563
- return;
564
- }
565
- this.sheet = document.createElement("style"), this.sheet.id = "fibo-dynamic-styles", this.sheet.setAttribute("data-fibo", "1"), document.head.appendChild(this.sheet);
566
- }
567
- /**
568
- * CSS `@media` rule, deduped. Used by `.media()` / `.md()` / `.responsive()` — not JS resize.
569
- */
570
- registerMedia(t, e, s) {
571
- const o = `@media ${t}|${e}:${s}`;
572
- if (this.cache.has(o))
573
- return this.cache.get(o);
574
- const i = `fibo-mq-${q(o)}`, n = `@media ${t} { .${i} { ${e}: ${s} !important; } }`;
575
- return this.insert(n), this.cache.set(o, i), i;
576
- }
577
- ensureDefaults() {
578
- var t;
579
- this.defaultsReady || (this.defaultsReady = !0, this.sheet && !((t = this.sheet.textContent) != null && t.includes("fibo-fadeIn")) && this.sheet.appendChild(document.createTextNode(F)));
580
- }
581
- getCss() {
582
- this.ensureDefaults();
583
- const t = [...this.extras].sort();
584
- return [F, ...t].filter(Boolean).join(`
585
- `);
586
- }
587
- registerKeyframes(t, e, s) {
588
- const o = `kf:${e}=>${s}`;
589
- if (this.cache.has(o)) return this.cache.get(o);
590
- const i = `fibo-c-${t}`;
591
- return this.insert(`@keyframes ${i} { from { ${e} } to { ${s} } }`), this.insert(`.${i} { animation-name: ${i}; }`), this.cache.set(o, i), i;
592
- }
593
- insert(t, e = !0) {
594
- var s;
595
- if (!(e && this.extras.includes(t)) && (e && this.extras.push(t), !(this.sheet && ((s = this.sheet.textContent) != null && s.includes(t)))))
596
- if (this.sheet && this.sheet.sheet)
597
- try {
598
- this.sheet.sheet.insertRule(t, this.sheet.sheet.cssRules.length);
599
- } catch {
600
- this.sheet && this.sheet.appendChild(document.createTextNode(t));
601
- }
602
- else this.sheet && this.sheet.appendChild(document.createTextNode(t));
603
- }
604
- /** Set a `:root` custom property (e.g. `--fibo-sticky-offset`). */
605
- registerRoot(t, e) {
606
- const s = `:root:${t}:${e}`;
607
- this.cache.has(s) || (this.insert(`:root { ${t}: ${e}; }`), this.cache.set(s, ":root"));
608
- }
609
- /** Once: `html { scroll-padding-top: var(--fibo-sticky-offset, 0px) }`. */
610
- ensureScrollPadding() {
611
- const t = "html:scroll-padding-top";
612
- this.cache.has(t) || (this.insert("html { scroll-padding-top: var(--fibo-sticky-offset, 0px); }"), this.cache.set(t, "html"));
613
- }
614
- register(t, e) {
615
- const s = `${t}:${e}`;
616
- if (this.cache.has(s))
617
- return this.cache.get(s);
618
- const o = e.replace(/[^a-zA-Z0-9-]/g, "_"), i = `fibo-${t}-${o}`, n = `.${i} { ${t}: ${e} !important; }`;
619
- return this.insert(n), this.cache.set(s, i), i;
620
- }
621
- /**
622
- * One class per (pseudo, property, value). Same rules → same class on server and client.
623
- * Order-independent: each declaration hashes on its own.
624
- */
625
- registerPseudo(t, e, s, o = !1) {
626
- const i = `${o ? "group:" : ""}${t}:${e}:${s}`;
627
- if (this.cache.has(i))
628
- return this.cache.get(i);
629
- const n = `fibo-ps-${q(i)}`, a = o ? `.group:${t} .${n} { ${e}: ${s} !important; }` : `.${n}:${t} { ${e}: ${s} !important; }`;
630
- return this.insert(a), this.cache.set(i, n), n;
631
- }
632
- registerGroupPseudo(t, e, s, o) {
633
- return this.registerPseudo(e, s, o, !0);
634
- }
635
- };
636
- c($, "instance");
637
- let T = $;
638
- const u = T.getInstance();
639
- function _() {
640
- T.getInstance().ensureDefaults();
641
- }
642
- function we() {
643
- return T.getInstance().getCss();
644
- }
645
- function nt() {
646
- return T.getInstance().getCss();
647
- }
648
- function Se() {
649
- return `<style id="fibo-dynamic-styles" data-fibo="1">${nt().replace(/<\/style/gi, "<\\/style")}</style>`;
650
- }
651
- function ve() {
652
- return _(), g.createElement("style", {
653
- id: "fibo-dynamic-styles",
654
- "data-fibo": "1",
655
- suppressHydrationWarning: !0,
656
- dangerouslySetInnerHTML: { __html: nt() }
657
- });
658
- }
659
- function Ot() {
660
- return _(), g.createElement("style", {
661
- id: "fibo-motion-presets",
662
- "data-fibo-motion": "1",
663
- dangerouslySetInnerHTML: { __html: F }
664
- });
665
- }
666
- const at = {
667
- sm: 640,
668
- md: 768,
669
- lg: 1024,
670
- xl: 1280
671
- };
672
- function Wt(r) {
673
- return r in at;
674
- }
675
- function Ht(r) {
676
- if (Wt(r))
677
- return `(min-width: ${at[r]}px)`;
678
- const t = r.trim();
679
- return t.startsWith("@media") ? t.replace(/^@media\s+/, "") : t;
680
- }
681
- function ct(r) {
682
- var t, e, s = "";
683
- if (typeof r == "string" || typeof r == "number") s += r;
684
- else if (typeof r == "object") if (Array.isArray(r)) {
685
- var o = r.length;
686
- for (t = 0; t < o; t++) r[t] && (e = ct(r[t])) && (s && (s += " "), s += e);
687
- } else for (e in r) r[e] && (s && (s += " "), s += e);
688
- return s;
689
- }
690
- function Xt() {
691
- for (var r, t, e = 0, s = "", o = arguments.length; e < o; e++) (r = arguments[e]) && (t = ct(r)) && (s && (s += " "), s += t);
692
- return s;
693
- }
694
- function Kt(r) {
695
- const t = r.match(/oklch\(\s*([\d.]+)\s+([\d.]+)\s+([\d.]+)\s*\)/);
696
- if (!t)
697
- return r;
698
- const [, e, s, o] = t, i = parseFloat(e), n = parseFloat(s), a = parseFloat(o), l = n * Math.cos(a * Math.PI / 180), d = n * Math.sin(a * Math.PI / 180), h = i + 0.3963377774 * l + 0.2158037573 * d, f = i - 0.1055613458 * l - 0.0638541728 * d, m = i - 0.0894841775 * l - 1.291485548 * d, p = h * h * h, y = f * f * f, b = m * m * m, x = 4.0767416621 * p - 3.3077115913 * y + 0.2309699292 * b, S = -1.2684380046 * p + 2.6097574011 * y - 0.3413193965 * b, ft = -0.0041960863 * p - 0.7034186147 * y + 1.707614701 * b, L = (I) => I >= 31308e-7 ? 1.055 * I ** (1 / 2.4) - 0.055 : 12.92 * I, dt = Math.max(0, Math.min(1, L(x))), mt = Math.max(0, Math.min(1, L(S))), pt = Math.max(0, Math.min(1, L(ft))), V = (I) => {
699
- var X;
700
- const P = (X = Math.round(I * 255).toString(16)) == null ? void 0 : X.toUpperCase();
701
- return P.length === 1 ? `0${P}` : P;
702
- };
703
- return `#${V(dt)}${V(mt)}${V(pt)}`;
704
- }
705
- function Yt(r) {
706
- const t = {}, e = {}, s = r.split(`
707
- `);
708
- for (const o of s) {
709
- const i = o.trim();
710
- if (!i || i.startsWith("//") || i.startsWith("*") || i === "@theme {" || i === "}")
711
- continue;
712
- const n = i.match(/^--color-([a-z0-9\-]+): (oklch\([^)]+\));?$/), a = i.match(/^--color-([a-z0-9\-]+): (#[a-fA-F0-9]{3,6});?$/);
713
- if (n) {
714
- const [, l, d] = n, h = Kt(d);
715
- t[h.toLowerCase()] = `bg-${l}`, e[h.toLowerCase()] = `text-${l}`;
716
- } else if (a) {
717
- const [, l, d] = a;
718
- t[d.toLowerCase()] = `bg-${l}`, e[d.toLowerCase()] = `text-${l}`;
719
- }
720
- }
721
- return { background: t, text: e };
722
- }
723
- const Ut = (r) => {
724
- if (r !== void 0)
725
- return typeof r == "number" ? `${r}px` : r.toString();
726
- }, N = (r, t) => {
727
- const e = Ut(t);
728
- return e === void 0 ? "" : `${r}-[${e}]`;
729
- }, Gt = `
730
- --color-red-50: oklch(0.971 0.013 17.38);
731
- --color-red-100: oklch(0.936 0.032 17.717);
732
- --color-red-200: oklch(0.885 0.062 18.334);
733
- --color-red-300: oklch(0.808 0.114 19.571);
734
- --color-red-400: oklch(0.704 0.191 22.216);
735
- --color-red-500: oklch(0.637 0.237 25.331);
736
- --color-red-600: oklch(0.577 0.245 27.325);
737
- --color-red-700: oklch(0.505 0.213 27.518);
738
- --color-red-800: oklch(0.444 0.177 26.899);
739
- --color-red-900: oklch(0.396 0.141 25.723);
740
- --color-red-950: oklch(0.258 0.092 26.042);
741
- --color-orange-50: oklch(0.98 0.016 73.684);
742
- --color-orange-100: oklch(0.954 0.038 75.164);
743
- --color-orange-200: oklch(0.901 0.076 70.697);
744
- --color-orange-300: oklch(0.837 0.128 66.29);
745
- --color-orange-400: oklch(0.75 0.183 55.934);
746
- --color-orange-500: oklch(0.705 0.213 47.604);
747
- --color-orange-600: oklch(0.646 0.222 41.116);
748
- --color-orange-700: oklch(0.553 0.195 38.402);
749
- --color-orange-800: oklch(0.47 0.157 37.304);
750
- --color-orange-900: oklch(0.408 0.123 38.172);
751
- --color-orange-950: oklch(0.266 0.079 36.259);
752
- --color-amber-50: oklch(0.987 0.022 95.277);
753
- --color-amber-100: oklch(0.962 0.059 95.617);
754
- --color-amber-200: oklch(0.924 0.12 95.746);
755
- --color-amber-300: oklch(0.879 0.169 91.605);
756
- --color-amber-400: oklch(0.828 0.189 84.429);
757
- --color-amber-500: oklch(0.769 0.188 70.08);
758
- --color-amber-600: oklch(0.666 0.179 58.318);
759
- --color-amber-700: oklch(0.555 0.163 48.998);
760
- --color-amber-800: oklch(0.473 0.137 46.201);
761
- --color-amber-900: oklch(0.414 0.112 45.904);
762
- --color-amber-950: oklch(0.279 0.077 45.635);
763
- --color-yellow-50: oklch(0.987 0.026 102.212);
764
- --color-yellow-100: oklch(0.973 0.071 103.193);
765
- --color-yellow-200: oklch(0.945 0.129 101.54);
766
- --color-yellow-300: oklch(0.905 0.182 98.111);
767
- --color-yellow-400: oklch(0.852 0.199 91.936);
768
- --color-yellow-500: oklch(0.795 0.184 86.047);
769
- --color-yellow-600: oklch(0.681 0.162 75.834);
770
- --color-yellow-700: oklch(0.554 0.135 66.442);
771
- --color-yellow-800: oklch(0.476 0.114 61.907);
772
- --color-yellow-900: oklch(0.421 0.095 57.708);
773
- --color-yellow-950: oklch(0.286 0.066 53.813);
774
- --color-lime-50: oklch(0.986 0.031 120.757);
775
- --color-lime-100: oklch(0.967 0.067 122.328);
776
- --color-lime-200: oklch(0.938 0.127 124.321);
777
- --color-lime-300: oklch(0.897 0.196 126.665);
778
- --color-lime-400: oklch(0.841 0.238 128.85);
779
- --color-lime-500: oklch(0.768 0.233 130.85);
780
- --color-lime-600: oklch(0.648 0.2 131.684);
781
- --color-lime-700: oklch(0.532 0.157 131.589);
782
- --color-lime-800: oklch(0.453 0.124 130.933);
783
- --color-lime-900: oklch(0.405 0.101 131.063);
784
- --color-lime-950: oklch(0.274 0.072 132.109);
785
- --color-green-50: oklch(0.982 0.018 155.826);
786
- --color-green-100: oklch(0.962 0.044 156.743);
787
- --color-green-200: oklch(0.925 0.084 155.995);
788
- --color-green-300: oklch(0.871 0.15 154.449);
789
- --color-green-400: oklch(0.792 0.209 151.711);
790
- --color-green-500: oklch(0.723 0.219 149.579);
791
- --color-green-600: oklch(0.627 0.194 149.214);
792
- --color-green-700: oklch(0.527 0.154 150.069);
793
- --color-green-800: oklch(0.448 0.119 151.328);
794
- --color-green-900: oklch(0.393 0.095 152.535);
795
- --color-green-950: oklch(0.266 0.065 152.934);
796
- --color-emerald-50: oklch(0.979 0.021 166.113);
797
- --color-emerald-100: oklch(0.95 0.052 163.051);
798
- --color-emerald-200: oklch(0.905 0.093 164.15);
799
- --color-emerald-300: oklch(0.845 0.143 164.978);
800
- --color-emerald-400: oklch(0.765 0.177 163.223);
801
- --color-emerald-500: oklch(0.696 0.17 162.48);
802
- --color-emerald-600: oklch(0.596 0.145 163.225);
803
- --color-emerald-700: oklch(0.508 0.118 165.612);
804
- --color-emerald-800: oklch(0.432 0.095 166.913);
805
- --color-emerald-900: oklch(0.378 0.077 168.94);
806
- --color-emerald-950: oklch(0.262 0.051 172.552);
807
- --color-teal-50: oklch(0.984 0.014 180.72);
808
- --color-teal-100: oklch(0.953 0.051 180.801);
809
- --color-teal-200: oklch(0.91 0.096 180.426);
810
- --color-teal-300: oklch(0.855 0.138 181.071);
811
- --color-teal-400: oklch(0.777 0.152 181.912);
812
- --color-teal-500: oklch(0.704 0.14 182.503);
813
- --color-teal-600: oklch(0.6 0.118 184.704);
814
- --color-teal-700: oklch(0.511 0.096 186.391);
815
- --color-teal-800: oklch(0.437 0.078 188.216);
816
- --color-teal-900: oklch(0.386 0.063 188.416);
817
- --color-teal-950: oklch(0.277 0.046 192.524);
818
- --color-cyan-50: oklch(0.984 0.019 200.873);
819
- --color-cyan-100: oklch(0.956 0.045 203.388);
820
- --color-cyan-200: oklch(0.917 0.08 205.041);
821
- --color-cyan-300: oklch(0.865 0.127 207.078);
822
- --color-cyan-400: oklch(0.789 0.154 211.53);
823
- --color-cyan-500: oklch(0.715 0.143 215.221);
824
- --color-cyan-600: oklch(0.609 0.126 221.723);
825
- --color-cyan-700: oklch(0.52 0.105 223.128);
826
- --color-cyan-800: oklch(0.45 0.085 224.283);
827
- --color-cyan-900: oklch(0.398 0.07 227.392);
828
- --color-cyan-950: oklch(0.302 0.056 229.695);
829
- --color-sky-50: oklch(0.977 0.013 236.62);
830
- --color-sky-100: oklch(0.951 0.026 236.824);
831
- --color-sky-200: oklch(0.901 0.058 230.902);
832
- --color-sky-300: oklch(0.828 0.111 230.318);
833
- --color-sky-400: oklch(0.746 0.16 232.661);
834
- --color-sky-500: oklch(0.685 0.169 237.323);
835
- --color-sky-600: oklch(0.588 0.158 241.966);
836
- --color-sky-700: oklch(0.5 0.134 242.749);
837
- --color-sky-800: oklch(0.443 0.11 240.79);
838
- --color-sky-900: oklch(0.391 0.09 240.876);
839
- --color-sky-950: oklch(0.293 0.066 243.157);
840
- --color-blue-50: oklch(0.97 0.014 254.604);
841
- --color-blue-100: oklch(0.932 0.032 255.585);
842
- --color-blue-200: oklch(0.882 0.059 254.128);
843
- --color-blue-300: oklch(0.809 0.105 251.813);
844
- --color-blue-400: oklch(0.707 0.165 254.624);
845
- --color-blue-500: oklch(0.623 0.214 259.815);
846
- --color-blue-600: oklch(0.546 0.245 262.881);
847
- --color-blue-700: oklch(0.488 0.243 264.376);
848
- --color-blue-800: oklch(0.424 0.199 265.638);
849
- --color-blue-900: oklch(0.379 0.146 265.522);
850
- --color-blue-950: oklch(0.282 0.091 267.935);
851
- --color-indigo-50: oklch(0.962 0.018 272.314);
852
- --color-indigo-100: oklch(0.93 0.034 272.788);
853
- --color-indigo-200: oklch(0.87 0.065 274.039);
854
- --color-indigo-300: oklch(0.785 0.115 274.713);
855
- --color-indigo-400: oklch(0.673 0.182 276.935);
856
- --color-indigo-500: oklch(0.585 0.233 277.117);
857
- --color-indigo-600: oklch(0.511 0.262 276.966);
858
- --color-indigo-700: oklch(0.457 0.24 277.023);
859
- --color-indigo-800: oklch(0.398 0.195 277.366);
860
- --color-indigo-900: oklch(0.359 0.144 278.697);
861
- --color-indigo-950: oklch(0.257 0.09 281.288);
862
- --color-violet-50: oklch(0.969 0.016 293.756);
863
- --color-violet-100: oklch(0.943 0.029 294.588);
864
- --color-violet-200: oklch(0.894 0.057 293.283);
865
- --color-violet-300: oklch(0.811 0.111 293.571);
866
- --color-violet-400: oklch(0.702 0.183 293.541);
867
- --color-violet-500: oklch(0.606 0.25 292.717);
868
- --color-violet-600: oklch(0.541 0.281 293.009);
869
- --color-violet-700: oklch(0.491 0.27 292.581);
870
- --color-violet-800: oklch(0.432 0.232 292.759);
871
- --color-violet-900: oklch(0.38 0.189 293.745);
872
- --color-violet-950: oklch(0.283 0.141 291.089);
873
- --color-purple-50: oklch(0.977 0.014 308.299);
874
- --color-purple-100: oklch(0.946 0.033 307.174);
875
- --color-purple-200: oklch(0.902 0.063 306.703);
876
- --color-purple-300: oklch(0.827 0.119 306.383);
877
- --color-purple-400: oklch(0.714 0.203 305.504);
878
- --color-purple-500: oklch(0.627 0.265 303.9);
879
- --color-purple-600: oklch(0.558 0.288 302.321);
880
- --color-purple-700: oklch(0.496 0.265 301.924);
881
- --color-purple-800: oklch(0.438 0.218 303.724);
882
- --color-purple-900: oklch(0.381 0.176 304.987);
883
- --color-purple-950: oklch(0.291 0.149 302.717);
884
- --color-fuchsia-50: oklch(0.977 0.017 320.058);
885
- --color-fuchsia-100: oklch(0.952 0.037 318.852);
886
- --color-fuchsia-200: oklch(0.903 0.076 319.62);
887
- --color-fuchsia-300: oklch(0.833 0.145 321.434);
888
- --color-fuchsia-400: oklch(0.74 0.238 322.16);
889
- --color-fuchsia-500: oklch(0.667 0.295 322.15);
890
- --color-fuchsia-600: oklch(0.591 0.293 322.896);
891
- --color-fuchsia-700: oklch(0.518 0.253 323.949);
892
- --color-fuchsia-800: oklch(0.452 0.211 324.591);
893
- --color-fuchsia-900: oklch(0.401 0.17 325.612);
894
- --color-fuchsia-950: oklch(0.293 0.136 325.661);
895
- --color-pink-50: oklch(0.971 0.014 343.198);
896
- --color-pink-100: oklch(0.948 0.028 342.258);
897
- --color-pink-200: oklch(0.899 0.061 343.231);
898
- --color-pink-300: oklch(0.823 0.12 346.018);
899
- --color-pink-400: oklch(0.718 0.202 349.761);
900
- --color-pink-500: oklch(0.656 0.241 354.308);
901
- --color-pink-600: oklch(0.592 0.249 0.584);
902
- --color-pink-700: oklch(0.525 0.223 3.958);
903
- --color-pink-800: oklch(0.459 0.187 3.815);
904
- --color-pink-900: oklch(0.408 0.153 2.432);
905
- --color-pink-950: oklch(0.284 0.109 3.907);
906
- --color-rose-50: oklch(0.969 0.015 12.422);
907
- --color-rose-100: oklch(0.941 0.03 12.58);
908
- --color-rose-200: oklch(0.892 0.058 10.001);
909
- --color-rose-300: oklch(0.81 0.117 11.638);
910
- --color-rose-400: oklch(0.712 0.194 13.428);
911
- --color-rose-500: oklch(0.645 0.246 16.439);
912
- --color-rose-600: oklch(0.586 0.253 17.585);
913
- --color-rose-700: oklch(0.514 0.222 16.935);
914
- --color-rose-800: oklch(0.455 0.188 13.697);
915
- --color-rose-900: oklch(0.41 0.159 10.272);
916
- --color-rose-950: oklch(0.271 0.105 12.094);
917
- --color-slate-50: oklch(0.984 0.003 247.858);
918
- --color-slate-100: oklch(0.968 0.007 247.896);
919
- --color-slate-200: oklch(0.929 0.013 255.508);
920
- --color-slate-300: oklch(0.869 0.022 252.894);
921
- --color-slate-400: oklch(0.704 0.04 256.788);
922
- --color-slate-500: oklch(0.554 0.046 257.417);
923
- --color-slate-600: oklch(0.446 0.043 257.281);
924
- --color-slate-700: oklch(0.372 0.044 257.287);
925
- --color-slate-800: oklch(0.279 0.041 260.031);
926
- --color-slate-900: oklch(0.208 0.042 265.755);
927
- --color-slate-950: oklch(0.129 0.042 264.695);
928
- --color-gray-50: oklch(0.985 0.002 247.839);
929
- --color-gray-100: oklch(0.967 0.003 264.542);
930
- --color-gray-200: oklch(0.928 0.006 264.531);
931
- --color-gray-300: oklch(0.872 0.01 258.338);
932
- --color-gray-400: oklch(0.707 0.022 261.325);
933
- --color-gray-500: oklch(0.551 0.027 264.364);
934
- --color-gray-600: oklch(0.446 0.03 256.802);
935
- --color-gray-700: oklch(0.373 0.034 259.733);
936
- --color-gray-800: oklch(0.278 0.033 256.848);
937
- --color-gray-900: oklch(0.21 0.034 264.665);
938
- --color-gray-950: oklch(0.13 0.028 261.692);
939
- --color-zinc-50: oklch(0.985 0 0);
940
- --color-zinc-100: oklch(0.967 0.001 286.375);
941
- --color-zinc-200: oklch(0.92 0.004 286.32);
942
- --color-zinc-300: oklch(0.871 0.006 286.286);
943
- --color-zinc-400: oklch(0.705 0.015 286.067);
944
- --color-zinc-500: oklch(0.552 0.016 285.938);
945
- --color-zinc-600: oklch(0.442 0.017 285.786);
946
- --color-zinc-700: oklch(0.37 0.013 285.805);
947
- --color-zinc-800: oklch(0.274 0.006 286.033);
948
- --color-zinc-900: oklch(0.21 0.006 285.885);
949
- --color-zinc-950: oklch(0.141 0.005 285.823);
950
- --color-neutral-50: oklch(0.985 0 0);
951
- --color-neutral-100: oklch(0.97 0 0);
952
- --color-neutral-200: oklch(0.922 0 0);
953
- --color-neutral-300: oklch(0.87 0 0);
954
- --color-neutral-400: oklch(0.708 0 0);
955
- --color-neutral-500: oklch(0.556 0 0);
956
- --color-neutral-600: oklch(0.439 0 0);
957
- --color-neutral-700: oklch(0.371 0 0);
958
- --color-neutral-800: oklch(0.269 0 0);
959
- --color-neutral-900: oklch(0.205 0 0);
960
- --color-neutral-950: oklch(0.145 0 0);
961
- --color-stone-50: oklch(0.985 0.001 106.423);
962
- --color-stone-100: oklch(0.97 0.001 106.424);
963
- --color-stone-200: oklch(0.923 0.003 48.717);
964
- --color-stone-300: oklch(0.869 0.005 56.366);
965
- --color-stone-400: oklch(0.709 0.01 56.259);
966
- --color-stone-500: oklch(0.553 0.013 58.071);
967
- --color-stone-600: oklch(0.444 0.011 73.639);
968
- --color-stone-700: oklch(0.374 0.01 67.558);
969
- --color-stone-800: oklch(0.268 0.007 34.298);
970
- --color-stone-900: oklch(0.216 0.006 56.043);
971
- --color-stone-950: oklch(0.147 0.004 49.25);
972
- --color-black: #000;
973
- --color-white: #fff;
974
- `, qt = Yt(Gt), lt = {
975
- borderRadius: {
976
- 0: "rounded-none",
977
- "0px": "rounded-none",
978
- "1px": "rounded-sm",
979
- "2px": "rounded-sm",
980
- "3px": "rounded",
981
- "4px": "rounded",
982
- "5px": "rounded-md",
983
- "6px": "rounded-md",
984
- "7px": "rounded-lg",
985
- "8px": "rounded-lg",
986
- "9px": "rounded-lg",
987
- "10px": "rounded-lg",
988
- "11px": "rounded-xl",
989
- "12px": "rounded-xl",
990
- "14px": "rounded-2xl",
991
- "16px": "rounded-2xl",
992
- "20px": "rounded-3xl",
993
- "50%": "rounded-full",
994
- "9999px": "rounded-full"
995
- },
996
- fontSize: {
997
- "0.75rem": "text-xs",
998
- "0.875rem": "text-sm",
999
- "1rem": "text-base",
1000
- "1.125rem": "text-lg",
1001
- "1.25rem": "text-xl",
1002
- "1.5rem": "text-2xl",
1003
- "1.875rem": "text-3xl",
1004
- "2.25rem": "text-4xl",
1005
- "3rem": "text-5xl",
1006
- "3.75rem": "text-6xl",
1007
- "4.5rem": "text-7xl",
1008
- "6rem": "text-8xl",
1009
- "8rem": "text-9xl"
1010
- },
1011
- fontWeight: {
1012
- 100: "font-thin",
1013
- 200: "font-extralight",
1014
- 300: "font-light",
1015
- 400: "font-normal",
1016
- 500: "font-medium",
1017
- 600: "font-semibold",
1018
- 700: "font-bold",
1019
- 800: "font-extrabold",
1020
- 900: "font-black"
1021
- },
1022
- fontFamily: {
1023
- "ui-serif": "font-serif",
1024
- "ui-monospace": "font-mono",
1025
- "ui-sans-serif": "font-sans",
1026
- default: "font-sans"
1027
- },
1028
- textAlign: {
1029
- left: "text-left",
1030
- center: "text-center",
1031
- right: "text-right",
1032
- justify: "text-justify"
1033
- },
1034
- textDecoration: {
1035
- underline: "underline",
1036
- overline: "overline",
1037
- "line-through": "line-through",
1038
- none: "no-underline"
1039
- },
1040
- fontVariantNumeric: {
1041
- "tabular-nums": "tabular-nums",
1042
- "oldstyle-nums": "oldstyle-nums",
1043
- "lining-nums": "lining-nums",
1044
- "proportional-nums": "proportional-nums",
1045
- "diagonal-fractions": "diagonal-fractions",
1046
- "stacked-fractions": "stacked-fractions",
1047
- ordinal: "ordinal",
1048
- "slashed-zero": "slashed-zero",
1049
- normal: "normal-nums"
1050
- },
1051
- fontStyle: {
1052
- normal: "normal",
1053
- italic: "italic",
1054
- oblique: "oblique"
1055
- },
1056
- display: {
1057
- block: "block",
1058
- flex: "flex",
1059
- "inline-flex": "inline-flex",
1060
- grid: "grid",
1061
- hidden: "hidden",
1062
- none: "hidden"
1063
- },
1064
- position: {
1065
- static: "static",
1066
- relative: "relative",
1067
- absolute: "absolute",
1068
- fixed: "fixed",
1069
- sticky: "sticky"
1070
- }
1071
- }, Zt = (r, t) => ({
1072
- // 背景色
1073
- backgroundColor: (e) => e.backgroundColor ? [r.background[e.backgroundColor.toLowerCase()] || `bg-[${e.backgroundColor}]`] : [],
1074
- // 文字色
1075
- color: (e) => e.color ? [r.text[e.color.toLowerCase()] || `text-[${e.color}]`] : [],
1076
- // 圆角
1077
- borderRadius: (e) => {
1078
- if (!e.borderRadius)
1079
- return [];
1080
- const s = lt.borderRadius[e.borderRadius] || N("rounded", e.borderRadius);
1081
- return s ? [s] : [];
1082
- },
1083
- // 外边距
1084
- margin: (e) => {
1085
- const s = [];
1086
- if (e.margin !== void 0) {
1087
- const i = N("m", e.margin);
1088
- return i ? [i] : [];
1089
- }
1090
- return [
1091
- { prop: e.marginTop, dir: "mt" },
1092
- { prop: e.marginRight, dir: "mr" },
1093
- { prop: e.marginBottom, dir: "mb" },
1094
- { prop: e.marginLeft, dir: "ml" },
1095
- { prop: e.marginX, dir: "mx" },
1096
- { prop: e.marginY, dir: "my" }
1097
- ].forEach(({ prop: i, dir: n }) => {
1098
- if (i !== void 0) {
1099
- const a = N(n, i);
1100
- a && s.push(a);
1101
- }
1102
- }), s;
1103
- },
1104
- // 内边距
1105
- padding: (e) => {
1106
- const s = [];
1107
- if (e.padding !== void 0) {
1108
- const i = N("p", e.padding);
1109
- return i ? [i] : [];
1110
- }
1111
- return [
1112
- { prop: e.paddingTop, dir: "pt" },
1113
- { prop: e.paddingRight, dir: "pr" },
1114
- { prop: e.paddingBottom, dir: "pb" },
1115
- { prop: e.paddingLeft, dir: "pl" },
1116
- { prop: e.paddingX, dir: "px" },
1117
- { prop: e.paddingY, dir: "py" }
1118
- ].forEach(({ prop: i, dir: n }) => {
1119
- if (i !== void 0) {
1120
- const a = N(n, i);
1121
- a && s.push(a);
1122
- }
1123
- }), s;
1124
- },
1125
- // 字体
1126
- font: (e) => {
1127
- const s = [];
1128
- if (e.fontSize && s.push(t.fontSize[e.fontSize.toString()] || `text-[${e.fontSize}]`), e.fontWeight) {
1129
- const o = t.fontWeight[e.fontWeight.toString()];
1130
- o && s.push(o);
1131
- }
1132
- if (e.textAlign) {
1133
- const o = t.textAlign[e.textAlign];
1134
- o && s.push(o);
1135
- }
1136
- if (e.fontFamily) {
1137
- const o = t.fontFamily[e.fontFamily];
1138
- o && s.push(o);
1139
- }
1140
- if (e.textDecoration) {
1141
- const o = t.textDecoration[e.textDecoration];
1142
- o && s.push(o);
1143
- }
1144
- if (e.fontVariantNumeric) {
1145
- const o = t.fontVariantNumeric[e.fontVariantNumeric];
1146
- o && s.push(o);
1147
- }
1148
- if (e.fontStyle) {
1149
- const o = t.fontStyle[e.fontStyle];
1150
- o && s.push(o);
1151
- }
1152
- return s;
1153
- },
1154
- // 尺寸
1155
- size: (e) => {
1156
- const s = [];
1157
- if (e.width) {
1158
- const o = e.width.toString();
1159
- s.push(`w-[${o}]`);
1160
- }
1161
- if (e.height) {
1162
- const o = e.height.toString();
1163
- s.push(`h-[${o}]`);
1164
- }
1165
- return s;
1166
- },
1167
- // 布局
1168
- layout: (e) => {
1169
- const s = [];
1170
- if (e.display) {
1171
- const o = t.display[e.display];
1172
- o && s.push(o);
1173
- }
1174
- if (e.flexDirection) {
1175
- const i = {
1176
- row: "flex-row",
1177
- column: "flex-col",
1178
- "row-reverse": "flex-row-reverse",
1179
- "column-reverse": "flex-col-reverse"
1180
- }[e.flexDirection];
1181
- i && s.push(i);
1182
- }
1183
- if (e.justifyContent) {
1184
- const i = {
1185
- "flex-start": "justify-start",
1186
- "flex-end": "justify-end",
1187
- center: "justify-center",
1188
- "space-between": "justify-between",
1189
- "space-around": "justify-around",
1190
- "space-evenly": "justify-evenly"
1191
- }[e.justifyContent];
1192
- i && s.push(i);
1193
- }
1194
- if (e.alignItems) {
1195
- const i = {
1196
- "flex-start": "items-start",
1197
- "flex-end": "items-end",
1198
- center: "items-center",
1199
- baseline: "items-baseline",
1200
- stretch: "items-stretch"
1201
- }[e.alignItems];
1202
- i && s.push(i);
1203
- }
1204
- if (e.gap) {
1205
- const o = N("gap", e.gap);
1206
- o && s.push(o);
1207
- }
1208
- return s;
1209
- },
1210
- // 定位
1211
- position: (e) => e.position ? [t.position[e.position] || ""].filter(Boolean) : [],
1212
- // 透明度
1213
- opacity: (e) => {
1214
- if (e.opacity === void 0)
1215
- return [];
1216
- const s = typeof e.opacity == "string" ? parseFloat(e.opacity) : e.opacity;
1217
- return [`opacity-${{
1218
- 0: "0",
1219
- 0.25: "25",
1220
- 0.5: "50",
1221
- 0.75: "75",
1222
- 1: "100"
1223
- }[s] || Math.round(s * 100)}`];
1224
- },
1225
- // 自定义类名
1226
- className: (e) => e.className ? [e.className] : []
1227
- }), Jt = {
1228
- backgroundColor: "backgroundColor",
1229
- color: "color",
1230
- borderRadius: "borderRadius",
1231
- margin: "margin",
1232
- marginTop: "margin",
1233
- marginRight: "margin",
1234
- marginBottom: "margin",
1235
- marginLeft: "margin",
1236
- marginX: "margin",
1237
- marginY: "margin",
1238
- padding: "padding",
1239
- paddingTop: "padding",
1240
- paddingRight: "padding",
1241
- paddingBottom: "padding",
1242
- paddingLeft: "padding",
1243
- paddingX: "padding",
1244
- paddingY: "padding",
1245
- fontSize: "font",
1246
- fontWeight: "font",
1247
- textAlign: "font",
1248
- textDecoration: "font",
1249
- fontVariantNumeric: "font",
1250
- fontStyle: "font",
1251
- width: "size",
1252
- height: "size",
1253
- display: "layout",
1254
- flexDirection: "layout",
1255
- justifyContent: "layout",
1256
- alignItems: "layout",
1257
- gap: "layout",
1258
- position: "position",
1259
- opacity: "opacity",
1260
- className: "className"
1261
- }, Qt = (r, t) => {
1262
- const e = (t == null ? void 0 : t.colorMaps) || qt, s = (t == null ? void 0 : t.styleMaps) || lt, o = Zt(e, s), i = [], n = /* @__PURE__ */ new Set();
1263
- return Object.keys(r).forEach((a) => {
1264
- const l = Jt[a];
1265
- if (l && !n.has(l)) {
1266
- const d = o[l];
1267
- if (d) {
1268
- const h = d(r);
1269
- i.push(...h), n.add(l);
1270
- }
1271
- }
1272
- }), i.filter(Boolean).join(" ");
1273
- };
1274
- function te(r) {
1275
- const t = {};
1276
- return r.forEach((e, s) => {
1277
- t[s] = e.value;
1278
- }), t;
1279
- }
1280
- function ee({ animatedProps: r, animationConfig: t, children: e }) {
1281
- const [s, o] = Z(
1282
- () => te(r)
1283
- );
1284
- A(() => {
1285
- const l = [];
1286
- return r.forEach((d, h) => {
1287
- const f = (m) => {
1288
- o((p) => ({
1289
- ...p,
1290
- [h]: m
1291
- }));
1292
- };
1293
- l.push(d.subscribe(f)), f(d.value);
1294
- }), () => {
1295
- l.forEach((d) => d());
1296
- };
1297
- }, [r]);
1298
- const i = [];
1299
- s.translateX !== void 0 && i.push(`translateX(${s.translateX}px)`), s.translateY !== void 0 && i.push(`translateY(${s.translateY}px)`), s.scale !== void 0 && i.push(`scale(${s.scale})`), s.rotate !== void 0 && i.push(`rotate(${s.rotate}deg)`);
1300
- const n = {};
1301
- if (i.length > 0 && (n.transform = i.join(" ")), t) {
1302
- const { duration: l = 300, curve: d = "easeOut", stiffness: h, damping: f } = t, m = v(d, { stiffness: h, damping: f });
1303
- n.transition = `transform ${l}ms ${m}`;
1304
- }
1305
- const a = {
1306
- ...e.props.style,
1307
- ...n
1308
- };
1309
- return yt(e, { style: a });
1310
- }
1311
- class k {
1312
- constructor(t, e, s = !1) {
1313
- c(this, "pseudoState");
1314
- c(this, "parentBuilder");
1315
- c(this, "isGroup");
1316
- c(this, "transitionDuration", 200);
1317
- c(this, "transitionEasing", "ease-in-out");
1318
- c(this, "transitionDelay", 0);
1319
- c(this, "transitionProperties", ["all"]);
1320
- c(this, "transforms", /* @__PURE__ */ new Map());
1321
- this.pseudoState = t, this.parentBuilder = e, this.isGroup = s;
1322
- }
1323
- bg(t) {
1324
- return this.set("background-color", t);
1325
- }
1326
- color(t) {
1327
- return this.set("color", t);
1328
- }
1329
- text(t) {
1330
- return this.color(t);
1331
- }
1332
- opacity(t) {
1333
- return this.set("opacity", String(t));
1334
- }
1335
- borderColor(t) {
1336
- return this.set("border-color", t);
1337
- }
1338
- transform(t) {
1339
- return this.transforms.set("raw", t), this.flushTransform();
1340
- }
1341
- scale(t) {
1342
- return this.transforms.set("scale", `scale(${t})`), this.flushTransform();
1343
- }
1344
- translateX(t) {
1345
- const e = typeof t == "number" ? `${t}px` : t;
1346
- return this.transforms.set("translateX", `translateX(${e})`), this.flushTransform();
1347
- }
1348
- translateY(t) {
1349
- const e = typeof t == "number" ? `${t}px` : t;
1350
- return this.transforms.set("translateY", `translateY(${e})`), this.flushTransform();
1351
- }
1352
- rotate(t) {
1353
- return this.transforms.set("rotate", `rotate(${t}deg)`), this.flushTransform();
1354
- }
1355
- shadow(t) {
1356
- return this.set("box-shadow", t);
1357
- }
1358
- css(t, e) {
1359
- return this.set(t, e);
1360
- }
1361
- transition(t, e, s, o) {
1362
- if (typeof t == "string" && e === void 0)
1363
- return this.set("transition", t);
1364
- const i = Array.isArray(t) ? t.join(", ") : t, n = `${e || this.transitionDuration}ms`, a = v(s || this.transitionEasing), l = o ? `${o}ms` : "0ms";
1365
- return this.set("transition", `${i} ${n} ${a} ${l}`);
1366
- }
1367
- duration(t) {
1368
- return this.transitionDuration = t, this.applyTransition(), this;
1369
- }
1370
- easing(t) {
1371
- return this.transitionEasing = v(t), this.applyTransition(), this;
1372
- }
1373
- ease(t) {
1374
- return this.easing(t);
1375
- }
1376
- delay(t) {
1377
- return this.transitionDelay = t, this.applyTransition(), this;
1378
- }
1379
- properties(t) {
1380
- return this.transitionProperties = t, this.applyTransition(), this;
1381
- }
1382
- applyTransition() {
1383
- const t = this.transitionProperties.join(", "), e = `${this.transitionDuration}ms`, s = this.transitionEasing, o = this.transitionDelay > 0 ? `${this.transitionDelay}ms` : "0ms";
1384
- this.set("transition", `${t} ${e} ${s} ${o}`);
1385
- }
1386
- flushTransform() {
1387
- return this.set("transform", [...this.transforms.values()].join(" "));
1388
- }
1389
- set(t, e) {
1390
- const s = u.registerPseudo(this.pseudoState, t, e, this.isGroup);
1391
- return this.parentBuilder.addClassName(s), this;
1392
- }
1393
- end() {
1394
- return this.parentBuilder;
1395
- }
1396
- }
1397
- function Ce(r, t) {
1398
- if (typeof document > "u") return;
1399
- const e = typeof r == "string" ? r : null, s = (e == null ? void 0 : e.replace(/^#/, "")) ?? null;
1400
- t != null && t.hash && s && typeof window < "u" && (window.location.hash = s);
1401
- const o = typeof r == "string" ? document.getElementById(r.replace(/^#/, "")) ?? document.querySelector(r.startsWith("#") ? r : `#${r}`) ?? document.querySelector(r) : r;
1402
- o && o.scrollIntoView({
1403
- behavior: (t == null ? void 0 : t.behavior) ?? "smooth",
1404
- block: (t == null ? void 0 : t.block) ?? "start"
1405
- });
1406
- }
1407
- function Ne(r) {
1408
- const t = typeof document < "u" ? document : void 0, e = t == null ? void 0 : t.startViewTransition;
1409
- if (typeof e == "function") {
1410
- e.call(t, r);
1411
- return;
1412
- }
1413
- r();
1414
- }
1415
- function se() {
1416
- return typeof CSS > "u" || typeof CSS.supports != "function" ? !1 : CSS.supports("animation-timeline", "view()");
1417
- }
1418
- function re() {
1419
- return typeof CSS > "u" || typeof CSS.supports != "function" ? !1 : CSS.supports("animation-timeline", "scroll()");
1420
- }
1421
- function oe({
1422
- preset: r = "fadeUp",
1423
- once: t = !0,
1424
- rootMargin: e = "0px 0px -8% 0px",
1425
- threshold: s = 0.12,
1426
- forceMotion: o = !1,
1427
- preferTimeline: i = !1,
1428
- children: n
1429
- }) {
1430
- const a = w(null);
1431
- A(() => {
1432
- _();
1433
- const d = a.current;
1434
- if (!d) return;
1435
- if (i && se()) {
1436
- d.classList.add("fibo-inview");
1437
- return;
1438
- }
1439
- if (typeof IntersectionObserver > "u") {
1440
- d.classList.add("fibo-inview");
1441
- return;
1442
- }
1443
- const h = new IntersectionObserver(
1444
- (f) => {
1445
- for (const m of f)
1446
- m.isIntersecting ? (m.target.classList.add("fibo-inview"), t && h.unobserve(m.target)) : t || m.target.classList.remove("fibo-inview");
1447
- },
1448
- { rootMargin: e, threshold: s }
1449
- );
1450
- return h.observe(d), () => h.disconnect();
1451
- }, [t, e, s, i]);
1452
- const l = [
1453
- "fibo-reveal",
1454
- `fibo-reveal-${r}`,
1455
- // min-w-0 only — do NOT force w-full (breaks horizontal ScrollView / carousel slides)
1456
- "min-w-0",
1457
- o ? "fibo-motion-force" : ""
1458
- ].filter(Boolean).join(" ");
1459
- return g.createElement("div", { ref: a, className: l, "data-fibo-reveal": r }, n);
1460
- }
1461
- function ie({ children: r }) {
1462
- const t = w(null);
1463
- return A(() => {
1464
- if (_(), re()) return;
1465
- const e = () => {
1466
- var i, n;
1467
- return ((i = t.current) == null ? void 0 : i.querySelector(".fibo-scroll-progress")) ?? ((n = t.current) == null ? void 0 : n.firstElementChild);
1468
- }, s = () => {
1469
- const o = e();
1470
- if (!o) return;
1471
- const i = document.documentElement.scrollHeight - window.innerHeight, n = i > 0 ? Math.min(1, Math.max(0, window.scrollY / i)) : 0;
1472
- o.style.setProperty("--fibo-progress", String(n));
1473
- };
1474
- return s(), window.addEventListener("scroll", s, { passive: !0 }), window.addEventListener("resize", s), () => {
1475
- window.removeEventListener("scroll", s), window.removeEventListener("resize", s);
1476
- };
1477
- }, []), g.createElement(
1478
- "div",
1479
- { ref: t, "data-fibo-scroll-progress": "1", style: { display: "contents" } },
1480
- r
1481
- );
1482
- }
1483
- const ht = 64, ne = `${ht}px`;
1484
- class Ee {
1485
- constructor() {
1486
- /** @internal Extra DOM props forwarded to the host element. */
1487
- c(this, "_props", {});
1488
- c(this, "_style", {});
1489
- c(this, "_cssStyles", {});
1490
- c(this, "_classNames", []);
1491
- c(this, "_children", []);
1492
- c(this, "_theme");
1493
- c(this, "_state", /* @__PURE__ */ new Map());
1494
- c(this, "_providers", /* @__PURE__ */ new Map());
1495
- c(this, "_observers", /* @__PURE__ */ new Set());
1496
- c(this, "_signals", /* @__PURE__ */ new Set());
1497
- c(this, "_isObserver", !1);
1498
- c(this, "_gesture");
1499
- c(this, "_animationConfig");
1500
- c(this, "_animatedProps", /* @__PURE__ */ new Map());
1501
- c(this, "_transforms", []);
1502
- c(this, "_transitionClass");
1503
- c(this, "_motionClass");
1504
- c(this, "_staggerMs");
1505
- c(this, "_reveal");
1506
- c(this, "_scrollProgress", !1);
1507
- c(this, "_viewTransition");
1508
- c(this, "_reducedMotion", "reduce");
1509
- c(this, "_usesCssMotion", !1);
1510
- c(this, "_explicitScrollMargin", !1);
1511
- /** Shrink-wrap: skip the default `w-full` / `self-stretch` on Row and Column. */
1512
- c(this, "_hug", !1);
1513
- // Transition properties
1514
- c(this, "_transitionDuration", 200);
1515
- // ms
1516
- c(this, "_transitionEasing", "ease-in-out");
1517
- c(this, "_transitionDelay", 0);
1518
- // ms
1519
- c(this, "_transitionProperties", ["all"]);
1520
- c(this, "_childFunction");
1521
- }
1522
- hug() {
1523
- return this._hug = !0, this;
1524
- }
1525
- isHug() {
1526
- return this._hug;
1527
- }
1528
- id(t) {
1529
- return this._props.id = t, this;
1530
- }
1531
- /**
1532
- * Scroll target. Same as `.id()`, plus `scroll-margin-top` so the section
1533
- * is not hidden under a sticky header. Pair with `scrollTo('#name')`.
1534
- */
1535
- anchor(t) {
1536
- return this.id(t), this._explicitScrollMargin || this._classNames.push(
1537
- u.register("scroll-margin-top", "var(--fibo-sticky-offset, 0px)")
1538
- ), this;
1539
- }
1540
- /**
1541
- * Explicit `scroll-margin-top` on this node (overrides the sticky CSS variable
1542
- * that `.anchor()` applies).
1543
- */
1544
- scrollMargin(t) {
1545
- this._explicitScrollMargin = !0;
1546
- const e = typeof t == "number" ? `${t}px` : t;
1547
- return this._classNames.push(u.register("scroll-margin-top", e)), this;
1548
- }
1549
- /** Stamp a class onto the host. Used by PseudoStateBuilder (hashed `:hover` etc.). */
1550
- addClassName(t) {
1551
- return t && !this._classNames.includes(t) && this._classNames.push(t), this;
1552
- }
1553
- /**
1554
- * React list key. After this is called, React reads the key as a string
1555
- * on both the builder element and the inner host wrapper.
1556
- * Builders are valid elements — you do not need `.build()`.
1557
- */
1558
- key(t) {
1559
- this._props.key = t;
1560
- const e = this.__fiboElementProps;
1561
- return e && typeof e == "object" && (this.__fiboElementProps = { ...e, key: String(t) }), this;
1562
- }
1563
- paddingHorizontal(t) {
1564
- const e = typeof t == "number" ? `${t}px` : t, s = u.register("padding-left", e), o = u.register("padding-right", e);
1565
- return this._classNames.push(s, o), this;
1566
- }
1567
- paddingVertical(t) {
1568
- const e = typeof t == "number" ? `${t}px` : t, s = u.register("padding-top", e), o = u.register("padding-bottom", e);
1569
- return this._classNames.push(s, o), this;
1570
- }
1571
- marginHorizontal(t) {
1572
- const e = typeof t == "number" ? `${t}px` : t, s = u.register("margin-left", e), o = u.register("margin-right", e);
1573
- return this._classNames.push(s, o), this;
1574
- }
1575
- marginVertical(t) {
1576
- const e = typeof t == "number" ? `${t}px` : t, s = u.register("margin-top", e), o = u.register("margin-bottom", e);
1577
- return this._classNames.push(s, o), this;
1578
- }
1579
- flexDirection(t) {
1580
- return this._classNames.push(`flex-${t}`), this;
1581
- }
1582
- alignItems(t) {
1583
- return this._classNames.push(`items-${t}`), this;
1584
- }
1585
- justifyContent(t) {
1586
- return this._classNames.push(`justify-${t}`), this;
1587
- }
1588
- flex(t) {
1589
- if (this._classNames.push("flex"), t !== void 0)
1590
- if (typeof t == "number") {
1591
- const e = u.register("flex", String(t));
1592
- this._classNames.push(e);
1593
- } else typeof t == "string" && this._classNames.push(`flex-${t}`);
1594
- return this;
1595
- }
1596
- grid() {
1597
- return this._classNames.push("grid"), this;
1598
- }
1599
- inlineFlex() {
1600
- return this._classNames.push("inline-flex"), this;
1601
- }
1602
- inlineGrid() {
1603
- return this._classNames.push("inline-grid"), this;
1604
- }
1605
- block() {
1606
- return this._classNames.push("block"), this;
1607
- }
1608
- inlineBlock() {
1609
- return this._classNames.push("inline-block"), this;
1610
- }
1611
- hidden() {
1612
- return this._classNames.push("hidden"), this;
1613
- }
1614
- center() {
1615
- return this._classNames.push("flex", "items-center", "justify-center"), this;
1616
- }
1617
- centerX() {
1618
- return this._classNames.push("flex", "justify-center"), this;
1619
- }
1620
- centerY() {
1621
- return this._classNames.push("flex", "items-center"), this;
1622
- }
1623
- spaceBetween() {
1624
- return this._classNames.push("justify-between"), this;
1625
- }
1626
- spaceAround() {
1627
- return this._classNames.push("justify-around"), this;
1628
- }
1629
- spaceEvenly() {
1630
- return this._classNames.push("justify-evenly"), this;
1631
- }
1632
- fill() {
1633
- return this._classNames.push("w-full", "h-full"), this;
1634
- }
1635
- fillWidth() {
1636
- return this._classNames.push("w-full"), this;
1637
- }
1638
- fillHeight() {
1639
- return this._classNames.push("h-full"), this;
1640
- }
1641
- square(t) {
1642
- const e = typeof t == "number" ? `${t}px` : t, s = u.register("width", e), o = u.register("height", e);
1643
- return this._classNames.push(s, o), this;
1644
- }
1645
- circle() {
1646
- return this._classNames.push("rounded-full"), this;
1647
- }
1648
- opacity(t) {
1649
- const e = u.register("opacity", String(t));
1650
- return this._classNames.push(e), this;
1651
- }
1652
- p(t) {
1653
- const e = typeof t == "number" ? `${t}px` : t, s = u.register("padding", e);
1654
- return this._classNames.push(s), this;
1655
- }
1656
- px(t) {
1657
- return this.paddingHorizontal(t);
1658
- }
1659
- py(t) {
1660
- return this.paddingVertical(t);
1661
- }
1662
- paddingX(t) {
1663
- return this.paddingHorizontal(t);
1664
- }
1665
- paddingY(t) {
1666
- return this.paddingVertical(t);
1667
- }
1668
- m(t) {
1669
- const e = typeof t == "number" ? `${t}px` : t, s = u.register("margin", e);
1670
- return this._classNames.push(s), this;
1671
- }
1672
- mx(t) {
1673
- return this.marginHorizontal(t);
1674
- }
1675
- my(t) {
1676
- return this.marginVertical(t);
1677
- }
1678
- marginX(t) {
1679
- return this.marginHorizontal(t);
1680
- }
1681
- marginY(t) {
1682
- return this.marginVertical(t);
1683
- }
1684
- bg(t) {
1685
- const e = typeof t == "string" && !t.startsWith("#") && !t.startsWith("rgb") ? this.resolveSemanticColor(t) : t, s = u.register("background-color", e);
1686
- return this._classNames.push(s), this;
1687
- }
1688
- text(t) {
1689
- const e = typeof t == "string" && !t.startsWith("#") && !t.startsWith("rgb") ? this.resolveSemanticColor(t) : t, s = u.register("color", e);
1690
- return this._classNames.push(s), this;
1691
- }
1692
- color(t) {
1693
- const e = typeof t == "string" && !t.startsWith("#") && !t.startsWith("rgb") ? this.resolveSemanticColor(t) : t, s = u.register("color", e);
1694
- return this._classNames.push(s), this;
1695
- }
1696
- resolveSemanticColor(t) {
1697
- return [
1698
- "primary",
1699
- "on-primary",
1700
- "primary-container",
1701
- "on-primary-container",
1702
- "secondary",
1703
- "on-secondary",
1704
- "secondary-container",
1705
- "on-secondary-container",
1706
- "tertiary",
1707
- "on-tertiary",
1708
- "tertiary-container",
1709
- "on-tertiary-container",
1710
- "error",
1711
- "on-error",
1712
- "background",
1713
- "on-background",
1714
- "surface",
1715
- "on-surface",
1716
- "surface-variant",
1717
- "on-surface-variant",
1718
- "outline"
1719
- ].includes(t) ? `var(--fibo-${t})` : t;
1720
- }
1721
- shadow(t) {
1722
- if (t === null || t === "none") {
1723
- const i = u.register("box-shadow", "none");
1724
- return this._classNames.push(i), this;
1725
- }
1726
- const e = {
1727
- sm: "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
1728
- md: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
1729
- lg: "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
1730
- xl: "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
1731
- "2xl": "0 25px 50px -12px rgba(0, 0, 0, 0.25)",
1732
- card: "0 2px 8px rgba(0, 0, 0, 0.1)",
1733
- button: "0 2px 4px rgba(0, 0, 0, 0.12)",
1734
- modal: "0 10px 40px rgba(0, 0, 0, 0.2)",
1735
- float: "0 8px 16px rgba(0, 0, 0, 0.15)",
1736
- inner: "inset 0 2px 4px 0 rgba(0, 0, 0, 0.06)"
1737
- }, s = (i) => i.startsWith("#") || i.startsWith("rgb") || i.startsWith("hsl") || ["red", "blue", "green", "yellow", "purple", "pink", "orange", "white", "black", "gray"].some((n) => i.includes(n)), o = (i, n, a, l) => {
1738
- let f = a || "rgba(0, 0, 0, " + (l ?? 0.1) + ")";
1739
- if (a && a.startsWith("#") && l !== void 0) {
1740
- const y = parseInt(a.slice(1, 3), 16), b = parseInt(a.slice(3, 5), 16), x = parseInt(a.slice(5, 7), 16);
1741
- f = `rgba(${y}, ${b}, ${x}, ${l})`;
1742
- }
1743
- const p = {
1744
- sm: "2px",
1745
- md: "4px",
1746
- lg: "8px",
1747
- xl: "12px",
1748
- "2xl": "16px"
1749
- }[n] || "4px";
1750
- switch (i) {
1751
- case "top":
1752
- return `0 -${p} ${p} -1px ${f}`;
1753
- case "bottom":
1754
- return `0 ${p} ${p} -1px ${f}`;
1755
- case "left":
1756
- return `-${p} 0 ${p} -1px ${f}`;
1757
- case "right":
1758
- return `${p} 0 ${p} -1px ${f}`;
1759
- case "top-bottom":
1760
- case "vertical":
1761
- return `0 -${p} ${p} -1px ${f}, 0 ${p} ${p} -1px ${f}`;
1762
- case "left-right":
1763
- case "horizontal":
1764
- return `-${p} 0 ${p} -1px ${f}, ${p} 0 ${p} -1px ${f}`;
1765
- case "all":
1766
- default:
1767
- return e[n] || e.md;
1768
- }
1769
- };
1770
- if (!t) {
1771
- const i = u.register("box-shadow", e.md);
1772
- return this._classNames.push(i), this;
1773
- }
1774
- if (typeof t == "string") {
1775
- if (s(t)) {
1776
- const a = o("all", "md", t), l = u.register("box-shadow", a);
1777
- return this._classNames.push(l), this;
1778
- }
1779
- const i = e[t] || e.md, n = u.register("box-shadow", i);
1780
- return this._classNames.push(n), this;
1781
- }
1782
- if (Array.isArray(t)) {
1783
- const [i, n, a, l] = t;
1784
- if (typeof i == "string" && s(i)) {
1785
- const f = o("all", "md", i, n), m = u.register("box-shadow", f);
1786
- return this._classNames.push(m), this;
1787
- }
1788
- const d = i;
1789
- if (typeof n == "string" && s(n)) {
1790
- const f = o(d, "md", n, a), m = u.register("box-shadow", f);
1791
- return this._classNames.push(m), this;
1792
- } else {
1793
- const m = o(d, n, a, l), p = u.register("box-shadow", m);
1794
- return this._classNames.push(p), this;
1795
- }
1796
- }
1797
- return this;
1798
- }
1799
- /**
1800
- * Breakpoint styles compiled to CSS `@media` (same engine as `.md()`).
1801
- * Tiers stay mutually exclusive: mobile `<768`, tablet `768–1023`, desktop `≥1024`.
1802
- * No `window.innerWidth` — hydrate-safe.
1803
- */
1804
- responsive(t) {
1805
- return this.registerMediaStyles("(max-width: 767px)", t.mobile), this.registerMediaStyles("(min-width: 768px) and (max-width: 1023px)", t.tablet), this.registerMediaStyles("(min-width: 1024px)", t.desktop), this;
1806
- }
1807
- /**
1808
- * CSS `@media` (min-width or a raw query). Compiles to a class — no resize JS.
1809
- *
1810
- * @example Box().padding(8).media('md', { padding: 16 }).media('(prefers-color-scheme: dark)', { backgroundColor: '#111' })
1811
- */
1812
- media(t, e) {
1813
- return this.registerMediaStyles(Ht(t), e), this;
1814
- }
1815
- registerMediaStyles(t, e) {
1816
- if (!e) return;
1817
- const s = /* @__PURE__ */ new Set([
1818
- "opacity",
1819
- "zIndex",
1820
- "z-index",
1821
- "flex",
1822
- "flexGrow",
1823
- "flexShrink",
1824
- "order",
1825
- "fontWeight",
1826
- "lineHeight"
1827
- ]);
1828
- for (const [o, i] of Object.entries(e)) {
1829
- if (i == null) continue;
1830
- const n = o.replace(/[A-Z]/g, (l) => `-${l.toLowerCase()}`), a = typeof i == "number" && !s.has(o) && !s.has(n) ? `${i}px` : String(i);
1831
- this._classNames.push(u.registerMedia(t, n, a));
1832
- }
1833
- }
1834
- sm(t) {
1835
- return this.media("sm", t);
1836
- }
1837
- md(t) {
1838
- return this.media("md", t);
1839
- }
1840
- lg(t) {
1841
- return this.media("lg", t);
1842
- }
1843
- xl(t) {
1844
- return this.media("xl", t);
1845
- }
1846
- rounded(t) {
1847
- if (typeof t == "number") {
1848
- const e = u.register("border-radius", `${t}px`);
1849
- this._classNames.push(e);
1850
- } else if (typeof t == "string" && (t.startsWith("rounded-") || ["sm", "md", "lg", "xl", "2xl", "3xl", "full", "none"].includes(t))) {
1851
- const e = t.startsWith("rounded-") ? t : `rounded-${t}`;
1852
- this._classNames.push(e);
1853
- } else {
1854
- const e = u.register("border-radius", t);
1855
- this._classNames.push(e);
1856
- }
1857
- return this;
1858
- }
1859
- borderRadius(t) {
1860
- if (typeof t == "number") {
1861
- const e = u.register("border-radius", `${t}px`);
1862
- this._classNames.push(e);
1863
- } else {
1864
- const e = u.register("border-radius", t);
1865
- this._classNames.push(e);
1866
- }
1867
- return this;
1868
- }
1869
- borderColor(t) {
1870
- if (t.startsWith("border-"))
1871
- this._classNames.push(t);
1872
- else if (["red", "blue", "green", "gray", "white", "black", "transparent"].some((e) => t.includes(e)))
1873
- this._classNames.push(`border-${t}`);
1874
- else {
1875
- const e = u.register("border-color", t);
1876
- this._classNames.push(e);
1877
- }
1878
- return this;
1879
- }
1880
- width(t) {
1881
- if (typeof t == "number") {
1882
- const e = u.register("width", `${t}px`);
1883
- this._classNames.push(e);
1884
- } else if (typeof t == "string" && (t.startsWith("w-") || t === "full" || t === "screen" || t === "min" || t === "max" || t === "fit")) {
1885
- const e = t.startsWith("w-") ? t : `w-${t}`;
1886
- this._classNames.push(e);
1887
- } else {
1888
- const e = u.register("width", t);
1889
- this._classNames.push(e);
1890
- }
1891
- return this;
1892
- }
1893
- height(t) {
1894
- if (typeof t == "number") {
1895
- const e = u.register("height", `${t}px`);
1896
- this._classNames.push(e);
1897
- } else if (typeof t == "string" && (t.startsWith("h-") || t === "full" || t === "screen" || t === "min" || t === "max" || t === "fit")) {
1898
- const e = t.startsWith("h-") ? t : `h-${t}`;
1899
- this._classNames.push(e);
1900
- } else {
1901
- const e = u.register("height", t);
1902
- this._classNames.push(e);
1903
- }
1904
- return this;
1905
- }
1906
- gap(t) {
1907
- if (typeof t == "number") {
1908
- const e = u.register("gap", `${t}px`);
1909
- this._classNames.push(e);
1910
- } else if (typeof t == "string" && t.startsWith("gap-"))
1911
- this._classNames.push(t);
1912
- else {
1913
- const e = u.register("gap", t);
1914
- this._classNames.push(e);
1915
- }
1916
- return this;
1917
- }
1918
- clean() {
1919
- return this._classNames.push(
1920
- "[&_input]:outline-none",
1921
- "[&_input]:ring-0",
1922
- "[&_input]:border-none",
1923
- "[&_input]:!shadow-none",
1924
- "[&_input]:bg-transparent",
1925
- "[&_input]:h-full",
1926
- "[&_input]:w-full",
1927
- "[&_input]:p-0",
1928
- "[&_textarea]:outline-none",
1929
- "[&_textarea]:ring-0",
1930
- "[&_textarea]:border-none",
1931
- "[&_textarea]:!shadow-none",
1932
- "[&_textarea]:bg-transparent",
1933
- "[&_textarea]:h-full",
1934
- "[&_textarea]:w-full",
1935
- "[&_textarea]:p-0",
1936
- "[&_select]:outline-none",
1937
- "[&_select]:ring-0",
1938
- "[&_select]:border-none",
1939
- "[&_select]:!shadow-none",
1940
- "[&_select]:bg-transparent",
1941
- "[&_select]:h-full",
1942
- "[&_select]:w-full",
1943
- "[&_select]:p-0",
1944
- "[&_.fibo-textfield-input]:outline-none",
1945
- "[&_.fibo-textfield-input]:ring-0",
1946
- "[&_.fibo-textfield-input]:border-none",
1947
- "[&_.fibo-textfield-input]:!shadow-none",
1948
- "[&_.fibo-textfield-input]:bg-transparent",
1949
- "[&_.fibo-textfield-input]:h-full",
1950
- "[&_.fibo-textfield-input]:w-full",
1951
- "[&_.fibo-textfield-input]:p-0",
1952
- "[&_.fibo-textarea-input]:outline-none",
1953
- "[&_.fibo-textarea-input]:ring-0",
1954
- "[&_.fibo-textarea-input]:border-none",
1955
- "[&_.fibo-textarea-input]:!shadow-none",
1956
- "[&_.fibo-textarea-input]:bg-transparent",
1957
- "[&_.fibo-textarea-input]:h-full",
1958
- "[&_.fibo-textarea-input]:w-full",
1959
- "[&_.fibo-textarea-input]:p-0",
1960
- "[&>div]:h-full"
1961
- ), this;
1962
- }
1963
- borderInput(t = "gray-300", e = "blue-500") {
1964
- const s = (n) => ["red", "blue", "green", "yellow", "purple", "pink", "indigo", "gray", "orange", "teal", "cyan", "emerald", "lime", "amber", "fuchsia", "rose", "violet", "sky", "slate", "zinc", "neutral", "stone"].includes(n) ? `${n}-500` : n, o = s(t), i = s(e);
1965
- return this._classNames.push(
1966
- "border",
1967
- `border-${o}`,
1968
- "focus-within:ring-2",
1969
- `focus-within:ring-${i}`,
1970
- `focus-within:border-${i}`
1971
- ), this.clean();
1972
- }
1973
- weight(t) {
1974
- if (typeof t == "number") {
1975
- const e = u.register("font-weight", String(t));
1976
- this._classNames.push(e);
1977
- } else {
1978
- const e = {
1979
- thin: "font-thin",
1980
- extralight: "font-extralight",
1981
- light: "font-light",
1982
- normal: "font-normal",
1983
- medium: "font-medium",
1984
- semibold: "font-semibold",
1985
- bold: "font-bold",
1986
- extrabold: "font-extrabold",
1987
- black: "font-black"
1988
- };
1989
- if (e[t])
1990
- this._classNames.push(e[t]);
1991
- else {
1992
- const s = u.register("font-weight", t);
1993
- this._classNames.push(s);
1994
- }
1995
- }
1996
- return this;
1997
- }
1998
- onClick(t) {
1999
- return this._props.onClick = t, this;
2000
- }
2001
- state(t, e) {
2002
- return this._state.set(t, e), this;
2003
- }
2004
- getState(t) {
2005
- return this._state.get(t);
2006
- }
2007
- setState(t, e) {
2008
- return this._state.set(t, e), this;
2009
- }
2010
- provide(t, e) {
2011
- return this._providers.set(t, e), this;
2012
- }
2013
- consume(t) {
2014
- return this._providers.get(t);
2015
- }
2016
- observer(t) {
2017
- return this._isObserver = !0, typeof t == "object" && t !== null ? t.key !== void 0 && this.key(t.key) : t !== void 0 && this.key(t), this;
2018
- }
2019
- observe(t) {
2020
- return this._observers.add(t), this;
2021
- }
2022
- bindSignal(t) {
2023
- return this._signals.add(t), this;
2024
- }
2025
- translateX(t) {
2026
- return t instanceof R ? this._animatedProps.set("translateX", t) : this._transforms.push(`translateX(${t}px)`), this;
2027
- }
2028
- translateY(t) {
2029
- return t instanceof R ? this._animatedProps.set("translateY", t) : this._transforms.push(`translateY(${t}px)`), this;
2030
- }
2031
- scale(t) {
2032
- return t instanceof R ? this._animatedProps.set("scale", t) : this._transforms.push(`scale(${t})`), this;
2033
- }
2034
- rotate(t) {
2035
- return t instanceof R ? this._animatedProps.set("rotate", t) : this._transforms.push(`rotate(${t}deg)`), this;
2036
- }
2037
- gesture(t) {
2038
- return this._gesture = t, this;
2039
- }
2040
- animation(t) {
2041
- return this._animationConfig = t, this;
2042
- }
2043
- hasStateManagement() {
2044
- return this._state.size > 0 || this._providers.size > 0 || this._observers.size > 0 || this._signals.size > 0 || this._isObserver || this._animatedProps.size > 0;
2045
- }
2046
- className(t) {
2047
- return this._classNames.push(t), this;
2048
- }
2049
- classNames(t) {
2050
- return this._classNames.push(...t), this;
2051
- }
2052
- css(t) {
2053
- return this._cssStyles = { ...this._cssStyles, ...t }, this;
2054
- }
2055
- style(t) {
2056
- return this._style = { ...this._style, ...t }, this;
2057
- }
2058
- props(t) {
2059
- return this._props = { ...this._props, ...t }, this;
2060
- }
2061
- transition(t, e, s, o) {
2062
- if (typeof t == "string" && e === void 0)
2063
- return this.replaceTransitionClass(u.register("transition", t)), this;
2064
- const i = Array.isArray(t) ? t.join(", ") : t, n = `${e || this._transitionDuration}ms`, a = v(s || this._transitionEasing), l = o ? `${o}ms` : "0ms";
2065
- return this.replaceTransitionClass(u.register("transition", `${i} ${n} ${a} ${l}`)), this;
2066
- }
2067
- /**
2068
- * Set transition duration in milliseconds
2069
- * Example: .duration(200) → 200ms
2070
- */
2071
- duration(t) {
2072
- return this._transitionDuration = t, this._motionClass ? (this._style["--fibo-dur"] = `${t}ms`, this) : (this._applyTransition(), this);
2073
- }
2074
- /**
2075
- * Set transition easing function
2076
- * Example: .easing('ease-in-out')
2077
- */
2078
- easing(t) {
2079
- return this._transitionEasing = v(t), this._motionClass ? (this._style["--fibo-ease"] = this._transitionEasing, this) : (this._applyTransition(), this);
2080
- }
2081
- /** Alias of `.easing()`. `'spring'` becomes CSS `linear()`. */
2082
- ease(t) {
2083
- return this.easing(t);
2084
- }
2085
- /**
2086
- * Set transition delay in milliseconds
2087
- * Example: .delay(100) → 100ms delay
2088
- */
2089
- delay(t) {
2090
- return this._transitionDelay = t, this._motionClass ? (this._style["--fibo-delay"] = `${t}ms`, this) : (this._applyTransition(), this);
2091
- }
2092
- /**
2093
- * Set which properties to transition
2094
- * Example: .properties(['color', 'transform'])
2095
- */
2096
- properties(t) {
2097
- return this._transitionProperties = t, this._applyTransition(), this;
2098
- }
2099
- /**
2100
- * Apply the built transition to the element
2101
- */
2102
- _applyTransition() {
2103
- const t = this._transitionProperties.join(", "), e = `${this._transitionDuration}ms`, s = this._transitionEasing, o = this._transitionDelay > 0 ? `${this._transitionDelay}ms` : "0ms";
2104
- this.replaceTransitionClass(u.register("transition", `${t} ${e} ${s} ${o}`));
2105
- }
2106
- replaceTransitionClass(t) {
2107
- this._transitionClass && (this._classNames = this._classNames.filter((e) => e !== this._transitionClass)), this._transitionClass = t, this._classNames.push(t);
2108
- }
2109
- animate(t, e) {
2110
- _(), this._usesCssMotion = !0, this._motionClass && (this._classNames = this._classNames.filter((h) => h !== this._motionClass));
2111
- const s = Pt(t), o = (s ? t.duration : e == null ? void 0 : e.duration) ?? this._transitionDuration, i = (s ? t.delay : e == null ? void 0 : e.delay) ?? this._transitionDelay;
2112
- let n = s ? t.ease : e == null ? void 0 : e.ease;
2113
- const a = {
2114
- stiffness: (s ? t.stiffness : e == null ? void 0 : e.stiffness) ?? void 0,
2115
- damping: (s ? t.damping : e == null ? void 0 : e.damping) ?? void 0,
2116
- mass: (s ? t.mass : e == null ? void 0 : e.mass) ?? void 0
2117
- };
2118
- if (s) {
2119
- const h = G(t.from), f = G(t.to), m = u.registerKeyframes(Ft(`${h}=>${f}`), h, f);
2120
- this._motionClass = `fibo-anim ${m}`, this._props["data-fibo-anim"] = "custom";
2121
- } else {
2122
- const h = Bt(t);
2123
- this._motionClass = `fibo-anim fibo-anim-${h}`, this._props["data-fibo-anim"] = h, (e == null ? void 0 : e.from) !== void 0 && (this._style["--fibo-from"] = typeof e.from == "number" ? `${e.from}px` : e.from), !n && h === "pop" && (n = "spring");
2124
- }
2125
- const l = v(n ?? "ease", a);
2126
- this._classNames.push(this._motionClass);
2127
- const d = this._style;
2128
- return d["--fibo-dur"] = `${o}ms`, d["--fibo-ease"] = l, d["--fibo-delay"] = `${i}ms`, this._reducedMotion === "never" && !this._classNames.includes("fibo-motion-force") && this._classNames.push("fibo-motion-force"), this;
2129
- }
2130
- /** CSS `linear()` spring. Works on `.animate()` and `.transition()` / `.hover()`. */
2131
- spring(t) {
2132
- const e = it(t);
2133
- return this._transitionEasing = e, this._motionClass ? (this._style["--fibo-ease"] = e, this) : (this._applyTransition(), this);
2134
- }
2135
- reducedMotion(t = "reduce") {
2136
- return this._reducedMotion = t, t === "never" && !this._classNames.includes("fibo-motion-force") && this._classNames.push("fibo-motion-force"), this;
2137
- }
2138
- press(t) {
2139
- return this.ensureInteractiveTransition(), t ? (this.active(t), this) : (this.active((e) => {
2140
- e.scale(0.97);
2141
- }), this);
2142
- }
2143
- focusVisible(t) {
2144
- const e = new k("focus-visible", this);
2145
- return t ? (t(e), this) : e;
2146
- }
2147
- stagger(t) {
2148
- return this._staggerMs = t, this._usesCssMotion = !0, this._style["--fibo-stagger"] = `${t}ms`, _(), this;
2149
- }
2150
- /** Scroll-reveal: IntersectionObserver toggles `.fibo-inview`. */
2151
- reveal(t = "fadeUp") {
2152
- return this._reveal = typeof t == "string" ? { preset: t, once: !0 } : { preset: "fadeUp", once: !0, ...t }, this._usesCssMotion = !0, _(), this;
2153
- }
2154
- /** Alias of `.reveal()` for scroll-triggered presets. */
2155
- onScroll(t = "fadeIn") {
2156
- return this.reveal(t);
2157
- }
2158
- /** CSS `animation-timeline: view()` / `scroll()`; IntersectionObserver reveal is the fallback. */
2159
- scrollTimeline(t = "view") {
2160
- return _(), this._classNames.push(t === "scroll" ? "fibo-scroll-timeline" : "fibo-view-timeline"), this._usesCssMotion = !0, t === "view" && !this._reveal && (this._reveal = { preset: "fadeUp", once: !0 }), this;
2161
- }
2162
- scrollProgress() {
2163
- return _(), this._scrollProgress = !0, this._classNames.push("fibo-scroll-progress"), this._usesCssMotion = !0, this;
2164
- }
2165
- smoothScroll() {
2166
- return this._classNames.push(u.register("scroll-behavior", "smooth")), this;
2167
- }
2168
- scrollSnap(t = "y") {
2169
- return _(), this._classNames.push(`fibo-snap-${t}`), this;
2170
- }
2171
- scrollSnapAlign(t = "start") {
2172
- return _(), this._classNames.push(`fibo-snap-${t}`), this;
2173
- }
2174
- sticky(t = 0) {
2175
- if (t === !1) return this;
2176
- this._classNames.push(u.register("position", "sticky"));
2177
- const e = t === !0 ? "0px" : typeof t == "number" ? `${t}px` : t;
2178
- this._classNames.push(u.register("top", e));
2179
- const s = t === !0 || t === 0 ? ne : typeof t == "number" ? `${Math.max(t, ht)}px` : t;
2180
- return this.publishStickyOffset(s), this;
2181
- }
2182
- /**
2183
- * Publish `--fibo-sticky-offset` on `:root` so `.anchor()` / `html` scroll-padding
2184
- * clear this bar. Header uses the real bar height.
2185
- */
2186
- publishStickyOffset(t) {
2187
- const e = typeof t == "number" ? `${t}px` : t;
2188
- u.registerRoot("--fibo-sticky-offset", e), u.ensureScrollPadding();
2189
- }
2190
- viewTransition(t) {
2191
- return this._viewTransition = t, this._style.viewTransitionName = t, this;
2192
- }
2193
- /** Default `:focus-visible` ring. Pass a callback to customize. */
2194
- focusRing(t = "var(--fibo-primary)") {
2195
- return this.focusVisible((e) => {
2196
- e.css("outline", `2px solid ${t}`), e.css("outline-offset", "2px");
2197
- }), this;
2198
- }
2199
- ensureInteractiveTransition() {
2200
- this._transitionClass || this._motionClass || this.replaceTransitionClass(
2201
- u.register(
2202
- "transition",
2203
- `transform ${this._transitionDuration}ms ${this._transitionEasing}, opacity ${this._transitionDuration}ms ${this._transitionEasing}`
2204
- )
2205
- );
2206
- }
2207
- theme(t) {
2208
- return this._theme = t, this;
2209
- }
2210
- hover(t) {
2211
- this.ensureInteractiveTransition();
2212
- const e = new k("hover", this);
2213
- return t ? (t(e), this) : e;
2214
- }
2215
- focus(t) {
2216
- const e = new k("focus", this);
2217
- return t ? (t(e), this) : e;
2218
- }
2219
- active(t) {
2220
- const e = new k("active", this);
2221
- return t ? (t(e), this) : e;
2222
- }
2223
- visited(t) {
2224
- const e = new k("visited", this);
2225
- return t ? (t(e), this) : e;
2226
- }
2227
- disabledState(t) {
2228
- const e = new k("disabled", this);
2229
- return t ? (t(e), this) : e;
2230
- }
2231
- focusWithin(t) {
2232
- const e = new k("focus-within", this);
2233
- return t ? (t(e), this) : e;
2234
- }
2235
- firstChild(t) {
2236
- const e = new k("first-child", this);
2237
- return t ? (t(e), this) : e;
2238
- }
2239
- lastChild(t) {
2240
- const e = new k("last-child", this);
2241
- return t ? (t(e), this) : e;
2242
- }
2243
- groupHover(t) {
2244
- const e = new k("hover", this, !0);
2245
- return t ? (t(e), this) : e;
2246
- }
2247
- groupFocus(t) {
2248
- const e = new k("focus", this, !0);
2249
- return t ? (t(e), this) : e;
2250
- }
2251
- groupActive(t) {
2252
- const e = new k("active", this, !0);
2253
- return t ? (t(e), this) : e;
2254
- }
2255
- groupFocusWithin(t) {
2256
- const e = new k("focus-within", this, !0);
2257
- return t ? (t(e), this) : e;
2258
- }
2259
- group() {
2260
- return this._classNames.push("group"), this;
2261
- }
2262
- children(t) {
2263
- return typeof t == "function" ? (this._childFunction = t, this._children = []) : (this._children = K(t), this._childFunction = void 0), this;
2264
- }
2265
- getClassName() {
2266
- let t;
2267
- return Object.keys(this._cssStyles).length > 0 && (t = Qt(this._cssStyles) || void 0), Xt(this._classNames, t);
2268
- }
2269
- getStyle() {
2270
- let t = { ...this._style, ...this._cssStyles };
2271
- if (this._theme) {
2272
- const e = this._theme.colors || this._theme.colorScheme;
2273
- if (e) {
2274
- const s = t;
2275
- e.primary && (s["--fibo-primary"] = e.primary), e.onPrimary && (s["--fibo-on-primary"] = e.onPrimary), e.secondary && (s["--fibo-secondary"] = e.secondary), e.onSecondary && (s["--fibo-on-secondary"] = e.onSecondary), e.background && (s["--fibo-background"] = e.background), e.onBackground && (s["--fibo-on-background"] = e.onBackground), e.surface && (s["--fibo-surface"] = e.surface), e.onSurface && (s["--fibo-on-surface"] = e.onSurface), e.error && (s["--fibo-error"] = e.error);
2276
- }
2277
- }
2278
- if (this._transforms.length > 0) {
2279
- const e = t.transform || "";
2280
- t.transform = e ? `${e} ${this._transforms.join(" ")}` : this._transforms.join(" ");
2281
- }
2282
- if (this._animationConfig && this._animatedProps.size === 0) {
2283
- const { duration: e = 300, curve: s = "easeOut", stiffness: o, damping: i } = this._animationConfig, n = v(s, { stiffness: o, damping: i });
2284
- t.transition = `all ${e}ms ${n}`;
2285
- }
2286
- return t;
2287
- }
2288
- processChildren() {
2289
- const t = this._childFunction ? K(this._childFunction) : this._children;
2290
- return this._staggerMs == null ? t : t.map(
2291
- (e, s) => g.createElement(
2292
- "span",
2293
- {
2294
- key: g.isValidElement(e) && H(e.key) ? e.key : `fibo-stagger-${s}`,
2295
- className: "fibo-stagger-item",
2296
- style: { "--fibo-i": String(s) }
2297
- },
2298
- e
2299
- )
2300
- );
2301
- }
2302
- getChildFunction() {
2303
- return this._childFunction;
2304
- }
2305
- }
2306
- const ae = /* @__PURE__ */ new Set([
2307
- "$$typeof",
2308
- "type",
2309
- "props",
2310
- "ref",
2311
- "_owner",
2312
- "_store",
2313
- "_self",
2314
- "_source",
2315
- "_debugStack",
2316
- "_debugTask",
2317
- "_debugInfo"
2318
- ]);
2319
- function ce(r) {
2320
- var e;
2321
- const t = (e = r._props) == null ? void 0 : e.key;
2322
- if (!(t == null || t === ""))
2323
- return t;
2324
- }
2325
- function le(r) {
2326
- const t = r._isObserver, e = r._signals, s = r._observers, o = r._state, i = r._providers, n = ce(r), a = () => {
2327
- var S;
2328
- let m = r.build();
2329
- const p = r._animatedProps, y = r._animationConfig;
2330
- p && p.size > 0 && (m = g.createElement(ee, {
2331
- key: n,
2332
- animatedProps: p,
2333
- animationConfig: y,
2334
- children: m
2335
- }));
2336
- const b = r._reveal;
2337
- b && (m = g.createElement(oe, {
2338
- key: n,
2339
- preset: b.preset,
2340
- once: b.once,
2341
- rootMargin: b.rootMargin,
2342
- threshold: b.threshold,
2343
- forceMotion: r._reducedMotion === "never",
2344
- preferTimeline: (S = r._classNames) == null ? void 0 : S.includes("fibo-view-timeline"),
2345
- children: m
2346
- })), r._scrollProgress && (m = g.createElement(ie, { key: n, children: m })), r._usesCssMotion && (m = g.createElement(
2347
- g.Fragment,
2348
- { key: n },
2349
- g.createElement(Ot),
2350
- m
2351
- ));
2352
- const x = r._gesture;
2353
- return x && (m = x.wrap(m)), m;
2354
- }, l = typeof r.hasStateManagement == "function" ? r.hasStateManagement() : !!(t || e && e.size || s && s.size || o && o.size || i && i.size), d = t ? g.createElement(Nt, {
2355
- key: n,
2356
- children: a
2357
- }) : null, h = () => d ?? a();
2358
- let f = h();
2359
- return l && e && e.size > 0 ? f = g.createElement(It, {
2360
- key: n,
2361
- signals: e,
2362
- children: h
2363
- }) : l && s && s.size > 0 && (f = g.createElement(Tt, {
2364
- key: n,
2365
- observables: s,
2366
- children: h
2367
- })), l && o && o.size > 0 && (f = g.createElement(Mt, {
2368
- key: n,
2369
- stateMap: o,
2370
- children: f
2371
- })), l && i && i.size > 0 && (f = g.createElement(Rt, {
2372
- key: n,
2373
- providers: i,
2374
- children: f
2375
- })), f;
2376
- }
2377
- function ut(r, t, e) {
2378
- const s = function() {
2379
- return t();
2380
- };
2381
- s.displayName = e;
2382
- const o = g.createElement(s);
2383
- Object.defineProperty(r, "$$typeof", {
2384
- value: o.$$typeof,
2385
- enumerable: !0,
2386
- configurable: !0
2387
- }), Object.defineProperty(r, "type", {
2388
- value: s,
2389
- enumerable: !0,
2390
- configurable: !0,
2391
- writable: !0
2392
- }), r.ref = o.ref ?? null, r.__fiboElementProps = o.props ?? {}, o._owner !== void 0 && (r._owner = o._owner), r._store = { validated: 1 };
2393
- }
2394
- function Me(r) {
2395
- return (...t) => {
2396
- const e = new r(...t), s = r.name.replace(/Builder$/, "") || "Fibo", o = () => le(e);
2397
- return ut(e, o, s), new Proxy(e, {
2398
- get(i, n, a) {
2399
- var l, d;
2400
- if (n === "build")
2401
- return o;
2402
- if (n === "key") {
2403
- const h = (l = i._props) == null ? void 0 : l.key;
2404
- if (h != null && h !== "")
2405
- return String(h);
2406
- if (!i.__fiboKeyFn) {
2407
- const f = (m) => (i.key(m), a);
2408
- i.__fiboKeyFn = f;
2409
- }
2410
- return i.__fiboKeyFn;
2411
- }
2412
- if (n === "props") {
2413
- const h = (d = i._props) == null ? void 0 : d.key, f = {
2414
- ...i.__fiboElementProps ?? {},
2415
- ...h != null && h !== "" ? { key: String(h) } : {}
2416
- }, m = Object.getPrototypeOf(i).props;
2417
- return typeof m == "function" ? Object.assign((y) => (m.call(i, y), a), f) : f;
2418
- }
2419
- return ae.has(n) || Reflect.has(i, n) ? Reflect.get(i, n, a) : (h) => {
2420
- const f = n.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase(), p = ["opacity", "z-index", "flex", "flex-grow", "flex-shrink", "order", "font-weight", "line-height"].includes(f), y = typeof h == "number" && !p ? `${h}px` : String(h), b = u.register(f, y);
2421
- return i.className(b), a;
2422
- };
2423
- }
2424
- });
2425
- };
2426
- }
2427
- const he = ({
2428
- signal: r,
2429
- builder: t,
2430
- loading: e,
2431
- error: s
2432
- }) => {
2433
- const o = g.useSyncExternalStore(
2434
- g.useCallback((a) => r.subscribe ? r.subscribe(a) : () => {
2435
- }, [r]),
2436
- () => r.value
2437
- ), i = o == null ? void 0 : o.error;
2438
- return i && s ? s(i) : ((o == null ? void 0 : o.isLoading) || (o == null ? void 0 : o.loading)) === !0 && e ? e() : t ? t(o) : null;
2439
- }, ue = g.memo(he);
2440
- class fe {
2441
- constructor(t) {
2442
- c(this, "_loading");
2443
- c(this, "_error");
2444
- c(this, "_builder");
2445
- this._signal = t, ut(this, () => this.build(), "ValueBuilder");
2446
- }
2447
- loading(t) {
2448
- return this._loading = typeof t == "function" ? t : () => t, this;
2449
- }
2450
- error(t) {
2451
- return this._error = t, this;
2452
- }
2453
- builder(t) {
2454
- return this._builder = t, this;
2455
- }
2456
- children(t) {
2457
- return this._builder = t, this;
2458
- }
2459
- build() {
2460
- return g.createElement(ue, {
2461
- signal: this._signal,
2462
- builder: this._builder,
2463
- loading: this._loading,
2464
- error: this._error
2465
- });
2466
- }
2467
- }
2468
- function Te(r) {
2469
- return new fe(r);
2470
- }
2471
- export {
2472
- Bt as A,
2473
- Mt as B,
2474
- $t as C,
2475
- zt as D,
2476
- _t as E,
2477
- ve as F,
2478
- jt as G,
2479
- At as H,
2480
- K as I,
2481
- q as J,
2482
- F as K,
2483
- at as L,
2484
- U as M,
2485
- Ht as N,
2486
- wt as O,
2487
- Rt as P,
2488
- _e as R,
2489
- R as S,
2490
- Te as V,
2491
- ke as a,
2492
- tt as b,
2493
- be as c,
2494
- Nt as d,
2495
- $e as e,
2496
- oe as f,
2497
- et as g,
2498
- ie as h,
2499
- Ce as i,
2500
- Ne as j,
2501
- se as k,
2502
- re as l,
2503
- it as m,
2504
- v as n,
2505
- ye as o,
2506
- Ot as p,
2507
- we as q,
2508
- kt as r,
2509
- ge as s,
2510
- nt as t,
2511
- xe as u,
2512
- Se as v,
2513
- Me as w,
2514
- Ee as x,
2515
- Ct as y,
2516
- _ as z
2517
- };