@adia-ai/web-components 0.8.10 → 0.8.11
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/CHANGELOG.md +20 -0
- package/MIGRATION.md +58 -0
- package/USAGE.md +5 -7
- package/components/adia-mark/adia-mark.a2ui.json +6 -6
- package/components/adia-mark/adia-mark.class.js +1 -1
- package/components/adia-mark/adia-mark.css +3 -4
- package/components/adia-mark/adia-mark.d.ts +1 -1
- package/components/adia-mark/adia-mark.examples.md +0 -2
- package/components/adia-mark/adia-mark.test.js +3 -3
- package/components/adia-mark/adia-mark.yaml +5 -4
- package/components/adia-wordmark/adia-wordmark.a2ui.json +108 -0
- package/components/adia-wordmark/adia-wordmark.class.js +60 -0
- package/components/adia-wordmark/adia-wordmark.css +45 -0
- package/components/adia-wordmark/adia-wordmark.d.ts +20 -0
- package/components/adia-wordmark/adia-wordmark.examples.md +23 -0
- package/components/adia-wordmark/adia-wordmark.js +17 -0
- package/components/adia-wordmark/adia-wordmark.test.js +69 -0
- package/components/adia-wordmark/adia-wordmark.yaml +102 -0
- package/components/avatar/avatar-group.a2ui.json +1 -1
- package/components/avatar/avatar-group.yaml +1 -1
- package/components/avatar/avatar.a2ui.json +2 -4
- package/components/avatar/avatar.css +16 -12
- package/components/avatar/avatar.d.ts +3 -3
- package/components/avatar/avatar.examples.md +1 -1
- package/components/avatar/avatar.yaml +1 -3
- package/components/badge/badge.a2ui.json +2 -4
- package/components/badge/badge.d.ts +2 -2
- package/components/badge/badge.yaml +1 -3
- package/components/button/button.a2ui.json +2 -4
- package/components/button/button.d.ts +2 -2
- package/components/button/button.yaml +1 -3
- package/components/calendar-grid/calendar-grid.class.js +2 -2
- package/components/calendar-grid/calendar-grid.css +1 -1
- package/components/calendar-picker/calendar-picker.class.js +2 -2
- package/components/calendar-picker/calendar-picker.css +1 -1
- package/components/chat-thread/chat-input.css +1 -1
- package/components/combobox/combobox.class.js +1 -1
- package/components/combobox/combobox.css +1 -1
- package/components/icon/icon.a2ui.json +1 -1
- package/components/icon/icon.class.js +5 -5
- package/components/icon/icon.css +7 -15
- package/components/icon/icon.d.ts +1 -1
- package/components/icon/icon.examples.md +1 -1
- package/components/icon/icon.yaml +10 -10
- package/components/index.js +1 -0
- package/components/input/input.class.js +2 -2
- package/components/modal/modal.a2ui.json +2 -3
- package/components/modal/modal.d.ts +2 -2
- package/components/modal/modal.yaml +1 -2
- package/components/select/select.class.js +4 -4
- package/components/select/select.css +12 -3
- package/components/swatch/swatch.css +1 -1
- package/components/switch/switch.a2ui.json +2 -4
- package/components/switch/switch.yaml +1 -3
- package/components/tag/tag.class.js +1 -1
- package/components/tag/tag.css +1 -1
- package/components/theme-provider/theme-provider.a2ui.json +11 -1
- package/components/theme-provider/theme-provider.class.js +27 -7
- package/components/theme-provider/theme-provider.d.ts +2 -2
- package/components/theme-provider/theme-provider.yaml +10 -1
- package/components/timeline/timeline.css +1 -1
- package/components/toggle-scheme/toggle-scheme.a2ui.json +2 -4
- package/components/toggle-scheme/toggle-scheme.d.ts +2 -2
- package/components/toggle-scheme/toggle-scheme.yaml +1 -3
- package/dist/scale.min.css +1 -0
- package/dist/scale.sheet.js +11 -0
- package/dist/theme-provider.min.js +8 -8
- package/dist/web-components.min.css +1 -1
- package/dist/web-components.min.js +93 -85
- package/dist/web-components.sheet.js +1 -1
- package/package.json +1 -1
- package/patterns/comments-and-collaboration/comments-and-collaboration.examples.html +4 -4
- package/patterns/kanban-board/kanban-board.examples.html +8 -8
- package/patterns/notifications-bell-and-digest/notifications-bell-and-digest.examples.html +2 -2
- package/patterns/profile-public-and-verification/profile-public-and-verification.examples.html +1 -1
- package/patterns/search-discovery/search-discovery.examples.html +4 -4
- package/styles/components.css +1 -0
- package/styles/prose.css +4 -0
- package/styles/scale.css +683 -0
- package/styles/verse.css +4 -0
|
@@ -423,7 +423,7 @@ export class UISelect extends UIFormElement {
|
|
|
423
423
|
// render. The `data-select-leading` marker scopes that reconciliation to
|
|
424
424
|
// our element. mark wins over avatar, which wins over icon (gh#339).
|
|
425
425
|
const leading = this.mark
|
|
426
|
-
? `<adia-mark-ui slot="leading" data-select-leading size="
|
|
426
|
+
? `<adia-mark-ui slot="leading" data-select-leading size="sm"></adia-mark-ui>`
|
|
427
427
|
: this.avatar
|
|
428
428
|
? `<img slot="leading" data-select-leading src="${escapeHTML(this.avatar)}" alt="" />`
|
|
429
429
|
: this.icon
|
|
@@ -447,7 +447,7 @@ export class UISelect extends UIFormElement {
|
|
|
447
447
|
${leading}
|
|
448
448
|
<span data-chips></span>
|
|
449
449
|
${displayMarkup}
|
|
450
|
-
<button-ui variant="ghost" size="
|
|
450
|
+
<button-ui variant="ghost" size="sm" icon="x" aria-label="Clear all" data-clear-all hidden></button-ui>
|
|
451
451
|
<icon-ui name="caret-down" slot="caret"></icon-ui>
|
|
452
452
|
</span>
|
|
453
453
|
${hintMarkup}
|
|
@@ -683,7 +683,7 @@ export class UISelect extends UIFormElement {
|
|
|
683
683
|
// (resolved against the selected option).
|
|
684
684
|
static #optionLeadHTML(opt) {
|
|
685
685
|
if (!opt) return '';
|
|
686
|
-
if (opt.mark) return `<adia-mark-ui size="
|
|
686
|
+
if (opt.mark) return `<adia-mark-ui data-select-mark size="sm"></adia-mark-ui>`;
|
|
687
687
|
if (opt.avatar) return `<img data-option-avatar src="${escapeHTML(opt.avatar)}" alt="" />`;
|
|
688
688
|
if (opt.icon) return `<icon-ui name="${escapeHTML(opt.icon)}"></icon-ui>`;
|
|
689
689
|
return '';
|
|
@@ -708,7 +708,7 @@ export class UISelect extends UIFormElement {
|
|
|
708
708
|
const icon = (sel && sel.icon) || this.icon || '';
|
|
709
709
|
const existing = trigger.querySelector(':scope > [data-select-leading]');
|
|
710
710
|
let html = '';
|
|
711
|
-
if (mark) html = `<adia-mark-ui slot="leading" data-select-leading size="
|
|
711
|
+
if (mark) html = `<adia-mark-ui slot="leading" data-select-leading size="sm"></adia-mark-ui>`;
|
|
712
712
|
else if (avatar) html = `<img slot="leading" data-select-leading src="${escapeHTML(avatar)}" alt="" />`;
|
|
713
713
|
else if (icon) html = `<icon-ui slot="leading" data-select-leading name="${escapeHTML(icon)}"></icon-ui>`;
|
|
714
714
|
if (!html) { existing?.remove(); return; }
|
|
@@ -225,7 +225,7 @@
|
|
|
225
225
|
/* Chip styling tracks the active variant via tag-ui's own tokens. */
|
|
226
226
|
--tag-size: var(--a-ui-tiny);
|
|
227
227
|
}
|
|
228
|
-
/* "+N more" overflow pill — a stamped <button-ui variant="ghost" size="
|
|
228
|
+
/* "+N more" overflow pill — a stamped <button-ui variant="ghost" size="sm">
|
|
229
229
|
(gh issue 276: no native <button> in stamped DOM); pill shape + chip-row
|
|
230
230
|
height via button token re-points, chrome stays button-ui's own. */
|
|
231
231
|
:scope[data-multi-chips] [data-chips] [data-more] {
|
|
@@ -236,7 +236,7 @@
|
|
|
236
236
|
flex-shrink: 0;
|
|
237
237
|
}
|
|
238
238
|
|
|
239
|
-
/* Clear-all `x` affordance — stamped <button-ui variant="ghost" size="
|
|
239
|
+
/* Clear-all `x` affordance — stamped <button-ui variant="ghost" size="sm"
|
|
240
240
|
icon="x"> (gh issue 276). Visible only when [clearable] AND chips. */
|
|
241
241
|
:scope[data-multi-chips] [data-clear-all] {
|
|
242
242
|
--button-radius: var(--a-radius-full);
|
|
@@ -426,7 +426,7 @@ select-ui [slot="listbox"] [data-select-all] {
|
|
|
426
426
|
border-bottom: 1px solid var(--md-sys-color-neutral-outline-variant);
|
|
427
427
|
margin-bottom: var(--a-space-1);
|
|
428
428
|
}
|
|
429
|
-
/* Select-all / Clear — stamped <button-ui variant="ghost" size="
|
|
429
|
+
/* Select-all / Clear — stamped <button-ui variant="ghost" size="sm">
|
|
430
430
|
(gh issue 276); link-colored via the button fg token, chrome is button-ui's. */
|
|
431
431
|
select-ui [slot="listbox"] [data-select-all-btn] {
|
|
432
432
|
--button-fg: var(--md-sys-color-primary);
|
|
@@ -495,3 +495,12 @@ select-ui [slot="listbox"] [data-empty] {
|
|
|
495
495
|
text-align: center;
|
|
496
496
|
font-size: var(--a-ui-xs);
|
|
497
497
|
}
|
|
498
|
+
|
|
499
|
+
/* Stamped leading marks (trigger + option rows) stay at the compact
|
|
500
|
+
1.25rem diameter the removed xs tier gave them — a select row is
|
|
501
|
+
denser than the mark's own sm (1.75rem). The extra [size] attr
|
|
502
|
+
out-specifies adia-mark's own :scope[size] variant rule. */
|
|
503
|
+
select-ui adia-mark-ui[data-select-leading][size],
|
|
504
|
+
select-ui adia-mark-ui[data-select-mark][size] {
|
|
505
|
+
--adia-mark-size: 1.25rem;
|
|
506
|
+
}
|
|
@@ -288,7 +288,7 @@
|
|
|
288
288
|
color: color-mix(in oklab, var(--a-chrome-dark, #111) 70%, transparent);
|
|
289
289
|
}
|
|
290
290
|
|
|
291
|
-
/* ═══════ Copy button — a stamped <button-ui variant="ghost" size="
|
|
291
|
+
/* ═══════ Copy button — a stamped <button-ui variant="ghost" size="sm">
|
|
292
292
|
(gh issue 276: no native <button> in stamped DOM). Geometry/colors
|
|
293
293
|
ride button token re-points; focus ring is button-ui's own. ═══════ */
|
|
294
294
|
:scope > [data-copy] {
|
|
@@ -47,14 +47,12 @@
|
|
|
47
47
|
"default": ""
|
|
48
48
|
},
|
|
49
49
|
"size": {
|
|
50
|
-
"description": "Sizing scale (
|
|
50
|
+
"description": "Sizing scale (sm / md / lg). For a denser or larger register, set [scale] on an ancestor.",
|
|
51
51
|
"type": "string",
|
|
52
52
|
"enum": [
|
|
53
|
-
"xs",
|
|
54
53
|
"sm",
|
|
55
54
|
"md",
|
|
56
|
-
"lg"
|
|
57
|
-
"xl"
|
|
55
|
+
"lg"
|
|
58
56
|
],
|
|
59
57
|
"default": ""
|
|
60
58
|
},
|
|
@@ -42,15 +42,13 @@ props:
|
|
|
42
42
|
type: string
|
|
43
43
|
default: ''
|
|
44
44
|
size:
|
|
45
|
-
description: Sizing scale (
|
|
45
|
+
description: Sizing scale (sm / md / lg). For a denser or larger register, set [scale] on an ancestor.
|
|
46
46
|
type: string
|
|
47
47
|
default: ''
|
|
48
48
|
enum:
|
|
49
|
-
- xs
|
|
50
49
|
- sm
|
|
51
50
|
- md
|
|
52
51
|
- lg
|
|
53
|
-
- xl
|
|
54
52
|
reflect: true
|
|
55
53
|
value:
|
|
56
54
|
description: Form value (submitted as 'on' when checked)
|
|
@@ -57,7 +57,7 @@ export class UITag extends UIElement {
|
|
|
57
57
|
static parts = {
|
|
58
58
|
// button-ui, not a native <button> (gh issue 276) — the icon slots in
|
|
59
59
|
// explicitly to keep its bold weight (the icon= prop stamps regular).
|
|
60
|
-
dismiss: '<button-ui slot="dismiss" variant="ghost" size="
|
|
60
|
+
dismiss: '<button-ui slot="dismiss" variant="ghost" size="sm" aria-label="Remove"><icon-ui slot="icon" name="x" weight="bold"></icon-ui></button-ui>',
|
|
61
61
|
};
|
|
62
62
|
|
|
63
63
|
static template = () => null;
|
package/components/tag/tag.css
CHANGED
|
@@ -249,7 +249,7 @@ tag-ui[removable]:not([disabled]):hover {
|
|
|
249
249
|
gap: var(--tag-gap-icon, 0.2em);
|
|
250
250
|
}
|
|
251
251
|
|
|
252
|
-
/* ── Dismiss button — a stamped <button-ui variant="ghost" size="
|
|
252
|
+
/* ── Dismiss button — a stamped <button-ui variant="ghost" size="sm">
|
|
253
253
|
(gh issue 276: no native <button> in stamped DOM); geometry + hover
|
|
254
254
|
ride button token re-points, chrome is button-ui's own. */
|
|
255
255
|
[slot="dismiss"] {
|
|
@@ -22,8 +22,18 @@
|
|
|
22
22
|
"const": "ThemeProvider"
|
|
23
23
|
},
|
|
24
24
|
"scale": {
|
|
25
|
-
"description": "
|
|
25
|
+
"description": "Sizing register for the subtree — one of the six [scale] tiers: ui-sm (dense product UI), ui-md (base), ui-lg (touch/presentation), content-sm (compact article), content-md (long-form), content-lg (hero/marketing). Adopts the scale layer on demand; the reflected attribute is the [scale=\"…\"] CSS hook. Deprecated aliases \"verse\" (→ ui-sm) and \"prose\" (→ content-md) still map onto the legacy [verse]/[prose] attributes; removed at v1.0.",
|
|
26
26
|
"type": "string",
|
|
27
|
+
"enum": [
|
|
28
|
+
"ui-sm",
|
|
29
|
+
"ui-md",
|
|
30
|
+
"ui-lg",
|
|
31
|
+
"content-sm",
|
|
32
|
+
"content-md",
|
|
33
|
+
"content-lg",
|
|
34
|
+
"verse",
|
|
35
|
+
"prose"
|
|
36
|
+
],
|
|
27
37
|
"default": ""
|
|
28
38
|
}
|
|
29
39
|
},
|
|
@@ -64,10 +64,11 @@ function provideFoundation() {
|
|
|
64
64
|
// the first time a provider needs one, deduped by sheet identity. Dynamic-imported
|
|
65
65
|
// (static paths, so bundlers can code-split) so the element stays lean — a provider
|
|
66
66
|
// that does no theming never pulls these in.
|
|
67
|
-
const TWIN_LOADED = { themes: false, verse: false, prose: false };
|
|
67
|
+
const TWIN_LOADED = { themes: false, verse: false, prose: false, scale: false };
|
|
68
68
|
function loadTwin(name) {
|
|
69
69
|
switch (name) {
|
|
70
70
|
case 'themes': return import('../../dist/themes.sheet.js');
|
|
71
|
+
case 'scale': return import('../../dist/scale.sheet.js');
|
|
71
72
|
case 'verse': return import('../../dist/verse.sheet.js');
|
|
72
73
|
case 'prose': return import('../../dist/prose.sheet.js');
|
|
73
74
|
default: return null;
|
|
@@ -96,10 +97,11 @@ export class UIThemeProvider extends UIElement {
|
|
|
96
97
|
// Named theme preset (ocean / forest / slate / …). Reflected, so the attribute
|
|
97
98
|
// — which IS the `[theme="…"]` CSS hook in themes.css — tracks the property.
|
|
98
99
|
theme: { type: String, reflect: true },
|
|
99
|
-
//
|
|
100
|
-
//
|
|
101
|
-
//
|
|
102
|
-
//
|
|
100
|
+
// Sizing register — one of the six [scale] tiers (ui-sm | ui-md | ui-lg |
|
|
101
|
+
// content-sm | content-md | content-lg). Reflected, so the attribute IS the
|
|
102
|
+
// `[scale="…"]` CSS hook in scale.css (the `theme` prop's mechanism).
|
|
103
|
+
// DEPRECATED aliases: "verse" (→ ui-sm) and "prose" (→ content-md) still
|
|
104
|
+
// map onto the legacy [verse]/[prose] attributes; removed at v1.0.
|
|
103
105
|
scale: { type: String, reflect: true },
|
|
104
106
|
};
|
|
105
107
|
static template = () => null;
|
|
@@ -128,7 +130,25 @@ export class UIThemeProvider extends UIElement {
|
|
|
128
130
|
const scale = this.scale;
|
|
129
131
|
this.toggleAttribute('verse', scale === 'verse');
|
|
130
132
|
this.toggleAttribute('prose', scale === 'prose');
|
|
131
|
-
if (scale === 'verse'
|
|
132
|
-
|
|
133
|
+
if (scale === 'verse' || scale === 'prose') {
|
|
134
|
+
// Legacy register aliases — the reflected scale="verse|prose" attribute
|
|
135
|
+
// matches no scale.css tier selector, so only the toggled [verse]/[prose]
|
|
136
|
+
// attribute has CSS effect. Removed at v1.0.
|
|
137
|
+
warnDeprecatedScaleAlias(scale);
|
|
138
|
+
ensureTwin(scale);
|
|
139
|
+
} else if (SCALE_TIERS.has(scale)) {
|
|
140
|
+
// Tier names match [scale="…"] in scale.css directly via reflection.
|
|
141
|
+
ensureTwin('scale');
|
|
142
|
+
}
|
|
133
143
|
}
|
|
134
144
|
}
|
|
145
|
+
|
|
146
|
+
const SCALE_TIERS = new Set(['ui-sm', 'ui-md', 'ui-lg', 'content-sm', 'content-md', 'content-lg']);
|
|
147
|
+
|
|
148
|
+
const warnedAliases = new Set();
|
|
149
|
+
function warnDeprecatedScaleAlias(alias) {
|
|
150
|
+
if (warnedAliases.has(alias)) return;
|
|
151
|
+
warnedAliases.add(alias);
|
|
152
|
+
const tier = alias === 'verse' ? 'ui-sm' : 'content-md';
|
|
153
|
+
console.warn(`[theme-provider] scale="${alias}" is deprecated — use scale="${tier}" (removed at v1.0).`);
|
|
154
|
+
}
|
|
@@ -40,6 +40,6 @@ import { UIElement } from '../../core/element.js';
|
|
|
40
40
|
export class UIThemeProvider extends UIElement {
|
|
41
41
|
/** Named theme preset for the wrapped subtree (default, ocean, forest, sunset, lavender, rose, slate, midnight). Adopts the themes layer on demand + matches the [theme="…"] hook. */
|
|
42
42
|
theme: string;
|
|
43
|
-
/**
|
|
44
|
-
scale:
|
|
43
|
+
/** Sizing register for the subtree — one of the six [scale] tiers: ui-sm (dense product UI), ui-md (base), ui-lg (touch/presentation), content-sm (compact article), content-md (long-form), content-lg (hero/marketing). Adopts the scale layer on demand; the reflected attribute is the [scale="…"] CSS hook. Deprecated aliases "verse" (→ ui-sm) and "prose" (→ content-md) still map onto the legacy [verse]/[prose] attributes; removed at v1.0. */
|
|
44
|
+
scale: 'ui-sm' | 'ui-md' | 'ui-lg' | 'content-sm' | 'content-md' | 'content-lg' | 'verse' | 'prose';
|
|
45
45
|
}
|
|
@@ -39,9 +39,18 @@ props:
|
|
|
39
39
|
default: ""
|
|
40
40
|
reflect: true
|
|
41
41
|
scale:
|
|
42
|
-
description: '
|
|
42
|
+
description: 'Sizing register for the subtree — one of the six [scale] tiers: ui-sm (dense product UI), ui-md (base), ui-lg (touch/presentation), content-sm (compact article), content-md (long-form), content-lg (hero/marketing). Adopts the scale layer on demand; the reflected attribute is the [scale="…"] CSS hook. Deprecated aliases "verse" (→ ui-sm) and "prose" (→ content-md) still map onto the legacy [verse]/[prose] attributes; removed at v1.0.'
|
|
43
43
|
type: string
|
|
44
44
|
default: ""
|
|
45
|
+
enum:
|
|
46
|
+
- ui-sm
|
|
47
|
+
- ui-md
|
|
48
|
+
- ui-lg
|
|
49
|
+
- content-sm
|
|
50
|
+
- content-md
|
|
51
|
+
- content-lg
|
|
52
|
+
- verse
|
|
53
|
+
- prose
|
|
45
54
|
reflect: true
|
|
46
55
|
events: {}
|
|
47
56
|
slots: {}
|
|
@@ -362,7 +362,7 @@ agent-reasoning-ui timeline-ui:not([orientation="horizontal"]),
|
|
|
362
362
|
|
|
363
363
|
/* ═══════ Toggle caret (outcomes) ═══════ */
|
|
364
364
|
|
|
365
|
-
/* A stamped <button-ui variant="ghost" size="
|
|
365
|
+
/* A stamped <button-ui variant="ghost" size="sm" icon="caret-*">
|
|
366
366
|
(gh issue 276: no native <button> in stamped DOM). Geometry/colors
|
|
367
367
|
ride button token re-points; focus ring + hover are button-ui's own. */
|
|
368
368
|
:scope > [data-timeline-toggle] {
|
|
@@ -81,14 +81,12 @@
|
|
|
81
81
|
"default": "auto"
|
|
82
82
|
},
|
|
83
83
|
"size": {
|
|
84
|
-
"description": "Sizing scale forwarded to the internal <button-ui>.",
|
|
84
|
+
"description": "Sizing scale (sm/md/lg) forwarded to the internal <button-ui>.",
|
|
85
85
|
"type": "string",
|
|
86
86
|
"enum": [
|
|
87
|
-
"xs",
|
|
88
87
|
"sm",
|
|
89
88
|
"md",
|
|
90
|
-
"lg"
|
|
91
|
-
"xl"
|
|
89
|
+
"lg"
|
|
92
90
|
],
|
|
93
91
|
"default": "md"
|
|
94
92
|
},
|
|
@@ -40,8 +40,8 @@ export class UIToggleScheme extends UIElement {
|
|
|
40
40
|
persist: boolean;
|
|
41
41
|
/** Initial scheme — "auto" follows prefers-color-scheme; "light" / "dark" force. */
|
|
42
42
|
scheme: 'auto' | 'light' | 'dark';
|
|
43
|
-
/** Sizing scale forwarded to the internal <button-ui>. */
|
|
44
|
-
size: '
|
|
43
|
+
/** Sizing scale (sm/md/lg) forwarded to the internal <button-ui>. */
|
|
44
|
+
size: 'sm' | 'md' | 'lg';
|
|
45
45
|
/** LocalStorage key prefix; default matches <theme-panel> for cross-element interop. */
|
|
46
46
|
storagePrefix: string;
|
|
47
47
|
/** CSS selector for the element receiving `color-scheme`. ":root" → <html>. */
|
|
@@ -69,15 +69,13 @@ props:
|
|
|
69
69
|
attribute: label-dark
|
|
70
70
|
reflect: true
|
|
71
71
|
size:
|
|
72
|
-
description: Sizing scale forwarded to the internal <button-ui>.
|
|
72
|
+
description: Sizing scale (sm/md/lg) forwarded to the internal <button-ui>.
|
|
73
73
|
type: string
|
|
74
74
|
default: md
|
|
75
75
|
enum:
|
|
76
|
-
- xs
|
|
77
76
|
- sm
|
|
78
77
|
- md
|
|
79
78
|
- lg
|
|
80
|
-
- xl
|
|
81
79
|
reflect: true
|
|
82
80
|
variant:
|
|
83
81
|
description: Visual style forwarded to the internal <button-ui>. Defaults to "ghost" (matches app practice).
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer context{[scale][scale=ui-sm]{--a-inset-sm:var(--a-space-2-5);--a-inset-md:var(--a-space-3);--a-inset-lg:var(--a-space-3-5);--a-inset:var(--a-inset-md);--a-gap-xs:calc(var(--a-space-2) * var(--a-gap-k));--a-gap-sm:calc(var(--a-space-2-5) * var(--a-gap-k));--a-gap-md:calc(var(--a-space-3) * var(--a-gap-k));--a-gap-lg:calc(var(--a-space-3-5) * var(--a-gap-k));--a-gap-xl:calc(var(--a-space-4) * var(--a-gap-k));--a-gap:var(--a-gap-md);--a-radius-min:.25rem;--a-radius-max:.75rem;--a-radius-xs:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));--a-radius-sm:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));--a-radius-md:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));--a-radius-lg:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));--a-radius:var(--a-radius-md);--a-size-sm:calc(var(--a-density) * 1.25rem);--a-size-md:calc(var(--a-density) * 1.5rem);--a-size-lg:calc(var(--a-density) * 1.75rem);--a-size:var(--a-size-md);--a-icon-size:16px;--a-caret-size:14px;--a-toggle-size:var(--a-space-5);--a-display-sm:18px;--a-display-md:23px;--a-display-lg:29px;--a-title-sm:16px;--a-title-md:19px;--a-title-lg:22px;--a-heading-sm:13px;--a-heading-md:14px;--a-heading-lg:15px;--a-section-sm:13px;--a-section-md:14px;--a-section-lg:16px;--a-subsection-sm:12px;--a-subsection-md:13px;--a-subsection-lg:14px;--a-body-sm:11px;--a-body-md:12px;--a-body-lg:13px;--a-deck-sm:14px;--a-deck-md:15px;--a-deck-lg:16px;--a-caption-sm:10px;--a-caption-md:11px;--a-caption-lg:12px;--a-kicker-sm:10px;--a-kicker-md:10px;--a-kicker-lg:11px;--a-label-sm:10px;--a-label-md:10px;--a-label-lg:11px;--a-metric-sm:19px;--a-metric-md:25px;--a-metric-lg:34px;--a-code-sm:11px;--a-code-md:12px;--a-code-lg:13px;--a-ui-px:var(--a-space-2);--a-ui-py:var(--a-space-1);--a-ui-sm:11px;--a-ui-md:12px;--a-ui-lg:13px}[scale][scale=ui-md]{--a-inset-sm:var(--a-space-3-5);--a-inset-md:var(--a-space-4);--a-inset-lg:var(--a-space-4-5);--a-inset:var(--a-inset-md);--a-gap-xs:calc(var(--a-space-2) * var(--a-gap-k));--a-gap-sm:calc(var(--a-space-2-5) * var(--a-gap-k));--a-gap-md:calc(var(--a-space-3) * var(--a-gap-k));--a-gap-lg:calc(var(--a-space-3-5) * var(--a-gap-k));--a-gap-xl:calc(var(--a-space-4) * var(--a-gap-k));--a-gap:var(--a-gap-md);--a-radius-min:.25rem;--a-radius-max:1.25rem;--a-radius-xs:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));--a-radius-sm:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));--a-radius-md:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));--a-radius-lg:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));--a-radius:var(--a-radius-md);--a-size-sm:calc(var(--a-density) * 1.5rem);--a-size-md:calc(var(--a-density) * 1.875rem);--a-size-lg:calc(var(--a-density) * 2.25rem);--a-size:var(--a-size-md);--a-icon-size:1rem;--a-caret-size:.875rem;--a-toggle-size:calc(var(--a-size-sm) - var(--a-space-1));--a-display-sm:clamp(22px, 20px + 1vw, 31px);--a-display-md:clamp(29px, 24px + 1.5vw, 39px);--a-display-lg:clamp(37px, 31px + 2vw, 52px);--a-title-sm:clamp(20px, 18px + .375vw, 28px);--a-title-md:clamp(24px, 20px + .5vw, 32px);--a-title-lg:clamp(28px, 24px + 1vw, 36px);--a-heading-sm:16px;--a-heading-md:17px;--a-heading-lg:18px;--a-section-sm:16px;--a-section-md:17px;--a-section-lg:19px;--a-subsection-sm:15px;--a-subsection-md:16px;--a-subsection-lg:17px;--a-body-sm:13px;--a-body-md:14px;--a-body-lg:15px;--a-deck-sm:17px;--a-deck-md:18px;--a-deck-lg:20px;--a-caption-sm:13px;--a-caption-md:14px;--a-caption-lg:15px;--a-kicker-sm:11px;--a-kicker-md:12px;--a-kicker-lg:13px;--a-label-sm:11px;--a-label-md:12px;--a-label-lg:13px;--a-metric-sm:clamp(24px, 22px + 1vw, 34px);--a-metric-md:clamp(32px, 28px + 1.5vw, 48px);--a-metric-lg:clamp(44px, 38px + 2vw, 64px);--a-code-sm:13px;--a-code-md:14px;--a-code-lg:15px;--a-ui-px:var(--a-space-2);--a-ui-py:var(--a-space-2);--a-ui-sm:12px;--a-ui-md:13px;--a-ui-lg:14px}[scale][scale=ui-lg]{--a-inset-sm:var(--a-space-4);--a-inset-md:var(--a-space-4-5);--a-inset-lg:var(--a-space-5);--a-inset:var(--a-inset-md);--a-gap-xs:calc(var(--a-space-2) * var(--a-gap-k));--a-gap-sm:calc(var(--a-space-2-5) * var(--a-gap-k));--a-gap-md:calc(var(--a-space-3) * var(--a-gap-k));--a-gap-lg:calc(var(--a-space-3-5) * var(--a-gap-k));--a-gap-xl:calc(var(--a-space-4) * var(--a-gap-k));--a-gap:var(--a-gap-md);--a-radius-min:.25rem;--a-radius-max:1.25rem;--a-radius-xs:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));--a-radius-sm:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));--a-radius-md:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));--a-radius-lg:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));--a-radius:var(--a-radius-md);--a-size-sm:calc(var(--a-density) * 1.75rem);--a-size-md:calc(var(--a-density) * 2.25rem);--a-size-lg:calc(var(--a-density) * 2.75rem);--a-size:var(--a-size-md);--a-icon-size:20px;--a-caret-size:16px;--a-toggle-size:var(--a-space-6);--a-display-sm:clamp(29px, 24px + 1.5vw, 39px);--a-display-md:clamp(37px, 31px + 2vw, 52px);--a-display-lg:clamp(44px, 38px + 2.5vw, 64px);--a-title-sm:clamp(24px, 20px + .5vw, 32px);--a-title-md:clamp(28px, 24px + 1vw, 36px);--a-title-lg:clamp(32px, 28px + 1.5vw, 44px);--a-heading-sm:17px;--a-heading-md:18px;--a-heading-lg:19px;--a-section-sm:17px;--a-section-md:19px;--a-section-lg:21px;--a-subsection-sm:16px;--a-subsection-md:17px;--a-subsection-lg:18px;--a-body-sm:14px;--a-body-md:15px;--a-body-lg:16px;--a-deck-sm:18px;--a-deck-md:20px;--a-deck-lg:22px;--a-caption-sm:14px;--a-caption-md:15px;--a-caption-lg:16px;--a-kicker-sm:12px;--a-kicker-md:13px;--a-kicker-lg:14px;--a-label-sm:12px;--a-label-md:13px;--a-label-lg:14px;--a-metric-sm:clamp(32px, 28px + 1.5vw, 48px);--a-metric-md:clamp(44px, 38px + 2vw, 64px);--a-metric-lg:clamp(52px, 44px + 2.5vw, 76px);--a-code-sm:14px;--a-code-md:15px;--a-code-lg:16px;--a-ui-px:var(--a-space-3);--a-ui-py:var(--a-space-2);--a-ui-sm:13px;--a-ui-md:14px;--a-ui-lg:16px}[scale][scale=content-sm]{--a-inset-sm:var(--a-space-6);--a-inset-md:var(--a-space-8);--a-inset-lg:var(--a-space-10);--a-inset:var(--a-inset-md);--a-gap-xs:calc(var(--a-space-3) * var(--a-gap-k));--a-gap-sm:calc(var(--a-space-4) * var(--a-gap-k));--a-gap-md:calc(var(--a-space-5) * var(--a-gap-k));--a-gap-lg:calc(var(--a-space-6) * var(--a-gap-k));--a-gap-xl:calc(var(--a-space-7) * var(--a-gap-k));--a-gap:var(--a-gap-md);--a-radius-min:.375rem;--a-radius-max:1.75rem;--a-radius-xs:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));--a-radius-sm:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));--a-radius-md:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));--a-radius-lg:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));--a-radius:var(--a-radius-md);--a-size-sm:calc(var(--a-density) * 1.5rem);--a-size-md:calc(var(--a-density) * 1.875rem);--a-size-lg:calc(var(--a-density) * 2.25rem);--a-size:var(--a-size-md);--a-display-sm:clamp(20px, 18px + 1vw, 30px);--a-display-md:clamp(24px, 20px + 1.5vw, 36px);--a-display-lg:clamp(32px, 24px + 3vw, 56px);--a-title-sm:clamp(16px, 15px + .5vw, 20px);--a-title-md:clamp(18px, 16px + .75vw, 24px);--a-title-lg:clamp(24px, 20px + 1.5vw, 36px);--a-heading-sm:14px;--a-heading-md:16px;--a-heading-lg:20px;--a-section-sm:13px;--a-section-md:14px;--a-section-lg:17px;--a-subsection-sm:12px;--a-subsection-md:13px;--a-subsection-lg:15px;--a-body-sm:13px;--a-body-md:14px;--a-body-lg:16px;--a-deck-sm:14px;--a-deck-md:15px;--a-deck-lg:18px;--a-caption-sm:13px;--a-caption-md:14px;--a-caption-lg:15px;--a-kicker-sm:13px;--a-kicker-md:14px;--a-kicker-lg:15px;--a-label-sm:11px;--a-label-md:12px;--a-label-lg:13px;--a-metric-sm:clamp(16px, 14px + 1vw, 26px);--a-metric-md:clamp(20px, 16px + 1.5vw, 32px);--a-metric-lg:clamp(28px, 24px + 2vw, 48px);--a-code-sm:13px;--a-code-md:14px;--a-code-lg:15px;--a-ui-px:var(--a-space-3);--a-ui-py:var(--a-space-2);--a-ui-sm:13px;--a-ui-md:14px;--a-ui-lg:15px;--prose-max-width-sm:55ch;--prose-max-width-md:65ch;--prose-max-width-lg:75ch;--prose-max-width:var(--prose-max-width-md)}[scale][scale=content-md]{--a-inset-sm:var(--a-space-8);--a-inset-md:var(--a-space-10);--a-inset-lg:var(--a-space-12);--a-inset:var(--a-inset-md);--a-gap-xs:calc(var(--a-space-3) * var(--a-gap-k));--a-gap-sm:calc(var(--a-space-4) * var(--a-gap-k));--a-gap-md:calc(var(--a-space-5) * var(--a-gap-k));--a-gap-lg:calc(var(--a-space-6) * var(--a-gap-k));--a-gap-xl:calc(var(--a-space-7) * var(--a-gap-k));--a-gap:var(--a-gap-md);--a-radius-min:.375rem;--a-radius-max:1.75rem;--a-radius-xs:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));--a-radius-sm:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));--a-radius-md:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));--a-radius-lg:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));--a-radius:var(--a-radius-md);--a-size-sm:calc(var(--a-density) * 1.75rem);--a-size-md:calc(var(--a-density) * 2.25rem);--a-size-lg:calc(var(--a-density) * 2.75rem);--a-size:var(--a-size-md);--a-display-sm:clamp(24px, 20px + 1.5vw, 36px);--a-display-md:clamp(32px, 24px + 3vw, 56px);--a-display-lg:clamp(40px, 32px + 4vw, 80px);--a-title-sm:clamp(18px, 16px + .75vw, 24px);--a-title-md:clamp(24px, 20px + 1.5vw, 36px);--a-title-lg:clamp(28px, 24px + 2vw, 48px);--a-heading-sm:16px;--a-heading-md:20px;--a-heading-lg:24px;--a-section-sm:14px;--a-section-md:17px;--a-section-lg:20px;--a-subsection-sm:13px;--a-subsection-md:15px;--a-subsection-lg:17px;--a-body-sm:14px;--a-body-md:16px;--a-body-lg:18px;--a-deck-sm:15px;--a-deck-md:18px;--a-deck-lg:20px;--a-caption-sm:14px;--a-caption-md:15px;--a-caption-lg:16px;--a-kicker-sm:14px;--a-kicker-md:15px;--a-kicker-lg:16px;--a-label-sm:12px;--a-label-md:13px;--a-label-lg:14px;--a-metric-sm:clamp(20px, 16px + 1.5vw, 32px);--a-metric-md:clamp(28px, 24px + 2vw, 48px);--a-metric-lg:clamp(40px, 32px + 4vw, 72px);--a-code-sm:14px;--a-code-md:15px;--a-code-lg:16px;--a-ui-px:var(--a-space-3);--a-ui-py:var(--a-space-2);--a-ui-sm:14px;--a-ui-md:15px;--a-ui-lg:16px;--prose-max-width-sm:55ch;--prose-max-width-md:65ch;--prose-max-width-lg:75ch;--prose-max-width:var(--prose-max-width-md)}[scale][scale=content-lg]{--a-inset-sm:var(--a-space-10);--a-inset-md:var(--a-space-12);--a-inset-lg:var(--a-space-16);--a-inset:var(--a-inset-md);--a-gap-xs:calc(var(--a-space-3) * var(--a-gap-k));--a-gap-sm:calc(var(--a-space-4) * var(--a-gap-k));--a-gap-md:calc(var(--a-space-5) * var(--a-gap-k));--a-gap-lg:calc(var(--a-space-6) * var(--a-gap-k));--a-gap-xl:calc(var(--a-space-7) * var(--a-gap-k));--a-gap:var(--a-gap-md);--a-radius-min:.375rem;--a-radius-max:1.75rem;--a-radius-xs:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));--a-radius-sm:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));--a-radius-md:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));--a-radius-lg:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));--a-radius:var(--a-radius-md);--a-size-sm:calc(var(--a-density) * 2.25rem);--a-size-md:calc(var(--a-density) * 2.75rem);--a-size-lg:calc(var(--a-density) * 3.25rem);--a-size:var(--a-size-md);--a-icon-size:20px;--a-caret-size:16px;--a-toggle-size:var(--a-space-6);--a-display-sm:clamp(32px, 24px + 3vw, 56px);--a-display-md:clamp(40px, 32px + 4vw, 80px);--a-display-lg:clamp(48px, 36px + 5vw, 96px);--a-title-sm:clamp(24px, 20px + 1.5vw, 36px);--a-title-md:clamp(28px, 24px + 2vw, 48px);--a-title-lg:clamp(34px, 28px + 2.5vw, 56px);--a-heading-sm:20px;--a-heading-md:24px;--a-heading-lg:28px;--a-section-sm:17px;--a-section-md:20px;--a-section-lg:24px;--a-subsection-sm:15px;--a-subsection-md:17px;--a-subsection-lg:19px;--a-body-sm:16px;--a-body-md:18px;--a-body-lg:20px;--a-deck-sm:18px;--a-deck-md:20px;--a-deck-lg:24px;--a-caption-sm:15px;--a-caption-md:16px;--a-caption-lg:17px;--a-kicker-sm:15px;--a-kicker-md:16px;--a-kicker-lg:17px;--a-label-sm:13px;--a-label-md:14px;--a-label-lg:15px;--a-metric-sm:clamp(28px, 24px + 2vw, 48px);--a-metric-md:clamp(40px, 32px + 4vw, 72px);--a-metric-lg:clamp(48px, 40px + 4.5vw, 88px);--a-code-sm:15px;--a-code-md:16px;--a-code-lg:17px;--a-ui-px:var(--a-space-4);--a-ui-py:var(--a-space-2);--a-ui-sm:15px;--a-ui-md:16px;--a-ui-lg:18px;--prose-max-width-sm:55ch;--prose-max-width-md:65ch;--prose-max-width-lg:75ch;--prose-max-width:var(--prose-max-width-md)}[scale][scale=ui-md]:not([size]){--a-display-size:var(--a-display-sm);--a-title-size:var(--a-title-sm);--a-heading-size:var(--a-heading-sm);--a-section-size:var(--a-section-sm);--a-subsection-size:var(--a-subsection-md);--a-body-size:var(--a-body-md);--a-deck-size:var(--a-deck-md);--a-caption-size:var(--a-caption-md);--a-kicker-size:var(--a-kicker-md);--a-label-size:var(--a-label-md);--a-metric-size:var(--a-metric-md);--a-code-size:var(--a-code-md);--a-ui-size:var(--a-ui-md)}[scale][scale=ui-sm]:not([size]),[scale][scale=ui-lg]:not([size]),[scale][scale=content-sm]:not([size]),[scale][scale=content-md]:not([size]),[scale][scale=content-lg]:not([size]){--a-display-size:var(--a-display-md);--a-title-size:var(--a-title-md);--a-heading-size:var(--a-heading-md);--a-section-size:var(--a-section-md);--a-subsection-size:var(--a-subsection-md);--a-body-size:var(--a-body-md);--a-deck-size:var(--a-deck-md);--a-caption-size:var(--a-caption-md);--a-kicker-size:var(--a-kicker-md);--a-label-size:var(--a-label-md);--a-metric-size:var(--a-metric-md);--a-code-size:var(--a-code-md);--a-ui-size:var(--a-ui-md)}[scale][scale=ui-sm][size=sm],[scale][scale=ui-sm] [size=sm]{--a-inset:var(--a-inset-sm);--a-gap:var(--a-gap-sm);--a-size:var(--a-size-sm);--a-radius:var(--a-radius-sm);--a-icon-size:14px;--a-caret-size:12px;--a-toggle-size:var(--a-space-4)}[scale][scale=ui-sm][size=lg],[scale][scale=ui-sm] [size=lg]{--a-inset:var(--a-inset-lg);--a-gap:var(--a-gap-lg);--a-size:var(--a-size-lg);--a-radius:var(--a-radius-lg);--a-icon-size:18px;--a-caret-size:16px;--a-toggle-size:var(--a-space-6)}[scale][scale=ui-md][size=sm],[scale][scale=ui-md] [size=sm]{--a-inset:var(--a-inset-sm);--a-gap:var(--a-gap-sm);--a-size:calc(var(--a-density) * 1.5rem);--a-radius:var(--a-radius-sm);--a-icon-size:.875rem;--a-caret-size:.75rem;--a-toggle-size:calc(var(--a-size-sm) - var(--a-space-2));--a-ui-px:var(--a-space-1-5)}[scale][scale=ui-md][size=lg],[scale][scale=ui-md] [size=lg]{--a-inset:var(--a-inset-lg);--a-gap:var(--a-gap-lg);--a-size:calc(var(--a-density) * 2.25rem);--a-radius:var(--a-radius-lg);--a-icon-size:1.25rem;--a-caret-size:1rem;--a-toggle-size:var(--a-size-sm);--a-ui-px:var(--a-space-3)}[scale][scale=ui-lg][size=sm],[scale][scale=ui-lg] [size=sm]{--a-inset:var(--a-inset-sm);--a-gap:var(--a-gap-sm);--a-size:var(--a-size-sm);--a-radius:var(--a-radius-sm);--a-icon-size:16px;--a-caret-size:14px;--a-toggle-size:var(--a-space-5)}[scale][scale=ui-lg][size=lg],[scale][scale=ui-lg] [size=lg]{--a-inset:var(--a-inset-lg);--a-gap:var(--a-gap-lg);--a-size:var(--a-size-lg);--a-radius:var(--a-radius-lg);--a-icon-size:24px;--a-caret-size:18px;--a-toggle-size:var(--a-space-7)}[scale][scale=content-sm][size=sm],[scale][scale=content-sm] [size=sm],[scale][scale=content-md][size=sm],[scale][scale=content-md] [size=sm]{--a-inset:var(--a-inset-sm);--a-gap:var(--a-gap-sm);--a-size:var(--a-size-sm);--a-radius:var(--a-radius-sm)}[scale][scale=content-sm][size=lg],[scale][scale=content-sm] [size=lg],[scale][scale=content-md][size=lg],[scale][scale=content-md] [size=lg]{--a-inset:var(--a-inset-lg);--a-gap:var(--a-gap-lg);--a-size:var(--a-size-lg);--a-radius:var(--a-radius-lg)}[scale][scale=content-lg][size=sm],[scale][scale=content-lg] [size=sm]{--a-inset:var(--a-inset-sm);--a-gap:var(--a-gap-sm);--a-size:var(--a-size-sm);--a-radius:var(--a-radius-sm);--a-icon-size:16px;--a-caret-size:14px;--a-toggle-size:var(--a-space-5)}[scale][scale=content-lg][size=lg],[scale][scale=content-lg] [size=lg]{--a-inset:var(--a-inset-lg);--a-gap:var(--a-gap-lg);--a-size:var(--a-size-lg);--a-radius:var(--a-radius-lg);--a-icon-size:24px;--a-caret-size:18px;--a-toggle-size:var(--a-space-7)}[scale][scale=ui-sm] avatar-ui{--avatar-size-sm:1.25rem;--avatar-size-md:1.75rem;--avatar-size-lg:2.5rem}[scale][scale=ui-sm] avatar-group-ui{--avatar-group-counter-size-sm:1.25rem;--avatar-group-counter-size-md:1.75rem;--avatar-group-counter-size-lg:2rem;--avatar-group-overlap-sm:-.3rem;--avatar-group-overlap-md:-.4rem;--avatar-group-overlap-lg:-.5rem}[scale][scale=ui-sm] adia-mark-ui{--adia-mark-size-sm:1.25rem;--adia-mark-size-md:1.75rem;--adia-mark-size-lg:2.5rem}[scale][scale=ui-sm] adia-wordmark-ui{--adia-wordmark-height-sm:.875rem;--adia-wordmark-height-md:1.125rem;--adia-wordmark-height-lg:1.5rem}[scale][scale=ui-lg] avatar-ui,[scale][scale=content-md] avatar-ui{--avatar-size-sm:2.5rem;--avatar-size-md:3.5rem;--avatar-size-lg:4.5rem}[scale][scale=ui-lg] avatar-group-ui,[scale][scale=content-md] avatar-group-ui{--avatar-group-counter-size-sm:2rem;--avatar-group-counter-size-md:3.5rem;--avatar-group-counter-size-lg:4.5rem;--avatar-group-overlap-sm:-.5rem;--avatar-group-overlap-md:-.625rem;--avatar-group-overlap-lg:-.75rem}[scale][scale=ui-lg] adia-mark-ui,[scale][scale=content-md] adia-mark-ui{--adia-mark-size-sm:2.5rem;--adia-mark-size-md:3.5rem;--adia-mark-size-lg:4.5rem}[scale][scale=ui-lg] adia-wordmark-ui,[scale][scale=content-md] adia-wordmark-ui{--adia-wordmark-height-sm:1.5rem;--adia-wordmark-height-md:2rem;--adia-wordmark-height-lg:2.75rem}[scale][scale=content-lg] avatar-ui{--avatar-size-sm:3.5rem;--avatar-size-md:4.5rem;--avatar-size-lg:5.5rem}[scale][scale=content-lg] avatar-group-ui{--avatar-group-counter-size-sm:3.5rem;--avatar-group-counter-size-md:4.5rem;--avatar-group-counter-size-lg:5.5rem;--avatar-group-overlap-sm:-.625rem;--avatar-group-overlap-md:-.75rem;--avatar-group-overlap-lg:-.875rem}[scale][scale=content-lg] adia-mark-ui{--adia-mark-size-sm:3.5rem;--adia-mark-size-md:4.5rem;--adia-mark-size-lg:5.5rem}[scale][scale=content-lg] adia-wordmark-ui{--adia-wordmark-height-sm:2rem;--adia-wordmark-height-md:2.75rem;--adia-wordmark-height-lg:3.5rem}[scale^=content-]>:is(p,ul,ol,blockquote,pre,table,dl){max-width:var(--prose-max-width)}[scale^=content-] :is(ul,ol){margin-block:.75em;padding-inline-start:1.75em}[scale^=content-] li+li{margin-block-start:.375em}[scale^=content-] blockquote{padding:var(--a-space-4) var(--a-space-6);font-size:var(--a-body-size);border-inline-start-width:4px}[scale^=content-] hr{margin-block:var(--a-space-6)}[scale^=content-] table{border:1px solid var(--a-border-subtle);border-radius:var(--a-radius-md);overflow:hidden}[scale^=content-] th{background:var(--a-bg-muted)}[scale^=content-] pre{padding:var(--a-space-5)}[scale^=content-] img{border-radius:var(--a-radius-lg)}}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
// Auto-generated by scripts/build/bundle-css.mjs — DO NOT EDIT.
|
|
2
|
+
// Constructable CSSStyleSheet form of scale.min.css (same build, byte-identical CSS).
|
|
3
|
+
// For <theme-provider> / runtime injection where a <link> in <head> isn't possible.
|
|
4
|
+
const css = "@layer context{[scale][scale=ui-sm]{--a-inset-sm:var(--a-space-2-5);--a-inset-md:var(--a-space-3);--a-inset-lg:var(--a-space-3-5);--a-inset:var(--a-inset-md);--a-gap-xs:calc(var(--a-space-2) * var(--a-gap-k));--a-gap-sm:calc(var(--a-space-2-5) * var(--a-gap-k));--a-gap-md:calc(var(--a-space-3) * var(--a-gap-k));--a-gap-lg:calc(var(--a-space-3-5) * var(--a-gap-k));--a-gap-xl:calc(var(--a-space-4) * var(--a-gap-k));--a-gap:var(--a-gap-md);--a-radius-min:.25rem;--a-radius-max:.75rem;--a-radius-xs:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));--a-radius-sm:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));--a-radius-md:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));--a-radius-lg:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));--a-radius:var(--a-radius-md);--a-size-sm:calc(var(--a-density) * 1.25rem);--a-size-md:calc(var(--a-density) * 1.5rem);--a-size-lg:calc(var(--a-density) * 1.75rem);--a-size:var(--a-size-md);--a-icon-size:16px;--a-caret-size:14px;--a-toggle-size:var(--a-space-5);--a-display-sm:18px;--a-display-md:23px;--a-display-lg:29px;--a-title-sm:16px;--a-title-md:19px;--a-title-lg:22px;--a-heading-sm:13px;--a-heading-md:14px;--a-heading-lg:15px;--a-section-sm:13px;--a-section-md:14px;--a-section-lg:16px;--a-subsection-sm:12px;--a-subsection-md:13px;--a-subsection-lg:14px;--a-body-sm:11px;--a-body-md:12px;--a-body-lg:13px;--a-deck-sm:14px;--a-deck-md:15px;--a-deck-lg:16px;--a-caption-sm:10px;--a-caption-md:11px;--a-caption-lg:12px;--a-kicker-sm:10px;--a-kicker-md:10px;--a-kicker-lg:11px;--a-label-sm:10px;--a-label-md:10px;--a-label-lg:11px;--a-metric-sm:19px;--a-metric-md:25px;--a-metric-lg:34px;--a-code-sm:11px;--a-code-md:12px;--a-code-lg:13px;--a-ui-px:var(--a-space-2);--a-ui-py:var(--a-space-1);--a-ui-sm:11px;--a-ui-md:12px;--a-ui-lg:13px}[scale][scale=ui-md]{--a-inset-sm:var(--a-space-3-5);--a-inset-md:var(--a-space-4);--a-inset-lg:var(--a-space-4-5);--a-inset:var(--a-inset-md);--a-gap-xs:calc(var(--a-space-2) * var(--a-gap-k));--a-gap-sm:calc(var(--a-space-2-5) * var(--a-gap-k));--a-gap-md:calc(var(--a-space-3) * var(--a-gap-k));--a-gap-lg:calc(var(--a-space-3-5) * var(--a-gap-k));--a-gap-xl:calc(var(--a-space-4) * var(--a-gap-k));--a-gap:var(--a-gap-md);--a-radius-min:.25rem;--a-radius-max:1.25rem;--a-radius-xs:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));--a-radius-sm:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));--a-radius-md:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));--a-radius-lg:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));--a-radius:var(--a-radius-md);--a-size-sm:calc(var(--a-density) * 1.5rem);--a-size-md:calc(var(--a-density) * 1.875rem);--a-size-lg:calc(var(--a-density) * 2.25rem);--a-size:var(--a-size-md);--a-icon-size:1rem;--a-caret-size:.875rem;--a-toggle-size:calc(var(--a-size-sm) - var(--a-space-1));--a-display-sm:clamp(22px, 20px + 1vw, 31px);--a-display-md:clamp(29px, 24px + 1.5vw, 39px);--a-display-lg:clamp(37px, 31px + 2vw, 52px);--a-title-sm:clamp(20px, 18px + .375vw, 28px);--a-title-md:clamp(24px, 20px + .5vw, 32px);--a-title-lg:clamp(28px, 24px + 1vw, 36px);--a-heading-sm:16px;--a-heading-md:17px;--a-heading-lg:18px;--a-section-sm:16px;--a-section-md:17px;--a-section-lg:19px;--a-subsection-sm:15px;--a-subsection-md:16px;--a-subsection-lg:17px;--a-body-sm:13px;--a-body-md:14px;--a-body-lg:15px;--a-deck-sm:17px;--a-deck-md:18px;--a-deck-lg:20px;--a-caption-sm:13px;--a-caption-md:14px;--a-caption-lg:15px;--a-kicker-sm:11px;--a-kicker-md:12px;--a-kicker-lg:13px;--a-label-sm:11px;--a-label-md:12px;--a-label-lg:13px;--a-metric-sm:clamp(24px, 22px + 1vw, 34px);--a-metric-md:clamp(32px, 28px + 1.5vw, 48px);--a-metric-lg:clamp(44px, 38px + 2vw, 64px);--a-code-sm:13px;--a-code-md:14px;--a-code-lg:15px;--a-ui-px:var(--a-space-2);--a-ui-py:var(--a-space-2);--a-ui-sm:12px;--a-ui-md:13px;--a-ui-lg:14px}[scale][scale=ui-lg]{--a-inset-sm:var(--a-space-4);--a-inset-md:var(--a-space-4-5);--a-inset-lg:var(--a-space-5);--a-inset:var(--a-inset-md);--a-gap-xs:calc(var(--a-space-2) * var(--a-gap-k));--a-gap-sm:calc(var(--a-space-2-5) * var(--a-gap-k));--a-gap-md:calc(var(--a-space-3) * var(--a-gap-k));--a-gap-lg:calc(var(--a-space-3-5) * var(--a-gap-k));--a-gap-xl:calc(var(--a-space-4) * var(--a-gap-k));--a-gap:var(--a-gap-md);--a-radius-min:.25rem;--a-radius-max:1.25rem;--a-radius-xs:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));--a-radius-sm:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));--a-radius-md:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));--a-radius-lg:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));--a-radius:var(--a-radius-md);--a-size-sm:calc(var(--a-density) * 1.75rem);--a-size-md:calc(var(--a-density) * 2.25rem);--a-size-lg:calc(var(--a-density) * 2.75rem);--a-size:var(--a-size-md);--a-icon-size:20px;--a-caret-size:16px;--a-toggle-size:var(--a-space-6);--a-display-sm:clamp(29px, 24px + 1.5vw, 39px);--a-display-md:clamp(37px, 31px + 2vw, 52px);--a-display-lg:clamp(44px, 38px + 2.5vw, 64px);--a-title-sm:clamp(24px, 20px + .5vw, 32px);--a-title-md:clamp(28px, 24px + 1vw, 36px);--a-title-lg:clamp(32px, 28px + 1.5vw, 44px);--a-heading-sm:17px;--a-heading-md:18px;--a-heading-lg:19px;--a-section-sm:17px;--a-section-md:19px;--a-section-lg:21px;--a-subsection-sm:16px;--a-subsection-md:17px;--a-subsection-lg:18px;--a-body-sm:14px;--a-body-md:15px;--a-body-lg:16px;--a-deck-sm:18px;--a-deck-md:20px;--a-deck-lg:22px;--a-caption-sm:14px;--a-caption-md:15px;--a-caption-lg:16px;--a-kicker-sm:12px;--a-kicker-md:13px;--a-kicker-lg:14px;--a-label-sm:12px;--a-label-md:13px;--a-label-lg:14px;--a-metric-sm:clamp(32px, 28px + 1.5vw, 48px);--a-metric-md:clamp(44px, 38px + 2vw, 64px);--a-metric-lg:clamp(52px, 44px + 2.5vw, 76px);--a-code-sm:14px;--a-code-md:15px;--a-code-lg:16px;--a-ui-px:var(--a-space-3);--a-ui-py:var(--a-space-2);--a-ui-sm:13px;--a-ui-md:14px;--a-ui-lg:16px}[scale][scale=content-sm]{--a-inset-sm:var(--a-space-6);--a-inset-md:var(--a-space-8);--a-inset-lg:var(--a-space-10);--a-inset:var(--a-inset-md);--a-gap-xs:calc(var(--a-space-3) * var(--a-gap-k));--a-gap-sm:calc(var(--a-space-4) * var(--a-gap-k));--a-gap-md:calc(var(--a-space-5) * var(--a-gap-k));--a-gap-lg:calc(var(--a-space-6) * var(--a-gap-k));--a-gap-xl:calc(var(--a-space-7) * var(--a-gap-k));--a-gap:var(--a-gap-md);--a-radius-min:.375rem;--a-radius-max:1.75rem;--a-radius-xs:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));--a-radius-sm:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));--a-radius-md:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));--a-radius-lg:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));--a-radius:var(--a-radius-md);--a-size-sm:calc(var(--a-density) * 1.5rem);--a-size-md:calc(var(--a-density) * 1.875rem);--a-size-lg:calc(var(--a-density) * 2.25rem);--a-size:var(--a-size-md);--a-display-sm:clamp(20px, 18px + 1vw, 30px);--a-display-md:clamp(24px, 20px + 1.5vw, 36px);--a-display-lg:clamp(32px, 24px + 3vw, 56px);--a-title-sm:clamp(16px, 15px + .5vw, 20px);--a-title-md:clamp(18px, 16px + .75vw, 24px);--a-title-lg:clamp(24px, 20px + 1.5vw, 36px);--a-heading-sm:14px;--a-heading-md:16px;--a-heading-lg:20px;--a-section-sm:13px;--a-section-md:14px;--a-section-lg:17px;--a-subsection-sm:12px;--a-subsection-md:13px;--a-subsection-lg:15px;--a-body-sm:13px;--a-body-md:14px;--a-body-lg:16px;--a-deck-sm:14px;--a-deck-md:15px;--a-deck-lg:18px;--a-caption-sm:13px;--a-caption-md:14px;--a-caption-lg:15px;--a-kicker-sm:13px;--a-kicker-md:14px;--a-kicker-lg:15px;--a-label-sm:11px;--a-label-md:12px;--a-label-lg:13px;--a-metric-sm:clamp(16px, 14px + 1vw, 26px);--a-metric-md:clamp(20px, 16px + 1.5vw, 32px);--a-metric-lg:clamp(28px, 24px + 2vw, 48px);--a-code-sm:13px;--a-code-md:14px;--a-code-lg:15px;--a-ui-px:var(--a-space-3);--a-ui-py:var(--a-space-2);--a-ui-sm:13px;--a-ui-md:14px;--a-ui-lg:15px;--prose-max-width-sm:55ch;--prose-max-width-md:65ch;--prose-max-width-lg:75ch;--prose-max-width:var(--prose-max-width-md)}[scale][scale=content-md]{--a-inset-sm:var(--a-space-8);--a-inset-md:var(--a-space-10);--a-inset-lg:var(--a-space-12);--a-inset:var(--a-inset-md);--a-gap-xs:calc(var(--a-space-3) * var(--a-gap-k));--a-gap-sm:calc(var(--a-space-4) * var(--a-gap-k));--a-gap-md:calc(var(--a-space-5) * var(--a-gap-k));--a-gap-lg:calc(var(--a-space-6) * var(--a-gap-k));--a-gap-xl:calc(var(--a-space-7) * var(--a-gap-k));--a-gap:var(--a-gap-md);--a-radius-min:.375rem;--a-radius-max:1.75rem;--a-radius-xs:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));--a-radius-sm:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));--a-radius-md:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));--a-radius-lg:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));--a-radius:var(--a-radius-md);--a-size-sm:calc(var(--a-density) * 1.75rem);--a-size-md:calc(var(--a-density) * 2.25rem);--a-size-lg:calc(var(--a-density) * 2.75rem);--a-size:var(--a-size-md);--a-display-sm:clamp(24px, 20px + 1.5vw, 36px);--a-display-md:clamp(32px, 24px + 3vw, 56px);--a-display-lg:clamp(40px, 32px + 4vw, 80px);--a-title-sm:clamp(18px, 16px + .75vw, 24px);--a-title-md:clamp(24px, 20px + 1.5vw, 36px);--a-title-lg:clamp(28px, 24px + 2vw, 48px);--a-heading-sm:16px;--a-heading-md:20px;--a-heading-lg:24px;--a-section-sm:14px;--a-section-md:17px;--a-section-lg:20px;--a-subsection-sm:13px;--a-subsection-md:15px;--a-subsection-lg:17px;--a-body-sm:14px;--a-body-md:16px;--a-body-lg:18px;--a-deck-sm:15px;--a-deck-md:18px;--a-deck-lg:20px;--a-caption-sm:14px;--a-caption-md:15px;--a-caption-lg:16px;--a-kicker-sm:14px;--a-kicker-md:15px;--a-kicker-lg:16px;--a-label-sm:12px;--a-label-md:13px;--a-label-lg:14px;--a-metric-sm:clamp(20px, 16px + 1.5vw, 32px);--a-metric-md:clamp(28px, 24px + 2vw, 48px);--a-metric-lg:clamp(40px, 32px + 4vw, 72px);--a-code-sm:14px;--a-code-md:15px;--a-code-lg:16px;--a-ui-px:var(--a-space-3);--a-ui-py:var(--a-space-2);--a-ui-sm:14px;--a-ui-md:15px;--a-ui-lg:16px;--prose-max-width-sm:55ch;--prose-max-width-md:65ch;--prose-max-width-lg:75ch;--prose-max-width:var(--prose-max-width-md)}[scale][scale=content-lg]{--a-inset-sm:var(--a-space-10);--a-inset-md:var(--a-space-12);--a-inset-lg:var(--a-space-16);--a-inset:var(--a-inset-md);--a-gap-xs:calc(var(--a-space-3) * var(--a-gap-k));--a-gap-sm:calc(var(--a-space-4) * var(--a-gap-k));--a-gap-md:calc(var(--a-space-5) * var(--a-gap-k));--a-gap-lg:calc(var(--a-space-6) * var(--a-gap-k));--a-gap-xl:calc(var(--a-space-7) * var(--a-gap-k));--a-gap:var(--a-gap-md);--a-radius-min:.375rem;--a-radius-max:1.75rem;--a-radius-xs:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-xs-k)), var(--a-radius-max));--a-radius-sm:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-sm-k)), var(--a-radius-max));--a-radius-md:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-md-k)), var(--a-radius-max));--a-radius-lg:clamp(var(--a-radius-min), calc(var(--a-radius-k) * var(--a-radius-max) * var(--a-radius-lg-k)), var(--a-radius-max));--a-radius:var(--a-radius-md);--a-size-sm:calc(var(--a-density) * 2.25rem);--a-size-md:calc(var(--a-density) * 2.75rem);--a-size-lg:calc(var(--a-density) * 3.25rem);--a-size:var(--a-size-md);--a-icon-size:20px;--a-caret-size:16px;--a-toggle-size:var(--a-space-6);--a-display-sm:clamp(32px, 24px + 3vw, 56px);--a-display-md:clamp(40px, 32px + 4vw, 80px);--a-display-lg:clamp(48px, 36px + 5vw, 96px);--a-title-sm:clamp(24px, 20px + 1.5vw, 36px);--a-title-md:clamp(28px, 24px + 2vw, 48px);--a-title-lg:clamp(34px, 28px + 2.5vw, 56px);--a-heading-sm:20px;--a-heading-md:24px;--a-heading-lg:28px;--a-section-sm:17px;--a-section-md:20px;--a-section-lg:24px;--a-subsection-sm:15px;--a-subsection-md:17px;--a-subsection-lg:19px;--a-body-sm:16px;--a-body-md:18px;--a-body-lg:20px;--a-deck-sm:18px;--a-deck-md:20px;--a-deck-lg:24px;--a-caption-sm:15px;--a-caption-md:16px;--a-caption-lg:17px;--a-kicker-sm:15px;--a-kicker-md:16px;--a-kicker-lg:17px;--a-label-sm:13px;--a-label-md:14px;--a-label-lg:15px;--a-metric-sm:clamp(28px, 24px + 2vw, 48px);--a-metric-md:clamp(40px, 32px + 4vw, 72px);--a-metric-lg:clamp(48px, 40px + 4.5vw, 88px);--a-code-sm:15px;--a-code-md:16px;--a-code-lg:17px;--a-ui-px:var(--a-space-4);--a-ui-py:var(--a-space-2);--a-ui-sm:15px;--a-ui-md:16px;--a-ui-lg:18px;--prose-max-width-sm:55ch;--prose-max-width-md:65ch;--prose-max-width-lg:75ch;--prose-max-width:var(--prose-max-width-md)}[scale][scale=ui-md]:not([size]){--a-display-size:var(--a-display-sm);--a-title-size:var(--a-title-sm);--a-heading-size:var(--a-heading-sm);--a-section-size:var(--a-section-sm);--a-subsection-size:var(--a-subsection-md);--a-body-size:var(--a-body-md);--a-deck-size:var(--a-deck-md);--a-caption-size:var(--a-caption-md);--a-kicker-size:var(--a-kicker-md);--a-label-size:var(--a-label-md);--a-metric-size:var(--a-metric-md);--a-code-size:var(--a-code-md);--a-ui-size:var(--a-ui-md)}[scale][scale=ui-sm]:not([size]),[scale][scale=ui-lg]:not([size]),[scale][scale=content-sm]:not([size]),[scale][scale=content-md]:not([size]),[scale][scale=content-lg]:not([size]){--a-display-size:var(--a-display-md);--a-title-size:var(--a-title-md);--a-heading-size:var(--a-heading-md);--a-section-size:var(--a-section-md);--a-subsection-size:var(--a-subsection-md);--a-body-size:var(--a-body-md);--a-deck-size:var(--a-deck-md);--a-caption-size:var(--a-caption-md);--a-kicker-size:var(--a-kicker-md);--a-label-size:var(--a-label-md);--a-metric-size:var(--a-metric-md);--a-code-size:var(--a-code-md);--a-ui-size:var(--a-ui-md)}[scale][scale=ui-sm][size=sm],[scale][scale=ui-sm] [size=sm]{--a-inset:var(--a-inset-sm);--a-gap:var(--a-gap-sm);--a-size:var(--a-size-sm);--a-radius:var(--a-radius-sm);--a-icon-size:14px;--a-caret-size:12px;--a-toggle-size:var(--a-space-4)}[scale][scale=ui-sm][size=lg],[scale][scale=ui-sm] [size=lg]{--a-inset:var(--a-inset-lg);--a-gap:var(--a-gap-lg);--a-size:var(--a-size-lg);--a-radius:var(--a-radius-lg);--a-icon-size:18px;--a-caret-size:16px;--a-toggle-size:var(--a-space-6)}[scale][scale=ui-md][size=sm],[scale][scale=ui-md] [size=sm]{--a-inset:var(--a-inset-sm);--a-gap:var(--a-gap-sm);--a-size:calc(var(--a-density) * 1.5rem);--a-radius:var(--a-radius-sm);--a-icon-size:.875rem;--a-caret-size:.75rem;--a-toggle-size:calc(var(--a-size-sm) - var(--a-space-2));--a-ui-px:var(--a-space-1-5)}[scale][scale=ui-md][size=lg],[scale][scale=ui-md] [size=lg]{--a-inset:var(--a-inset-lg);--a-gap:var(--a-gap-lg);--a-size:calc(var(--a-density) * 2.25rem);--a-radius:var(--a-radius-lg);--a-icon-size:1.25rem;--a-caret-size:1rem;--a-toggle-size:var(--a-size-sm);--a-ui-px:var(--a-space-3)}[scale][scale=ui-lg][size=sm],[scale][scale=ui-lg] [size=sm]{--a-inset:var(--a-inset-sm);--a-gap:var(--a-gap-sm);--a-size:var(--a-size-sm);--a-radius:var(--a-radius-sm);--a-icon-size:16px;--a-caret-size:14px;--a-toggle-size:var(--a-space-5)}[scale][scale=ui-lg][size=lg],[scale][scale=ui-lg] [size=lg]{--a-inset:var(--a-inset-lg);--a-gap:var(--a-gap-lg);--a-size:var(--a-size-lg);--a-radius:var(--a-radius-lg);--a-icon-size:24px;--a-caret-size:18px;--a-toggle-size:var(--a-space-7)}[scale][scale=content-sm][size=sm],[scale][scale=content-sm] [size=sm],[scale][scale=content-md][size=sm],[scale][scale=content-md] [size=sm]{--a-inset:var(--a-inset-sm);--a-gap:var(--a-gap-sm);--a-size:var(--a-size-sm);--a-radius:var(--a-radius-sm)}[scale][scale=content-sm][size=lg],[scale][scale=content-sm] [size=lg],[scale][scale=content-md][size=lg],[scale][scale=content-md] [size=lg]{--a-inset:var(--a-inset-lg);--a-gap:var(--a-gap-lg);--a-size:var(--a-size-lg);--a-radius:var(--a-radius-lg)}[scale][scale=content-lg][size=sm],[scale][scale=content-lg] [size=sm]{--a-inset:var(--a-inset-sm);--a-gap:var(--a-gap-sm);--a-size:var(--a-size-sm);--a-radius:var(--a-radius-sm);--a-icon-size:16px;--a-caret-size:14px;--a-toggle-size:var(--a-space-5)}[scale][scale=content-lg][size=lg],[scale][scale=content-lg] [size=lg]{--a-inset:var(--a-inset-lg);--a-gap:var(--a-gap-lg);--a-size:var(--a-size-lg);--a-radius:var(--a-radius-lg);--a-icon-size:24px;--a-caret-size:18px;--a-toggle-size:var(--a-space-7)}[scale][scale=ui-sm] avatar-ui{--avatar-size-sm:1.25rem;--avatar-size-md:1.75rem;--avatar-size-lg:2.5rem}[scale][scale=ui-sm] avatar-group-ui{--avatar-group-counter-size-sm:1.25rem;--avatar-group-counter-size-md:1.75rem;--avatar-group-counter-size-lg:2rem;--avatar-group-overlap-sm:-.3rem;--avatar-group-overlap-md:-.4rem;--avatar-group-overlap-lg:-.5rem}[scale][scale=ui-sm] adia-mark-ui{--adia-mark-size-sm:1.25rem;--adia-mark-size-md:1.75rem;--adia-mark-size-lg:2.5rem}[scale][scale=ui-sm] adia-wordmark-ui{--adia-wordmark-height-sm:.875rem;--adia-wordmark-height-md:1.125rem;--adia-wordmark-height-lg:1.5rem}[scale][scale=ui-lg] avatar-ui,[scale][scale=content-md] avatar-ui{--avatar-size-sm:2.5rem;--avatar-size-md:3.5rem;--avatar-size-lg:4.5rem}[scale][scale=ui-lg] avatar-group-ui,[scale][scale=content-md] avatar-group-ui{--avatar-group-counter-size-sm:2rem;--avatar-group-counter-size-md:3.5rem;--avatar-group-counter-size-lg:4.5rem;--avatar-group-overlap-sm:-.5rem;--avatar-group-overlap-md:-.625rem;--avatar-group-overlap-lg:-.75rem}[scale][scale=ui-lg] adia-mark-ui,[scale][scale=content-md] adia-mark-ui{--adia-mark-size-sm:2.5rem;--adia-mark-size-md:3.5rem;--adia-mark-size-lg:4.5rem}[scale][scale=ui-lg] adia-wordmark-ui,[scale][scale=content-md] adia-wordmark-ui{--adia-wordmark-height-sm:1.5rem;--adia-wordmark-height-md:2rem;--adia-wordmark-height-lg:2.75rem}[scale][scale=content-lg] avatar-ui{--avatar-size-sm:3.5rem;--avatar-size-md:4.5rem;--avatar-size-lg:5.5rem}[scale][scale=content-lg] avatar-group-ui{--avatar-group-counter-size-sm:3.5rem;--avatar-group-counter-size-md:4.5rem;--avatar-group-counter-size-lg:5.5rem;--avatar-group-overlap-sm:-.625rem;--avatar-group-overlap-md:-.75rem;--avatar-group-overlap-lg:-.875rem}[scale][scale=content-lg] adia-mark-ui{--adia-mark-size-sm:3.5rem;--adia-mark-size-md:4.5rem;--adia-mark-size-lg:5.5rem}[scale][scale=content-lg] adia-wordmark-ui{--adia-wordmark-height-sm:2rem;--adia-wordmark-height-md:2.75rem;--adia-wordmark-height-lg:3.5rem}[scale^=content-]>:is(p,ul,ol,blockquote,pre,table,dl){max-width:var(--prose-max-width)}[scale^=content-] :is(ul,ol){margin-block:.75em;padding-inline-start:1.75em}[scale^=content-] li+li{margin-block-start:.375em}[scale^=content-] blockquote{padding:var(--a-space-4) var(--a-space-6);font-size:var(--a-body-size);border-inline-start-width:4px}[scale^=content-] hr{margin-block:var(--a-space-6)}[scale^=content-] table{border:1px solid var(--a-border-subtle);border-radius:var(--a-radius-md);overflow:hidden}[scale^=content-] th{background:var(--a-bg-muted)}[scale^=content-] pre{padding:var(--a-space-5)}[scale^=content-] img{border-radius:var(--a-radius-lg)}}";
|
|
5
|
+
let _sheet = null;
|
|
6
|
+
export function constructSheet() {
|
|
7
|
+
if (typeof CSSStyleSheet === 'undefined') return null; // non-DOM (SSR/Node) — link the .min.css instead
|
|
8
|
+
if (!_sheet) { _sheet = new CSSStyleSheet(); _sheet.replaceSync(css); }
|
|
9
|
+
return _sheet;
|
|
10
|
+
}
|
|
11
|
+
export default constructSheet;
|