@juwel-development/design-system 2.1.1 → 3.0.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.
- package/dist/design-system.js +58 -58
- package/dist/index.css +1 -1
- package/dist/types/Interaction/Input/Input.d.ts +5 -0
- package/dist/types/Interaction/TextArea/TextArea.d.ts +5 -0
- package/package.json +2 -6
- package/src/Interaction/Input/Input.tsx +9 -1
- package/src/Interaction/TextArea/TextArea.tsx +9 -1
package/dist/design-system.js
CHANGED
|
@@ -142,7 +142,7 @@ var s = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, c = o, l = (e
|
|
|
142
142
|
children: l
|
|
143
143
|
})]
|
|
144
144
|
});
|
|
145
|
-
}, x = l(["grid gap-[var(--space-stack)]", "lg:grid-cols-[10rem_minmax(0,1fr)] lg:items-start lg:gap-x-12"].join(" ")), S = l("lg:sticky lg:top-6"), C = l("block border-b border-solid border-border pb-1 font-secondary text-label tracking-label text-muted"), w = l("block pt-1 font-secondary text-label tracking-label text-foreground"),
|
|
145
|
+
}, x = l(["grid gap-[var(--space-stack)]", "lg:grid-cols-[10rem_minmax(0,1fr)] lg:items-start lg:gap-x-12"].join(" ")), S = l("lg:sticky lg:top-6"), C = l("block border-b border-solid border-border pb-1 font-secondary text-label tracking-label text-muted"), w = l("block pt-1 font-secondary text-label tracking-label text-foreground"), T = {
|
|
146
146
|
Root: ({ children: t, testId: n }) => /* @__PURE__ */ e("div", {
|
|
147
147
|
className: x(),
|
|
148
148
|
"data-testid": n,
|
|
@@ -164,7 +164,7 @@ var s = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, c = o, l = (e
|
|
|
164
164
|
"data-testid": n,
|
|
165
165
|
children: t
|
|
166
166
|
})
|
|
167
|
-
},
|
|
167
|
+
}, E = l([
|
|
168
168
|
"[&:not([data-notes])]:overflow-x-auto",
|
|
169
169
|
"[&>table]:w-full [&>table]:border-collapse [&>table]:text-left",
|
|
170
170
|
"[&_caption]:pb-3 [&_caption]:text-left [&_caption]:font-secondary [&_caption]:text-label [&_caption]:tracking-label [&_caption]:text-muted",
|
|
@@ -173,7 +173,7 @@ var s = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, c = o, l = (e
|
|
|
173
173
|
"[&[data-notes=content]>table]:max-md:block",
|
|
174
174
|
"[&[data-notes=content]_thead]:max-md:block [&[data-notes=content]_tbody]:max-md:block [&[data-notes=content]_tfoot]:max-md:block",
|
|
175
175
|
"[&[data-notes=content]_tr]:max-md:block [&[data-notes=content]_td]:max-md:block [&[data-notes=content]_th]:max-md:block"
|
|
176
|
-
].join(" ")),
|
|
176
|
+
].join(" ")), ee = l("border-t border-solid border-border"), D = l("px-4 py-2 text-small first:pl-0 last:pr-0", {
|
|
177
177
|
variants: {
|
|
178
178
|
variant: {
|
|
179
179
|
value: "font-primary text-foreground tabular-nums",
|
|
@@ -200,13 +200,13 @@ var s = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, c = o, l = (e
|
|
|
200
200
|
Root: ({ caption: n, notes: r, children: i, testId: a }) => {
|
|
201
201
|
let o = /* @__PURE__ */ t("table", { children: [/* @__PURE__ */ e("caption", { children: n }), i] });
|
|
202
202
|
return r === void 0 ? /* @__PURE__ */ e("section", {
|
|
203
|
-
className:
|
|
203
|
+
className: E(),
|
|
204
204
|
"data-testid": a,
|
|
205
205
|
"aria-label": n,
|
|
206
206
|
tabIndex: 0,
|
|
207
207
|
children: o
|
|
208
208
|
}) : /* @__PURE__ */ e("div", {
|
|
209
|
-
className:
|
|
209
|
+
className: E(),
|
|
210
210
|
"data-notes": r,
|
|
211
211
|
"data-testid": a,
|
|
212
212
|
children: o
|
|
@@ -216,7 +216,7 @@ var s = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, c = o, l = (e
|
|
|
216
216
|
Body: ({ children: t }) => /* @__PURE__ */ e("tbody", { children: t }),
|
|
217
217
|
Footer: ({ children: t }) => /* @__PURE__ */ e("tfoot", { children: t }),
|
|
218
218
|
Row: ({ children: t, testId: n }) => /* @__PURE__ */ e("tr", {
|
|
219
|
-
className:
|
|
219
|
+
className: ee(),
|
|
220
220
|
"data-testid": n,
|
|
221
221
|
children: t
|
|
222
222
|
}),
|
|
@@ -319,7 +319,7 @@ var s = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, c = o, l = (e
|
|
|
319
319
|
muted: "text-muted"
|
|
320
320
|
} },
|
|
321
321
|
defaultVariants: { color: "foreground" }
|
|
322
|
-
}), Y = l("font-primary text-small text-muted"),
|
|
322
|
+
}), Y = l("font-primary text-small text-muted"), X = {
|
|
323
323
|
Root: ({ children: t, testId: n }) => /* @__PURE__ */ e("div", {
|
|
324
324
|
className: K(),
|
|
325
325
|
"data-testid": n,
|
|
@@ -337,7 +337,7 @@ var s = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, c = o, l = (e
|
|
|
337
337
|
className: Y(),
|
|
338
338
|
children: t
|
|
339
339
|
})
|
|
340
|
-
},
|
|
340
|
+
}, te = l("transition-colors duration-[var(--motion-duration-color)] rounded-[var(--radius-control)] py-2 sm:py-2 disabled:bg-disabled disabled:hover:bg-disabled-hover cursor-pointer disabled:cursor-not-allowed select-none text-nowrap inline-flex flex-row items-center justify-center gap-2 outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]", {
|
|
341
341
|
variants: { variant: {
|
|
342
342
|
primary: "px-4 sm:px-6 min-w-[var(--control-min-width)] bg-primary text-primary-foreground hover:bg-primary-hover",
|
|
343
343
|
secondary: "px-4 sm:px-6 min-w-[var(--control-min-width)] bg-secondary text-secondary-foreground hover:bg-secondary-hover",
|
|
@@ -347,7 +347,7 @@ var s = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, c = o, l = (e
|
|
|
347
347
|
}), Z = ({ children: t, disabled: n, testId: r, variant: i, onClick$: a, ariaLabel: o, type: s = "button" }) => /* @__PURE__ */ e("button", {
|
|
348
348
|
type: s,
|
|
349
349
|
"data-testid": r,
|
|
350
|
-
className:
|
|
350
|
+
className: te({ variant: i }),
|
|
351
351
|
onClick: () => a?.next(),
|
|
352
352
|
disabled: n,
|
|
353
353
|
"aria-label": o,
|
|
@@ -359,50 +359,50 @@ var s = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, c = o, l = (e
|
|
|
359
359
|
url: ""
|
|
360
360
|
} },
|
|
361
361
|
defaultVariants: { variant: "text" }
|
|
362
|
-
}), ne = ({ label: a, name: o, variant: s, required: c,
|
|
363
|
-
let
|
|
362
|
+
}), ne = ({ label: a, name: o, variant: s, required: c, optionalLabel: l, invalid: u, disabled: d, defaultValue: f, placeholder: p, autocomplete: m, hint: h, errorMessage: g, onInput$: _, reset$: v, testId: y }) => {
|
|
363
|
+
let b = r(), x = `${b}-control`, S = `${b}-hint`, C = `${b}-error`, w = [h ? S : void 0, u ? C : void 0].filter(Boolean).join(" ") || void 0, T = i(null);
|
|
364
364
|
return n(() => {
|
|
365
|
-
let e =
|
|
366
|
-
|
|
365
|
+
let e = v?.subscribe(() => {
|
|
366
|
+
T.current && (T.current.value = "");
|
|
367
367
|
});
|
|
368
368
|
return () => e?.unsubscribe();
|
|
369
|
-
}, [
|
|
369
|
+
}, [v]), /* @__PURE__ */ t("div", {
|
|
370
370
|
className: "flex flex-col gap-[var(--space-stack)]",
|
|
371
371
|
children: [
|
|
372
372
|
/* @__PURE__ */ e("label", {
|
|
373
|
-
htmlFor:
|
|
373
|
+
htmlFor: x,
|
|
374
374
|
className: "font-medium text-foreground",
|
|
375
375
|
children: a
|
|
376
376
|
}),
|
|
377
377
|
/* @__PURE__ */ e("input", {
|
|
378
|
-
ref:
|
|
379
|
-
id:
|
|
378
|
+
ref: T,
|
|
379
|
+
id: x,
|
|
380
380
|
name: o,
|
|
381
381
|
type: s ?? "text",
|
|
382
382
|
className: Q({ variant: s }),
|
|
383
383
|
required: c,
|
|
384
|
-
disabled:
|
|
385
|
-
defaultValue:
|
|
386
|
-
placeholder:
|
|
387
|
-
autoComplete:
|
|
388
|
-
"aria-invalid":
|
|
389
|
-
"aria-describedby":
|
|
390
|
-
"data-testid":
|
|
391
|
-
onInput: (e) =>
|
|
384
|
+
disabled: d,
|
|
385
|
+
defaultValue: f,
|
|
386
|
+
placeholder: p,
|
|
387
|
+
autoComplete: m,
|
|
388
|
+
"aria-invalid": u || void 0,
|
|
389
|
+
"aria-describedby": w,
|
|
390
|
+
"data-testid": y,
|
|
391
|
+
onInput: (e) => _?.next(e.currentTarget.value)
|
|
392
392
|
}),
|
|
393
|
-
!c && /* @__PURE__ */ e("span", {
|
|
393
|
+
!c && l && /* @__PURE__ */ e("span", {
|
|
394
394
|
className: "text-muted text-sm",
|
|
395
|
-
children:
|
|
395
|
+
children: l
|
|
396
396
|
}),
|
|
397
|
-
|
|
398
|
-
id:
|
|
397
|
+
h && /* @__PURE__ */ e("p", {
|
|
398
|
+
id: S,
|
|
399
399
|
className: "text-muted text-sm",
|
|
400
|
-
children:
|
|
400
|
+
children: h
|
|
401
401
|
}),
|
|
402
|
-
|
|
403
|
-
id:
|
|
402
|
+
u && /* @__PURE__ */ e("p", {
|
|
403
|
+
id: C,
|
|
404
404
|
className: "text-error text-sm",
|
|
405
|
-
children:
|
|
405
|
+
children: g
|
|
406
406
|
})
|
|
407
407
|
]
|
|
408
408
|
});
|
|
@@ -422,49 +422,49 @@ var s = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, c = o, l = (e
|
|
|
422
422
|
"aria-current": a ? "page" : void 0,
|
|
423
423
|
"data-testid": o,
|
|
424
424
|
children: n
|
|
425
|
-
}), ae = l("block min-h-24 w-full rounded-[var(--radius-control)] border border-solid border-control-border bg-transparent px-3 py-2 text-foreground transition-colors duration-[var(--motion-duration-color)] outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)] [&:user-invalid]:border-error aria-[invalid=true]:border-error disabled:cursor-not-allowed disabled:border-disabled disabled:text-muted"), oe = ({ label: a, name: o, required: s,
|
|
426
|
-
let
|
|
425
|
+
}), ae = l("block min-h-24 w-full rounded-[var(--radius-control)] border border-solid border-control-border bg-transparent px-3 py-2 text-foreground transition-colors duration-[var(--motion-duration-color)] outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)] [&:user-invalid]:border-error aria-[invalid=true]:border-error disabled:cursor-not-allowed disabled:border-disabled disabled:text-muted"), oe = ({ label: a, name: o, required: s, optionalLabel: c, invalid: l, disabled: u, defaultValue: d, placeholder: f, autocomplete: p, hint: m, errorMessage: h, onInput$: g, reset$: _, testId: v }) => {
|
|
426
|
+
let y = r(), b = `${y}-control`, x = `${y}-hint`, S = `${y}-error`, C = [m ? x : void 0, l ? S : void 0].filter(Boolean).join(" ") || void 0, w = i(null);
|
|
427
427
|
return n(() => {
|
|
428
|
-
let e =
|
|
429
|
-
|
|
428
|
+
let e = _?.subscribe(() => {
|
|
429
|
+
w.current && (w.current.value = "");
|
|
430
430
|
});
|
|
431
431
|
return () => e?.unsubscribe();
|
|
432
|
-
}, [
|
|
432
|
+
}, [_]), /* @__PURE__ */ t("div", {
|
|
433
433
|
className: "flex flex-col gap-[var(--space-stack)]",
|
|
434
434
|
children: [
|
|
435
435
|
/* @__PURE__ */ e("label", {
|
|
436
|
-
htmlFor:
|
|
436
|
+
htmlFor: b,
|
|
437
437
|
className: "font-medium text-foreground",
|
|
438
438
|
children: a
|
|
439
439
|
}),
|
|
440
440
|
/* @__PURE__ */ e("textarea", {
|
|
441
|
-
ref:
|
|
442
|
-
id:
|
|
441
|
+
ref: w,
|
|
442
|
+
id: b,
|
|
443
443
|
name: o,
|
|
444
444
|
className: ae(),
|
|
445
445
|
required: s,
|
|
446
|
-
disabled:
|
|
447
|
-
defaultValue:
|
|
448
|
-
placeholder:
|
|
449
|
-
autoComplete:
|
|
450
|
-
"aria-invalid":
|
|
451
|
-
"aria-describedby":
|
|
452
|
-
"data-testid":
|
|
453
|
-
onInput: (e) =>
|
|
446
|
+
disabled: u,
|
|
447
|
+
defaultValue: d,
|
|
448
|
+
placeholder: f,
|
|
449
|
+
autoComplete: p,
|
|
450
|
+
"aria-invalid": l || void 0,
|
|
451
|
+
"aria-describedby": C,
|
|
452
|
+
"data-testid": v,
|
|
453
|
+
onInput: (e) => g?.next(e.currentTarget.value)
|
|
454
454
|
}),
|
|
455
|
-
!s && /* @__PURE__ */ e("span", {
|
|
455
|
+
!s && c && /* @__PURE__ */ e("span", {
|
|
456
456
|
className: "text-muted text-sm",
|
|
457
|
-
children:
|
|
457
|
+
children: c
|
|
458
458
|
}),
|
|
459
|
-
|
|
460
|
-
id:
|
|
459
|
+
m && /* @__PURE__ */ e("p", {
|
|
460
|
+
id: x,
|
|
461
461
|
className: "text-muted text-sm",
|
|
462
|
-
children:
|
|
462
|
+
children: m
|
|
463
463
|
}),
|
|
464
|
-
|
|
465
|
-
id:
|
|
464
|
+
l && /* @__PURE__ */ e("p", {
|
|
465
|
+
id: S,
|
|
466
466
|
className: "text-error text-sm",
|
|
467
|
-
children:
|
|
467
|
+
children: h
|
|
468
468
|
})
|
|
469
469
|
]
|
|
470
470
|
});
|
|
@@ -619,4 +619,4 @@ var s = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, c = o, l = (e
|
|
|
619
619
|
info: "#22d3ee"
|
|
620
620
|
};
|
|
621
621
|
//#endregion
|
|
622
|
-
export { d as Brandmark, Z as Button, m as Checklist, v as DefinitionList, j as Eyebrow, b as Figure, ce as Footer, de as Form, N as H1, F as H2, L as H3, z as H4, V as H5, U as H6, pe as Header, me as Hero, ne as Input, ie as Link, G as P, ye as PageHead,
|
|
622
|
+
export { d as Brandmark, Z as Button, m as Checklist, v as DefinitionList, j as Eyebrow, b as Figure, ce as Footer, de as Form, N as H1, F as H2, L as H3, z as H4, V as H5, U as H6, pe as Header, me as Hero, ne as Input, ie as Link, G as P, ye as PageHead, X as Prose, T as Rail, xe as Section, k as Table, oe as TextArea, Ce as dark, Se as light };
|
package/dist/index.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
|
|
2
|
-
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-content:""}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-serif:ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--radius-lg:.5rem;--aspect-video:16 / 9;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-surface:var(--color-surface);--color-foreground:var(--color-foreground);--color-muted:var(--color-muted);--color-border:var(--color-border);--color-control-border:var(--color-control-border);--color-rule:var(--color-rule);--color-backing:var(--color-backing);--color-primary:var(--color-primary);--color-primary-hover:var(--color-primary-hover);--color-primary-foreground:var(--color-primary-foreground);--color-secondary:var(--color-secondary);--color-secondary-hover:var(--color-secondary-hover);--color-secondary-foreground:var(--color-secondary-foreground);--color-disabled:var(--color-disabled);--color-disabled-hover:var(--color-disabled-hover);--color-focus-ring:var(--color-focus-ring);--color-link:var(--color-link);--color-success:var(--color-success);--color-warning:var(--color-warning);--color-error:var(--color-error);--color-info:var(--color-info);--font-primary:inherit;--font-secondary:inherit;--text-display:clamp(3rem, 7vw, 6rem);--leading-display:1.05;--text-title:clamp(2.25rem, 5vw, 4.25rem);--leading-title:1.1;--text-subtitle:clamp(1.5rem, 3vw, 2.25rem);--leading-subtitle:1.2;--text-lede:1.25rem;--leading-lede:1.4;--text-body:1.0625rem;--leading-body:1.6;--text-small:.9375rem;--text-label:.8125rem;--tracking-label:.14em;--tracking-optical:-.02em;--aspect-portrait:4 / 5;--aspect-square:1 / 1;--aspect-landscape:3 / 2;--aspect-wide:16 / 9}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.collapse{visibility:collapse}.invisible{visibility:hidden}.visible{visibility:visible}.fixed{position:fixed}.static{position:static}.sticky{position:sticky}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.m-0{margin:0}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.inline{display:inline}.inline-flex{display:inline-flex}.table{display:table}.aspect-landscape{aspect-ratio:var(--aspect-landscape)}.aspect-portrait{aspect-ratio:var(--aspect-portrait)}.aspect-square{aspect-ratio:var(--aspect-square)}.aspect-wide{aspect-ratio:var(--aspect-wide)}.min-h-24{min-height:calc(var(--spacing) * 24)}.min-h-\[var\(--fold-height\)\]{min-height:var(--fold-height)}.w-full{width:100%}.max-w-\[var\(--measure\)\]{max-width:var(--measure)}.max-w-\[var\(--measure-wide\)\]{max-width:var(--measure-wide)}.min-w-0{min-width:0}.min-w-42{min-width:calc(var(--spacing) * 42)}.min-w-\[var\(--control-min-width\)\]{min-width:var(--control-min-width)}.grow{flex-grow:1}.cursor-pointer{cursor:pointer}.list-none{list-style-type:none}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-start{justify-content:flex-start}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-\[var\(--space-region\)\]{gap:var(--space-region)}.gap-\[var\(--space-stack\)\]{gap:var(--space-stack)}.rounded-\[var\(--radius-control\)\]{border-radius:var(--radius-control)}.rounded-\[var\(--radius-…\)\]{border-radius:var(--radius-…)}.rounded-lg{border-radius:var(--radius-lg)}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-solid{--tw-border-style:solid;border-style:solid}.border-border{border-color:var(--color-border)}.border-control-border{border-color:var(--color-control-border)}.border-rule{border-color:var(--color-rule)}.bg-backing{background-color:var(--color-backing)}.bg-primary{background-color:var(--color-primary)}.bg-secondary{background-color:var(--color-secondary)}.bg-transparent{background-color:#0000}.object-cover{object-fit:cover}.object-bottom{object-position:bottom}.object-center{object-position:center}.object-left{object-position:left}.object-right{object-position:right}.object-top{object-position:top}.p-0{padding:0}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-\[var\(--gutter\)\]{padding-inline:var(--gutter)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-\[var\(--space-band\)\]{padding-block:var(--space-band)}.py-\[var\(--space-region\)\]{padding-block:var(--space-region)}.pt-1{padding-top:var(--spacing)}.pb-1{padding-bottom:var(--spacing)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-primary{font-family:var(--font-primary)}.font-secondary{font-family:var(--font-secondary)}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-body{font-size:var(--text-body)}.text-display{font-size:var(--text-display)}.text-label{font-size:var(--text-label)}.text-lede{font-size:var(--text-lede)}.text-small{font-size:var(--text-small)}.text-subtitle{font-size:var(--text-subtitle)}.text-title{font-size:var(--text-title)}.leading-body{--tw-leading:var(--leading-body);line-height:var(--leading-body)}.leading-display{--tw-leading:var(--leading-display);line-height:var(--leading-display)}.leading-lede{--tw-leading:var(--leading-lede);line-height:var(--leading-lede)}.leading-subtitle{--tw-leading:var(--leading-subtitle);line-height:var(--leading-subtitle)}.leading-title{--tw-leading:var(--leading-title);line-height:var(--leading-title)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-label{--tw-tracking:var(--tracking-label);letter-spacing:var(--tracking-label)}.tracking-optical{--tw-tracking:var(--tracking-optical);letter-spacing:var(--tracking-optical)}.text-nowrap{text-wrap:nowrap}.text-error{color:var(--color-error)}.text-foreground{color:var(--color-foreground)}.text-inherit{color:inherit}.text-link{color:var(--color-link)}.text-muted{color:var(--color-muted)}.text-primary-foreground{color:var(--color-primary-foreground)}.text-secondary-foreground{color:var(--color-secondary-foreground)}.text-success{color:var(--color-success)}.ordinal{--tw-ordinal:ordinal;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.no-underline{text-decoration-line:none}.underline{text-decoration-line:underline}.decoration-\[length\:var\(--underline-thickness\)\]{text-decoration-thickness:var(--underline-thickness)}.underline-offset-\[var\(--underline-offset\)\]{text-underline-offset:var(--underline-offset)}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.outline-offset-\[var\(--focus-ring-offset\)\]{outline-offset:var(--focus-ring-offset)}.outline-focus-ring{outline-color:var(--color-focus-ring)}.invert{--tw-invert:invert(100%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-\[var\(--motion-duration-color\)\]{--tw-duration:var(--motion-duration-color);transition-duration:var(--motion-duration-color)}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.before\:mt-\[0\.35em\]:before{content:var(--tw-content);margin-top:.35em}.before\:size-\[calc\(var\(--tick-length\)\*0\.7\)\]:before{content:var(--tw-content);width:calc(var(--tick-length) * .7);height:calc(var(--tick-length) * .7)}.before\:shrink-0:before{content:var(--tw-content);flex-shrink:0}.before\:rotate-45:before{content:var(--tw-content);rotate:45deg}.before\:bg-\[var\(--color-rule\)\]:before{content:var(--tw-content);background-color:var(--color-rule)}.before\:content-\[\'\'\]:before{--tw-content:"";content:var(--tw-content)}.before\:\[border-right\:var\(--tick-thickness\)_solid_var\(--color-rule\)\]:before{content:var(--tw-content);border-right:var(--tick-thickness) solid var(--color-rule)}.before\:\[border-top\:var\(--tick-thickness\)_solid_var\(--color-rule\)\]:before{content:var(--tw-content);border-top:var(--tick-thickness) solid var(--color-rule)}.first\:border-t:first-child{border-top-style:var(--tw-border-style);border-top-width:1px}.first\:pl-0:first-child{padding-left:0}.last\:pr-0:last-child{padding-right:0}@media (hover:hover){.hover\:bg-primary-hover:hover{background-color:var(--color-primary-hover)}.hover\:bg-secondary-hover:hover{background-color:var(--color-secondary-hover)}.hover\:text-foreground:hover{color:var(--color-foreground)}.hover\:underline:hover{text-decoration-line:underline}.hover\:decoration-\[length\:var\(--underline-thickness\)\]:hover{text-decoration-thickness:var(--underline-thickness)}.hover\:decoration-\[length\:var\(--underline-thickness-hover\)\]:hover{text-decoration-thickness:var(--underline-thickness-hover)}.hover\:underline-offset-\[var\(--underline-offset\)\]:hover{text-underline-offset:var(--underline-offset)}}.focus-visible\:outline:focus-visible{outline-style:var(--tw-outline-style);outline-width:1px}.focus-visible\:outline-\[length\:var\(--focus-ring-width\)\]:focus-visible{outline-style:var(--tw-outline-style);outline-width:var(--focus-ring-width)}.focus-visible\:outline-focus-ring:focus-visible{outline-color:var(--color-focus-ring)}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:border-disabled:disabled{border-color:var(--color-disabled)}.disabled\:bg-disabled:disabled{background-color:var(--color-disabled)}.disabled\:text-muted:disabled{color:var(--color-muted)}@media (hover:hover){.disabled\:hover\:bg-disabled-hover:disabled:hover{background-color:var(--color-disabled-hover)}}.aria-\[invalid\=true\]\:border-error[aria-invalid=true]{border-color:var(--color-error)}@media (width>=40rem){.sm\:px-6{padding-inline:calc(var(--spacing) * 6)}.sm\:py-2{padding-block:calc(var(--spacing) * 2)}}@media (width>=64rem){.lg\:sticky{position:sticky}.lg\:top-6{top:calc(var(--spacing) * 6)}.lg\:grid-cols-\[10rem_minmax\(0\,1fr\)\]{grid-template-columns:10rem minmax(0,1fr)}.lg\:grid-cols-\[16rem_minmax\(0\,1fr\)\]{grid-template-columns:16rem minmax(0,1fr)}.lg\:items-baseline{align-items:baseline}.lg\:items-start{align-items:flex-start}.lg\:gap-x-12{column-gap:calc(var(--spacing) * 12)}}.\[\&_\[aria-current\=page\]\]\:text-foreground [aria-current=page]{color:var(--color-foreground)}.\[\&_caption\]\:pb-3 caption{padding-bottom:calc(var(--spacing) * 3)}.\[\&_caption\]\:text-left caption{text-align:left}.\[\&_caption\]\:font-secondary caption{font-family:var(--font-secondary)}.\[\&_caption\]\:text-label caption{font-size:var(--text-label)}.\[\&_caption\]\:tracking-label caption{--tw-tracking:var(--tracking-label);letter-spacing:var(--tracking-label)}.\[\&_caption\]\:text-muted caption{color:var(--color-muted)}.\[\&\:not\(\:first-child\)\]\:mt-\[var\(--space-stack\)\]:not(:first-child){margin-top:var(--space-stack)}.\[\&\:not\(\:first-child\)\]\:border-t:not(:first-child){border-top-style:var(--tw-border-style);border-top-width:1px}.\[\&\:not\(\:first-child\)\]\:border-solid:not(:first-child){--tw-border-style:solid;border-style:solid}.\[\&\:not\(\:first-child\)\]\:border-border:not(:first-child){border-color:var(--color-border)}.\[\&\:not\(\:first-child\)\]\:pt-\[var\(--space-stack\)\]:not(:first-child){padding-top:var(--space-stack)}.\[\&\:not\(\[data-notes\]\)\]\:overflow-x-auto:not([data-notes]){overflow-x:auto}.\[\&\:user-invalid\]\:border-error:user-invalid{border-color:var(--color-error)}@media (width>=64rem){.lg\:\[\&\>dd\]\:col-start-2>dd{grid-column-start:2}.lg\:\[\&\>dd\]\:row-start-1>dd{grid-row-start:1}.lg\:\[\&\>dt\]\:col-start-1>dt{grid-column-start:1}}.\[\&\>table\]\:w-full>table{width:100%}.\[\&\>table\]\:border-collapse>table{border-collapse:collapse}.\[\&\>table\]\:text-left>table{text-align:left}.\[\&\>table\>\*\:nth-child\(2\)\>tr\:first-child\]\:border-rule>table>:nth-child(2)>tr:first-child{border-color:var(--color-rule)}@media not all and (width>=48rem){.\[\&\[data-notes\=content\]_tbody\]\:max-md\:block[data-notes=content] tbody,.\[\&\[data-notes\=content\]_td\]\:max-md\:block[data-notes=content] td,.\[\&\[data-notes\=content\]_tfoot\]\:max-md\:block[data-notes=content] tfoot,.\[\&\[data-notes\=content\]_th\]\:max-md\:block[data-notes=content] th,.\[\&\[data-notes\=content\]_thead\]\:max-md\:block[data-notes=content] thead,.\[\&\[data-notes\=content\]_tr\]\:max-md\:block[data-notes=content] tr,.\[\&\[data-notes\=content\]\>table\]\:max-md\:block[data-notes=content]>table{display:block}.\[\&\[data-notes\=supplementary\]_\[data-variant\=note\]\]\:max-md\:hidden[data-notes=supplementary] [data-variant=note]{display:none}}[data-section]+.\[\[data-section\]\+\&\]\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}[data-section]+.\[\[data-section\]\+\&\]\:border-solid{--tw-border-style:solid;border-style:solid}[data-section]+.\[\[data-section\]\+\&\]\:border-rule{border-color:var(--color-rule)}}:root{--color-surface:#fff;--color-foreground:#0f172a;--color-muted:#64748b;--color-border:#e2e8f0;--color-control-border:#64748b;--color-rule:#808fa3;--color-backing:#f1f5f9;--color-primary:#8b5cf6;--color-primary-hover:#7c3aed;--color-primary-foreground:#f8fafc;--color-secondary:#0ea5e9;--color-secondary-hover:#0284c7;--color-secondary-foreground:#f8fafc;--color-disabled:#94a3b8;--color-disabled-hover:#64748b;--color-focus-ring:var(--color-ring,#475569);--color-link:#2563eb;--color-success:#10b981;--color-warning:#f59e0b;--color-error:#d63384;--color-info:#06b6d4}.dark{--color-surface:#0f172a;--color-foreground:#f8fafc;--color-muted:#94a3b8;--color-border:#334155;--color-control-border:#94a3b8;--color-rule:#5b6a80;--color-backing:#1e293b;--color-primary:#7c3aed;--color-primary-hover:#8b5cf6;--color-primary-foreground:#f8fafc;--color-secondary:#0284c7;--color-secondary-hover:#0ea5e9;--color-secondary-foreground:#f8fafc;--color-disabled:#475569;--color-disabled-hover:#334155;--color-focus-ring:var(--color-ring,#cbd5e1);--color-link:#60a5fa;--color-success:#34d399;--color-warning:#fbbf24;--color-error:#f48fb1;--color-info:#22d3ee}:root{--motion-duration-color:.15s}@media (prefers-reduced-motion:reduce){:root{--motion-duration-color:0s}}:root{--focus-ring-width:3px;--focus-ring-offset:2px;--radius-control:.5rem;--control-min-width:10.5rem;--underline-offset:.18em;--underline-thickness:1px;--underline-thickness-hover:2px;--measure:66ch;--measure-display:36ch;--measure-wide:72ch;--space-stack:.5em;--space-region:1.5em;--space-band:4em;--gutter:clamp(1.5rem, 5vw, 4rem);--fold-height:min(70vh, 40rem);--tick-length:.9rem;--tick-thickness:1px}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-content{syntax:"*";inherits:false;initial-value:""}
|
|
2
|
+
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-content:""}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-serif:ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-slate-200:oklch(92.9% .013 255.508);--color-slate-900:oklch(20.8% .042 265.755);--color-stone-50:oklch(98.5% .001 106.423);--color-white:#fff;--spacing:.25rem;--container-5xl:64rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--tracking-wider:.05em;--radius-md:.375rem;--radius-lg:.5rem;--aspect-video:16 / 9;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-surface:var(--color-surface);--color-foreground:var(--color-foreground);--color-muted:var(--color-muted);--color-border:var(--color-border);--color-control-border:var(--color-control-border);--color-rule:var(--color-rule);--color-backing:var(--color-backing);--color-primary:var(--color-primary);--color-primary-hover:var(--color-primary-hover);--color-primary-foreground:var(--color-primary-foreground);--color-secondary:var(--color-secondary);--color-secondary-hover:var(--color-secondary-hover);--color-secondary-foreground:var(--color-secondary-foreground);--color-disabled:var(--color-disabled);--color-disabled-hover:var(--color-disabled-hover);--color-focus-ring:var(--color-focus-ring);--color-link:var(--color-link);--color-success:var(--color-success);--color-warning:var(--color-warning);--color-error:var(--color-error);--color-info:var(--color-info);--font-primary:inherit;--font-secondary:inherit;--text-display:clamp(3rem, 7vw, 6rem);--leading-display:1.05;--text-title:clamp(2.25rem, 5vw, 4.25rem);--leading-title:1.1;--text-subtitle:clamp(1.5rem, 3vw, 2.25rem);--leading-subtitle:1.2;--text-lede:1.25rem;--leading-lede:1.4;--text-body:1.0625rem;--leading-body:1.6;--text-small:.9375rem;--text-label:.8125rem;--tracking-label:.14em;--tracking-optical:-.02em;--aspect-portrait:4 / 5;--aspect-square:1 / 1;--aspect-landscape:3 / 2;--aspect-wide:16 / 9}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.collapse{visibility:collapse}.invisible{visibility:hidden}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.isolate{isolation:isolate}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.m-0{margin:0}.mx-auto{margin-inline:auto}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.table{display:table}.aspect-landscape{aspect-ratio:var(--aspect-landscape)}.aspect-portrait{aspect-ratio:var(--aspect-portrait)}.aspect-square{aspect-ratio:var(--aspect-square)}.aspect-wide{aspect-ratio:var(--aspect-wide)}.h-12{height:calc(var(--spacing) * 12)}.min-h-24{min-height:calc(var(--spacing) * 24)}.min-h-\[var\(--fold-height\)\]{min-height:var(--fold-height)}.w-full{width:100%}.max-w-5xl{max-width:var(--container-5xl)}.max-w-\[var\(--measure\)\]{max-width:var(--measure)}.max-w-\[var\(--measure-wide\)\]{max-width:var(--measure-wide)}.min-w-0{min-width:0}.min-w-42{min-width:calc(var(--spacing) * 42)}.min-w-\[var\(--control-min-width\)\]{min-width:var(--control-min-width)}.shrink{flex-shrink:1}.grow{flex-grow:1}.cursor-pointer{cursor:pointer}.list-none{list-style-type:none}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-start{justify-content:flex-start}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-\[var\(--space-region\)\]{gap:var(--space-region)}.gap-\[var\(--space-stack\)\]{gap:var(--space-stack)}:where(.space-y-10>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 10) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 10) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-12>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 12) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 12) * calc(1 - var(--tw-space-y-reverse)))}.rounded-\[var\(--radius-control\)\]{border-radius:var(--radius-control)}.rounded-\[var\(--radius-…\)\]{border-radius:var(--radius-…)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l-4{border-left-style:var(--tw-border-style);border-left-width:4px}.border-solid{--tw-border-style:solid;border-style:solid}.border-border{border-color:var(--color-border)}.border-control-border{border-color:var(--color-control-border)}.border-primary{border-color:var(--color-primary)}.border-rule{border-color:var(--color-rule)}.border-slate-200{border-color:var(--color-slate-200)}.bg-backing{background-color:var(--color-backing)}.bg-primary{background-color:var(--color-primary)}.bg-secondary{background-color:var(--color-secondary)}.bg-stone-50{background-color:var(--color-stone-50)}.bg-surface{background-color:var(--color-surface)}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.object-cover{object-fit:cover}.object-bottom{object-position:bottom}.object-center{object-position:center}.object-left{object-position:left}.object-right{object-position:right}.object-top{object-position:top}.p-0{padding:0}.p-4{padding:calc(var(--spacing) * 4)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.px-\[var\(--gutter\)\]{padding-inline:var(--gutter)}.py-1{padding-block:var(--spacing)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-12{padding-block:calc(var(--spacing) * 12)}.py-\[var\(--space-band\)\]{padding-block:var(--space-band)}.py-\[var\(--space-region\)\]{padding-block:var(--space-region)}.pt-1{padding-top:var(--spacing)}.pb-1{padding-bottom:var(--spacing)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.font-primary{font-family:var(--font-primary)}.font-sans{font-family:var(--font-sans)}.font-secondary{font-family:var(--font-secondary)}.font-serif{font-family:var(--font-serif)}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-body{font-size:var(--text-body)}.text-display{font-size:var(--text-display)}.text-label{font-size:var(--text-label)}.text-lede{font-size:var(--text-lede)}.text-small{font-size:var(--text-small)}.text-subtitle{font-size:var(--text-subtitle)}.text-title{font-size:var(--text-title)}.leading-body{--tw-leading:var(--leading-body);line-height:var(--leading-body)}.leading-display{--tw-leading:var(--leading-display);line-height:var(--leading-display)}.leading-lede{--tw-leading:var(--leading-lede);line-height:var(--leading-lede)}.leading-subtitle{--tw-leading:var(--leading-subtitle);line-height:var(--leading-subtitle)}.leading-title{--tw-leading:var(--leading-title);line-height:var(--leading-title)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-label{--tw-tracking:var(--tracking-label);letter-spacing:var(--tracking-label)}.tracking-optical{--tw-tracking:var(--tracking-optical);letter-spacing:var(--tracking-optical)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.text-nowrap{text-wrap:nowrap}.text-error{color:var(--color-error)}.text-foreground{color:var(--color-foreground)}.text-inherit{color:inherit}.text-link{color:var(--color-link)}.text-muted{color:var(--color-muted)}.text-primary-foreground{color:var(--color-primary-foreground)}.text-secondary-foreground{color:var(--color-secondary-foreground)}.text-slate-900{color:var(--color-slate-900)}.text-success{color:var(--color-success)}.uppercase{text-transform:uppercase}.ordinal{--tw-ordinal:ordinal;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.no-underline{text-decoration-line:none}.underline{text-decoration-line:underline}.decoration-\[length\:var\(--underline-thickness\)\]{text-decoration-thickness:var(--underline-thickness)}.underline-offset-\[var\(--underline-offset\)\]{text-underline-offset:var(--underline-offset)}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.outline-offset-\[var\(--focus-ring-offset\)\]{outline-offset:var(--focus-ring-offset)}.outline-focus-ring{outline-color:var(--color-focus-ring)}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.invert{--tw-invert:invert(100%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-\[var\(--motion-duration-color\)\]{--tw-duration:var(--motion-duration-color);transition-duration:var(--motion-duration-color)}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.before\:mt-\[0\.35em\]:before{content:var(--tw-content);margin-top:.35em}.before\:size-\[calc\(var\(--tick-length\)\*0\.7\)\]:before{content:var(--tw-content);width:calc(var(--tick-length) * .7);height:calc(var(--tick-length) * .7)}.before\:shrink-0:before{content:var(--tw-content);flex-shrink:0}.before\:rotate-45:before{content:var(--tw-content);rotate:45deg}.before\:bg-\[var\(--color-rule\)\]:before{content:var(--tw-content);background-color:var(--color-rule)}.before\:content-\[\'\'\]:before{--tw-content:"";content:var(--tw-content)}.before\:\[border-right\:var\(--tick-thickness\)_solid_var\(--color-rule\)\]:before{content:var(--tw-content);border-right:var(--tick-thickness) solid var(--color-rule)}.before\:\[border-top\:var\(--tick-thickness\)_solid_var\(--color-rule\)\]:before{content:var(--tw-content);border-top:var(--tick-thickness) solid var(--color-rule)}.first\:border-t:first-child{border-top-style:var(--tw-border-style);border-top-width:1px}.first\:pl-0:first-child{padding-left:0}.last\:pr-0:last-child{padding-right:0}@media (hover:hover){.hover\:border-muted:hover{border-color:var(--color-muted)}.hover\:bg-primary-hover:hover{background-color:var(--color-primary-hover)}.hover\:bg-secondary-hover:hover{background-color:var(--color-secondary-hover)}.hover\:text-foreground:hover{color:var(--color-foreground)}.hover\:underline:hover{text-decoration-line:underline}.hover\:decoration-\[length\:var\(--underline-thickness\)\]:hover{text-decoration-thickness:var(--underline-thickness)}.hover\:decoration-\[length\:var\(--underline-thickness-hover\)\]:hover{text-decoration-thickness:var(--underline-thickness-hover)}.hover\:underline-offset-\[var\(--underline-offset\)\]:hover{text-underline-offset:var(--underline-offset)}.hover\:opacity-90:hover{opacity:.9}}.focus-visible\:outline:focus-visible{outline-style:var(--tw-outline-style);outline-width:1px}.focus-visible\:outline-\[length\:var\(--focus-ring-width\)\]:focus-visible{outline-style:var(--tw-outline-style);outline-width:var(--focus-ring-width)}.focus-visible\:outline-focus-ring:focus-visible{outline-color:var(--color-focus-ring)}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:border-disabled:disabled{border-color:var(--color-disabled)}.disabled\:bg-disabled:disabled{background-color:var(--color-disabled)}.disabled\:text-muted:disabled{color:var(--color-muted)}@media (hover:hover){.disabled\:hover\:bg-disabled-hover:disabled:hover{background-color:var(--color-disabled-hover)}}.aria-\[invalid\=true\]\:border-error[aria-invalid=true]{border-color:var(--color-error)}@media (width>=40rem){.sm\:px-6{padding-inline:calc(var(--spacing) * 6)}.sm\:py-2{padding-block:calc(var(--spacing) * 2)}}@media (width>=64rem){.lg\:sticky{position:sticky}.lg\:top-6{top:calc(var(--spacing) * 6)}.lg\:grid-cols-\[10rem_minmax\(0\,1fr\)\]{grid-template-columns:10rem minmax(0,1fr)}.lg\:grid-cols-\[16rem_minmax\(0\,1fr\)\]{grid-template-columns:16rem minmax(0,1fr)}.lg\:items-baseline{align-items:baseline}.lg\:items-start{align-items:flex-start}.lg\:gap-x-12{column-gap:calc(var(--spacing) * 12)}}.\[\&_\[aria-current\=page\]\]\:text-foreground [aria-current=page]{color:var(--color-foreground)}.\[\&_caption\]\:pb-3 caption{padding-bottom:calc(var(--spacing) * 3)}.\[\&_caption\]\:text-left caption{text-align:left}.\[\&_caption\]\:font-secondary caption{font-family:var(--font-secondary)}.\[\&_caption\]\:text-label caption{font-size:var(--text-label)}.\[\&_caption\]\:tracking-label caption{--tw-tracking:var(--tracking-label);letter-spacing:var(--tracking-label)}.\[\&_caption\]\:text-muted caption{color:var(--color-muted)}.\[\&\:not\(\:first-child\)\]\:mt-\[var\(--space-stack\)\]:not(:first-child){margin-top:var(--space-stack)}.\[\&\:not\(\:first-child\)\]\:border-t:not(:first-child){border-top-style:var(--tw-border-style);border-top-width:1px}.\[\&\:not\(\:first-child\)\]\:border-solid:not(:first-child){--tw-border-style:solid;border-style:solid}.\[\&\:not\(\:first-child\)\]\:border-border:not(:first-child){border-color:var(--color-border)}.\[\&\:not\(\:first-child\)\]\:pt-\[var\(--space-stack\)\]:not(:first-child){padding-top:var(--space-stack)}.\[\&\:not\(\[data-notes\]\)\]\:overflow-x-auto:not([data-notes]){overflow-x:auto}.\[\&\:user-invalid\]\:border-error:user-invalid{border-color:var(--color-error)}@media (width>=64rem){.lg\:\[\&\>dd\]\:col-start-2>dd{grid-column-start:2}.lg\:\[\&\>dd\]\:row-start-1>dd{grid-row-start:1}.lg\:\[\&\>dt\]\:col-start-1>dt{grid-column-start:1}}.\[\&\>table\]\:w-full>table{width:100%}.\[\&\>table\]\:border-collapse>table{border-collapse:collapse}.\[\&\>table\]\:text-left>table{text-align:left}.\[\&\>table\>\*\:nth-child\(2\)\>tr\:first-child\]\:border-rule>table>:nth-child(2)>tr:first-child{border-color:var(--color-rule)}@media not all and (width>=48rem){.\[\&\[data-notes\=content\]_tbody\]\:max-md\:block[data-notes=content] tbody,.\[\&\[data-notes\=content\]_td\]\:max-md\:block[data-notes=content] td,.\[\&\[data-notes\=content\]_tfoot\]\:max-md\:block[data-notes=content] tfoot,.\[\&\[data-notes\=content\]_th\]\:max-md\:block[data-notes=content] th,.\[\&\[data-notes\=content\]_thead\]\:max-md\:block[data-notes=content] thead,.\[\&\[data-notes\=content\]_tr\]\:max-md\:block[data-notes=content] tr,.\[\&\[data-notes\=content\]\>table\]\:max-md\:block[data-notes=content]>table{display:block}.\[\&\[data-notes\=supplementary\]_\[data-variant\=note\]\]\:max-md\:hidden[data-notes=supplementary] [data-variant=note]{display:none}}[data-section]+.\[\[data-section\]\+\&\]\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}[data-section]+.\[\[data-section\]\+\&\]\:border-solid{--tw-border-style:solid;border-style:solid}[data-section]+.\[\[data-section\]\+\&\]\:border-rule{border-color:var(--color-rule)}}:root{--color-surface:#fff;--color-foreground:#0f172a;--color-muted:#64748b;--color-border:#e2e8f0;--color-control-border:#64748b;--color-rule:#808fa3;--color-backing:#f1f5f9;--color-primary:#8b5cf6;--color-primary-hover:#7c3aed;--color-primary-foreground:#f8fafc;--color-secondary:#0ea5e9;--color-secondary-hover:#0284c7;--color-secondary-foreground:#f8fafc;--color-disabled:#94a3b8;--color-disabled-hover:#64748b;--color-focus-ring:var(--color-ring,#475569);--color-link:#2563eb;--color-success:#10b981;--color-warning:#f59e0b;--color-error:#d63384;--color-info:#06b6d4}.dark{--color-surface:#0f172a;--color-foreground:#f8fafc;--color-muted:#94a3b8;--color-border:#334155;--color-control-border:#94a3b8;--color-rule:#5b6a80;--color-backing:#1e293b;--color-primary:#7c3aed;--color-primary-hover:#8b5cf6;--color-primary-foreground:#f8fafc;--color-secondary:#0284c7;--color-secondary-hover:#0ea5e9;--color-secondary-foreground:#f8fafc;--color-disabled:#475569;--color-disabled-hover:#334155;--color-focus-ring:var(--color-ring,#cbd5e1);--color-link:#60a5fa;--color-success:#34d399;--color-warning:#fbbf24;--color-error:#f48fb1;--color-info:#22d3ee}:root{--motion-duration-color:.15s}@media (prefers-reduced-motion:reduce){:root{--motion-duration-color:0s}}:root{--focus-ring-width:3px;--focus-ring-offset:2px;--radius-control:.5rem;--control-min-width:10.5rem;--underline-offset:.18em;--underline-thickness:1px;--underline-thickness-hover:2px;--measure:66ch;--measure-display:36ch;--measure-wide:72ch;--space-stack:.5em;--space-region:1.5em;--space-band:4em;--gutter:clamp(1.5rem, 5vw, 4rem);--fold-height:min(70vh, 40rem);--tick-length:.9rem;--tick-thickness:1px}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-content{syntax:"*";inherits:false;initial-value:""}
|
|
@@ -10,6 +10,11 @@ interface IInputProps extends VariantProps<typeof input> {
|
|
|
10
10
|
/** How the surrounding form reads the value on submit. */
|
|
11
11
|
name: string;
|
|
12
12
|
required?: boolean;
|
|
13
|
+
/**
|
|
14
|
+
* How a non-required field says so, in the consuming app's language. Left out, the field carries
|
|
15
|
+
* no marker at all: the library translates nothing and ships no wording of its own (issue #74).
|
|
16
|
+
*/
|
|
17
|
+
optionalLabel?: string;
|
|
13
18
|
invalid?: boolean;
|
|
14
19
|
disabled?: boolean;
|
|
15
20
|
defaultValue?: string;
|
|
@@ -6,6 +6,11 @@ interface ITextAreaProps {
|
|
|
6
6
|
/** How the surrounding form reads the value on submit. */
|
|
7
7
|
name: string;
|
|
8
8
|
required?: boolean;
|
|
9
|
+
/**
|
|
10
|
+
* How a non-required field says so, in the consuming app's language. Left out, the field carries
|
|
11
|
+
* no marker at all: the library translates nothing and ships no wording of its own (issue #74).
|
|
12
|
+
*/
|
|
13
|
+
optionalLabel?: string;
|
|
9
14
|
invalid?: boolean;
|
|
10
15
|
disabled?: boolean;
|
|
11
16
|
defaultValue?: string;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@juwel-development/design-system",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "3.0.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Shared design system: tokens and components.",
|
|
6
6
|
"license": "MIT",
|
|
@@ -49,8 +49,6 @@
|
|
|
49
49
|
"lint:fix": "biome check --write .",
|
|
50
50
|
"storybook": "storybook dev -p 6006",
|
|
51
51
|
"build-storybook": "storybook build",
|
|
52
|
-
"sandcastle": "tsx .sandcastle/main.ts",
|
|
53
|
-
"sandcastle:image": "sandcastle docker build-image",
|
|
54
52
|
"fallow": "fallow",
|
|
55
53
|
"fallow:human": "fallow dead-code && fallow dupes && fallow health",
|
|
56
54
|
"fallow:agent": "fallow review --brief",
|
|
@@ -66,7 +64,6 @@
|
|
|
66
64
|
"rxjs": "^7.8.2"
|
|
67
65
|
},
|
|
68
66
|
"devDependencies": {
|
|
69
|
-
"@ai-hero/sandcastle": "^0.12.0",
|
|
70
67
|
"@biomejs/biome": "^2.5.7",
|
|
71
68
|
"@commitlint/cli": "^21.2.1",
|
|
72
69
|
"@commitlint/config-conventional": "^21.2.0",
|
|
@@ -97,8 +94,7 @@
|
|
|
97
94
|
"typescript": "^5.9.2",
|
|
98
95
|
"vite": "^8.2.1",
|
|
99
96
|
"vite-plugin-lib-inject-css": "^2.2.2",
|
|
100
|
-
"vitest": "^4.1.10"
|
|
101
|
-
"zod": "^4.4.3"
|
|
97
|
+
"vitest": "^4.1.10"
|
|
102
98
|
},
|
|
103
99
|
"overrides": {
|
|
104
100
|
"fallow-type-aware": {
|
|
@@ -27,6 +27,11 @@ interface IInputProps extends VariantProps<typeof input> {
|
|
|
27
27
|
/** How the surrounding form reads the value on submit. */
|
|
28
28
|
name: string;
|
|
29
29
|
required?: boolean;
|
|
30
|
+
/**
|
|
31
|
+
* How a non-required field says so, in the consuming app's language. Left out, the field carries
|
|
32
|
+
* no marker at all: the library translates nothing and ships no wording of its own (issue #74).
|
|
33
|
+
*/
|
|
34
|
+
optionalLabel?: string;
|
|
30
35
|
invalid?: boolean;
|
|
31
36
|
disabled?: boolean;
|
|
32
37
|
defaultValue?: string;
|
|
@@ -50,6 +55,7 @@ export const Input: FunctionComponent<IInputProps> = ({
|
|
|
50
55
|
name,
|
|
51
56
|
variant,
|
|
52
57
|
required,
|
|
58
|
+
optionalLabel,
|
|
53
59
|
invalid,
|
|
54
60
|
disabled,
|
|
55
61
|
defaultValue,
|
|
@@ -104,7 +110,9 @@ export const Input: FunctionComponent<IInputProps> = ({
|
|
|
104
110
|
data-testid={testId}
|
|
105
111
|
onInput={(event) => onInput$?.next(event.currentTarget.value)}
|
|
106
112
|
/>
|
|
107
|
-
{!required &&
|
|
113
|
+
{!required && optionalLabel && (
|
|
114
|
+
<span className={'text-muted text-sm'}>{optionalLabel}</span>
|
|
115
|
+
)}
|
|
108
116
|
{hint && (
|
|
109
117
|
<p id={hintId} className={'text-muted text-sm'}>
|
|
110
118
|
{hint}
|
|
@@ -19,6 +19,11 @@ interface ITextAreaProps {
|
|
|
19
19
|
/** How the surrounding form reads the value on submit. */
|
|
20
20
|
name: string;
|
|
21
21
|
required?: boolean;
|
|
22
|
+
/**
|
|
23
|
+
* How a non-required field says so, in the consuming app's language. Left out, the field carries
|
|
24
|
+
* no marker at all: the library translates nothing and ships no wording of its own (issue #74).
|
|
25
|
+
*/
|
|
26
|
+
optionalLabel?: string;
|
|
22
27
|
invalid?: boolean;
|
|
23
28
|
disabled?: boolean;
|
|
24
29
|
defaultValue?: string;
|
|
@@ -41,6 +46,7 @@ export const TextArea: FunctionComponent<ITextAreaProps> = ({
|
|
|
41
46
|
label,
|
|
42
47
|
name,
|
|
43
48
|
required,
|
|
49
|
+
optionalLabel,
|
|
44
50
|
invalid,
|
|
45
51
|
disabled,
|
|
46
52
|
defaultValue,
|
|
@@ -94,7 +100,9 @@ export const TextArea: FunctionComponent<ITextAreaProps> = ({
|
|
|
94
100
|
data-testid={testId}
|
|
95
101
|
onInput={(event) => onInput$?.next(event.currentTarget.value)}
|
|
96
102
|
/>
|
|
97
|
-
{!required &&
|
|
103
|
+
{!required && optionalLabel && (
|
|
104
|
+
<span className={'text-muted text-sm'}>{optionalLabel}</span>
|
|
105
|
+
)}
|
|
98
106
|
{hint && (
|
|
99
107
|
<p id={hintId} className={'text-muted text-sm'}>
|
|
100
108
|
{hint}
|