@andespindola/ui-core 0.1.0 → 0.2.0

package/dist/esm/ui-button.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host } from './index-DYwlrXg_.js';
 
-const uiButtonCss = () => `:host{display:inline-block}.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;white-space:nowrap;border:1px solid transparent;border-radius:var(--ui-radius-full);font-family:var(--ui-font-sans);font-weight:500;cursor:pointer;outline:none;transition:all var(--ui-duration) var(--ui-ease)}.btn:active{transform:scale(0.98)}.btn:focus-visible{box-shadow:0 0 0 2px var(--ui-background), 0 0 0 4px var(--ui-ring)}.btn:disabled{pointer-events:none;opacity:0.5}.size-sm{height:2.25rem;padding:0 1rem;font-size:0.75rem}.size-md{height:2.75rem;padding:0 1.25rem;font-size:0.875rem}.size-lg{height:3rem;padding:0 1.5rem;font-size:1rem}.size-icon{height:2.5rem;width:2.5rem;padding:0}.variant-solid{background:var(--ui-accent);color:var(--ui-accent-contrast);box-shadow:var(--ui-shadow)}.variant-solid:hover{filter:brightness(1.1)}.variant-default{background:var(--ui-panel-strong);color:var(--ui-foreground);border-color:var(--ui-border);backdrop-filter:blur(22px)}.variant-default:hover{border-color:var(--ui-border-strong)}.variant-subtle{background:var(--ui-chip);color:var(--ui-foreground);border-color:var(--ui-border);backdrop-filter:blur(22px)}.variant-subtle:hover{background:var(--ui-panel)}.variant-outline{color:var(--ui-foreground);border-color:var(--ui-border-strong)}.variant-outline:hover{background:var(--ui-chip)}.variant-ghost{color:var(--ui-text-soft)}.variant-ghost:hover{background:var(--ui-chip)}.variant-destructive{background:var(--ui-danger);color:var(--ui-on-status)}.variant-destructive:hover{filter:brightness(1.1)}.variant-link{color:var(--ui-accent);text-underline-offset:4px}.variant-link:hover{text-decoration:underline}.spinner{width:1rem;height:1rem;border-radius:9999px;border:2px solid currentColor;border-top-color:transparent;animation:ui-button-spin 0.7s linear infinite}@keyframes ui-button-spin{to{transform:rotate(360deg)}}`;
+const uiButtonCss = () => `:host{display:inline-block}:host([full]){display:block;width:100%}:host([full]) .btn{width:100%}.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;white-space:nowrap;border:1px solid transparent;border-radius:var(--ui-radius-full);font-family:var(--ui-font-sans);font-weight:500;cursor:pointer;outline:none;transition:all var(--ui-duration) var(--ui-ease)}.btn:active{transform:scale(0.98)}.btn:focus-visible{box-shadow:0 0 0 2px var(--ui-background), 0 0 0 4px var(--ui-ring)}.btn:disabled{pointer-events:none;opacity:0.5}.size-sm{height:2.25rem;padding:0 1rem;font-size:0.75rem}.size-md{height:2.75rem;padding:0 1.25rem;font-size:0.875rem}.size-lg{height:3rem;padding:0 1.5rem;font-size:1rem}.size-icon{height:2.5rem;width:2.5rem;padding:0}.variant-solid{background:var(--ui-accent);color:var(--ui-accent-contrast);box-shadow:var(--ui-shadow)}.variant-solid:hover{filter:brightness(1.1)}.variant-default{background:var(--ui-panel-strong);color:var(--ui-foreground);border-color:var(--ui-border);backdrop-filter:blur(22px)}.variant-default:hover{border-color:var(--ui-border-strong)}.variant-subtle{background:var(--ui-chip);color:var(--ui-foreground);border-color:var(--ui-border);backdrop-filter:blur(22px)}.variant-subtle:hover{background:var(--ui-panel)}.variant-outline{color:var(--ui-foreground);border-color:color-mix(in srgb, var(--ui-foreground) 30%, transparent)}.variant-outline:hover{background:var(--ui-chip);border-color:color-mix(in srgb, var(--ui-foreground) 45%, transparent)}.variant-ghost{color:var(--ui-text-soft)}.variant-ghost:hover{background:var(--ui-chip)}.variant-destructive{background:var(--ui-danger);color:var(--ui-on-status)}.variant-destructive:hover{filter:brightness(1.1)}.variant-link{color:var(--ui-accent);text-underline-offset:4px}.variant-link:hover{text-decoration:underline}.spinner{width:1rem;height:1rem;border-radius:9999px;border:2px solid currentColor;border-top-color:transparent;animation:ui-button-spin 0.7s linear infinite}@keyframes ui-button-spin{to{transform:rotate(360deg)}}`;
 
 const UiButton = class {
     constructor(hostRef) {
@@ -15,13 +15,15 @@ const UiButton = class {
         this.loading = false;
         /** Tipo do botão nativo. */
         this.type = "button";
+        /** Ocupa 100% da largura disponível. */
+        this.full = false;
     }
     render() {
-        return (h(Host, { key: 'bf18a1f72babada2698ce42f54bf2d73b0d41d0b' }, h("button", { key: 'f08a766e14d139d7031dac4fa5846fbc0749328f', class: {
+        return (h(Host, { key: 'fa9886a20cac8424b127be543c0fd1ad04cc2fb1' }, h("button", { key: 'c54077dabce85b286733efcae8a08a435b81d72e', class: {
                 btn: true,
                 [`variant-${this.variant}`]: true,
                 [`size-${this.size}`]: true,
-            }, type: this.type, disabled: this.disabled || this.loading, "aria-busy": this.loading ? "true" : null }, this.loading && h("span", { key: 'a3e87dd124b697050a657b9957884c231aa58c54', class: "spinner", "aria-hidden": "true" }), h("slot", { key: '87a720f06602011042d70a91918a0b2157abb163' }))));
+            }, type: this.type, disabled: this.disabled || this.loading, "aria-busy": this.loading ? "true" : null }, this.loading && h("span", { key: '8e557bd098d5655be256ea7fc0748990b7f11026', class: "spinner", "aria-hidden": "true" }), h("slot", { key: '36946d065411700928e3541f351a3f6f75018ae9' }))));
     }
 };
 UiButton.style = uiButtonCss();

package/dist/esm/ui-card.entry.js

@@ -1,13 +1,13 @@
 import { r as registerInstance, h, H as Host } from './index-DYwlrXg_.js';
 
-const uiCardCss = () => `:host{display:block}.card{border:1px solid var(--ui-border);background:var(--ui-panel);box-shadow:var(--ui-shadow-lg);backdrop-filter:blur(22px) saturate(140%);border-radius:var(--ui-radius-xl);color:var(--ui-foreground);padding:1.5rem}::slotted([slot="title"]){font-size:1.125rem;font-weight:600;letter-spacing:-0.01em}::slotted([slot="description"]){color:var(--ui-text-muted);font-size:0.875rem}`;
+const uiCardCss = () => `:host{display:block}.card{display:flex;flex-direction:column;gap:0.5rem;padding:1.5rem;border:1px solid var(--ui-border);background:var(--ui-panel);box-shadow:var(--ui-shadow-lg);backdrop-filter:blur(22px) saturate(140%);border-radius:var(--ui-radius-xl);color:var(--ui-text-soft);font-family:var(--ui-font-sans)}::slotted([slot="title"]){margin:0;font-size:1.125rem;font-weight:600;letter-spacing:-0.01em;color:var(--ui-foreground)}::slotted([slot="description"]){margin:0;font-size:0.875rem;color:var(--ui-text-muted)}::slotted([slot="footer"]){display:flex;gap:0.75rem;margin-top:0.5rem}`;
 
 const UiCard = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: '7e2833cdc6f37c6b8577c17677840913fb7cd9e1' }, h("div", { key: '223c291e98af73ee2c299b8649773cfcf54388d7', class: "card" }, h("slot", { key: 'e948386bcd492c31e264d50cf27d26e98dd771eb' }))));
