@tasteee/zest 0.3.0 → 0.4.0

package/README.md

@@ -76,22 +76,49 @@ attribute autocompletion for the `<z-*>` elements.
 
 ## Components
 
-Foundation `z-box` `z-text` `z-card` `z-line` `z-separator` ·
-Layout `z-stack` `z-grid` `z-cluster` `z-center` `z-container` `z-section`
-`z-surface` `z-scroll` `z-spacer` ·
-Actions `z-button` `z-button-group` `z-toggle` `z-toggle-group` `z-link` ·
-Forms `z-input` `z-textarea` `z-checkbox` `z-switch` `z-radio` `z-radio-group`
-`z-slider` `z-select` `z-combobox` `z-color-picker` `z-input-otp` ·
-Data display `z-badge` `z-avatar` `z-progress` `z-skeleton` `z-table`
-`z-pagination` `z-stat` ·
-Navigation `z-breadcrumbs` `z-tabs` `z-collapsible` `z-accordion` `z-menu`
-`z-nav-menu` `z-sidebar` ·
-Overlays `z-tooltip` `z-popover` `z-hover-card` `z-dialog` `z-alert-dialog`
-`z-alert` `z-sheet` `z-drawer` `z-context-menu` `z-toast` `z-command` ·
-Specialized `z-empty-state` `z-scroll-area` `z-code-block` `z-post-meta`
-`z-carousel` `z-chart`
-
-## Local development
+### Complete catalog
+
+The generated [`custom-elements.json`](./custom-elements.json) is the
+machine-readable source for editor tooling; the docs component manifest mirrors
+the same 138 elements.
+
+#### Foundations
+
+`z-box` `z-display` `z-eyebrow` `z-text` `z-heading` `z-subheading` `z-label` `z-inline` `z-card` `z-line` `z-separator`
+
+#### Layout
+
+`z-row` `z-column` `z-stack` `z-grid` `z-bento-grid` `z-bento-item` `z-cluster` `z-center` `z-container` `z-section` `z-surface` `z-scroll` `z-spacer` `z-chassis` `z-resizable-panels` `z-panel` `z-panel-handle` `z-editor-canvas` `z-canvas-item`
+
+#### Actions
+
+`z-button` `z-button-group` `z-toggle` `z-toggle-group` `z-toggle-group-item` `z-toolbar` `z-toolbar-group` `z-swap` `z-link`
+
+#### Forms
+
+`z-field` `z-input` `z-textarea` `z-checkbox` `z-switch` `z-radio` `z-radio-group` `z-slider` `z-range` `z-range-handle` `z-select` `z-combobox` `z-filter` `z-color-picker` `z-input-otp`
+
+#### Data Display
+
+`z-badge` `z-avatar` `z-avatar-stack` `z-progress` `z-skeleton` `z-table` `z-pagination` `z-stat` `z-relative-time` `z-status-dot` `z-kbd` `z-list` `z-list-row` `z-tree` `z-virtual-list`
+
+#### Navigation
+
+`z-breadcrumbs` `z-tabs` `z-collapsible` `z-accordion` `z-menu` `z-nav-menu` `z-sidebar` `z-dock` `z-dock-item`
+
+#### Overlays
+
+`z-tooltip` `z-popover` `z-hover-card` `z-dialog` `z-alert-dialog` `z-alert` `z-sheet` `z-drawer` `z-context-menu` `z-toast` `z-command`
+
+#### Specialized
+
+`z-callout` `z-empty-state` `z-scroll-area` `z-code-block` `z-markdown` `z-terminal` `z-post-meta` `z-carousel` `z-chart` `z-aura` `z-marquee` `z-progressive-blur` `z-pointer-follow` `z-draggable` `z-drop-target` `z-sortable` `z-dropzone` `z-piano-roll` `z-pattern-roll`
+
+#### Chat
+
+`z-chat-shell` `z-chat-header` `z-conversation-list` `z-conversation-item` `z-message-list` `z-message-group` `z-message-bubble` `z-message-actions` `z-reactions` `z-emoji-picker` `z-date-divider` `z-unread-divider` `z-system-message` `z-delivery-status` `z-read-receipt` `z-quoted-message` `z-file-attachment` `z-image-message` `z-attachment-chip` `z-attachment-tray` `z-typing-indicator` `z-composer` `z-send-button` `z-streaming-text` `z-thinking` `z-tool-call` `z-citation` `z-sources` `z-suggestion-chips` `z-model-picker`
+
+## Local development
 
 ```sh
 pnpm install

package/custom-elements.json

@@ -2242,7 +2242,7 @@
             },
             {
               "kind": "field",
-              "name": "doesLightUpOnHover",
+              "name": "isReactive",
               "type": {
                 "text": "boolean"
               }
@@ -2285,8 +2285,8 @@
               }
             },
             {
-              "name": "does-light-up-on-hover",
-              "fieldName": "doesLightUpOnHover",
+              "name": "is-reactive",
+              "fieldName": "isReactive",
               "type": {
                 "text": "boolean"
               }
@@ -3787,6 +3787,13 @@
                 "text": "string"
               }
             },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              }
+            },
             {
               "kind": "field",
               "name": "placeholder",
@@ -3845,6 +3852,13 @@
                 "text": "string"
               }
             },
+            {
+              "name": "label",
+              "fieldName": "label",
+              "type": {
+                "text": "string"
+              }
+            },
             {
               "name": "placeholder",
               "fieldName": "placeholder",
@@ -5860,6 +5874,86 @@
             }
           ]
         },
+        {
+          "kind": "class",
+          "customElement": true,
+          "tagName": "z-field",
+          "name": "ZField",
+          "members": [
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "description",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "error",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "isRequired",
+              "type": {
+                "text": "boolean"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "isLabelHidden",
+              "type": {
+                "text": "boolean"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "label",
+              "fieldName": "label",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "name": "description",
+              "fieldName": "description",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "name": "error",
+              "fieldName": "error",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "name": "is-required",
+              "fieldName": "isRequired",
+              "type": {
+                "text": "boolean"
+              }
+            },
+            {
+              "name": "is-label-hidden",
+              "fieldName": "isLabelHidden",
+              "type": {
+                "text": "boolean"
+              }
+            }
+          ]
+        },
         {
           "kind": "class",
           "customElement": true,
@@ -6643,6 +6737,13 @@
                 "text": "string"
               }
             },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              }
+            },
             {
               "kind": "field",
               "name": "type",
@@ -6764,6 +6865,13 @@
                 "text": "string"
               }
             },
+            {
+              "name": "label",
+              "fieldName": "label",
+              "type": {
+                "text": "string"
+              }
+            },
             {
               "name": "type",
               "fieldName": "type",
@@ -8656,6 +8764,13 @@
                 "text": "number"
               }
             },
+            {
+              "kind": "field",
+              "name": "toneMargin",
+              "type": {
+                "text": "number"
+              }
+            },
             {
               "kind": "field",
               "name": "chordSize",
@@ -8784,6 +8899,13 @@
                 "text": "number"
               }
             },
+            {
+              "name": "tone-margin",
+              "fieldName": "toneMargin",
+              "type": {
+                "text": "number"
+              }
+            },
             {
               "name": "chord-size",
               "fieldName": "chordSize",
@@ -10921,6 +11043,13 @@
                 "text": "string"
               }
             },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              }
+            },
             {
               "kind": "field",
               "name": "placeholder",
@@ -10993,6 +11122,13 @@
                 "text": "string"
               }
             },
+            {
+              "name": "label",
+              "fieldName": "label",
+              "type": {
+                "text": "string"
+              }
+            },
             {
               "name": "placeholder",
               "fieldName": "placeholder",
@@ -13709,6 +13845,13 @@
                 "text": "string"
               }
             },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              }
+            },
             {
               "kind": "field",
               "name": "placeholder",
@@ -13816,6 +13959,13 @@
                 "text": "string"
               }
             },
+            {
+              "name": "label",
+              "fieldName": "label",
+              "type": {
+                "text": "string"
+              }
+            },
             {
               "name": "placeholder",
               "fieldName": "placeholder",
@@ -15696,6 +15846,14 @@
             "module": "dist/zest.js"
           }
         },
+        {
+          "kind": "custom-element-definition",
+          "name": "z-field",
+          "declaration": {
+            "name": "ZField",
+            "module": "dist/zest.js"
+          }
+        },
         {
           "kind": "custom-element-definition",
           "name": "z-file-attachment",

package/dist/components/z-card.d.ts

@@ -16,7 +16,7 @@ export declare const ZCard: import("atomico/types/dom").Atomico<{
             type: BooleanConstructor;
             reflect: true;
         };
-        doesLightUpOnHover: {
+        isReactive: {
             type: BooleanConstructor;
             reflect: true;
         };

package/dist/components/z-chassis.d.ts

@@ -29,5 +29,5 @@ export declare const ZChassis: import("atomico/types/dom").Atomico<{
             reflect: true;
         };
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-code-block.d.ts

@@ -21,5 +21,5 @@ export declare const ZCodeBlock: import("atomico/types/dom").Atomico<{
         };
         copy: import("atomico/types/schema").EventProp<void>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-combobox.d.ts

@@ -4,6 +4,7 @@ export declare const ZCombobox: import("atomico/types/dom").Atomico<{
             type: StringConstructor;
             reflect: true;
         };
+        label: StringConstructor;
         placeholder: StringConstructor;
         options: {
             type: ArrayConstructor;
@@ -28,5 +29,5 @@ export declare const ZCombobox: import("atomico/types/dom").Atomico<{
             value: string;
         }>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-command.d.ts

@@ -15,5 +15,5 @@ export declare const ZCommand: import("atomico/types/dom").Atomico<{
         open: import("atomico/types/schema").EventProp<void>;
         close: import("atomico/types/schema").EventProp<void>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-composer.d.ts

@@ -31,5 +31,5 @@ export declare const ZComposer: import("atomico/types/dom").Atomico<{
             value: string;
         }>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-conversation-list.d.ts

@@ -5,5 +5,5 @@ export declare const ZConversationList: import("atomico/types/dom").Atomico<{
             reflect: true;
         };
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-emoji-picker.d.ts

@@ -7,5 +7,5 @@ export declare const ZEmojiPicker: import("atomico/types/dom").Atomico<{
             emoji: string;
         }>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-field.d.ts

@@ -0,0 +1,16 @@
+export declare const ZField: import("atomico/types/dom").Atomico<{
+    props: {
+        label: StringConstructor;
+        description: StringConstructor;
+        error: StringConstructor;
+        isRequired: {
+            type: BooleanConstructor;
+            reflect: true;
+        };
+        isLabelHidden: {
+            type: BooleanConstructor;
+            reflect: true;
+        };
+    };
+    styles: CSSStyleSheet;
+}>;

package/dist/components/z-input.d.ts

@@ -4,6 +4,7 @@ export declare const ZInput: import("atomico/types/dom").Atomico<{
             type: StringConstructor;
             reflect: true;
         };
+        label: StringConstructor;
         type: StringConstructor;
         placeholder: StringConstructor;
         name: StringConstructor;

package/dist/components/z-message-list.d.ts

@@ -16,5 +16,5 @@ export declare const ZMessageList: import("atomico/types/dom").Atomico<{
             isPinned: boolean;
         }>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-pattern-roll.d.ts

@@ -7,6 +7,10 @@ export declare const ZPatternRoll: import("atomico/types/dom").Atomico<{
             type: NumberConstructor;
             reflect: true;
         };
+        toneMargin: {
+            type: NumberConstructor;
+            reflect: true;
+        };
         chordSize: {
             type: NumberConstructor;
             reflect: true;
@@ -70,5 +74,5 @@ export declare const ZPatternRoll: import("atomico/types/dom").Atomico<{
             ids: number[];
         }>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-piano-roll.d.ts

@@ -78,5 +78,5 @@ export declare const ZPianoRoll: import("atomico/types/dom").Atomico<{
             ids: number[];
         }>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-scroll-area.d.ts

@@ -11,5 +11,5 @@ export declare const ZScrollArea: import("atomico/types/dom").Atomico<{
             reflect: true;
         };
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-select.d.ts

@@ -4,6 +4,7 @@ export declare const ZSelect: import("atomico/types/dom").Atomico<{
             type: StringConstructor;
             reflect: true;
         };
+        label: StringConstructor;
         placeholder: StringConstructor;
         options: {
             type: ArrayConstructor;
@@ -36,5 +37,5 @@ export declare const ZSelect: import("atomico/types/dom").Atomico<{
             value: string;
         }>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-sidebar.d.ts

@@ -27,5 +27,5 @@ export declare const ZSidebar: import("atomico/types/dom").Atomico<{
             value: string;
         }>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-table.d.ts

@@ -27,6 +27,6 @@ export declare const ZTable: import("atomico/types/dom").Atomico<{
             index: number;
         }>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;
 export {};

package/dist/components/z-terminal.d.ts

@@ -44,5 +44,5 @@ export declare const ZTerminal: import("atomico/types/dom").Atomico<{
         copy: import("atomico/types/schema").EventProp<string>;
         done: import("atomico/types/schema").EventProp<void>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-textarea.d.ts

@@ -4,6 +4,7 @@ export declare const ZTextarea: import("atomico/types/dom").Atomico<{
             type: StringConstructor;
             reflect: true;
         };
+        label: StringConstructor;
         placeholder: StringConstructor;
         name: StringConstructor;
         rows: NumberConstructor;
@@ -50,5 +51,5 @@ export declare const ZTextarea: import("atomico/types/dom").Atomico<{
             value: string;
         }>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-toolbar.d.ts

@@ -17,5 +17,5 @@ export declare const ZToolbar: import("atomico/types/dom").Atomico<{
             reflect: true;
         };
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/components/z-virtual-list.d.ts

@@ -34,5 +34,5 @@ export declare const ZVirtualList: import("atomico/types/dom").Atomico<{
             end: number;
         }>;
     };
-    styles: CSSStyleSheet;
+    styles: CSSStyleSheet[];
 }>;

package/dist/index.d.ts

@@ -37,6 +37,7 @@ export * from './components/z-toolbar';
 export * from './components/z-toolbar-group';
 export * from './components/z-swap';
 export * from './components/z-link';
+export * from './components/z-field';
 export * from './components/z-input';
 export * from './components/z-textarea';
 export * from './components/z-checkbox';

package/dist/ink.css

@@ -1 +1 @@
-@import"https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,100..1000&family=DM+Mono:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap";@property --aura-angle{syntax: "<angle>"; inherits: false; initial-value: 0deg;}:root{--base-accent-color-0: lch(62.44 70.29 .86 / 1);--base-accent-color-1: lab(60 40.17 -57.68);--base-success-color: lab(52.2 -46.61 31.61 / 1);--base-warning-color: lch(62.44 70.29 54.86 / 1);--base-danger-color: lch(59.5 75.52 35.8 / 1);--base-success-color: lch(62 58 145 / 1);--base-warning-color: lch(72 78 76 / 1);--base-danger-color: lch(58 72 37 / 1);--base-neutral-color-light: #fff;--base-neutral-color-dark: #0a0f0a;--base-sans-font-family: "DM Sans";--base-mono-font-family: "DM Mono";--base-spacing: .25rem;--base-radius: .625rem;--base-font-size: 16px;--font-size-0: calc(.579rem * var(--base-font-size) / 16);--font-size-1: calc(.694rem * var(--base-font-size) / 16);--font-size-2: calc(.833rem * var(--base-font-size) / 16);--font-size-3: calc(1rem * var(--base-font-size) / 16);--font-size-4: calc(1.25rem * var(--base-font-size) / 16);--font-size-5: calc(1.563rem * var(--base-font-size) / 16);--font-size-6: calc(1.953rem * var(--base-font-size) / 16);--font-size-7: calc(2.441rem * var(--base-font-size) / 16);--font-size-8: calc(3.052rem * var(--base-font-size) / 16);--color-primary-0: oklch(from var(--base-accent-color-0) .18 .1 h);--color-primary-1: oklch(from var(--base-accent-color-0) .28 .14 h);--color-primary-2: oklch(from var(--base-accent-color-0) .38 .18 h);--color-primary-3: oklch(from var(--base-accent-color-0) .52 .22 h);--color-primary-4: var(--base-accent-color-0);--color-primary-5: oklch(from var(--base-accent-color-0) .82 .21 h);--color-primary-6: oklch(from var(--base-accent-color-0) .87 .16 h);--color-primary-7: oklch(from var(--base-accent-color-0) .91 .11 h);--color-primary-8: oklch(from var(--base-accent-color-0) .94 .06 h);--color-primary-9: oklch(from var(--base-accent-color-0) .97 .02 h);--color-secondary-0: oklch(from var(--base-accent-color-1) .15 .1 h);--color-secondary-1: oklch(from var(--base-accent-color-1) .25 .14 h);--color-secondary-2: oklch(from var(--base-accent-color-1) .35 .18 h);--color-secondary-3: oklch(from var(--base-accent-color-1) .5 .22 h);--color-secondary-4: var(--base-accent-color-1);--color-secondary-5: oklch(from var(--base-accent-color-1) .78 .21 h);--color-secondary-6: oklch(from var(--base-accent-color-1) .84 .16 h);--color-secondary-7: oklch(from var(--base-accent-color-1) .89 .1 h);--color-secondary-8: oklch(from var(--base-accent-color-1) .93 .05 h);--color-secondary-9: oklch(from var(--base-accent-color-1) .97 .02 h);--color-neutral-0: oklch(from var(--base-neutral-color-dark) l c h);--color-neutral-1: oklch(from var(--base-neutral-color-dark) .21 c h);--color-neutral-2: oklch(from var(--base-neutral-color-dark) .25 c h);--color-neutral-3: oklch(from var(--base-neutral-color-dark) .31 c h);--color-neutral-4: oklch(from var(--base-neutral-color-dark) .4 c h);--color-neutral-5: oklch(from var(--base-neutral-color-dark) .55 c h);--color-neutral-6: oklch(from var(--base-neutral-color-dark) .68 c h);--color-neutral-7: oklch(from var(--base-neutral-color-dark) .8 c h);--color-neutral-8: oklch(from var(--base-neutral-color-dark) .9 c h);--color-neutral-9: oklch(from var(--base-neutral-color-light) l c h);--spacing-0: 0;--spacing-1: calc(var(--base-spacing) * 1);--spacing-2: calc(var(--base-spacing) * 2);--spacing-3: calc(var(--base-spacing) * 3);--spacing-4: calc(var(--base-spacing) * 4);--spacing-5: calc(var(--base-spacing) * 5);--spacing-6: calc(var(--base-spacing) * 6);--spacing-7: calc(var(--base-spacing) * 7);--spacing-8: calc(var(--base-spacing) * 8);--spacing-9: calc(var(--base-spacing) * 9);--spacing-10: calc(var(--base-spacing) * 10);--spacing-11: calc(var(--base-spacing) * 11);--spacing-12: calc(var(--base-spacing) * 12);--spacing-14: calc(var(--base-spacing) * 14);--spacing-16: calc(var(--base-spacing) * 16);--spacing-20: calc(var(--base-spacing) * 20);--spacing-24: calc(var(--base-spacing) * 24);--spacing-28: calc(var(--base-spacing) * 28);--spacing-32: calc(var(--base-spacing) * 32);--spacing-36: calc(var(--base-spacing) * 36);--spacing-40: calc(var(--base-spacing) * 40)}@supports (color: lab(0% 0 0)){:root{--base-neutral-color-dark: lab(3.87% -2.29438 1.63959)}}:root{--color-pink: var(--color-primary-4);--color-purple: var(--color-secondary-4);--bg: var(--color-neutral-0);--paper: var(--color-neutral-1);--paper-soft: var(--color-neutral-2);--line: var(--color-neutral-3);--primary: var(--color-neutral-8);--foreground: var(--color-neutral-8);--muted: var(--color-neutral-6);--secondary: var(--color-neutral-5);--accent: var(--color-purple);--accent-alt: var(--color-pink);--purple: var(--base-accent-color-1);--pink: var(--base-accent-color-0);--success: var(--base-success-color);--warning: var(--base-warning-color);--background: var(--bg);--background-light: var(--paper-soft);--card: var(--paper);--card-foreground: var(--primary);--popover: var(--paper);--popover-foreground: var(--primary);--primary-foreground: var(--bg);--secondary-foreground: var(--primary);--muted-foreground: var(--muted);--skeleton: var(--color-neutral-3);--accent-foreground: var(--primary);--destructive: var(--base-danger-color);--border: var(--line);--input: var(--line);--ring: var(--color-neutral-4);--chart-1: var(--color-purple);--chart-2: var(--color-pink);--chart-3: var(--color-neutral-7);--chart-4: var(--color-neutral-5);--chart-5: var(--color-neutral-4);--sidebar: var(--paper);--sidebar-foreground: var(--primary);--sidebar-primary: var(--accent);--sidebar-primary-foreground: var(--primary);--sidebar-accent: var(--paper-soft);--sidebar-accent-foreground: var(--primary);--sidebar-border: var(--line);--sidebar-ring: var(--ring);--page-gradient-from: var(--color-neutral-0);--page-gradient-via: var(--color-neutral-1);--page-gradient-to: var(--color-neutral-2);--page-gradient-min-height: 2000px;--page-gradient: none;--font-sans: var(--base-sans-font-family), "DM Sans Fallback", system-ui, sans-serif;--font-mono: var(--base-mono-font-family), "Geist Mono", "Fira Code", monospace;--radius: var(--base-radius);--radius-sm: calc(var(--radius) - 4px);--radius-md: calc(var(--radius) - 2px);--radius-lg: var(--radius);--radius-xl: calc(var(--radius) + 4px);--small-button-radius: 4px;--medium-button-radius: 5px;--large-button-radius: 6px;--color-background: var(--background);--color-background-light: var(--background-light);--color-foreground: var(--foreground);--color-card: var(--card);--color-card-foreground: var(--card-foreground);--color-popover: var(--popover);--color-popover-foreground: var(--popover-foreground);--color-primary: var(--primary);--color-primary-foreground: var(--primary-foreground);--color-secondary: var(--secondary);--color-secondary-foreground: var(--secondary-foreground);--color-muted: var(--muted);--color-muted-foreground: var(--muted-foreground);--color-skeleton: var(--skeleton);--color-accent: var(--accent);--color-accent-foreground: var(--accent-foreground);--color-destructive: var(--destructive);--color-success: var(--success);--color-border: var(--border);--color-input: var(--input);--color-ring: var(--ring);--color-chart-1: var(--chart-1);--color-chart-2: var(--chart-2);--color-chart-3: var(--chart-3);--color-chart-4: var(--chart-4);--color-chart-5: var(--chart-5);--color-neon-pink: var(--color-pink);--color-neon-purple: var(--color-purple);--color-sidebar: var(--sidebar);--color-sidebar-foreground: var(--sidebar-foreground);--color-sidebar-primary: var(--sidebar-primary);--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);--color-sidebar-accent: var(--sidebar-accent);--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);--color-sidebar-border: var(--sidebar-border);--color-sidebar-ring: var(--sidebar-ring)}:root{--neon-purple: var(--color-neon-purple);--neon-pink: var(--color-neon-pink);--space-xs: var(--spacing-1);--space-sm: var(--spacing-2);--space-md: var(--spacing-3);--space-base: var(--spacing-4);--space-lg: var(--spacing-6);--space-xl: var(--spacing-8);--space-2xl: var(--spacing-12);--space-3xl: var(--spacing-16);--font-size-display: 4.5rem;--font-size-h1: 3rem;--font-size-h2: 2.25rem;--font-size-h3: 1.5rem;--font-size-h4: 1.25rem;--font-size-body: 1rem;--font-size-small: .875rem;--font-size-caption: .75rem;--line-height-display: .9;--line-height-h1: 1;--line-height-h2: 1.1;--line-height-h3: 1.2;--line-height-h4: 1.3;--line-height-body: 1.6;--line-height-small: 1.5;--line-height-caption: 1.4;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--duration-fast: .14s;--easing-standard: ease-out}:root{--syntax-comment: var(--color-neutral-5);--syntax-keyword: var(--color-secondary-6);--syntax-string: oklch(.79 .13 152);--syntax-number: oklch(.82 .12 78);--syntax-constant: oklch(.76 .16 48);--syntax-function: var(--color-primary-6);--syntax-class: oklch(.83 .11 200);--syntax-property: oklch(.86 .07 222);--syntax-operator: var(--color-neutral-6);--syntax-punctuation: var(--color-neutral-6);--syntax-tag: var(--color-primary-6);--syntax-attr: oklch(.82 .12 78);--syntax-variable: var(--color-neutral-8);--syntax-regex: oklch(.79 .13 168);--syntax-plain: var(--color-neutral-8)}:root{--selection-background: var(--color-neutral-7);--selection-foreground: var(--color-neutral-1)}html,body{margin:0;font-family:var(--font-sans);background-color:var(--background);color:var(--foreground);user-select:text;-webkit-user-select:text}::selection{user-select:text;-webkit-user-select:text;color:var(--selection-foreground);background-color:var(--selection-background)}input,textarea,[contenteditable]:not([contenteditable=false]){user-select:text;-webkit-user-select:text}::selection{background:var(--selection-background);color:var(--selection-foreground)}::-moz-selection{background:var(--selection-background);color:var(--selection-foreground)}
+@import"https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,100..1000&family=DM+Mono:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap";@property --aura-angle{syntax: "<angle>"; inherits: false; initial-value: 0deg;}@supports not selector(::-webkit-scrollbar){html,body,*{scrollbar-color:var(--color-neutral-3) transparent;scrollbar-width:thin}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track,::-webkit-scrollbar-corner{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-neutral-3);border:2px solid transparent;border-radius:999px;background-clip:padding-box}::-webkit-scrollbar-thumb:hover{background:var(--color-neutral-4)}::-webkit-scrollbar-button{display:none;width:0;height:0}:root{--base-accent-color-0: lch(62.44 70.29 .86 / 1);--base-accent-color-1: lab(60 40.17 -57.68);--base-success-color: lab(52.2 -46.61 31.61 / 1);--base-warning-color: lch(62.44 70.29 54.86 / 1);--base-danger-color: lch(59.5 75.52 35.8 / 1);--base-success-color: lch(62 58 145 / 1);--base-warning-color: lch(72 78 76 / 1);--base-danger-color: lch(58 72 37 / 1);--base-neutral-color-light: #fff;--base-neutral-color-dark: #0a0f0a;--base-sans-font-family: "DM Sans";--base-mono-font-family: "DM Mono";--base-spacing: .25rem;--base-radius: .625rem;--base-font-size: 16px;--font-size-0: calc(.579rem * var(--base-font-size) / 16);--font-size-1: calc(.694rem * var(--base-font-size) / 16);--font-size-2: calc(.833rem * var(--base-font-size) / 16);--font-size-3: calc(1rem * var(--base-font-size) / 16);--font-size-4: calc(1.25rem * var(--base-font-size) / 16);--font-size-5: calc(1.563rem * var(--base-font-size) / 16);--font-size-6: calc(1.953rem * var(--base-font-size) / 16);--font-size-7: calc(2.441rem * var(--base-font-size) / 16);--font-size-8: calc(3.052rem * var(--base-font-size) / 16);--color-primary-0: oklch(from var(--base-accent-color-0) .18 .1 h);--color-primary-1: oklch(from var(--base-accent-color-0) .28 .14 h);--color-primary-2: oklch(from var(--base-accent-color-0) .38 .18 h);--color-primary-3: oklch(from var(--base-accent-color-0) .52 .22 h);--color-primary-4: var(--base-accent-color-0);--color-primary-5: oklch(from var(--base-accent-color-0) .82 .21 h);--color-primary-6: oklch(from var(--base-accent-color-0) .87 .16 h);--color-primary-7: oklch(from var(--base-accent-color-0) .91 .11 h);--color-primary-8: oklch(from var(--base-accent-color-0) .94 .06 h);--color-primary-9: oklch(from var(--base-accent-color-0) .97 .02 h);--color-secondary-0: oklch(from var(--base-accent-color-1) .15 .1 h);--color-secondary-1: oklch(from var(--base-accent-color-1) .25 .14 h);--color-secondary-2: oklch(from var(--base-accent-color-1) .35 .18 h);--color-secondary-3: oklch(from var(--base-accent-color-1) .5 .22 h);--color-secondary-4: var(--base-accent-color-1);--color-secondary-5: oklch(from var(--base-accent-color-1) .78 .21 h);--color-secondary-6: oklch(from var(--base-accent-color-1) .84 .16 h);--color-secondary-7: oklch(from var(--base-accent-color-1) .89 .1 h);--color-secondary-8: oklch(from var(--base-accent-color-1) .93 .05 h);--color-secondary-9: oklch(from var(--base-accent-color-1) .97 .02 h);--color-neutral-0: oklch(from var(--base-neutral-color-dark) l c h);--color-neutral-1: oklch(from var(--base-neutral-color-dark) .21 c h);--color-neutral-2: oklch(from var(--base-neutral-color-dark) .25 c h);--color-neutral-3: oklch(from var(--base-neutral-color-dark) .31 c h);--color-neutral-4: oklch(from var(--base-neutral-color-dark) .4 c h);--color-neutral-5: oklch(from var(--base-neutral-color-dark) .55 c h);--color-neutral-6: oklch(from var(--base-neutral-color-dark) .68 c h);--color-neutral-7: oklch(from var(--base-neutral-color-dark) .8 c h);--color-neutral-8: oklch(from var(--base-neutral-color-dark) .9 c h);--color-neutral-9: oklch(from var(--base-neutral-color-light) l c h);--spacing-0: 0;--spacing-1: calc(var(--base-spacing) * 1);--spacing-2: calc(var(--base-spacing) * 2);--spacing-3: calc(var(--base-spacing) * 3);--spacing-4: calc(var(--base-spacing) * 4);--spacing-5: calc(var(--base-spacing) * 5);--spacing-6: calc(var(--base-spacing) * 6);--spacing-7: calc(var(--base-spacing) * 7);--spacing-8: calc(var(--base-spacing) * 8);--spacing-9: calc(var(--base-spacing) * 9);--spacing-10: calc(var(--base-spacing) * 10);--spacing-11: calc(var(--base-spacing) * 11);--spacing-12: calc(var(--base-spacing) * 12);--spacing-14: calc(var(--base-spacing) * 14);--spacing-16: calc(var(--base-spacing) * 16);--spacing-20: calc(var(--base-spacing) * 20);--spacing-24: calc(var(--base-spacing) * 24);--spacing-28: calc(var(--base-spacing) * 28);--spacing-32: calc(var(--base-spacing) * 32);--spacing-36: calc(var(--base-spacing) * 36);--spacing-40: calc(var(--base-spacing) * 40)}@supports (color: lab(0% 0 0)){:root{--base-neutral-color-dark: lab(3.87% -2.29438 1.63959)}}:root{--color-pink: var(--color-primary-4);--color-purple: var(--color-secondary-4);--bg: var(--color-neutral-0);--paper: var(--color-neutral-1);--paper-soft: var(--color-neutral-2);--line: var(--color-neutral-3);--primary: var(--color-neutral-8);--foreground: var(--color-neutral-8);--muted: var(--color-neutral-6);--secondary: var(--color-neutral-5);--accent: var(--color-purple);--accent-alt: var(--color-pink);--purple: var(--base-accent-color-1);--pink: var(--base-accent-color-0);--success: var(--base-success-color);--warning: var(--base-warning-color);--background: var(--bg);--background-light: var(--paper-soft);--card: var(--paper);--card-foreground: var(--primary);--popover: var(--paper);--popover-foreground: var(--primary);--primary-foreground: var(--bg);--secondary-foreground: var(--primary);--muted-foreground: var(--muted);--skeleton: var(--color-neutral-3);--accent-foreground: var(--primary);--destructive: var(--base-danger-color);--border: var(--line);--input: var(--line);--ring: var(--color-neutral-4);--chart-1: var(--color-purple);--chart-2: var(--color-pink);--chart-3: var(--color-neutral-7);--chart-4: var(--color-neutral-5);--chart-5: var(--color-neutral-4);--sidebar: var(--paper);--sidebar-foreground: var(--primary);--sidebar-primary: var(--accent);--sidebar-primary-foreground: var(--primary);--sidebar-accent: var(--paper-soft);--sidebar-accent-foreground: var(--primary);--sidebar-border: var(--line);--sidebar-ring: var(--ring);--page-gradient-from: var(--color-neutral-0);--page-gradient-via: var(--color-neutral-1);--page-gradient-to: var(--color-neutral-2);--page-gradient-min-height: 2000px;--page-gradient: none;--font-sans: var(--base-sans-font-family), "DM Sans Fallback", system-ui, sans-serif;--font-mono: var(--base-mono-font-family), "Geist Mono", "Fira Code", monospace;--radius: var(--base-radius);--radius-sm: calc(var(--radius) - 4px);--radius-md: calc(var(--radius) - 2px);--radius-lg: var(--radius);--radius-xl: calc(var(--radius) + 4px);--small-button-radius: 4px;--medium-button-radius: 5px;--large-button-radius: 6px;--color-background: var(--background);--color-background-light: var(--background-light);--color-foreground: var(--foreground);--color-card: var(--card);--color-card-foreground: var(--card-foreground);--color-popover: var(--popover);--color-popover-foreground: var(--popover-foreground);--color-primary: var(--primary);--color-primary-foreground: var(--primary-foreground);--color-secondary: var(--secondary);--color-secondary-foreground: var(--secondary-foreground);--color-muted: var(--muted);--color-muted-foreground: var(--muted-foreground);--color-skeleton: var(--skeleton);--color-accent: var(--accent);--color-accent-foreground: var(--accent-foreground);--color-destructive: var(--destructive);--color-success: var(--success);--color-border: var(--border);--color-input: var(--input);--color-ring: var(--ring);--color-chart-1: var(--chart-1);--color-chart-2: var(--chart-2);--color-chart-3: var(--chart-3);--color-chart-4: var(--chart-4);--color-chart-5: var(--chart-5);--color-neon-pink: var(--color-pink);--color-neon-purple: var(--color-purple);--color-sidebar: var(--sidebar);--color-sidebar-foreground: var(--sidebar-foreground);--color-sidebar-primary: var(--sidebar-primary);--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);--color-sidebar-accent: var(--sidebar-accent);--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);--color-sidebar-border: var(--sidebar-border);--color-sidebar-ring: var(--sidebar-ring)}:root{--neon-purple: var(--color-neon-purple);--neon-pink: var(--color-neon-pink);--space-xs: var(--spacing-1);--space-sm: var(--spacing-2);--space-md: var(--spacing-3);--space-base: var(--spacing-4);--space-lg: var(--spacing-6);--space-xl: var(--spacing-8);--space-2xl: var(--spacing-12);--space-3xl: var(--spacing-16);--font-size-display: 4.5rem;--font-size-h1: 3rem;--font-size-h2: 2.25rem;--font-size-h3: 1.5rem;--font-size-h4: 1.25rem;--font-size-body: 1rem;--font-size-small: .875rem;--font-size-caption: .75rem;--line-height-display: .9;--line-height-h1: 1;--line-height-h2: 1.1;--line-height-h3: 1.2;--line-height-h4: 1.3;--line-height-body: 1.6;--line-height-small: 1.5;--line-height-caption: 1.4;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--duration-fast: .14s;--easing-standard: ease-out}:root{--syntax-comment: var(--color-neutral-5);--syntax-keyword: var(--color-secondary-6);--syntax-string: oklch(.79 .13 152);--syntax-number: oklch(.82 .12 78);--syntax-constant: oklch(.76 .16 48);--syntax-function: var(--color-primary-6);--syntax-class: oklch(.83 .11 200);--syntax-property: oklch(.86 .07 222);--syntax-operator: var(--color-neutral-6);--syntax-punctuation: var(--color-neutral-6);--syntax-tag: var(--color-primary-6);--syntax-attr: oklch(.82 .12 78);--syntax-variable: var(--color-neutral-8);--syntax-regex: oklch(.79 .13 168);--syntax-plain: var(--color-neutral-8)}:root{--selection-background: var(--color-neutral-7);--selection-foreground: var(--color-neutral-1)}html,body{margin:0;font-family:var(--font-sans);background-color:var(--background);color:var(--foreground);user-select:text;-webkit-user-select:text}::selection{user-select:text;-webkit-user-select:text;color:var(--selection-foreground);background-color:var(--selection-background)}input,textarea,[contenteditable]:not([contenteditable=false]){user-select:text;-webkit-user-select:text}::selection{background:var(--selection-background);color:var(--selection-foreground)}::-moz-selection{background:var(--selection-background);color:var(--selection-foreground)}

package/dist/shared/scrollbar-styles.d.ts

@@ -0,0 +1,7 @@
+/**
+ * The single scrollbar treatment for every scroll surface inside a Zest shadow
+ * root. Document-level rules in ink.css cover application chrome; this sheet
+ * covers internal component surfaces, where document CSS cannot cross the
+ * shadow boundary.
+ */
+export declare const themedScrollbarStyles: CSSStyleSheet;