+        return (h(Host, { key: '39ddf0a9974086fcc9ad3fc89f1e1d6858e2fead' }, h("div", { key: 'e8e510a468dc662f9fc76affce785a9b37edc205', class: "card" }, h("slot", { key: 'ee92d4bc2fa1738d84689d989d4e113d515acc83', name: "title" }), h("slot", { key: '6e87c2406474b6ea2aa370d1602ff02a89c4f4d5', name: "description" }), h("slot", { key: 'a388b4bc2d9c5e328ade55ac38c870afc9ade82c' }), h("slot", { key: '071ce297db672e332cf2d354a395b07e100b16a1', name: "footer" }))));
     }
 };
 UiCard.style = uiCardCss();

package/dist/esm/ui-checkbox.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-DYwlrXg_.js';
 
-const uiCheckboxCss = () => `:host{display:inline-flex}.checkbox{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;padding:0;border:1px solid var(--ui-border-strong);border-radius:var(--ui-radius-sm);background:var(--ui-panel);cursor:pointer;outline:none;transition:all var(--ui-duration) var(--ui-ease)}.checkbox:focus-visible{box-shadow:0 0 0 2px var(--ui-background), 0 0 0 4px var(--ui-ring)}.checkbox[aria-checked="true"]{background:var(--ui-accent);border-color:var(--ui-accent)}.checkbox:disabled{opacity:0.5;pointer-events:none}.check{width:0.875rem;height:0.875rem;color:var(--ui-accent-contrast);opacity:0;transform:scale(0.6);transition:all var(--ui-duration) var(--ui-ease)}.checkbox[aria-checked="true"] .check{opacity:1;transform:scale(1)}`;
+const uiCheckboxCss = () => `:host{display:inline-flex}.checkbox{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;padding:0;border:1.5px solid color-mix(in srgb, var(--ui-foreground) 32%, transparent);border-radius:var(--ui-radius-sm);background:var(--ui-chip);cursor:pointer;outline:none;transition:all var(--ui-duration) var(--ui-ease)}.checkbox:hover:not(:disabled):not([aria-checked="true"]){border-color:var(--ui-accent)}.checkbox:focus-visible{box-shadow:0 0 0 2px var(--ui-background), 0 0 0 4px var(--ui-ring)}.checkbox[aria-checked="true"]{background:var(--ui-accent);border-color:var(--ui-accent)}.checkbox:disabled{opacity:0.5;pointer-events:none}.check{width:0.875rem;height:0.875rem;color:var(--ui-accent-contrast);opacity:0;transform:scale(0.6);transition:all var(--ui-duration) var(--ui-ease)}.checkbox[aria-checked="true"] .check{opacity:1;transform:scale(1)}`;
 
 const UiCheckbox = class {
     constructor(hostRef) {
@@ -24,7 +24,7 @@ const UiCheckbox = class {
         };
     }
     render() {
-        return (h(Host, { key: '218342fd572fe2a937ef30501ceb1286ed9872ac' }, h("button", { key: 'c54f4b4d663c472e08aeff9016da9d3fe63072fd', class: "checkbox", type: "button", role: "checkbox", "aria-checked": this.checked ? "true" : "false", disabled: this.disabled, onClick: this.toggle, onKeyDown: this.onKeyDown }, h("svg", { key: 'a4f460f90eeaa930b0d867ad1aadf99550ff3c9a', class: "check", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "3", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("polyline", { key: 'e96040e1a3058b910203023d882aa8da62ec9fce', points: "20 6 9 17 4 12" })))));
+        return (h(Host, { key: '73477b35af6a093e87ae8a5b33232690888ca98c' }, h("button", { key: '235b0102bbdd9a0ef23c3230acbba9aebdb06898', class: "checkbox", type: "button", role: "checkbox", "aria-checked": this.checked ? "true" : "false", disabled: this.disabled, onClick: this.toggle, onKeyDown: this.onKeyDown }, h("svg", { key: '3aaa64d1d173991b2c785298586aab66471e9285', class: "check", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "3", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("polyline", { key: 'baaca1ba97901e5a9d4e97640221f35cdeb02351', points: "20 6 9 17 4 12" })))));
     }
 };
 UiCheckbox.style = uiCheckboxCss();

package/dist/esm/ui-container.entry.js

@@ -0,0 +1,24 @@
+import { r as registerInstance, h, H as Host } from './index-DYwlrXg_.js';
+
+const uiContainerCss = () => `:host{display:block;width:100%}.container{margin-inline:auto;width:100%;font-family:var(--ui-font-sans)}.size-sm{max-width:40rem}.size-md{max-width:48rem}.size-lg{max-width:64rem}.size-xl{max-width:80rem}.size-full{max-width:none}.padded{padding-inline:1.25rem}@media (min-width: 640px){.padded{padding-inline:2rem}}`;
+
+const UiContainer = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /** Largura máxima do container. */
+        this.size = "lg";
+        /** Aplica padding lateral responsivo. */
+        this.padded = true;
+    }
+    render() {
+        const classes = {
+            container: true,
+            [`size-${this.size}`]: true,
+            padded: this.padded,
+        };
+        return (h(Host, { key: '4f00ee39f0ae347fafac349ee8e42c991c8013dd' }, h("div", { key: 'a0f8f0c6d418f119c6631d0387f9328af8fbb416', class: classes }, h("slot", { key: '86178f8371c958123fcf8b7e6bfe059aeed9f690' }))));
+    }
+};
+UiContainer.style = uiContainerCss();
+
+export { UiContainer as ui_container };

package/dist/esm/ui-dialog.entry.js

@@ -42,7 +42,7 @@ const UiDialog = class {
         this.open = false;
     }
     render() {
-        return (h(Host, { key: 'c61dad5c30282e7a0ff063b713fff567be0b2183' }, h("dialog", { key: '55e3de816fcdaafce020a8edb30e469f6d579df7', class: "dialog", ref: (el) => (this.dialogEl = el), onClose: this.onClose, onCancel: this.onClose, onClick: this.onBackdropClick }, h("div", { key: '39b8436aca48ee79ff63a1cd81640697be8007cf', class: "content" }, h("slot", { key: 'e8d509cd882aa1e3a97f66486baf4afacdf36767' })))));
+        return (h(Host, { key: 'e6c34700dc04fd3754eedeab279a67cd3997fb3d' }, h("dialog", { key: 'fdb23f89bd4b9aef79abaec586bf39add47ce013', class: "dialog", ref: (el) => (this.dialogEl = el), onClose: this.onClose, onCancel: this.onClose, onClick: this.onBackdropClick }, h("div", { key: '8a86f47c263d4fac68debdcef9cc8ed7e0be7ca8', class: "content" }, h("slot", { key: 'fe9d9105c13670104b5a60c939f9256b44694e8e' })))));
     }
     static get watchers() { return {
         "open": [{

package/dist/esm/ui-drawer.entry.js

@@ -44,7 +44,7 @@ const UiDrawer = class {
         this.open = false;
     }
     render() {
-        return (h(Host, { key: '96c4f4cec0fdc9a8601448bfc9a16dda37b33507' }, h("dialog", { key: '72ef71e674d116c9d2f47bf4d997fc9d5ca1472d', class: `drawer side-${this.side}`, ref: (el) => (this.dialogEl = el), onClose: this.onClose, onCancel: this.onClose, onClick: this.onBackdropClick }, h("div", { key: '25e537c059dcc33085bd0c0c47aa39448a16176b', class: "content" }, h("slot", { key: '3c0b746055fb6f1ac6a8c0c4713aa9cd47fd1a00' })))));
+        return (h(Host, { key: '5d44e7d604eab21d2d30d5cbaaa225658c8e7e71' }, h("dialog", { key: 'ecdfc2057a8864f6b8dc961ddcd51c3f349b2b54', class: `drawer side-${this.side}`, ref: (el) => (this.dialogEl = el), onClose: this.onClose, onCancel: this.onClose, onClick: this.onBackdropClick }, h("div", { key: 'c14965ebb97a2c77d06c4a50466d00bf4036bafa', class: "content" }, h("slot", { key: '2bdbb4cbd2cd30ade870090c5383d398cfb6772b' })))));
     }
     static get watchers() { return {
         "open": [{

package/dist/esm/ui-dropdown-item.entry.js

@@ -16,7 +16,7 @@ const UiDropdownItem = class {
         };
     }
     render() {
-        return (h(Host, { key: '9e88bb2a1ccec0a6c5f088cdd40a7881cba6e3ac' }, h("button", { key: '371c531f920cbd1a5374b8c6812d9b67c97e44f4', type: "button", class: "item", role: "menuitem", disabled: this.disabled, onClick: this.onClick }, h("slot", { key: 'fe16aad1402e098180719edd9110c83ee550224c' }))));
+        return (h(Host, { key: 'a73d394ff94b232151c37e749d398f4485f46bde' }, h("button", { key: '3827857b88fc5d63681e80dc2cc470b58faf69e1', type: "button", class: "item", role: "menuitem", disabled: this.disabled, onClick: this.onClick }, h("slot", { key: 'a6dbd79c7b171ef6a8a53aa5da39fbca37725e1c' }))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/ui-dropdown-menu.entry.js

@@ -81,7 +81,7 @@ const UiDropdownMenu = class {
         this.cleanup = undefined;
     }
     render() {
-        return (h(Host, { key: '83694eb278f8a9c711ae30677254a4168dbd825f' }, h("span", { key: 'dabab12417ed473e22097578c07842f36a05e397', class: "trigger", ref: (el) => (this.triggerEl = el), onClick: this.onTriggerClick }, h("slot", { key: '6e3b0f1c2c83a48c0c70a2416c6e0ac34b05c68e', name: "trigger" })), h("div", { key: '2b6059c9bfa98c6f5bc9656d86ffeaf1009a887b', class: { menu: true, "is-open": this.open }, role: "menu", ref: (el) => (this.floatingEl = el) }, h("slot", { key: 'af01e24903f705ef30174ba37735d774b8e5aa99' }))));
+        return (h(Host, { key: '6d1ac3cd9096527745a84f24443a3b230bf2aaf0' }, h("span", { key: '5594e37030b1fd69260b4de30393aacfbc636ca3', class: "trigger", ref: (el) => (this.triggerEl = el), onClick: this.onTriggerClick }, h("slot", { key: '763b6bf28fe4c79a13a2cc5a620d19e51ae5f6e2', name: "trigger" })), h("div", { key: '0bec01181593abbcb1a8634eb027ce0cef0d860d', class: { menu: true, "is-open": this.open }, role: "menu", ref: (el) => (this.floatingEl = el) }, h("slot", { key: '1b1fa528fc1186c81dd433d0cb9b775df8357641' }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/ui-field.entry.js

@@ -9,7 +9,7 @@ const UiField = class {
         this.required = false;
     }
     render() {
-        return (h(Host, { key: '1f944085a10d6c795ce06a7a91021fee46780347' }, h("div", { key: 'a2f2fde238292d543c65bf6e1ed0dfd0dce424f9', class: "field" }, this.label && (h("label", { key: '4f450b5e43f1ea8dda3b3134022a010391a2f404', class: "label", htmlFor: this.fieldId }, this.label, this.required && (h("span", { key: '1853d16b19752584b646a294dcbe2b8359ec12b4', class: "required", "aria-hidden": "true" }, " *")))), h("slot", { key: '75adc24c2264e3e954618737769232535caa13e4' }), this.error ? (h("p", { class: "error", role: "alert" }, this.error)) : (this.description && h("p", { class: "description" }, this.description)))));
+        return (h(Host, { key: '1910a6ce3a389ab7faa9e3b46e0397e6a9bfbaab' }, h("div", { key: 'fb76fb030b9af9129578f7b2f0b85eaffefc8d67', class: "field" }, this.label && (h("label", { key: '659a7c0982360c133891a1a22a98cdae32a529ed', class: "label", htmlFor: this.fieldId }, this.label, this.required && (h("span", { key: 'de93f19b8a2dd063df1175c00c68c0b7c9b092d6', class: "required", "aria-hidden": "true" }, " *")))), h("slot", { key: 'a510f107aab90a202c178f1d22727689db828fdc' }), this.error ? (h("p", { class: "error", role: "alert" }, this.error)) : (this.description && h("p", { class: "description" }, this.description)))));
     }
 };
 UiField.style = uiFieldCss();

package/dist/esm/ui-grid.entry.js

@@ -0,0 +1,32 @@
+import { r as registerInstance, h, H as Host } from './index-DYwlrXg_.js';
+
+const uiGridCss = () => `:host{display:block}.grid{display:grid;font-family:var(--ui-font-sans)}`;
+
+const GAP = {
+    xs: "0.25rem",
+    sm: "0.5rem",
+    md: "1rem",
+    lg: "1.5rem",
+    xl: "2rem",
+};
+const UiGrid = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /** Número de colunas da grade. */
+        this.columns = 12;
+        /** Espaçamento entre células. */
+        this.gap = "md";
+    }
+    render() {
+        const style = {
+            gridTemplateColumns: this.minItemWidth
+                ? `repeat(auto-fit, minmax(${this.minItemWidth}, 1fr))`
+                : `repeat(${this.columns}, minmax(0, 1fr))`,
+            gap: GAP[this.gap],
+        };
+        return (h(Host, { key: '465a816e064af42d8282185ee92e32477a6112fd' }, h("div", { key: 'da2e151c56959ced55477e3fe6c99aa5563b38aa', class: "grid", style: style }, h("slot", { key: '5bb285ce0feaf16d066b627010fc3fb595a85c15' }))));
+    }
+};
+UiGrid.style = uiGridCss();
+
+export { UiGrid as ui_grid };

package/dist/esm/ui-input.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-DYwlrXg_.js';
 
-const uiInputCss = () => `:host{display:block}.input{width:100%;height:2.75rem;padding:0 1rem;border:1px solid var(--ui-border);border-radius:var(--ui-radius-sm);background:var(--ui-panel);color:var(--ui-foreground);font-family:var(--ui-font-sans);font-size:0.875rem;outline:none;backdrop-filter:blur(22px);transition:all var(--ui-duration) var(--ui-ease);box-sizing:border-box}.input::placeholder{color:var(--ui-text-faint)}.input:focus-visible{border-color:var(--ui-accent);box-shadow:0 0 0 2px var(--ui-ring)}.input:disabled{opacity:0.5;pointer-events:none}.input.invalid{border-color:var(--ui-danger)}.input.invalid:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--ui-danger) 40%, transparent)}`;
+const uiInputCss = () => `:host{display:block}.field{display:flex;align-items:center;gap:0.5rem;width:100%;height:2.75rem;padding:0 0.875rem;border:1px solid var(--ui-border);border-radius:var(--ui-radius-sm);background:var(--ui-panel);backdrop-filter:blur(22px);transition:all var(--ui-duration) var(--ui-ease);box-sizing:border-box}.field:hover:not(.disabled){border-color:var(--ui-border-strong)}.field:focus-within{border-color:var(--ui-accent);box-shadow:0 0 0 2px var(--ui-ring)}.field.invalid{border-color:var(--ui-danger)}.field.invalid:focus-within{box-shadow:0 0 0 2px color-mix(in srgb, var(--ui-danger) 40%, transparent)}.field.disabled{opacity:0.5;pointer-events:none}.input{flex:1;min-width:0;height:100%;border:none;background:transparent;color:var(--ui-foreground);font-family:var(--ui-font-sans);font-size:0.875rem;outline:none}.input::placeholder{color:var(--ui-text-faint)}.affix{display:inline-flex;align-items:center;color:var(--ui-text-muted)}.affix::slotted(svg),::slotted([slot="prefix"]),::slotted([slot="suffix"]){display:inline-flex;color:var(--ui-text-muted)}.clear{display:inline-flex;align-items:center;justify-content:center;flex:none;width:1.25rem;height:1.25rem;padding:0;border:none;border-radius:var(--ui-radius-full);background:var(--ui-chip);color:var(--ui-text-muted);cursor:pointer;transition:all var(--ui-duration) var(--ui-ease)}.clear:hover{color:var(--ui-foreground);background:var(--ui-panel-strong)}`;
 
 const UiInput = class {
     constructor(hostRef) {
@@ -15,6 +15,8 @@ const UiInput = class {
         this.disabled = false;
         /** Marca o campo como inválido (estilo + aria-invalid). */
         this.invalid = false;
+        /** Exibe um botão para limpar o valor quando preenchido. */
+        this.clearable = false;
         this.onInput = (event) => {
             const target = event.target;
             this.value = target.value;
@@ -23,9 +25,15 @@ const UiInput = class {
         this.onChange = (event) => {
             this.uiChange.emit(event.target.value);
         };
+        this.clear = () => {
+            this.value = "";
+            this.uiInput.emit("");
+            this.uiChange.emit("");
+        };
     }
     render() {
-        return (h(Host, { key: 'e2ca2973fb898cde6988d2422f8b346662caf375' }, h("input", { key: '6e2b0358dc583f448a71f95f319d0fd675536c60', class: { input: true, invalid: this.invalid }, type: this.type, value: this.value, name: this.name, placeholder: this.placeholder, disabled: this.disabled, "aria-invalid": this.invalid ? "true" : null, onInput: this.onInput, onChange: this.onChange })));
+        const showClear = this.clearable && !!this.value && !this.disabled;
+        return (h(Host, { key: 'a87a7c9a1aba5631099f2f9c3a3083a9e7374854' }, h("div", { key: '04d3493ab32a4636f3f2540aaba0b30e4c018225', class: { field: true, invalid: this.invalid, disabled: this.disabled } }, h("span", { key: '66fa079a8b6ccc62dca78f4266d92800dd8727b0', class: "affix" }, h("slot", { key: 'c9db74515db3226bc730beb42a2a8f2d8eb6ee9f', name: "prefix" })), h("input", { key: 'a8f4db568e49ee22b5eeae078c4e4b3fdbc48983', class: "input", type: this.type, value: this.value, name: this.name, placeholder: this.placeholder, disabled: this.disabled, "aria-invalid": this.invalid ? "true" : null, onInput: this.onInput, onChange: this.onChange }), showClear && (h("button", { key: 'e38a2279db1b1c677274a6e22019bf3183ae1920', class: "clear", type: "button", "aria-label": "Limpar", onClick: this.clear }, h("svg", { key: '0982ea65d3b1598620953fcd600b1eb1945348ee', viewBox: "0 0 24 24", width: "14", height: "14", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round" }, h("path", { key: '26f833d4ccf8feab9f2ec4f4527b8c8e9c00d09b', d: "M18 6 6 18M6 6l12 12" })))), h("span", { key: '22c7d4d4a030157a4a9eb73ef0a260f4db56c848', class: "affix" }, h("slot", { key: 'fa74011b1237908aa9eea78f88294afcdf09f0f5', name: "suffix" })))));
     }
 };
 UiInput.style = uiInputCss();

package/dist/esm/ui-label.entry.js

@@ -7,7 +7,7 @@ const UiLabel = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: 'bb726d8b26a82776e688532b6fbe69c178308c75' }, h("label", { key: 'bfd33ad1561fcee62395be37e83894cdce0ec259', class: "label" }, h("slot", { key: 'c0ac5938df3aea7219a59caf46cb7cd152046770' }))));
+        return (h(Host, { key: '15695a208223a3270e49d72972a49c26fe3acd4d' }, h("label", { key: 'a6d0290c845797368e59fa936b80c8fee55dbcb1', class: "label" }, h("slot", { key: 'daae42c194f0c31d69a82bfad95a97b85cf2cdf2' }))));
     }
 };
 UiLabel.style = uiLabelCss();

package/dist/esm/ui-pagination.entry.js

@@ -0,0 +1,61 @@
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-DYwlrXg_.js';
+
+const uiPaginationCss = () => `:host{display:inline-block}.pagination{display:inline-flex;align-items:center;gap:0.25rem;font-family:var(--ui-font-sans)}.page{display:inline-flex;align-items:center;justify-content:center;min-width:2.25rem;height:2.25rem;padding:0 0.5rem;border:1px solid var(--ui-border);border-radius:var(--ui-radius-sm);background:transparent;color:var(--ui-foreground);font-family:var(--ui-font-sans);font-size:0.875rem;cursor:pointer;outline:none;transition:all var(--ui-duration) var(--ui-ease)}.page:hover{border-color:var(--ui-border-strong);background:var(--ui-chip)}.page:focus-visible{box-shadow:0 0 0 2px var(--ui-ring)}.page:disabled{pointer-events:none;opacity:0.5}.page.active{background:var(--ui-accent);color:var(--ui-accent-contrast);border-color:var(--ui-accent);box-shadow:var(--ui-shadow-sm)}.ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:2.25rem;height:2.25rem;color:var(--ui-text-faint);font-size:0.875rem}`;
+
+const UiPagination = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.uiChange = createEvent(this, "uiChange");
+        /** Total de páginas. */
+        this.total = 1;
+        /** Página atual. */
+        this.current = 1;
+        /** Quantidade de páginas ao redor da atual. */
+        this.siblings = 1;
+        this.clamp = (page) => Math.min(Math.max(page, 1), Math.max(this.total, 1));
+        this.go = (page) => {
+            const next = this.clamp(page);
+            if (next === this.current)
+                return;
+            this.current = next;
+            this.uiChange.emit(next);
+        };
+        this.buildRange = () => {
+            const total = Math.max(this.total, 1);
+            const current = this.clamp(this.current);
+            const siblings = Math.max(this.siblings, 0);
+            const start = Math.max(current - siblings, 1);
+            const end = Math.min(current + siblings, total);
+            const pages = new Set([1, total]);
+            for (let page = start; page <= end; page += 1)
+                pages.add(page);
+            const sorted = Array.from(pages)
+                .filter((page) => page >= 1 && page <= total)
+                .sort((a, b) => a - b);
+            const result = [];
+            let previous = 0;
+            for (const page of sorted) {
+                if (previous && page - previous > 1)
+                    result.push("...");
+                result.push(page);
+                previous = page;
+            }
+            return result;
+        };
+    }
+    render() {
+        const total = Math.max(this.total, 1);
+        const current = this.clamp(this.current);
+        const entries = this.buildRange();
+        return (h(Host, { key: '405a1c41db3850f25ffc14a053b12c0767809b1e' }, h("nav", { key: 'bd9baa3307cb5576ca81ab82653b44ccd4cb0385', class: "pagination", role: "navigation", "aria-label": "Pagina\u00E7\u00E3o" }, h("button", { key: '8efdfeb278037fabab6b82ba4083a7d23a00d612', class: "page nav", type: "button", "aria-label": "P\u00E1gina anterior", disabled: current <= 1, onClick: () => this.go(current - 1) }, "\u2039"), entries.map((entry, index) => {
+            if (entry === "...") {
+                return (h("span", { key: `ellipsis-${index}`, class: "ellipsis", "aria-hidden": "true" }, "\u2026"));
+            }
+            const active = entry === current;
+            return (h("button", { key: entry, class: { page: true, active }, type: "button", "aria-label": `Página ${entry}`, "aria-current": active ? "page" : undefined, onClick: () => this.go(entry) }, entry));
+        }), h("button", { key: '5ba13b9a59857423e65a4d10630eb66cc32c30fe', class: "page nav", type: "button", "aria-label": "Pr\u00F3xima p\u00E1gina", disabled: current >= total, onClick: () => this.go(current + 1) }, "\u203A"))));
+    }
+};
+UiPagination.style = uiPaginationCss();
+
+export { UiPagination as ui_pagination };

package/dist/esm/ui-popover.entry.js

@@ -78,7 +78,7 @@ const UiPopover = class {
         this.cleanup = undefined;
     }
     render() {
-        return (h(Host, { key: '193a3f6fb440dc2da1837c2387511d38f71e7da3' }, h("span", { key: '8732b0b40340e39ac26b80e38864438cf9bf01cc', class: "trigger", ref: (el) => (this.triggerEl = el), onClick: this.onTriggerClick }, h("slot", { key: 'd51743b5fa62e8fd5c5639ba2d9681caa8556fb0', name: "trigger" })), h("div", { key: 'a2ae9fd5bb67dc1ad4243ac478ecc11cb4c28665', class: { panel: true, "is-open": this.open }, ref: (el) => (this.floatingEl = el) }, h("slot", { key: '655d8b979962d25dabe8497516be51199ce16452' }))));
+        return (h(Host, { key: '61b4088ff4d61701a3466619274e60ac64fcc420' }, h("span", { key: 'd2d00f4dbf391ea1bc119870e399187d98634de6', class: "trigger", ref: (el) => (this.triggerEl = el), onClick: this.onTriggerClick }, h("slot", { key: 'ece70edbdda096821de68295e55a3fba3caeada4', name: "trigger" })), h("div", { key: 'f30e5a570e49eb9c7056fd820bc57408dd78e013', class: { panel: true, "is-open": this.open }, ref: (el) => (this.floatingEl = el) }, h("slot", { key: '5823d3c7ed47946d812a2c34002fc5fd0cfc8a29' }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/ui-progress.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host } from './index-DYwlrXg_.js';
 
-const uiProgressCss = () => `:host{display:block}.track{width:100%;height:0.5rem;border-radius:var(--ui-radius-full);background:var(--ui-chip);overflow:hidden}.indicator{height:100%;border-radius:var(--ui-radius-full);background:var(--ui-accent);transition:width var(--ui-duration) var(--ui-ease)}.indicator.indeterminate{width:40%;animation:ui-progress-slide 1.2s ease-in-out infinite}@keyframes ui-progress-slide{0%{transform:translateX(-100%)}100%{transform:translateX(250%)}}`;
+const uiProgressCss = () => `:host{display:block}.track{width:100%;height:0.5rem;border-radius:var(--ui-radius-full);background:var(--ui-chip);border:1px solid var(--ui-border);overflow:hidden;box-sizing:border-box}.indicator{height:100%;min-width:0.5rem;border-radius:var(--ui-radius-full);background:linear-gradient(90deg, var(--ui-accent), var(--ui-accent-strong));box-shadow:0 0 12px color-mix(in srgb, var(--ui-accent) 55%, transparent);transition:width var(--ui-duration) var(--ui-ease)}.indicator.indeterminate{width:40%;min-width:0;animation:ui-progress-slide 1.3s var(--ui-ease) infinite}@keyframes ui-progress-slide{0%{transform:translateX(-110%)}100%{transform:translateX(360%)}}`;
 
 const UiProgress = class {
     constructor(hostRef) {
@@ -23,7 +23,7 @@ const UiProgress = class {
     }
     render() {
         const determinate = !this.isIndeterminate;
-        return (h(Host, { key: '0be3e6f551bf5401e033a7faba2787eb4166eb0a', role: "progressbar", "aria-valuenow": determinate ? String(this.value) : undefined, "aria-valuemin": determinate ? "0" : undefined, "aria-valuemax": determinate ? String(this.max) : undefined }, h("div", { key: '89151bf96326053ce60b71a2f2f9b6c13d721e39', class: "track" }, h("div", { key: '2cdf8f8cbbe7729813e8e78b671fc43b7ebec153', class: { indicator: true, indeterminate: this.isIndeterminate }, style: determinate ? { width: `${this.percent}%` } : undefined }))));
+        return (h(Host, { key: '8f40e0e4a439959e1474d2952f0f891438fb3ecf', role: "progressbar", "aria-valuenow": determinate ? String(this.value) : undefined, "aria-valuemin": determinate ? "0" : undefined, "aria-valuemax": determinate ? String(this.max) : undefined }, h("div", { key: '9bfd7557efbfad05a8b170764b96935f00cbdaeb', class: "track" }, h("div", { key: '02205ac65e75f27f52869991b168c6397c8b2760', class: { indicator: true, indeterminate: this.isIndeterminate }, style: determinate ? { width: `${this.percent}%` } : undefined }))));
     }
 };
 UiProgress.style = uiProgressCss();

package/dist/esm/ui-radio-group.entry.js

@@ -36,7 +36,7 @@ const UiRadioGroup = class {
         };
     }
     render() {
-        return (h(Host, { key: '80b7e45cfc95e7e82015db2fa893b374ba73cf07' }, h("div", { key: '1133cd7ad3f9eb9ebaa0ac6c8a2ca3e2a52c46a9', class: "group", role: "radiogroup" }, this.options.map((option, index) => {
+        return (h(Host, { key: '67c377ec552ea8cb6ea3d015bab1ee3d66ee436c' }, h("div", { key: 'aa52c74b8473ca06b762811a900d90cdfc8f7422', class: "group", role: "radiogroup" }, this.options.map((option, index) => {
             const selected = option.value === this.value;
             return (h("button", { class: "radio", type: "button", role: "radio", "aria-checked": selected ? "true" : "false", tabindex: selected || (!this.value && index === 0) ? "0" : "-1", disabled: this.disabled, onClick: () => this.select(option.value), onKeyDown: (event) => this.onKeyDown(event, index) }, h("span", { class: "indicator" }, h("span", { class: "dot" })), h("span", { class: "label" }, option.label)));
         }))));

package/dist/esm/ui-reveal.entry.js

@@ -30,7 +30,7 @@ const UiReveal = class {
         this.observer?.disconnect();
     }
     render() {
-        return (h(Host, { key: '926e1c25b8463f92dc35a010d58b9bd622932c21' }, h("div", { key: '0561142e1b0955e22d12056f316c98556cb5365d', class: { reveal: true, visible: this.visible }, style: { transitionDelay: `${this.delay}ms` } }, h("slot", { key: 'bd53a6ca33153d3f7768a7662e5e5b78ea221cc6' }))));
+        return (h(Host, { key: '4ab570c0eaa9fb6b4d6a9d01887fde6edd72ba8d' }, h("div", { key: 'cf0287499bfa5107fb49cadc85c85f2f70063967', class: { reveal: true, visible: this.visible }, style: { transitionDelay: `${this.delay}ms` } }, h("slot", { key: 'b46502732e597f13d60ec55be0d456dba8181386' }))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/ui-scroll-progress.entry.js

@@ -27,7 +27,7 @@ const UiScrollProgress = class {
         window.removeEventListener("scroll", this.onScroll);
     }
     render() {
-        return (h(Host, { key: '7eced0439a2d6ef04d085396a6fc0e69fbe798ed' }, h("div", { key: '30db3ea1a3fce2a26ebca96568e939c4a0183922', class: "bar", role: "progressbar", "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": Math.round(this.progress * 100), style: { transform: `scaleX(${this.progress})` } })));
+        return (h(Host, { key: 'cb2d746b6e0ca3642a0460cff5685f2eb83a6301' }, h("div", { key: '7fdb8b414f833110c389aef8620c313fb8c001c7', class: "bar", role: "progressbar", "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": Math.round(this.progress * 100), style: { transform: `scaleX(${this.progress})` } })));
     }
 };
 UiScrollProgress.style = uiScrollProgressCss();

package/dist/esm/ui-section.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, H as Host } from './index-DYwlrXg_.js';
 
-const uiSectionCss = () => `:host{display:block;font-family:var(--ui-font-sans)}section{max-width:80rem;margin:0 auto;padding:5rem 1.25rem}.eyebrow{margin:0 0 0.75rem;text-transform:uppercase;letter-spacing:0.08em;font-size:0.75rem;font-weight:600;color:var(--ui-accent)}.heading{margin:0 0 1rem;font-size:1.875rem;font-weight:600;color:var(--ui-foreground)}.description{margin:0 0 2rem;max-width:42rem;color:var(--ui-text-muted)}`;
+const uiSectionCss = () => `:host{display:block;font-family:var(--ui-font-sans)}section{max-width:80rem;margin:0 auto;padding:3.5rem 1.5rem}.eyebrow{display:inline-block;margin:0 0 0.75rem;padding:0.25rem 0.625rem;border:1px solid var(--ui-border);border-radius:var(--ui-radius-full);background:var(--ui-chip);text-transform:uppercase;letter-spacing:0.12em;font-size:0.6875rem;font-weight:600;color:var(--ui-accent)}.heading{margin:0 0 0.75rem;font-size:2.25rem;font-weight:600;letter-spacing:-0.02em;line-height:1.1;color:var(--ui-foreground)}.description{margin:0 0 2rem;max-width:42rem;color:var(--ui-text-muted)}`;
 
 const UiSection = class {
     constructor(hostRef) {
@@ -13,7 +13,7 @@ const UiSection = class {
         this.description = "";
     }
     render() {
-        return (h(Host, { key: '63ee126b1e457a4dcd01a66aa519e6fae8377db6' }, h("section", { key: '34f3c07dca2e9f6a3c288b7c41abaf2a3502129f' }, this.eyebrow && h("p", { key: '7c71e3e38e56872757d017ba4f59949f50518c6f', class: "eyebrow" }, this.eyebrow), this.heading && h("h2", { key: 'b8f42a4ae5d2e5d8fb80a4cb9de07ca10c2423fd', class: "heading" }, this.heading), this.description && h("p", { key: 'faeba9733afaa52e7a08629459dd708b4f647740', class: "description" }, this.description), h("slot", { key: '99e906d4ca93461c35125acb4eb3401ed76929fe' }))));
+        return (h(Host, { key: '71344e4d5a4c6bccade1bf5151aeba1dffa14d7f' }, h("section", { key: '404cb27c6db128f60608b4eff44fa6e05520016b' }, this.eyebrow && h("p", { key: '204ced95531d3bf77c2a32f940c3ec4bc0e76f53', class: "eyebrow" }, this.eyebrow), this.heading && h("h2", { key: '46818123dd264ef60db8ff9c7a2ad93979d71434', class: "heading" }, this.heading), this.description && h("p", { key: 'eaba39853cd12a874c9079e2181aca9e0fc130b7', class: "description" }, this.description), h("slot", { key: '24d02b1d9176e42d7906ef43881807d7cfda2e52' }))));
     }
 };
 UiSection.style = uiSectionCss();

package/dist/esm/ui-segmented.entry.js

@@ -0,0 +1,29 @@
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-DYwlrXg_.js';
+
+const uiSegmentedCss = () => `:host{display:inline-block}.track{display:inline-flex;align-items:center;gap:0.125rem;padding:0.25rem;border:1px solid var(--ui-border);border-radius:var(--ui-radius-full);background:var(--ui-chip);font-family:var(--ui-font-sans)}.segment{display:inline-flex;align-items:center;justify-content:center;height:2rem;padding:0 0.875rem;border:none;border-radius:var(--ui-radius-full);background:transparent;color:var(--ui-text-muted);font-family:var(--ui-font-sans);font-size:0.8125rem;font-weight:500;cursor:pointer;outline:none;transition:all var(--ui-duration) var(--ui-ease)}.segment:hover{color:var(--ui-foreground)}.segment:focus-visible{box-shadow:0 0 0 2px var(--ui-ring)}.segment.active{background:var(--ui-panel-strong);color:var(--ui-foreground);box-shadow:var(--ui-shadow-sm)}`;
+
+const UiSegmented = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.uiChange = createEvent(this, "uiChange");
+        /** Lista de segmentos. */
+        this.items = [];
+        /** Valor do segmento ativo. */
+        this.value = "";
+        this.select = (value) => {
+            if (value === this.value)
+                return;
+            this.value = value;
+            this.uiChange.emit(value);
+        };
+    }
+    render() {
+        return (h(Host, { key: '92649a392383aebb62bab90e3f20a008783f2ed2' }, h("div", { key: '22983cd496ee1f9ed1dbf49d989c409cdca3c8b4', class: "track", role: "radiogroup" }, this.items.map((item) => {
+            const active = item.value === this.value;
+            return (h("button", { key: item.value, class: { segment: true, active }, type: "button", role: "radio", "aria-checked": active ? "true" : "false", onClick: () => this.select(item.value) }, item.label));
+        }))));
+    }
+};
+UiSegmented.style = uiSegmentedCss();
+
+export { UiSegmented as ui_segmented };

package/dist/esm/ui-select.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-DYwlrXg_.js';
 
-const uiSelectCss = () => `:host{display:block}.wrapper{position:relative;display:block;width:100%}.select{width:100%;height:2.75rem;padding:0 2.5rem 0 1rem;border:1px solid var(--ui-border);border-radius:var(--ui-radius-sm);background:var(--ui-panel);color:var(--ui-foreground);font-family:var(--ui-font-sans);font-size:0.875rem;outline:none;backdrop-filter:blur(22px);transition:all var(--ui-duration) var(--ui-ease);box-sizing:border-box;cursor:pointer;-webkit-appearance:none;appearance:none}.select:focus-visible{border-color:var(--ui-accent);box-shadow:0 0 0 2px var(--ui-ring)}.select:disabled{opacity:0.5;pointer-events:none}.chevron{position:absolute;top:50%;right:0.875rem;width:1.125rem;height:1.125rem;color:var(--ui-text-muted);transform:translateY(-50%);pointer-events:none}`;
+const uiSelectCss = () => `:host{display:block}.wrapper{position:relative;display:block;width:100%}.select{width:100%;height:2.75rem;padding:0 2.5rem 0 1rem;border:1px solid var(--ui-border);border-radius:var(--ui-radius-sm);background:var(--ui-panel);color:var(--ui-foreground);font-family:var(--ui-font-sans);font-size:0.875rem;outline:none;backdrop-filter:blur(22px);transition:all var(--ui-duration) var(--ui-ease);box-sizing:border-box;cursor:pointer;-webkit-appearance:none;appearance:none}.select:hover:not(:disabled){border-color:var(--ui-border-strong)}.select:focus-visible{border-color:var(--ui-accent);box-shadow:0 0 0 2px var(--ui-ring)}.select:disabled{opacity:0.5;pointer-events:none}.chevron{position:absolute;top:50%;right:0.875rem;width:1.125rem;height:1.125rem;color:var(--ui-text-muted);transform:translateY(-50%);pointer-events:none}`;
 
 const UiSelect = class {
     constructor(hostRef) {
@@ -18,7 +18,7 @@ const UiSelect = class {
     }
     render() {
         const hasValue = this.value !== undefined && this.value !== "";
-        return (h(Host, { key: '1ebd6a8472a116ad071e9504ab0756daddb27824' }, h("div", { key: '5d2d00f41b8f74202156d0af7c150b89d79dc1a4', class: "wrapper" }, h("select", { key: '7b370433247f03a126ce13005a3697ba5b04845f', class: "select", name: this.name, disabled: this.disabled, onChange: this.onChange }, this.placeholder && (h("option", { key: '9e482642eebeab0b1b1c5b56a6730fb5ecbd9617', value: "", disabled: true, selected: !hasValue }, this.placeholder)), this.options.map((option) => (h("option", { value: option.value, selected: option.value === this.value }, option.label)))), h("svg", { key: '7d66788b8d8b51169ae28e5e5c5a31c0b637e377', class: "chevron", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("polyline", { key: 'aaa00671ba95ebd20f81174fc27bf218b16dfc64', points: "6 9 12 15 18 9" })))));
+        return (h(Host, { key: '5f41047362d77643cc663925900c15c6cd10ec60' }, h("div", { key: '53ec77b2100bdd6de568ad549a42ad8fd080ac6a', class: "wrapper" }, h("select", { key: 'b0b4b1def7b7166bf24f996f9736a670a9b7b052', class: "select", name: this.name, disabled: this.disabled, onChange: this.onChange }, this.placeholder && (h("option", { key: 'e83b039418ac74bb3124c151dca9af43ff05dd61', value: "", disabled: true, selected: !hasValue }, this.placeholder)), this.options.map((option) => (h("option", { value: option.value, selected: option.value === this.value }, option.label)))), h("svg", { key: 'bb3165c856d11b352b2c7a64cc12ab4284541fb4', class: "chevron", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("polyline", { key: 'ab5e3cb2419dc63fbcd3804740b781c856ae8240', points: "6 9 12 15 18 9" })))));
     }
 };
 UiSelect.style = uiSelectCss();

package/dist/esm/ui-separator.entry.js

@@ -9,7 +9,7 @@ const UiSeparator = class {
         this.orientation = "horizontal";
     }
     render() {
-        return (h(Host, { key: '212e4b763ad309ef74ba2e21592a0d4091fb0fcf', role: "separator", "aria-orientation": this.orientation, class: `orientation-${this.orientation}` }));
+        return (h(Host, { key: '33e452485ff7838e37a378f9acba10f242069cfc', role: "separator", "aria-orientation": this.orientation, class: `orientation-${this.orientation}` }));
     }
 };
 UiSeparator.style = uiSeparatorCss();

package/dist/esm/ui-skeleton.entry.js

@@ -1,13 +1,13 @@
 import { r as registerInstance, h, H as Host } from './index-DYwlrXg_.js';
 
-const uiSkeletonCss = () => `:host{display:block}.skeleton{display:block;width:100%;height:100%;border-radius:var(--ui-radius-sm);background:linear-gradient(     90deg,     var(--ui-chip),     var(--ui-panel),     var(--ui-chip)   );background-size:200% 100%;animation:ui-skeleton-shimmer 1.5s ease-in-out infinite}@keyframes ui-skeleton-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}`;
+const uiSkeletonCss = () => `:host{display:block}.skeleton{display:block;width:100%;height:100%;min-height:1rem;border-radius:var(--ui-radius-sm);background-color:var(--ui-chip);background-image:linear-gradient(     90deg,     transparent,     color-mix(in srgb, var(--ui-foreground) 12%, transparent),     transparent   );background-size:200% 100%;background-repeat:no-repeat;animation:ui-skeleton-shimmer 1.5s ease-in-out infinite}@keyframes ui-skeleton-shimmer{0%{background-position:-150% 0}100%{background-position:150% 0}}`;
 
 const UiSkeleton = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: '19b59c75e9ff1607c731227bd344a0d082de5366' }, h("span", { key: '6eb968b5bd87768818381db897a090a2783ad938', class: "skeleton" })));
+        return (h(Host, { key: '8f839817a493a8221e9d3b2e95fd7ae5ece2e70e' }, h("span", { key: '295dce8e9e6489def8b20a703f04c65ad3740ce8', class: "skeleton" })));
     }
 };
 UiSkeleton.style = uiSkeletonCss();

package/dist/esm/ui-slider.entry.js

@@ -27,7 +27,7 @@ const UiSlider = class {
         };
     }
     render() {
-        return (h(Host, { key: 'dc7f810ebfdde28731d2e1c491596caf03c2476e' }, h("input", { key: 'cac37f559b5587d18fee732e11d6515d57d23466', class: "slider", type: "range", min: this.min, max: this.max, step: this.step, value: this.value, disabled: this.disabled, onInput: this.onInput, onChange: this.onChange })));
+        return (h(Host, { key: '22fe57f0e95edb2e169718c8b1fb5c2f3d78ddfe' }, h("input", { key: 'a9e16ef8f97f412c22911f72c4b7212f6d04a293', class: "slider", type: "range", min: this.min, max: this.max, step: this.step, value: this.value, disabled: this.disabled, onInput: this.onInput, onChange: this.onChange })));
     }
 };
 UiSlider.style = uiSliderCss();

package/dist/esm/ui-spinner.entry.js

@@ -9,7 +9,7 @@ const UiSpinner = class {
         this.size = "md";
     }
     render() {
-        return (h(Host, { key: 'cedf6e857d1f4e6561c78f3fd3076341c2d8ecdc', role: "status" }, h("span", { key: '7200580dccc32b30829725ad84e913c3b1afee60', class: { spinner: true, [`size-${this.size}`]: true } }), h("span", { key: '63d4cfee2e5cebabc3c7b3b6ed95a656daa65705', class: "sr-only" }, "Carregando")));
+        return (h(Host, { key: '0414d6e3be8588ad4c71c5e4cf227075ac7494ab', role: "status" }, h("span", { key: '61e5d0a16b5fd566767ef098477c3144a9c1c987', class: { spinner: true, [`size-${this.size}`]: true } }), h("span", { key: 'ea33b6e6603ba23e7a117ef978329c83818a044b', class: "sr-only" }, "Carregando")));
     }
 };
 UiSpinner.style = uiSpinnerCss();

package/dist/esm/ui-stack.entry.js

@@ -0,0 +1,51 @@
+import { r as registerInstance, h, H as Host } from './index-DYwlrXg_.js';
+
+const uiStackCss = () => `:host{display:block}.stack{display:flex;font-family:var(--ui-font-sans)}`;
+
+const GAP = {
+    xs: "0.25rem",
+    sm: "0.5rem",
+    md: "1rem",
+    lg: "1.5rem",
+    xl: "2rem",
+};
+const ALIGN = {
+    start: "flex-start",
+    center: "center",
+    end: "flex-end",
+    stretch: "stretch",
+};
+const JUSTIFY = {
+    start: "flex-start",
+    center: "center",
+    end: "flex-end",
+    between: "space-between",
+};
+const UiStack = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /** Direção do empilhamento. */
+        this.direction = "vertical";
+        /** Espaçamento entre itens. */
+        this.gap = "md";
+        /** Alinhamento no eixo cruzado. */
+        this.align = "stretch";
+        /** Distribuição no eixo principal. */
+        this.justify = "start";
+        /** Permite quebra de linha dos itens. */
+        this.wrap = false;
+    }
+    render() {
+        const style = {
+            flexDirection: this.direction === "horizontal" ? "row" : "column",
+            gap: GAP[this.gap],
+            alignItems: ALIGN[this.align],
+            justifyContent: JUSTIFY[this.justify],
+            flexWrap: this.wrap ? "wrap" : "nowrap",
+        };
+        return (h(Host, { key: 'ba9547e72877aa05a5e93afbe098d7402b315df3' }, h("div", { key: 'e0fd73777e2211925435f2fd8bfcb74ad2eb8085', class: "stack", style: style }, h("slot", { key: '3a5aa50721c641f0cc81328a21262ff5d375e55c' }))));
+    }
+};
+UiStack.style = uiStackCss();
+
+export { UiStack as ui_stack };

package/dist/esm/ui-stat.entry.js

@@ -0,0 +1,26 @@
+import { r as registerInstance, h, H as Host } from './index-DYwlrXg_.js';
+
+const uiStatCss = () => `:host{display:block}.card{display:flex;flex-direction:column;gap:0.5rem;padding:1.25rem;border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);background:var(--ui-panel);backdrop-filter:blur(22px);font-family:var(--ui-font-sans)}.label{margin:0;text-transform:uppercase;letter-spacing:0.08em;font-size:0.7rem;font-weight:500;color:var(--ui-text-faint)}.value-row{display:flex;align-items:baseline;gap:0.625rem}.value{font-size:1.875rem;font-weight:600;line-height:1.1;color:var(--ui-foreground)}.delta{display:inline-flex;align-items:center;gap:0.25rem;padding:0.125rem 0.5rem;border-radius:var(--ui-radius-full);font-size:0.75rem;font-weight:600}.delta svg{display:block}.trend-up{color:var(--ui-success);background:color-mix(in srgb, var(--ui-success) 14%, transparent)}.trend-down{color:var(--ui-danger);background:color-mix(in srgb, var(--ui-danger) 14%, transparent)}.trend-neutral{color:var(--ui-text-muted);background:var(--ui-chip)}.extra{font-size:0.8125rem;color:var(--ui-text-muted)}`;
+
+const UiStat = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /** Direção da tendência. */
+        this.trend = "neutral";
+    }
+    renderArrow() {
+        if (this.trend === "down") {
+            return (h("svg", { width: "10", height: "10", viewBox: "0 0 12 12", fill: "currentColor", "aria-hidden": "true" }, h("path", { d: "M6 11 1 4h10z" })));
+        }
+        if (this.trend === "up") {
+            return (h("svg", { width: "10", height: "10", viewBox: "0 0 12 12", fill: "currentColor", "aria-hidden": "true" }, h("path", { d: "M6 1 11 8H1z" })));
+        }
+        return null;
+    }
+    render() {
+        return (h(Host, { key: '7afc03397921ff23d08da136999896a40d8a31be' }, h("div", { key: '35a7d594e9ebb426f10ff256ba4805ee88a0100c', class: "card" }, h("p", { key: '92a82cf415c22f884ed782d410e25559ff391017', class: "label" }, this.label), h("div", { key: '1c8d08800ca0a6f38e574930c5187ec979666a62', class: "value-row" }, h("span", { key: '0bb5e825e9d51a045638f48616c24bdc7a4a0ee0', class: "value" }, this.value), this.delta && (h("span", { key: '01aa434582c8eee2c1fd6b69c16de0262fb89daf', class: { delta: true, [`trend-${this.trend}`]: true } }, this.renderArrow(), this.delta))), h("div", { key: '4446e15c156412cc8b6c72f823a49396f31e8e74', class: "extra" }, h("slot", { key: 'ca4e0cc60f588840d3fd88e3efaecabb84cd633d' })))));
+    }
+};
+UiStat.style = uiStatCss();
+
+export { UiStat as ui_stat };

package/dist/esm/ui-switch.entry.js

@@ -24,7 +24,7 @@ const UiSwitch = class {
         };
     }
     render() {
-        return (h(Host, { key: '495f30df67c0277471c4d01920f5608700943132' }, h("button", { key: '8327f2d141877994b6ddd3ba8b474e816cb2f949', class: "switch", type: "button", role: "switch", "aria-checked": this.checked ? "true" : "false", disabled: this.disabled, onClick: this.toggle, onKeyDown: this.onKeyDown }, h("span", { key: 'e91d3ffd7b8fdfb1a64f96746c5a396ecaecb882', class: "thumb" }))));
+        return (h(Host, { key: '018ccd47d567e5c16ce40a600c15a9e2281301d2' }, h("button", { key: '7975d671d3c6d048b760b285a68e9ae832c93ebc', class: "switch", type: "button", role: "switch", "aria-checked": this.checked ? "true" : "false", disabled: this.disabled, onClick: this.toggle, onKeyDown: this.onKeyDown }, h("span", { key: '4ac740348a215ff97e0cae3bbbbd411163760792', class: "thumb" }))));
     }
 };
 UiSwitch.style = uiSwitchCss();