@vielzeug/refine 1.1.3 → 1.3.1

package/dist/overlay/command-palette/command-palette.types.d.ts

@@ -0,0 +1,76 @@
+import type { DialogCloseReason, OverlayOpenDetail } from '../../headless';
+export type CommandPaletteItemInput = {
+    disabled?: boolean;
+    /** Group heading the item is rendered under. Items sharing a group are clustered together. */
+    group?: string;
+    /** Lucide icon name (e.g. `"file-plus"`), rendered via `ore-icon` at the start of the row. */
+    icon?: string;
+    /** Extra search terms matched against the query in addition to the label. */
+    keywords?: string[];
+    label?: string;
+    /**
+     * Display-only shortcut hint rendered at the end of the row, one `<kbd>` per key — separate
+     * keys with `+` (e.g. `"⌘+S"`). Purely visual — not bound to a live key handler. A literal
+     * `+` key itself isn't representable this way — spell it out instead (e.g. `"Ctrl+Plus"`).
+     */
+    shortcut?: string;
+    value: string;
+};
+export type CommandPaletteItem = {
+    disabled: boolean;
+    group?: string;
+    icon?: string;
+    keywords: string[];
+    label: string;
+    shortcut?: string;
+    value: string;
+};
+export type CommandPaletteSelectDetail = {
+    item: CommandPaletteItem;
+    label: string;
+    value: string;
+};
+export type OreCommandPaletteEvents = {
+    close: {
+        reason: DialogCloseReason;
+    };
+    open: OverlayOpenDetail;
+    search: {
+        query: string;
+    };
+    select: CommandPaletteSelectDetail;
+};
+export type OreCommandPaletteProps = {
+    /** Text shown when no item matches the current query. */
+    'empty-text'?: string;
+    /** JS items array — alternative or supplement to slotted `<ore-command-palette-item>` elements. */
+    items?: CommandPaletteItemInput[];
+    /** Keep the palette open after an item is selected. Default: closes on select. */
+    'keep-open-on-select'?: boolean;
+    /** Accessible label for the dialog (also the visually-hidden heading read by screen readers). */
+    label?: string;
+    /** Shows a loading row below the search input (e.g. while results are fetched asynchronously). */
+    loading?: boolean;
+    /** Disables built-in client-side filtering — use when `items` is already filtered server-side. */
+    'no-filter'?: boolean;
+    /** Controls the open state of the palette. */
+    open?: boolean;
+    /** Placeholder text for the search input. */
+    placeholder?: string;
+    /**
+     * Global keyboard shortcut (in `@vielzeug/keymap` syntax, e.g. `"mod+k"`) that toggles the
+     * palette open/closed from anywhere on the page. Set to an empty string to disable — useful
+     * when the host application already manages its own trigger and shortcut.
+     */
+    shortcut?: string;
+};
+export type OreCommandPaletteItemProps = {
+    disabled?: boolean;
+    group?: string;
+    icon?: string;
+    /** Explicit label text; falls back to the element's text content. */
+    label?: string;
+    shortcut?: string;
+    value?: string;
+};
+//# sourceMappingURL=command-palette.types.d.ts.map

package/dist/overlay/command-palette/command-palette.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-palette.types.d.ts","sourceRoot":"","sources":["../../../src/overlay/command-palette/command-palette.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAE3E,MAAM,MAAM,uBAAuB,GAAG;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8FAA8F;IAC9F,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8FAA8F;IAC9F,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,6EAA6E;IAC7E,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACvC,IAAI,EAAE,kBAAkB,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG;IACpC,KAAK,EAAE;QAAE,MAAM,EAAE,iBAAiB,CAAA;KAAE,CAAC;IACrC,IAAI,EAAE,iBAAiB,CAAC;IACxB,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1B,MAAM,EAAE,0BAA0B,CAAC;CACpC,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC,yDAAyD;IACzD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mGAAmG;IACnG,KAAK,CAAC,EAAE,uBAAuB,EAAE,CAAC;IAClC,kFAAkF;IAClF,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,iGAAiG;IACjG,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kGAAkG;IAClG,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kGAAkG;IAClG,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8CAA8C;IAC9C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qEAAqE;IACrE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC"}

package/dist/overlay/dialog/{dialog.css?inline.cjs → dialog.css.cjs}

@@ -1,2 +1,2 @@
 var e=`@layer refine.base{:host{--_radius:var(--dialog-radius,var(--rounded-lg));--_padding:var(--dialog-padding,var(--size-4));--_gap:var(--dialog-gap,var(--size-4));--_max-width:var(--dialog-max-width,32rem);--_elevation:var(--shadow-xl);--_backdrop-filter:none;--_backdrop-bg:var(--dialog-backdrop,color-mix(in oklch, var(--color-canvas) 40%, transparent));--_panel-bg:var(--dialog-bg,var(--color-canvas));--_panel-blur:var(--dialog-panel-blur,var(--blur-md));--_panel-border-color:var(--dialog-border-color,var(--color-divider));display:contents}dialog{all:unset;box-sizing:border-box;pointer-events:none;width:100%;max-width:100%;height:100%;max-height:100%;transition:display .2s allow-discrete, overlay .2s allow-discrete;background:0 0;border:none;justify-content:center;align-items:center;margin:0;padding:0;display:flex;position:fixed;inset:0;overflow:hidden}dialog:not([open]),dialog:not([open]) .panel{display:none}dialog[open]{pointer-events:auto}dialog::backdrop{background:var(--_backdrop-bg);opacity:1;-webkit-backdrop-filter:var(--_backdrop-filter);backdrop-filter:var(--_backdrop-filter);transition:opacity var(--transition-normal), overlay var(--transition-normal) allow-discrete, display var(--transition-normal) allow-discrete}@starting-style{dialog::backdrop{opacity:0}}dialog.closing::backdrop{opacity:0;transition:opacity .15s var(--ease-in-out), overlay .15s allow-discrete, display .15s allow-discrete}.panel{box-sizing:border-box;width:var(--_max-width);max-width:calc(100vw - var(--size-8));max-height:calc(100dvh - var(--size-8));background:var(--_panel-bg);border:var(--border) solid var(--_panel-border-color);border-radius:var(--_radius);box-shadow:var(--dialog-shadow,var(--_elevation));opacity:1;-webkit-backdrop-filter:blur(var(--_panel-blur));backdrop-filter:blur(var(--_panel-blur));transition:opacity .2s var(--ease-spring), transform .2s var(--ease-spring);flex-direction:column;display:flex;position:relative;overflow:hidden;transform:scale(1)translateY(0)}@starting-style{.panel{opacity:0;transform:scale(var(--overlay-enter-scale-dialog)) translateY(4px)}}dialog.closing .panel{opacity:0;transform:scale(var(--overlay-enter-scale-dialog)) translateY(4px);transition:opacity .15s var(--ease-spring), transform .15s var(--ease-spring)}.panel[data-size=sm]{--_max-width:var(--dialog-max-width,22rem)}.panel[data-size=md]{--_max-width:var(--dialog-max-width,32rem)}.panel[data-size=lg]{--_max-width:var(--dialog-max-width,48rem)}.panel[data-size=xl]{--_max-width:var(--dialog-max-width,64rem)}.panel[data-size=full]{width:calc(100vw - var(--size-8));max-width:calc(100vw - var(--size-8));max-height:calc(100dvh - var(--size-8))}.header{gap:var(--size-2);padding:var(--_padding);flex-shrink:0;align-items:center;padding-bottom:0;display:flex}.header[hidden]{display:none}.title{font-size:var(--text-lg);font-weight:var(--font-semibold);line-height:var(--leading-tight);color:var(--color-contrast-900);flex:1}.close{width:var(--size-8);min-width:var(--_touch-target);height:var(--size-8);min-height:var(--_touch-target);color:var(--color-contrast-500);cursor:pointer;border-radius:var(--rounded-md);transition:background var(--transition-fast), color var(--transition-fast);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}.close:not(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-left:auto}.close:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-right:auto}.close:hover{color:var(--color-contrast-900);background:var(--color-contrast-200)}.close:focus-visible{outline:var(--border-2) solid var(--color-focus);outline-offset:var(--border-2)}.close[hidden]{display:none}.body{padding:var(--_padding);overscroll-behavior:contain;font-size:var(--text-sm);line-height:var(--leading-relaxed);color:var(--color-contrast-700);flex:1;overflow-y:auto}.footer{gap:var(--_gap);padding:var(--_padding);flex-wrap:wrap;flex-shrink:0;justify-content:flex-end;align-items:center;padding-top:0;display:flex}.footer[hidden]{display:none}.header:not([hidden])+.body{padding-top:var(--size-4)}.body+.footer:not([hidden]){padding-top:var(--size-4);border-top:var(--border) solid var(--color-contrast-100)}@media (width<=640px){.panel,.panel[data-size=sm],.panel[data-size=md],.panel[data-size=lg],.panel[data-size=xl]{width:calc(100vw - var(--size-4));max-width:calc(100vw - var(--size-4));max-height:calc(100dvh - var(--size-4))}.header,.body,.footer{padding-inline:var(--size-3)}}}@layer refine.config{:host([backdrop=blur]){--_backdrop-filter:blur(var(--blur-xs))}:host([backdrop=transparent]){--_backdrop-bg:transparent}:host([elevation=none]){--_elevation:var(--shadow-none)}:host([elevation=sm]){--_elevation:var(--shadow-sm)}:host([elevation=md]){--_elevation:var(--shadow-md)}:host([elevation=lg]){--_elevation:var(--shadow-lg)}:host([elevation=xl]){--_elevation:var(--shadow-xl)}:host([elevation="2xl"]){--_elevation:var(--shadow-2xl)}:host([padding=none]){--_padding:var(--size-0)}:host([padding=sm]){--_padding:var(--size-3)}:host([padding=md]){--_padding:var(--size-4)}:host([padding=lg]){--_padding:var(--size-6)}:host([padding=xl]){--_padding:var(--size-8)}}`;exports.default=e;
-//# sourceMappingURL=dialog.css?inline.cjs.map
+//# sourceMappingURL=dialog.css.cjs.map

package/dist/overlay/dialog/dialog.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.css.cjs","names":[],"sources":["../../../src/overlay/dialog/dialog.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    --_radius: var(--dialog-radius, var(--rounded-lg));\n    --_padding: var(--dialog-padding, var(--size-4));\n    --_gap: var(--dialog-gap, var(--size-4));\n    --_max-width: var(--dialog-max-width, 32rem);\n    --_elevation: var(--shadow-xl);\n    --_backdrop-filter: none;\n    --_backdrop-bg: var(--dialog-backdrop, color-mix(in oklch, var(--color-canvas) 40%, transparent));\n    --_panel-bg: var(--dialog-bg, var(--color-canvas));\n    --_panel-blur: var(--dialog-panel-blur, var(--blur-md));\n    --_panel-border-color: var(--dialog-border-color, var(--color-divider));\n\n    display: contents;\n  }\n\n  /* =====================\n       Native <dialog> resets\n       ===================== */\n\n  dialog {\n    all: unset;\n    position: fixed;\n    inset: 0;\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    max-width: 100%;\n    height: 100%;\n    max-height: 100%;\n    padding: 0;\n    margin: 0;\n    overflow: hidden;\n    pointer-events: none;\n    background: transparent;\n    border: none;\n\n    /* display + overlay allow-discrete hold the element in the top layer during exit\n       and let @starting-style fire on entry via showModal().\n       Use fixed 200ms — --transition-normal resolves to 'none' under reduced-motion\n       which makes the entire declaration syntactically invalid if used here. */\n    transition:\n      display 200ms allow-discrete,\n      overlay 200ms allow-discrete;\n  }\n\n  /* all:unset removes the UA stylesheet's dialog:not([open]){display:none} — restore it */\n  dialog:not([open]) {\n    display: none;\n  }\n\n  dialog:not([open]) .panel {\n    display: none;\n  }\n\n  dialog[open] {\n    pointer-events: auto;\n  }\n\n  dialog::backdrop {\n    background: var(--_backdrop-bg);\n    opacity: 1;\n    backdrop-filter: var(--_backdrop-filter);\n    transition:\n      opacity var(--transition-normal),\n      overlay var(--transition-normal) allow-discrete,\n      display var(--transition-normal) allow-discrete;\n\n    @starting-style {\n      opacity: 0;\n    }\n  }\n\n  dialog.closing::backdrop {\n    opacity: 0;\n    transition:\n      opacity 150ms var(--ease-in-out),\n      overlay 150ms allow-discrete,\n      display 150ms allow-discrete;\n  }\n\n  /* =====================\n       Panel (the visible dialog box)\n       ===================== */\n\n  .panel {\n    position: relative;\n    box-sizing: border-box;\n    display: flex;\n    flex-direction: column;\n    width: var(--_max-width);\n    max-width: calc(100vw - var(--size-8));\n    max-height: calc(100dvh - var(--size-8));\n    overflow: hidden;\n    background: var(--_panel-bg);\n    border: var(--border) solid var(--_panel-border-color);\n    border-radius: var(--_radius);\n    box-shadow: var(--dialog-shadow, var(--_elevation));\n    opacity: 1;\n    backdrop-filter: blur(var(--_panel-blur));\n    transform: scale(1) translateY(0);\n    transition:\n      opacity 200ms var(--ease-spring),\n      transform 200ms var(--ease-spring);\n\n    @starting-style {\n      opacity: 0;\n      transform: scale(var(--overlay-enter-scale-dialog)) translateY(4px);\n    }\n  }\n\n  dialog.closing .panel {\n    opacity: 0;\n    transform: scale(var(--overlay-enter-scale-dialog)) translateY(4px);\n    transition:\n      opacity 150ms var(--ease-spring),\n      transform 150ms var(--ease-spring);\n  }\n\n  /* =====================\n       Sizes\n       ===================== */\n\n  .panel[data-size='sm'] {\n    --_max-width: var(--dialog-max-width, 22rem);\n  }\n\n  .panel[data-size='md'] {\n    --_max-width: var(--dialog-max-width, 32rem);\n  }\n\n  .panel[data-size='lg'] {\n    --_max-width: var(--dialog-max-width, 48rem);\n  }\n\n  .panel[data-size='xl'] {\n    --_max-width: var(--dialog-max-width, 64rem);\n  }\n\n  .panel[data-size='full'] {\n    width: calc(100vw - var(--size-8));\n    max-width: calc(100vw - var(--size-8));\n    max-height: calc(100dvh - var(--size-8));\n  }\n\n  /* =====================\n       Header\n       ===================== */\n\n  .header {\n    display: flex;\n    flex-shrink: 0;\n    gap: var(--size-2);\n    align-items: center;\n    padding: var(--_padding);\n    padding-bottom: 0;\n  }\n\n  .header[hidden] {\n    display: none;\n  }\n\n  .title {\n    flex: 1;\n    font-size: var(--text-lg);\n    font-weight: var(--font-semibold);\n    line-height: var(--leading-tight);\n    color: var(--color-contrast-900);\n  }\n\n  .close {\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    width: var(--size-8);\n    min-width: var(--_touch-target);\n    height: var(--size-8);\n    min-height: var(--_touch-target);\n    padding: 0;\n    margin-inline-start: auto;\n    color: var(--color-contrast-500);\n    cursor: pointer;\n    background: transparent;\n    border: none;\n    border-radius: var(--rounded-md);\n    transition:\n      background var(--transition-fast),\n      color var(--transition-fast);\n  }\n\n  .close:hover {\n    color: var(--color-contrast-900);\n    background: var(--color-contrast-200);\n  }\n\n  .close:focus-visible {\n    outline: var(--border-2) solid var(--color-focus);\n    outline-offset: var(--border-2);\n  }\n\n  .close[hidden] {\n    display: none;\n  }\n\n  /* =====================\n       Body\n       ===================== */\n\n  .body {\n    flex: 1;\n    padding: var(--_padding);\n    overflow-y: auto;\n    overscroll-behavior: contain;\n    font-size: var(--text-sm);\n    line-height: var(--leading-relaxed);\n    color: var(--color-contrast-700);\n  }\n\n  /* =====================\n       Footer\n       ===================== */\n\n  .footer {\n    display: flex;\n    flex-shrink: 0;\n    flex-wrap: wrap;\n    gap: var(--_gap);\n    align-items: center;\n    justify-content: flex-end;\n    padding: var(--_padding);\n    padding-top: 0;\n  }\n\n  .footer[hidden] {\n    display: none;\n  }\n\n  /* =====================\n       Dividers when header/footer present\n       ===================== */\n\n  .header:not([hidden]) + .body {\n    padding-top: var(--size-4);\n  }\n\n  .body + .footer:not([hidden]) {\n    padding-top: var(--size-4);\n    border-top: var(--border) solid var(--color-contrast-100);\n  }\n\n  @media (width <= 640px) {\n    .panel,\n    .panel[data-size='sm'],\n    .panel[data-size='md'],\n    .panel[data-size='lg'],\n    .panel[data-size='xl'] {\n      width: calc(100vw - var(--size-4));\n      max-width: calc(100vw - var(--size-4));\n      max-height: calc(100dvh - var(--size-4));\n    }\n\n    .header,\n    .body,\n    .footer {\n      padding-inline: var(--size-3);\n    }\n  }\n}\n\n@layer refine.config {\n  :host([backdrop='blur']) {\n    --_backdrop-filter: blur(var(--blur-xs));\n  }\n\n  :host([backdrop='transparent']) {\n    --_backdrop-bg: transparent;\n  }\n\n  /* Panel elevation / shadow scale */\n  :host([elevation='none']) {\n    --_elevation: var(--shadow-none);\n  }\n\n  :host([elevation='sm']) {\n    --_elevation: var(--shadow-sm);\n  }\n\n  :host([elevation='md']) {\n    --_elevation: var(--shadow-md);\n  }\n\n  :host([elevation='lg']) {\n    --_elevation: var(--shadow-lg);\n  }\n\n  :host([elevation='xl']) {\n    --_elevation: var(--shadow-xl);\n  }\n\n  :host([elevation='2xl']) {\n    --_elevation: var(--shadow-2xl);\n  }\n\n  /* Padding scale */\n  :host([padding='none']) {\n    --_padding: var(--size-0);\n  }\n\n  :host([padding='sm']) {\n    --_padding: var(--size-3);\n  }\n\n  :host([padding='md']) {\n    --_padding: var(--size-4);\n  }\n\n  :host([padding='lg']) {\n    --_padding: var(--size-6);\n  }\n\n  :host([padding='xl']) {\n    --_padding: var(--size-8);\n  }\n}\n"],"mappings":""}

package/dist/overlay/dialog/{dialog.css?inline.js → dialog.css.js}

@@ -3,4 +3,4 @@ var e = "@layer refine.base{:host{--_radius:var(--dialog-radius,var(--rounded-lg
 //#endregion
 export { e as default };
 
-//# sourceMappingURL=dialog.css?inline.js.map
+//# sourceMappingURL=dialog.css.js.map

package/dist/overlay/dialog/dialog.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.css.js","names":[],"sources":["../../../src/overlay/dialog/dialog.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    --_radius: var(--dialog-radius, var(--rounded-lg));\n    --_padding: var(--dialog-padding, var(--size-4));\n    --_gap: var(--dialog-gap, var(--size-4));\n    --_max-width: var(--dialog-max-width, 32rem);\n    --_elevation: var(--shadow-xl);\n    --_backdrop-filter: none;\n    --_backdrop-bg: var(--dialog-backdrop, color-mix(in oklch, var(--color-canvas) 40%, transparent));\n    --_panel-bg: var(--dialog-bg, var(--color-canvas));\n    --_panel-blur: var(--dialog-panel-blur, var(--blur-md));\n    --_panel-border-color: var(--dialog-border-color, var(--color-divider));\n\n    display: contents;\n  }\n\n  /* =====================\n       Native <dialog> resets\n       ===================== */\n\n  dialog {\n    all: unset;\n    position: fixed;\n    inset: 0;\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    max-width: 100%;\n    height: 100%;\n    max-height: 100%;\n    padding: 0;\n    margin: 0;\n    overflow: hidden;\n    pointer-events: none;\n    background: transparent;\n    border: none;\n\n    /* display + overlay allow-discrete hold the element in the top layer during exit\n       and let @starting-style fire on entry via showModal().\n       Use fixed 200ms — --transition-normal resolves to 'none' under reduced-motion\n       which makes the entire declaration syntactically invalid if used here. */\n    transition:\n      display 200ms allow-discrete,\n      overlay 200ms allow-discrete;\n  }\n\n  /* all:unset removes the UA stylesheet's dialog:not([open]){display:none} — restore it */\n  dialog:not([open]) {\n    display: none;\n  }\n\n  dialog:not([open]) .panel {\n    display: none;\n  }\n\n  dialog[open] {\n    pointer-events: auto;\n  }\n\n  dialog::backdrop {\n    background: var(--_backdrop-bg);\n    opacity: 1;\n    backdrop-filter: var(--_backdrop-filter);\n    transition:\n      opacity var(--transition-normal),\n      overlay var(--transition-normal) allow-discrete,\n      display var(--transition-normal) allow-discrete;\n\n    @starting-style {\n      opacity: 0;\n    }\n  }\n\n  dialog.closing::backdrop {\n    opacity: 0;\n    transition:\n      opacity 150ms var(--ease-in-out),\n      overlay 150ms allow-discrete,\n      display 150ms allow-discrete;\n  }\n\n  /* =====================\n       Panel (the visible dialog box)\n       ===================== */\n\n  .panel {\n    position: relative;\n    box-sizing: border-box;\n    display: flex;\n    flex-direction: column;\n    width: var(--_max-width);\n    max-width: calc(100vw - var(--size-8));\n    max-height: calc(100dvh - var(--size-8));\n    overflow: hidden;\n    background: var(--_panel-bg);\n    border: var(--border) solid var(--_panel-border-color);\n    border-radius: var(--_radius);\n    box-shadow: var(--dialog-shadow, var(--_elevation));\n    opacity: 1;\n    backdrop-filter: blur(var(--_panel-blur));\n    transform: scale(1) translateY(0);\n    transition:\n      opacity 200ms var(--ease-spring),\n      transform 200ms var(--ease-spring);\n\n    @starting-style {\n      opacity: 0;\n      transform: scale(var(--overlay-enter-scale-dialog)) translateY(4px);\n    }\n  }\n\n  dialog.closing .panel {\n    opacity: 0;\n    transform: scale(var(--overlay-enter-scale-dialog)) translateY(4px);\n    transition:\n      opacity 150ms var(--ease-spring),\n      transform 150ms var(--ease-spring);\n  }\n\n  /* =====================\n       Sizes\n       ===================== */\n\n  .panel[data-size='sm'] {\n    --_max-width: var(--dialog-max-width, 22rem);\n  }\n\n  .panel[data-size='md'] {\n    --_max-width: var(--dialog-max-width, 32rem);\n  }\n\n  .panel[data-size='lg'] {\n    --_max-width: var(--dialog-max-width, 48rem);\n  }\n\n  .panel[data-size='xl'] {\n    --_max-width: var(--dialog-max-width, 64rem);\n  }\n\n  .panel[data-size='full'] {\n    width: calc(100vw - var(--size-8));\n    max-width: calc(100vw - var(--size-8));\n    max-height: calc(100dvh - var(--size-8));\n  }\n\n  /* =====================\n       Header\n       ===================== */\n\n  .header {\n    display: flex;\n    flex-shrink: 0;\n    gap: var(--size-2);\n    align-items: center;\n    padding: var(--_padding);\n    padding-bottom: 0;\n  }\n\n  .header[hidden] {\n    display: none;\n  }\n\n  .title {\n    flex: 1;\n    font-size: var(--text-lg);\n    font-weight: var(--font-semibold);\n    line-height: var(--leading-tight);\n    color: var(--color-contrast-900);\n  }\n\n  .close {\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    width: var(--size-8);\n    min-width: var(--_touch-target);\n    height: var(--size-8);\n    min-height: var(--_touch-target);\n    padding: 0;\n    margin-inline-start: auto;\n    color: var(--color-contrast-500);\n    cursor: pointer;\n    background: transparent;\n    border: none;\n    border-radius: var(--rounded-md);\n    transition:\n      background var(--transition-fast),\n      color var(--transition-fast);\n  }\n\n  .close:hover {\n    color: var(--color-contrast-900);\n    background: var(--color-contrast-200);\n  }\n\n  .close:focus-visible {\n    outline: var(--border-2) solid var(--color-focus);\n    outline-offset: var(--border-2);\n  }\n\n  .close[hidden] {\n    display: none;\n  }\n\n  /* =====================\n       Body\n       ===================== */\n\n  .body {\n    flex: 1;\n    padding: var(--_padding);\n    overflow-y: auto;\n    overscroll-behavior: contain;\n    font-size: var(--text-sm);\n    line-height: var(--leading-relaxed);\n    color: var(--color-contrast-700);\n  }\n\n  /* =====================\n       Footer\n       ===================== */\n\n  .footer {\n    display: flex;\n    flex-shrink: 0;\n    flex-wrap: wrap;\n    gap: var(--_gap);\n    align-items: center;\n    justify-content: flex-end;\n    padding: var(--_padding);\n    padding-top: 0;\n  }\n\n  .footer[hidden] {\n    display: none;\n  }\n\n  /* =====================\n       Dividers when header/footer present\n       ===================== */\n\n  .header:not([hidden]) + .body {\n    padding-top: var(--size-4);\n  }\n\n  .body + .footer:not([hidden]) {\n    padding-top: var(--size-4);\n    border-top: var(--border) solid var(--color-contrast-100);\n  }\n\n  @media (width <= 640px) {\n    .panel,\n    .panel[data-size='sm'],\n    .panel[data-size='md'],\n    .panel[data-size='lg'],\n    .panel[data-size='xl'] {\n      width: calc(100vw - var(--size-4));\n      max-width: calc(100vw - var(--size-4));\n      max-height: calc(100dvh - var(--size-4));\n    }\n\n    .header,\n    .body,\n    .footer {\n      padding-inline: var(--size-3);\n    }\n  }\n}\n\n@layer refine.config {\n  :host([backdrop='blur']) {\n    --_backdrop-filter: blur(var(--blur-xs));\n  }\n\n  :host([backdrop='transparent']) {\n    --_backdrop-bg: transparent;\n  }\n\n  /* Panel elevation / shadow scale */\n  :host([elevation='none']) {\n    --_elevation: var(--shadow-none);\n  }\n\n  :host([elevation='sm']) {\n    --_elevation: var(--shadow-sm);\n  }\n\n  :host([elevation='md']) {\n    --_elevation: var(--shadow-md);\n  }\n\n  :host([elevation='lg']) {\n    --_elevation: var(--shadow-lg);\n  }\n\n  :host([elevation='xl']) {\n    --_elevation: var(--shadow-xl);\n  }\n\n  :host([elevation='2xl']) {\n    --_elevation: var(--shadow-2xl);\n  }\n\n  /* Padding scale */\n  :host([padding='none']) {\n    --_padding: var(--size-0);\n  }\n\n  :host([padding='sm']) {\n    --_padding: var(--size-3);\n  }\n\n  :host([padding='md']) {\n    --_padding: var(--size-4);\n  }\n\n  :host([padding='lg']) {\n    --_padding: var(--size-6);\n  }\n\n  :host([padding='xl']) {\n    --_padding: var(--size-8);\n  }\n}\n"],"mappings":""}

package/dist/overlay/drawer/{drawer.css?inline.cjs → drawer.css.cjs}

@@ -1,2 +1,2 @@
 var e=`@layer refine.base{:host{--_backdrop-bg:var(--drawer-backdrop-bg,color-mix(in oklch, var(--color-canvas) 40%, transparent));--_backdrop-filter:none;--_panel-bg:var(--drawer-bg,var(--color-canvas));--_panel-blur:var(--drawer-panel-blur,var(--blur-md));--_panel-shadow:var(--drawer-shadow,var(--shadow-xl));--_panel-border-color:var(--color-divider);--_panel-bleed:var(--size-8);--_drag-handle-inset:calc(var(--size-1) * -1);display:contents}dialog{all:unset;box-sizing:border-box;pointer-events:none;width:100%;max-width:100%;height:100%;max-height:100%;transition:display .2s allow-discrete, overlay .2s allow-discrete;display:flex;position:fixed;inset:0}dialog:not([open]),dialog:not([open]) .panel{display:none}dialog[open]{pointer-events:auto;display:flex}dialog::backdrop{background:var(--_backdrop-bg);opacity:1;-webkit-backdrop-filter:var(--_backdrop-filter);backdrop-filter:var(--_backdrop-filter);transition:display .2s allow-discrete, overlay .2s allow-discrete, opacity var(--transition-normal), backdrop-filter var(--transition-normal)}@starting-style{dialog::backdrop{opacity:0;-webkit-backdrop-filter:blur();backdrop-filter:blur()}}dialog.closing::backdrop{opacity:0;-webkit-backdrop-filter:blur();backdrop-filter:blur();transition:opacity .3s var(--ease-in-out), backdrop-filter .3s var(--ease-in-out), overlay .3s allow-discrete, display .3s allow-discrete}.panel{box-sizing:border-box;background:var(--_panel-bg);border:var(--border) solid var(--_panel-border-color);box-shadow:var(--_panel-shadow);opacity:1;-webkit-backdrop-filter:blur(var(--_panel-blur));backdrop-filter:blur(var(--_panel-blur));transition:opacity var(--transition-normal), transform .3s var(--ease-move);flex-direction:column;display:flex;position:absolute;overflow:visible;transform:translate(0)}@starting-style{.panel{opacity:0;transform:var(--_panel-exit-transform,translate3d(0, 0, 0))}}dialog.closing .panel{opacity:0;transform:var(--_panel-exit-transform,translate3d(0, 0, 0))}:host([placement=left]) .panel{--_panel-exit-transform:translateX(calc(-100% - var(--_panel-bleed)));width:calc(var(--drawer-size,20rem) + var(--_panel-bleed));max-width:calc(100dvw + var(--_panel-bleed));border-top:none;border-bottom:none;top:0;bottom:0}:host([placement=left]) .panel:not(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-left:calc(var(--_panel-bleed) * -1);padding-left:var(--_panel-bleed);border-left:none;left:0}:host([placement=left]) .panel:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-right:calc(var(--_panel-bleed) * -1);padding-right:var(--_panel-bleed);border-right:none;right:0}:host(:not([placement])) .panel,:host([placement=right]) .panel{--_panel-exit-transform:translateX(calc(100% + var(--_panel-bleed)));width:calc(var(--drawer-size,20rem) + var(--_panel-bleed));max-width:calc(100dvw + var(--_panel-bleed));border-top:none;border-bottom:none;top:0;bottom:0}:host(:not([placement])) .panel:not(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),:host([placement=right]) .panel:not(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-right:calc(var(--_panel-bleed) * -1);padding-right:var(--_panel-bleed);border-right:none;right:0}:host(:not([placement])) .panel:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-left:calc(var(--_panel-bleed) * -1);padding-left:var(--_panel-bleed);border-left:none;left:0}:host([placement=right]) .panel:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-left:calc(var(--_panel-bleed) * -1);padding-left:var(--_panel-bleed);border-left:none;left:0}:host([placement=top]) .panel{--_panel-exit-transform:translateY(calc(-100% - var(--_panel-bleed)));height:calc(var(--drawer-size,16rem) + var(--_panel-bleed));max-height:calc(100dvh + var(--_panel-bleed));margin-top:calc(var(--_panel-bleed) * -1);padding-top:var(--_panel-bleed);border-top:none;border-left:none;border-right:none;top:0;left:0;right:0}:host([placement=bottom]) .panel{--_panel-exit-transform:translateY(calc(100% + var(--_panel-bleed)));height:calc(var(--drawer-size,16rem) + var(--_panel-bleed));max-height:calc(100dvh + var(--_panel-bleed));margin-bottom:calc(var(--_panel-bleed) * -1);padding-bottom:var(--_panel-bleed);border-bottom:none;border-left:none;border-right:none;bottom:0;left:0;right:0}:host(:dir(rtl)[placement=left]) .panel{--_panel-exit-transform:translateX(calc(100% + var(--_panel-bleed)))}:host(:dir(rtl)[placement=right]) .panel,:host(:dir(rtl):not([placement])) .panel{--_panel-exit-transform:translateX(calc(-100% - var(--_panel-bleed)))}:host([size=sm]){--drawer-size:14rem}:host([size=lg]){--drawer-size:32rem}:host([size=full]){--drawer-size:100%}:host([size=full]) .panel{width:calc(100% + var(--_panel-bleed));max-width:none;height:calc(100% + var(--_panel-bleed));border:none;max-height:none}.header{gap:var(--size-2);padding:var(--size-4);border-bottom:var(--border) solid var(--color-contrast-200);flex-shrink:0;align-items:center;display:flex}.header-title{text-overflow:ellipsis;min-width:0;font-size:var(--text-lg);font-weight:var(--font-semibold);white-space:nowrap;flex:1;overflow:hidden}.body{padding:var(--size-4);flex:1;overflow-y:auto}.footer{gap:var(--size-2);padding:var(--size-4);border-top:var(--border) solid var(--color-contrast-200);flex-shrink:0;justify-content:flex-end;display:flex}.header[hidden],.footer[hidden],.close-btn[hidden]{display:none}.close-btn{all:unset;box-sizing:border-box;width:var(--size-8);height:var(--size-8);color:var(--color-contrast-500);cursor:pointer;border-radius:var(--rounded-sm);transition:background var(--transition-fast), color var(--transition-fast);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.close-btn:not(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-left:auto}.close-btn:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){margin-right:auto}.close-btn:hover{color:var(--color-contrast-800);background:var(--color-contrast-200)}.close-btn:active{opacity:.8}.drag-handle{z-index:10;pointer-events:all;touch-action:none;cursor:grab;position:absolute}.drag-handle:active{cursor:grabbing}:host([placement=left]) .drag-handle,:host(:not([placement])) .drag-handle,:host([placement=right]) .drag-handle{width:var(--_panel-bleed);height:3.5rem;top:50%;translate:0 -50%}:host([placement=left]) .drag-handle{right:calc(var(--_panel-bleed) * -1)}:host([placement=right]) .drag-handle,:host(:not([placement])) .drag-handle{left:calc(var(--_panel-bleed) * -1)}:host([placement=top]) .drag-handle,:host([placement=bottom]) .drag-handle{width:3.5rem;height:var(--_panel-bleed);left:50%;translate:-50%}:host([placement=top]) .drag-handle{bottom:calc(var(--_panel-bleed) * -1)}:host([placement=bottom]) .drag-handle{top:calc(var(--_panel-bleed) * -1)}:host([drag-handle-placement=inset][placement=left]) .drag-handle{right:var(--_drag-handle-inset)}:host([drag-handle-placement=inset][placement=right]) .drag-handle,:host([drag-handle-placement=inset]:not([placement])) .drag-handle{left:var(--_drag-handle-inset)}:host([drag-handle-placement=inset][placement=top]) .drag-handle{bottom:var(--_drag-handle-inset)}:host([drag-handle-placement=inset][placement=bottom]) .drag-handle{top:var(--_drag-handle-inset)}.drag-handle:before{content:"";background:var(--color-contrast-400);border-radius:var(--rounded-full);opacity:.6;transition:background var(--transition-fast), opacity var(--transition-fast), transform var(--transition-fast);position:absolute;inset:50%;translate:-50% -50%}:host([placement=left]) .drag-handle:before,:host([placement=right]) .drag-handle:before,:host(:not([placement])) .drag-handle:before{width:5px;height:2.5rem}:host([placement=top]) .drag-handle:before,:host([placement=bottom]) .drag-handle:before{width:2.5rem;height:5px}.drag-handle:hover:before{background:var(--color-contrast-600);opacity:.9;transform:scale(1.15)}.close-btn:focus-visible{outline:var(--focus-ring)}@media (width<=640px){:host([placement=left]) .panel,:host(:not([placement])) .panel,:host([placement=right]) .panel{width:calc(min(var(--drawer-size,20rem), calc(100vw - var(--size-2))) + var(--_panel-bleed));max-width:calc(100vw - var(--size-2) + var(--_panel-bleed))}:host([placement=top]) .panel,:host([placement=bottom]) .panel{height:calc(min(var(--drawer-size,16rem), calc(100dvh - var(--size-2))) + var(--_panel-bleed));max-height:calc(100dvh - var(--size-2) + var(--_panel-bleed))}.header,.body,.footer{padding:var(--size-3)}}}@layer refine.config{:host([backdrop=blur]){--_backdrop-filter:blur(var(--blur-xs))}:host([backdrop=transparent]){--_backdrop-bg:transparent}}`;exports.default=e;
-//# sourceMappingURL=drawer.css?inline.cjs.map
+//# sourceMappingURL=drawer.css.cjs.map

package/dist/overlay/drawer/drawer.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.css.cjs","names":[],"sources":["../../../src/overlay/drawer/drawer.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    --_backdrop-bg: var(--drawer-backdrop-bg, color-mix(in oklch, var(--color-canvas) 40%, transparent));\n    --_backdrop-filter: none;\n    --_panel-bg: var(--drawer-bg, var(--color-canvas));\n    --_panel-blur: var(--drawer-panel-blur, var(--blur-md));\n    --_panel-shadow: var(--drawer-shadow, var(--shadow-xl));\n    --_panel-border-color: var(--color-divider);\n    --_panel-bleed: var(--size-8);\n    --_drag-handle-inset: calc(var(--size-1) * -1);\n\n    display: contents;\n  }\n\n  dialog {\n    all: unset;\n    position: fixed;\n    inset: 0;\n    box-sizing: border-box;\n    display: flex;\n    width: 100%;\n    max-width: 100%;\n    height: 100%;\n    max-height: 100%;\n    pointer-events: none;\n    transition:\n      display 200ms allow-discrete,\n      overlay 200ms allow-discrete;\n  }\n\n  dialog:not([open]) {\n    display: none;\n  }\n\n  dialog:not([open]) .panel {\n    display: none;\n  }\n\n  dialog[open] {\n    display: flex;\n    pointer-events: auto;\n  }\n\n  dialog::backdrop {\n    background: var(--_backdrop-bg);\n    opacity: 1;\n    backdrop-filter: var(--_backdrop-filter);\n    transition:\n      display 200ms allow-discrete,\n      overlay 200ms allow-discrete,\n      opacity var(--transition-normal),\n      backdrop-filter var(--transition-normal);\n\n    @starting-style {\n      opacity: 0;\n      backdrop-filter: blur(0);\n    }\n  }\n\n  dialog.closing::backdrop {\n    opacity: 0;\n    backdrop-filter: blur(0);\n    transition:\n      opacity 300ms var(--ease-in-out),\n      backdrop-filter 300ms var(--ease-in-out),\n      overlay 300ms allow-discrete,\n      display 300ms allow-discrete;\n  }\n\n  .panel {\n    position: absolute;\n    box-sizing: border-box;\n    display: flex;\n    flex-direction: column;\n    overflow: visible;\n    background: var(--_panel-bg);\n    border: var(--border) solid var(--_panel-border-color);\n    box-shadow: var(--_panel-shadow);\n    opacity: 1;\n    backdrop-filter: blur(var(--_panel-blur));\n    transform: translate3d(0, 0, 0);\n    transition:\n      opacity var(--transition-normal),\n      transform 300ms var(--ease-move);\n\n    @starting-style {\n      opacity: 0;\n      transform: var(--_panel-exit-transform, translate3d(0, 0, 0));\n    }\n  }\n\n  dialog.closing .panel {\n    opacity: 0;\n    transform: var(--_panel-exit-transform, translate3d(0, 0, 0));\n  }\n\n  /* left */\n  :host([placement='left']) .panel {\n    --_panel-exit-transform: translateX(calc(-100% - var(--_panel-bleed)));\n\n    inset-block: 0;\n    inset-inline-start: 0;\n    width: calc(var(--drawer-size, 20rem) + var(--_panel-bleed));\n    max-width: calc(100dvw + var(--_panel-bleed));\n    padding-inline-start: var(--_panel-bleed);\n    margin-inline-start: calc(var(--_panel-bleed) * -1);\n    border-block: none;\n    border-inline-start: none;\n  }\n\n  /* right (default) */\n  :host(:not([placement])) .panel,\n  :host([placement='right']) .panel {\n    --_panel-exit-transform: translateX(calc(100% + var(--_panel-bleed)));\n\n    inset-block: 0;\n    inset-inline-end: 0;\n    width: calc(var(--drawer-size, 20rem) + var(--_panel-bleed));\n    max-width: calc(100dvw + var(--_panel-bleed));\n    padding-inline-end: var(--_panel-bleed);\n    margin-inline-end: calc(var(--_panel-bleed) * -1);\n    border-block: none;\n    border-inline-end: none;\n  }\n\n  /* top */\n  :host([placement='top']) .panel {\n    --_panel-exit-transform: translateY(calc(-100% - var(--_panel-bleed)));\n\n    inset-block-start: 0;\n    inset-inline: 0;\n    height: calc(var(--drawer-size, 16rem) + var(--_panel-bleed));\n    max-height: calc(100dvh + var(--_panel-bleed));\n    padding-block-start: var(--_panel-bleed);\n    margin-block-start: calc(var(--_panel-bleed) * -1);\n    border-block-start: none;\n    border-inline: none;\n  }\n\n  /* bottom */\n  :host([placement='bottom']) .panel {\n    --_panel-exit-transform: translateY(calc(100% + var(--_panel-bleed)));\n\n    inset-block-end: 0;\n    inset-inline: 0;\n    height: calc(var(--drawer-size, 16rem) + var(--_panel-bleed));\n    max-height: calc(100dvh + var(--_panel-bleed));\n    padding-block-end: var(--_panel-bleed);\n    margin-block-end: calc(var(--_panel-bleed) * -1);\n    border-block-end: none;\n    border-inline: none;\n  }\n\n  /* RTL overrides */\n  :host(:dir(rtl)[placement='left']) .panel {\n    --_panel-exit-transform: translateX(calc(100% + var(--_panel-bleed)));\n  }\n\n  :host(:dir(rtl)[placement='right']) .panel,\n  :host(:dir(rtl):not([placement])) .panel {\n    --_panel-exit-transform: translateX(calc(-100% - var(--_panel-bleed)));\n  }\n\n  /* Size utilities */\n  :host([size='sm']) {\n    --drawer-size: 14rem;\n  }\n\n  :host([size='lg']) {\n    --drawer-size: 32rem;\n  }\n\n  :host([size='full']) {\n    --drawer-size: 100%;\n  }\n\n  :host([size='full']) .panel {\n    width: calc(100% + var(--_panel-bleed));\n    max-width: none;\n    height: calc(100% + var(--_panel-bleed));\n    max-height: none;\n    border: none;\n  }\n\n  /* Header / Body / Footer */\n  .header {\n    display: flex;\n    flex-shrink: 0;\n    gap: var(--size-2);\n    align-items: center;\n    padding: var(--size-4);\n    border-bottom: var(--border) solid var(--color-contrast-200);\n  }\n\n  .header-title {\n    flex: 1;\n    min-width: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    font-size: var(--text-lg);\n    font-weight: var(--font-semibold);\n    white-space: nowrap;\n  }\n\n  .body {\n    flex: 1;\n    padding: var(--size-4);\n    overflow-y: auto;\n  }\n\n  .footer {\n    display: flex;\n    flex-shrink: 0;\n    gap: var(--size-2);\n    justify-content: flex-end;\n    padding: var(--size-4);\n    border-top: var(--border) solid var(--color-contrast-200);\n  }\n\n  .header[hidden],\n  .footer[hidden],\n  .close-btn[hidden] {\n    display: none;\n  }\n\n  .close-btn {\n    all: unset;\n    box-sizing: border-box;\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    width: var(--size-8);\n    height: var(--size-8);\n    margin-inline-start: auto;\n    color: var(--color-contrast-500);\n    cursor: pointer;\n    border-radius: var(--rounded-sm);\n    transition:\n      background var(--transition-fast),\n      color var(--transition-fast);\n  }\n\n  .close-btn:hover {\n    color: var(--color-contrast-800);\n    background: var(--color-contrast-200);\n  }\n\n  .close-btn:active {\n    opacity: 0.8;\n  }\n\n  /* Drag handle for mobile/touch swipe-to-close */\n  .drag-handle {\n    position: absolute;\n    z-index: 10;\n    pointer-events: all;\n    touch-action: none;\n    cursor: grab;\n  }\n\n  .drag-handle:active {\n    cursor: grabbing;\n  }\n\n  /* Horizontal drawers (left/right) — drag handle on the opposite edge */\n  :host([placement='left']) .drag-handle,\n  :host(:not([placement])) .drag-handle,\n  :host([placement='right']) .drag-handle {\n    top: 50%;\n    width: var(--_panel-bleed);\n    height: 3.5rem;\n    translate: 0 -50%;\n  }\n\n  /* Left drawer — handle on the right (opposite side) */\n  :host([placement='left']) .drag-handle {\n    right: calc(var(--_panel-bleed) * -1);\n  }\n\n  /* Right drawer (default) — handle on the left (opposite side) */\n  :host([placement='right']) .drag-handle,\n  :host(:not([placement])) .drag-handle {\n    left: calc(var(--_panel-bleed) * -1);\n  }\n\n  /* Vertical drawers (top/bottom) — drag handle on the opposite edge */\n  :host([placement='top']) .drag-handle,\n  :host([placement='bottom']) .drag-handle {\n    left: 50%;\n    width: 3.5rem;\n    height: var(--_panel-bleed);\n    translate: -50% 0;\n  }\n\n  /* Top drawer — handle at bottom (opposite side) */\n  :host([placement='top']) .drag-handle {\n    bottom: calc(var(--_panel-bleed) * -1);\n  }\n\n  /* Bottom drawer — handle at top (opposite side) */\n  :host([placement='bottom']) .drag-handle {\n    top: calc(var(--_panel-bleed) * -1);\n  }\n\n  /* Inset drag-handle placement keeps the handle fully inside the panel. */\n  :host([drag-handle-placement='inset'][placement='left']) .drag-handle {\n    right: var(--_drag-handle-inset);\n  }\n\n  :host([drag-handle-placement='inset'][placement='right']) .drag-handle,\n  :host([drag-handle-placement='inset']:not([placement])) .drag-handle {\n    left: var(--_drag-handle-inset);\n  }\n\n  :host([drag-handle-placement='inset'][placement='top']) .drag-handle {\n    bottom: var(--_drag-handle-inset);\n  }\n\n  :host([drag-handle-placement='inset'][placement='bottom']) .drag-handle {\n    top: var(--_drag-handle-inset);\n  }\n\n  /* Visual indicator — subtle bar in the center */\n  .drag-handle::before {\n    position: absolute;\n    inset: 50%;\n    content: '';\n    background: var(--color-contrast-400);\n    border-radius: var(--rounded-full);\n    opacity: 0.6;\n    translate: -50% -50%;\n    transition:\n      background var(--transition-fast),\n      opacity var(--transition-fast),\n      transform var(--transition-fast);\n  }\n\n  :host([placement='left']) .drag-handle::before,\n  :host([placement='right']) .drag-handle::before,\n  :host(:not([placement])) .drag-handle::before {\n    width: 5px;\n    height: 2.5rem;\n  }\n\n  :host([placement='top']) .drag-handle::before,\n  :host([placement='bottom']) .drag-handle::before {\n    width: 2.5rem;\n    height: 5px;\n  }\n\n  .drag-handle:hover::before {\n    background: var(--color-contrast-600);\n    opacity: 0.9;\n    transform: scale(1.15);\n  }\n\n  .close-btn:focus-visible {\n    outline: var(--focus-ring);\n  }\n\n  @media (width <= 640px) {\n    :host([placement='left']) .panel,\n    :host(:not([placement])) .panel,\n    :host([placement='right']) .panel {\n      width: calc(min(var(--drawer-size, 20rem), calc(100vw - var(--size-2))) + var(--_panel-bleed));\n      max-width: calc(100vw - var(--size-2) + var(--_panel-bleed));\n    }\n\n    :host([placement='top']) .panel,\n    :host([placement='bottom']) .panel {\n      height: calc(min(var(--drawer-size, 16rem), calc(100dvh - var(--size-2))) + var(--_panel-bleed));\n      max-height: calc(100dvh - var(--size-2) + var(--_panel-bleed));\n    }\n\n    .header,\n    .body,\n    .footer {\n      padding: var(--size-3);\n    }\n  }\n}\n\n@layer refine.config {\n  :host([backdrop='blur']) {\n    --_backdrop-filter: blur(var(--blur-xs));\n  }\n\n  :host([backdrop='transparent']) {\n    --_backdrop-bg: transparent;\n  }\n}\n"],"mappings":""}

package/dist/overlay/drawer/{drawer.css?inline.js → drawer.css.js}

@@ -3,4 +3,4 @@ var e = "@layer refine.base{:host{--_backdrop-bg:var(--drawer-backdrop-bg,color-
 //#endregion
 export { e as default };
 
-//# sourceMappingURL=drawer.css?inline.js.map
+//# sourceMappingURL=drawer.css.js.map

package/dist/overlay/drawer/drawer.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.css.js","names":[],"sources":["../../../src/overlay/drawer/drawer.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    --_backdrop-bg: var(--drawer-backdrop-bg, color-mix(in oklch, var(--color-canvas) 40%, transparent));\n    --_backdrop-filter: none;\n    --_panel-bg: var(--drawer-bg, var(--color-canvas));\n    --_panel-blur: var(--drawer-panel-blur, var(--blur-md));\n    --_panel-shadow: var(--drawer-shadow, var(--shadow-xl));\n    --_panel-border-color: var(--color-divider);\n    --_panel-bleed: var(--size-8);\n    --_drag-handle-inset: calc(var(--size-1) * -1);\n\n    display: contents;\n  }\n\n  dialog {\n    all: unset;\n    position: fixed;\n    inset: 0;\n    box-sizing: border-box;\n    display: flex;\n    width: 100%;\n    max-width: 100%;\n    height: 100%;\n    max-height: 100%;\n    pointer-events: none;\n    transition:\n      display 200ms allow-discrete,\n      overlay 200ms allow-discrete;\n  }\n\n  dialog:not([open]) {\n    display: none;\n  }\n\n  dialog:not([open]) .panel {\n    display: none;\n  }\n\n  dialog[open] {\n    display: flex;\n    pointer-events: auto;\n  }\n\n  dialog::backdrop {\n    background: var(--_backdrop-bg);\n    opacity: 1;\n    backdrop-filter: var(--_backdrop-filter);\n    transition:\n      display 200ms allow-discrete,\n      overlay 200ms allow-discrete,\n      opacity var(--transition-normal),\n      backdrop-filter var(--transition-normal);\n\n    @starting-style {\n      opacity: 0;\n      backdrop-filter: blur(0);\n    }\n  }\n\n  dialog.closing::backdrop {\n    opacity: 0;\n    backdrop-filter: blur(0);\n    transition:\n      opacity 300ms var(--ease-in-out),\n      backdrop-filter 300ms var(--ease-in-out),\n      overlay 300ms allow-discrete,\n      display 300ms allow-discrete;\n  }\n\n  .panel {\n    position: absolute;\n    box-sizing: border-box;\n    display: flex;\n    flex-direction: column;\n    overflow: visible;\n    background: var(--_panel-bg);\n    border: var(--border) solid var(--_panel-border-color);\n    box-shadow: var(--_panel-shadow);\n    opacity: 1;\n    backdrop-filter: blur(var(--_panel-blur));\n    transform: translate3d(0, 0, 0);\n    transition:\n      opacity var(--transition-normal),\n      transform 300ms var(--ease-move);\n\n    @starting-style {\n      opacity: 0;\n      transform: var(--_panel-exit-transform, translate3d(0, 0, 0));\n    }\n  }\n\n  dialog.closing .panel {\n    opacity: 0;\n    transform: var(--_panel-exit-transform, translate3d(0, 0, 0));\n  }\n\n  /* left */\n  :host([placement='left']) .panel {\n    --_panel-exit-transform: translateX(calc(-100% - var(--_panel-bleed)));\n\n    inset-block: 0;\n    inset-inline-start: 0;\n    width: calc(var(--drawer-size, 20rem) + var(--_panel-bleed));\n    max-width: calc(100dvw + var(--_panel-bleed));\n    padding-inline-start: var(--_panel-bleed);\n    margin-inline-start: calc(var(--_panel-bleed) * -1);\n    border-block: none;\n    border-inline-start: none;\n  }\n\n  /* right (default) */\n  :host(:not([placement])) .panel,\n  :host([placement='right']) .panel {\n    --_panel-exit-transform: translateX(calc(100% + var(--_panel-bleed)));\n\n    inset-block: 0;\n    inset-inline-end: 0;\n    width: calc(var(--drawer-size, 20rem) + var(--_panel-bleed));\n    max-width: calc(100dvw + var(--_panel-bleed));\n    padding-inline-end: var(--_panel-bleed);\n    margin-inline-end: calc(var(--_panel-bleed) * -1);\n    border-block: none;\n    border-inline-end: none;\n  }\n\n  /* top */\n  :host([placement='top']) .panel {\n    --_panel-exit-transform: translateY(calc(-100% - var(--_panel-bleed)));\n\n    inset-block-start: 0;\n    inset-inline: 0;\n    height: calc(var(--drawer-size, 16rem) + var(--_panel-bleed));\n    max-height: calc(100dvh + var(--_panel-bleed));\n    padding-block-start: var(--_panel-bleed);\n    margin-block-start: calc(var(--_panel-bleed) * -1);\n    border-block-start: none;\n    border-inline: none;\n  }\n\n  /* bottom */\n  :host([placement='bottom']) .panel {\n    --_panel-exit-transform: translateY(calc(100% + var(--_panel-bleed)));\n\n    inset-block-end: 0;\n    inset-inline: 0;\n    height: calc(var(--drawer-size, 16rem) + var(--_panel-bleed));\n    max-height: calc(100dvh + var(--_panel-bleed));\n    padding-block-end: var(--_panel-bleed);\n    margin-block-end: calc(var(--_panel-bleed) * -1);\n    border-block-end: none;\n    border-inline: none;\n  }\n\n  /* RTL overrides */\n  :host(:dir(rtl)[placement='left']) .panel {\n    --_panel-exit-transform: translateX(calc(100% + var(--_panel-bleed)));\n  }\n\n  :host(:dir(rtl)[placement='right']) .panel,\n  :host(:dir(rtl):not([placement])) .panel {\n    --_panel-exit-transform: translateX(calc(-100% - var(--_panel-bleed)));\n  }\n\n  /* Size utilities */\n  :host([size='sm']) {\n    --drawer-size: 14rem;\n  }\n\n  :host([size='lg']) {\n    --drawer-size: 32rem;\n  }\n\n  :host([size='full']) {\n    --drawer-size: 100%;\n  }\n\n  :host([size='full']) .panel {\n    width: calc(100% + var(--_panel-bleed));\n    max-width: none;\n    height: calc(100% + var(--_panel-bleed));\n    max-height: none;\n    border: none;\n  }\n\n  /* Header / Body / Footer */\n  .header {\n    display: flex;\n    flex-shrink: 0;\n    gap: var(--size-2);\n    align-items: center;\n    padding: var(--size-4);\n    border-bottom: var(--border) solid var(--color-contrast-200);\n  }\n\n  .header-title {\n    flex: 1;\n    min-width: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    font-size: var(--text-lg);\n    font-weight: var(--font-semibold);\n    white-space: nowrap;\n  }\n\n  .body {\n    flex: 1;\n    padding: var(--size-4);\n    overflow-y: auto;\n  }\n\n  .footer {\n    display: flex;\n    flex-shrink: 0;\n    gap: var(--size-2);\n    justify-content: flex-end;\n    padding: var(--size-4);\n    border-top: var(--border) solid var(--color-contrast-200);\n  }\n\n  .header[hidden],\n  .footer[hidden],\n  .close-btn[hidden] {\n    display: none;\n  }\n\n  .close-btn {\n    all: unset;\n    box-sizing: border-box;\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    width: var(--size-8);\n    height: var(--size-8);\n    margin-inline-start: auto;\n    color: var(--color-contrast-500);\n    cursor: pointer;\n    border-radius: var(--rounded-sm);\n    transition:\n      background var(--transition-fast),\n      color var(--transition-fast);\n  }\n\n  .close-btn:hover {\n    color: var(--color-contrast-800);\n    background: var(--color-contrast-200);\n  }\n\n  .close-btn:active {\n    opacity: 0.8;\n  }\n\n  /* Drag handle for mobile/touch swipe-to-close */\n  .drag-handle {\n    position: absolute;\n    z-index: 10;\n    pointer-events: all;\n    touch-action: none;\n    cursor: grab;\n  }\n\n  .drag-handle:active {\n    cursor: grabbing;\n  }\n\n  /* Horizontal drawers (left/right) — drag handle on the opposite edge */\n  :host([placement='left']) .drag-handle,\n  :host(:not([placement])) .drag-handle,\n  :host([placement='right']) .drag-handle {\n    top: 50%;\n    width: var(--_panel-bleed);\n    height: 3.5rem;\n    translate: 0 -50%;\n  }\n\n  /* Left drawer — handle on the right (opposite side) */\n  :host([placement='left']) .drag-handle {\n    right: calc(var(--_panel-bleed) * -1);\n  }\n\n  /* Right drawer (default) — handle on the left (opposite side) */\n  :host([placement='right']) .drag-handle,\n  :host(:not([placement])) .drag-handle {\n    left: calc(var(--_panel-bleed) * -1);\n  }\n\n  /* Vertical drawers (top/bottom) — drag handle on the opposite edge */\n  :host([placement='top']) .drag-handle,\n  :host([placement='bottom']) .drag-handle {\n    left: 50%;\n    width: 3.5rem;\n    height: var(--_panel-bleed);\n    translate: -50% 0;\n  }\n\n  /* Top drawer — handle at bottom (opposite side) */\n  :host([placement='top']) .drag-handle {\n    bottom: calc(var(--_panel-bleed) * -1);\n  }\n\n  /* Bottom drawer — handle at top (opposite side) */\n  :host([placement='bottom']) .drag-handle {\n    top: calc(var(--_panel-bleed) * -1);\n  }\n\n  /* Inset drag-handle placement keeps the handle fully inside the panel. */\n  :host([drag-handle-placement='inset'][placement='left']) .drag-handle {\n    right: var(--_drag-handle-inset);\n  }\n\n  :host([drag-handle-placement='inset'][placement='right']) .drag-handle,\n  :host([drag-handle-placement='inset']:not([placement])) .drag-handle {\n    left: var(--_drag-handle-inset);\n  }\n\n  :host([drag-handle-placement='inset'][placement='top']) .drag-handle {\n    bottom: var(--_drag-handle-inset);\n  }\n\n  :host([drag-handle-placement='inset'][placement='bottom']) .drag-handle {\n    top: var(--_drag-handle-inset);\n  }\n\n  /* Visual indicator — subtle bar in the center */\n  .drag-handle::before {\n    position: absolute;\n    inset: 50%;\n    content: '';\n    background: var(--color-contrast-400);\n    border-radius: var(--rounded-full);\n    opacity: 0.6;\n    translate: -50% -50%;\n    transition:\n      background var(--transition-fast),\n      opacity var(--transition-fast),\n      transform var(--transition-fast);\n  }\n\n  :host([placement='left']) .drag-handle::before,\n  :host([placement='right']) .drag-handle::before,\n  :host(:not([placement])) .drag-handle::before {\n    width: 5px;\n    height: 2.5rem;\n  }\n\n  :host([placement='top']) .drag-handle::before,\n  :host([placement='bottom']) .drag-handle::before {\n    width: 2.5rem;\n    height: 5px;\n  }\n\n  .drag-handle:hover::before {\n    background: var(--color-contrast-600);\n    opacity: 0.9;\n    transform: scale(1.15);\n  }\n\n  .close-btn:focus-visible {\n    outline: var(--focus-ring);\n  }\n\n  @media (width <= 640px) {\n    :host([placement='left']) .panel,\n    :host(:not([placement])) .panel,\n    :host([placement='right']) .panel {\n      width: calc(min(var(--drawer-size, 20rem), calc(100vw - var(--size-2))) + var(--_panel-bleed));\n      max-width: calc(100vw - var(--size-2) + var(--_panel-bleed));\n    }\n\n    :host([placement='top']) .panel,\n    :host([placement='bottom']) .panel {\n      height: calc(min(var(--drawer-size, 16rem), calc(100dvh - var(--size-2))) + var(--_panel-bleed));\n      max-height: calc(100dvh - var(--size-2) + var(--_panel-bleed));\n    }\n\n    .header,\n    .body,\n    .footer {\n      padding: var(--size-3);\n    }\n  }\n}\n\n@layer refine.config {\n  :host([backdrop='blur']) {\n    --_backdrop-filter: blur(var(--blur-xs));\n  }\n\n  :host([backdrop='transparent']) {\n    --_backdrop-bg: transparent;\n  }\n}\n"],"mappings":""}

package/dist/overlay/drawer/drawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../src/overlay/drawer/drawer.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,kBAAkB,EAAE,iBAAiB,EAAa,MAAM,gBAAgB,CAAC;AAGvF,OAAO,yBAAyB,CAAC;AAKjC,KAAK,eAAe,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC;AAC3D,KAAK,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AACvC,KAAK,cAAc,GAAG,QAAQ,GAAG,MAAM,GAAG,aAAa,CAAC;AACxD,KAAK,yBAAyB,GAAG,SAAS,GAAG,OAAO,CAAC;AA8BrD,sEAAsE;AACtE,MAAM,WAAW,aAAc,SAAQ,WAAW,EAAE,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC;IAC/E,sEAAsE;IACtE,IAAI,IAAI,IAAI,CAAC;IACb,iEAAiE;IACjE,IAAI,IAAI,IAAI,CAAC;CACd;AAED,kCAAkC;AAElC,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,kBAAkB,GAAG;QAAE,SAAS,EAAE,eAAe,CAAA;KAAE,CAAC;IAC3D,IAAI,EAAE,iBAAiB,GAAG;QAAE,SAAS,EAAE,eAAe,CAAA;KAAE,CAAC;CAC1D,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,oEAAoE;IACpE,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,8DAA8D;IAC9D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,4DAA4D;IAC5D,uBAAuB,CAAC,EAAE,yBAAyB,CAAC;IACpD;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4BAA4B;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,0EAA0E;IAC1E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,iCAAiC;IACjC,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AAEH,eAAO,MAAM,UAAU,EAAG,YAAqB,CAAC"}
+{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../src/overlay/drawer/drawer.ts"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,kBAAkB,EAAE,iBAAiB,EAAa,MAAM,gBAAgB,CAAC;AAGvF,OAAO,yBAAyB,CAAC;AAKjC,KAAK,eAAe,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC;AAC3D,KAAK,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AACvC,KAAK,cAAc,GAAG,QAAQ,GAAG,MAAM,GAAG,aAAa,CAAC;AACxD,KAAK,yBAAyB,GAAG,SAAS,GAAG,OAAO,CAAC;AA8BrD,sEAAsE;AACtE,MAAM,WAAW,aAAc,SAAQ,WAAW,EAAE,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC;IAC/E,sEAAsE;IACtE,IAAI,IAAI,IAAI,CAAC;IACb,iEAAiE;IACjE,IAAI,IAAI,IAAI,CAAC;CACd;AAED,kCAAkC;AAElC,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,kBAAkB,GAAG;QAAE,SAAS,EAAE,eAAe,CAAA;KAAE,CAAC;IAC3D,IAAI,EAAE,iBAAiB,GAAG;QAAE,SAAS,EAAE,eAAe,CAAA;KAAE,CAAC;CAC1D,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,oEAAoE;IACpE,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,8DAA8D;IAC9D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,4DAA4D;IAC5D,uBAAuB,CAAC,EAAE,yBAAyB,CAAC;IACpD;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4BAA4B;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,0EAA0E;IAC1E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,2CAA2C;IAC3C,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,iCAAiC;IACjC,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AAEH,eAAO,MAAM,UAAU,EAAG,YAAqB,CAAC"}

package/dist/overlay/index.d.ts

@@ -1,3 +1,5 @@
+export { COMMAND_PALETTE_ITEM_TAG, COMMAND_PALETTE_TAG } from './command-palette/command-palette';
+export type { CommandPaletteItem, CommandPaletteItemInput, CommandPaletteSelectDetail, OreCommandPaletteEvents, OreCommandPaletteItemProps, OreCommandPaletteProps, } from './command-palette/command-palette.types';
 export { DIALOG_TAG } from './dialog/dialog';
 export type { OreDialogEvents, OreDialogProps } from './dialog/dialog';
 export { DRAWER_TAG } from './drawer/drawer';

package/dist/overlay/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/overlay/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACtF,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACtD,YAAY,EAAE,aAAa,EAAE,gBAAgB,EAAE,eAAe,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AACpH,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC3E,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,YAAY,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/overlay/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,mBAAmB,EAAE,MAAM,mCAAmC,CAAC;AAClG,YAAY,EACV,kBAAkB,EAClB,uBAAuB,EACvB,0BAA0B,EAC1B,uBAAuB,EACvB,0BAA0B,EAC1B,sBAAsB,GACvB,MAAM,yCAAyC,CAAC;AACjD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACtF,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACtD,YAAY,EAAE,aAAa,EAAE,gBAAgB,EAAE,eAAe,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AACpH,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC3E,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,YAAY,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/overlay/menu/{menu-item.css?inline.cjs → menu-item.css.cjs}

@@ -1,2 +1,2 @@
 var e=`@layer refine.base{:host{--_menu-color:var(--menu-item-color,var(--_theme-base,var(--color-primary)));--_hover-bg:var(--menu-item-hover-bg,var(--color-contrast-100));--_focus-color:var(--menu-item-focus-color,var(--_menu-color));--_focus-bg:var(--menu-item-focus-bg,color-mix(in oklch, var(--_menu-color) 12%, var(--color-contrast-100)));--_selection-bg:var(--menu-item-selection-bg,color-mix(in oklch, var(--color-contrast-900) 5%, var(--color-canvas)));--_checked-color:var(--menu-item-checked-color,var(--_menu-color));--_checked-bg:var(--menu-item-checked-bg,color-mix(in oklch, var(--_menu-color) 18%, var(--color-canvas)));outline:none;display:block}.item{gap:var(--size-2);padding:var(--size-1-5) var(--size-3);font-size:var(--text-sm);line-height:var(--leading-normal);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background var(--transition-fast), color var(--transition-fast);border-radius:0;align-items:center;display:flex}:host(:first-of-type) .item{border-radius:var(--rounded-sm) var(--rounded-sm) 0 0}:host(:last-child) .item{border-radius:0 0 var(--rounded-sm) var(--rounded-sm)}:host(:first-of-type:last-child) .item{border-radius:var(--rounded-sm)}:host(:not([disabled])) .item:hover{background:var(--_hover-bg)}:host(:focus-visible) .item{color:var(--_focus-color);background:var(--_focus-bg)}.item.is-checked{font-weight:var(--font-medium);color:var(--_checked-color)}:host([disabled]) .item{color:var(--color-contrast-400);pointer-events:none;cursor:not-allowed;opacity:.6}.icon-slot{display:contents}.item-check{color:currentColor;flex-shrink:0;justify-content:center;align-items:center;width:1.25rem;display:inline-flex}.item-check:before{content:"";width:.875rem;height:.875rem;transition:background var(--transition-fast), border-color var(--transition-fast);border:1.5px solid;display:block}.item.is-checkbox .item-check:before{border-radius:2px}.item.is-radio .item-check:before{border-radius:50%}.item.is-checked .item-check:before{background:currentColor}.item.is-radio.is-checked .item-check:before{background:0 0;box-shadow:inset 0 0 0 3px}.item-label{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}}@media (pointer:coarse){.item{padding:var(--size-2-5) var(--size-3)}}`;exports.default=e;
-//# sourceMappingURL=menu-item.css?inline.cjs.map
+//# sourceMappingURL=menu-item.css.cjs.map

package/dist/overlay/menu/menu-item.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item.css.cjs","names":[],"sources":["../../../src/overlay/menu/menu-item.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    --_menu-color: var(--menu-item-color, var(--_theme-base, var(--color-primary)));\n    --_hover-bg: var(--menu-item-hover-bg, var(--color-contrast-100));\n    --_focus-color: var(--menu-item-focus-color, var(--_menu-color));\n    --_focus-bg: var(--menu-item-focus-bg, color-mix(in oklch, var(--_menu-color) 12%, var(--color-contrast-100)));\n    --_selection-bg: var(\n      --menu-item-selection-bg,\n      color-mix(in oklch, var(--color-contrast-900) 5%, var(--color-canvas))\n    );\n    --_checked-color: var(--menu-item-checked-color, var(--_menu-color));\n    --_checked-bg: var(--menu-item-checked-bg, color-mix(in oklch, var(--_menu-color) 18%, var(--color-canvas)));\n\n    display: block;\n    outline: none;\n  }\n\n  .item {\n    display: flex;\n    gap: var(--size-2);\n    align-items: center;\n    padding: var(--size-1-5) var(--size-3);\n    font-size: var(--text-sm);\n    line-height: var(--leading-normal);\n    white-space: nowrap;\n    cursor: pointer;\n    user-select: none;\n    border-radius: 0;\n    transition:\n      background var(--transition-fast),\n      color var(--transition-fast);\n  }\n\n  :host(:first-of-type) .item {\n    border-radius: var(--rounded-sm) var(--rounded-sm) 0 0;\n  }\n\n  :host(:last-child) .item {\n    border-radius: 0 0 var(--rounded-sm) var(--rounded-sm);\n  }\n\n  :host(:first-of-type:last-child) .item {\n    border-radius: var(--rounded-sm);\n  }\n\n  :host(:not([disabled])) .item:hover {\n    background: var(--_hover-bg);\n  }\n\n  :host(:focus-visible) .item {\n    color: var(--_focus-color);\n    background: var(--_focus-bg);\n  }\n\n  .item.is-checked {\n    font-weight: var(--font-medium);\n    color: var(--_checked-color);\n  }\n\n  :host([disabled]) .item {\n    color: var(--color-contrast-400);\n    pointer-events: none;\n    cursor: not-allowed;\n    opacity: 0.6;\n  }\n\n  .icon-slot {\n    display: contents;\n  }\n\n  .item-check {\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    width: 1.25rem;\n    color: currentcolor;\n  }\n\n  /* CSS-based check/radio indicator — no Unicode characters */\n  .item-check::before {\n    display: block;\n    width: 0.875rem;\n    height: 0.875rem;\n    content: '';\n    border: 1.5px solid currentcolor;\n    transition:\n      background var(--transition-fast),\n      border-color var(--transition-fast);\n  }\n\n  .item.is-checkbox .item-check::before {\n    border-radius: 2px;\n  }\n\n  .item.is-radio .item-check::before {\n    border-radius: 50%;\n  }\n\n  .item.is-checked .item-check::before {\n    background: currentcolor;\n  }\n\n  /* Radio checked: filled dot via inset box-shadow */\n  .item.is-radio.is-checked .item-check::before {\n    background: transparent;\n    box-shadow: inset 0 0 0 3px currentcolor;\n  }\n\n  .item-label {\n    flex: 1;\n    min-width: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n}\n\n@media (pointer: coarse) {\n  .item {\n    padding: var(--size-2-5) var(--size-3);\n  }\n}\n"],"mappings":""}

package/dist/overlay/menu/{menu-item.css?inline.js → menu-item.css.js}

@@ -3,4 +3,4 @@ var e = "@layer refine.base{:host{--_menu-color:var(--menu-item-color,var(--_the
 //#endregion
 export { e as default };
 
-//# sourceMappingURL=menu-item.css?inline.js.map
+//# sourceMappingURL=menu-item.css.js.map

package/dist/overlay/menu/menu-item.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-item.css.js","names":[],"sources":["../../../src/overlay/menu/menu-item.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    --_menu-color: var(--menu-item-color, var(--_theme-base, var(--color-primary)));\n    --_hover-bg: var(--menu-item-hover-bg, var(--color-contrast-100));\n    --_focus-color: var(--menu-item-focus-color, var(--_menu-color));\n    --_focus-bg: var(--menu-item-focus-bg, color-mix(in oklch, var(--_menu-color) 12%, var(--color-contrast-100)));\n    --_selection-bg: var(\n      --menu-item-selection-bg,\n      color-mix(in oklch, var(--color-contrast-900) 5%, var(--color-canvas))\n    );\n    --_checked-color: var(--menu-item-checked-color, var(--_menu-color));\n    --_checked-bg: var(--menu-item-checked-bg, color-mix(in oklch, var(--_menu-color) 18%, var(--color-canvas)));\n\n    display: block;\n    outline: none;\n  }\n\n  .item {\n    display: flex;\n    gap: var(--size-2);\n    align-items: center;\n    padding: var(--size-1-5) var(--size-3);\n    font-size: var(--text-sm);\n    line-height: var(--leading-normal);\n    white-space: nowrap;\n    cursor: pointer;\n    user-select: none;\n    border-radius: 0;\n    transition:\n      background var(--transition-fast),\n      color var(--transition-fast);\n  }\n\n  :host(:first-of-type) .item {\n    border-radius: var(--rounded-sm) var(--rounded-sm) 0 0;\n  }\n\n  :host(:last-child) .item {\n    border-radius: 0 0 var(--rounded-sm) var(--rounded-sm);\n  }\n\n  :host(:first-of-type:last-child) .item {\n    border-radius: var(--rounded-sm);\n  }\n\n  :host(:not([disabled])) .item:hover {\n    background: var(--_hover-bg);\n  }\n\n  :host(:focus-visible) .item {\n    color: var(--_focus-color);\n    background: var(--_focus-bg);\n  }\n\n  .item.is-checked {\n    font-weight: var(--font-medium);\n    color: var(--_checked-color);\n  }\n\n  :host([disabled]) .item {\n    color: var(--color-contrast-400);\n    pointer-events: none;\n    cursor: not-allowed;\n    opacity: 0.6;\n  }\n\n  .icon-slot {\n    display: contents;\n  }\n\n  .item-check {\n    display: inline-flex;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n    width: 1.25rem;\n    color: currentcolor;\n  }\n\n  /* CSS-based check/radio indicator — no Unicode characters */\n  .item-check::before {\n    display: block;\n    width: 0.875rem;\n    height: 0.875rem;\n    content: '';\n    border: 1.5px solid currentcolor;\n    transition:\n      background var(--transition-fast),\n      border-color var(--transition-fast);\n  }\n\n  .item.is-checkbox .item-check::before {\n    border-radius: 2px;\n  }\n\n  .item.is-radio .item-check::before {\n    border-radius: 50%;\n  }\n\n  .item.is-checked .item-check::before {\n    background: currentcolor;\n  }\n\n  /* Radio checked: filled dot via inset box-shadow */\n  .item.is-radio.is-checked .item-check::before {\n    background: transparent;\n    box-shadow: inset 0 0 0 3px currentcolor;\n  }\n\n  .item-label {\n    flex: 1;\n    min-width: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n}\n\n@media (pointer: coarse) {\n  .item {\n    padding: var(--size-2-5) var(--size-3);\n  }\n}\n"],"mappings":""}

package/dist/overlay/menu/{menu-separator.css?inline.cjs → menu-separator.css.cjs}

@@ -1,2 +1,2 @@
 var e=`@layer refine.base{:host{margin:var(--size-1) 0;border-top:var(--border) solid var(--color-contrast-200);display:block}}`;exports.default=e;
-//# sourceMappingURL=menu-separator.css?inline.cjs.map
+//# sourceMappingURL=menu-separator.css.cjs.map

package/dist/overlay/menu/menu-separator.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-separator.css.cjs","names":[],"sources":["../../../src/overlay/menu/menu-separator.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    display: block;\n    margin: var(--size-1) 0;\n    border-top: var(--border) solid var(--color-contrast-200);\n  }\n}\n"],"mappings":""}

package/dist/overlay/menu/{menu-separator.css?inline.js → menu-separator.css.js}

@@ -3,4 +3,4 @@ var e = "@layer refine.base{:host{margin:var(--size-1) 0;border-top:var(--border
 //#endregion
 export { e as default };
 
-//# sourceMappingURL=menu-separator.css?inline.js.map
+//# sourceMappingURL=menu-separator.css.js.map

package/dist/overlay/menu/menu-separator.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-separator.css.js","names":[],"sources":["../../../src/overlay/menu/menu-separator.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    display: block;\n    margin: var(--size-1) 0;\n    border-top: var(--border) solid var(--color-contrast-200);\n  }\n}\n"],"mappings":""}

package/dist/overlay/menu/menu.css.cjs

@@ -0,0 +1,2 @@
+var e=`@layer refine.base{:host{--_menu-panel-bg:var(--menu-panel-bg,var(--color-canvas));--_menu-panel-border-color:var(--menu-panel-border-color,var(--color-divider));--_menu-panel-blur:var(--menu-panel-blur,var(--blur-md));--_menu-panel-shadow:var(--menu-panel-shadow,var(--shadow-xl));display:inline-block;position:relative}.menu-panel{z-index:calc(var(--z-popover) + 1);box-sizing:border-box;min-width:var(--menu-panel-min-width,10rem);max-height:var(--menu-panel-max-height,min(70vh, 32rem));padding:var(--size-1);pointer-events:none;background:var(--_menu-panel-bg);border:var(--border) solid var(--_menu-panel-border-color);border-radius:var(--menu-panel-radius,var(--rounded-lg));box-shadow:var(--_menu-panel-shadow);opacity:0;-webkit-backdrop-filter:blur(var(--_menu-panel-blur));backdrop-filter:blur(var(--_menu-panel-blur));transform:translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale));transform-origin:0 0;transition:opacity .1s var(--ease-spring), transform .1s var(--ease-spring), display .1s allow-discrete, overlay .1s allow-discrete;margin:0;position:fixed;top:0;overflow-y:auto}.menu-panel:not(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){left:0}.menu-panel:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}.menu-panel[data-placement=top-start],.menu-panel[data-placement=top],.menu-panel[data-placement=top-end]{transform-origin:0 100%}.menu-panel[data-placement=bottom-end],.menu-panel[data-placement=right-start],.menu-panel[data-placement=right]{transform-origin:100% 0}.menu-panel[data-open]{pointer-events:auto;opacity:1;transition:opacity .15s var(--ease-spring), transform .15s var(--ease-spring), display .15s allow-discrete, overlay .15s allow-discrete;transform:translateY(0)scale(1)}@starting-style{.menu-panel[data-open]{opacity:0;transform:translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale))}}::slotted(ore-menu-item),::slotted(ore-menu-separator){display:block}}`;exports.default=e;
+//# sourceMappingURL=menu.css.cjs.map

package/dist/overlay/menu/menu.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu.css.cjs","names":[],"sources":["../../../src/overlay/menu/menu.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    --_menu-panel-bg: var(--menu-panel-bg, var(--color-canvas));\n    --_menu-panel-border-color: var(--menu-panel-border-color, var(--color-divider));\n    --_menu-panel-blur: var(--menu-panel-blur, var(--blur-md));\n    --_menu-panel-shadow: var(--menu-panel-shadow, var(--shadow-xl));\n\n    position: relative;\n    display: inline-block;\n  }\n\n  /* ========================================\n       Menu Panel\n       ======================================== */\n\n  .menu-panel {\n    position: fixed;\n    inset-inline-start: 0;\n    top: 0;\n    z-index: calc(var(--z-popover) + 1);\n    box-sizing: border-box;\n    min-width: var(--menu-panel-min-width, 10rem);\n    max-height: var(--menu-panel-max-height, min(70vh, 32rem));\n    padding: var(--size-1);\n    margin: 0;\n    overflow-y: auto;\n    pointer-events: none;\n    background: var(--_menu-panel-bg);\n    border: var(--border) solid var(--_menu-panel-border-color);\n    border-radius: var(--menu-panel-radius, var(--rounded-lg));\n    box-shadow: var(--_menu-panel-shadow);\n    opacity: 0;\n    backdrop-filter: blur(var(--_menu-panel-blur));\n    transform: translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale));\n    transform-origin: top left;\n    transition:\n      opacity 100ms var(--ease-spring),\n      transform 100ms var(--ease-spring),\n      display 100ms allow-discrete,\n      overlay 100ms allow-discrete;\n  }\n\n  .menu-panel[data-placement='top-start'],\n  .menu-panel[data-placement='top'],\n  .menu-panel[data-placement='top-end'] {\n    transform-origin: bottom left;\n  }\n\n  .menu-panel[data-placement='bottom-end'],\n  .menu-panel[data-placement='right-start'],\n  .menu-panel[data-placement='right'] {\n    transform-origin: top right;\n  }\n\n  .menu-panel[data-open] {\n    pointer-events: auto;\n    opacity: 1;\n    transform: translateY(0) scale(1);\n    transition:\n      opacity 150ms var(--ease-spring),\n      transform 150ms var(--ease-spring),\n      display 150ms allow-discrete,\n      overlay 150ms allow-discrete;\n\n    @starting-style {\n      opacity: 0;\n      transform: translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale));\n    }\n  }\n\n  /* ========================================\n       Menu Items (slotted ore-menu-item)\n       ======================================== */\n\n  ::slotted(ore-menu-item) {\n    display: block;\n  }\n\n  ::slotted(ore-menu-separator) {\n    display: block;\n  }\n}\n"],"mappings":""}

package/dist/overlay/menu/menu.css.js

@@ -0,0 +1,6 @@
+//#region src/overlay/menu/menu.css?inline
+var e = "@layer refine.base{:host{--_menu-panel-bg:var(--menu-panel-bg,var(--color-canvas));--_menu-panel-border-color:var(--menu-panel-border-color,var(--color-divider));--_menu-panel-blur:var(--menu-panel-blur,var(--blur-md));--_menu-panel-shadow:var(--menu-panel-shadow,var(--shadow-xl));display:inline-block;position:relative}.menu-panel{z-index:calc(var(--z-popover) + 1);box-sizing:border-box;min-width:var(--menu-panel-min-width,10rem);max-height:var(--menu-panel-max-height,min(70vh, 32rem));padding:var(--size-1);pointer-events:none;background:var(--_menu-panel-bg);border:var(--border) solid var(--_menu-panel-border-color);border-radius:var(--menu-panel-radius,var(--rounded-lg));box-shadow:var(--_menu-panel-shadow);opacity:0;-webkit-backdrop-filter:blur(var(--_menu-panel-blur));backdrop-filter:blur(var(--_menu-panel-blur));transform:translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale));transform-origin:0 0;transition:opacity .1s var(--ease-spring), transform .1s var(--ease-spring), display .1s allow-discrete, overlay .1s allow-discrete;margin:0;position:fixed;top:0;overflow-y:auto}.menu-panel:not(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){left:0}.menu-panel:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:0}.menu-panel[data-placement=top-start],.menu-panel[data-placement=top],.menu-panel[data-placement=top-end]{transform-origin:0 100%}.menu-panel[data-placement=bottom-end],.menu-panel[data-placement=right-start],.menu-panel[data-placement=right]{transform-origin:100% 0}.menu-panel[data-open]{pointer-events:auto;opacity:1;transition:opacity .15s var(--ease-spring), transform .15s var(--ease-spring), display .15s allow-discrete, overlay .15s allow-discrete;transform:translateY(0)scale(1)}@starting-style{.menu-panel[data-open]{opacity:0;transform:translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale))}}::slotted(ore-menu-item),::slotted(ore-menu-separator){display:block}}";
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=menu.css.js.map

package/dist/overlay/menu/menu.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu.css.js","names":[],"sources":["../../../src/overlay/menu/menu.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    --_menu-panel-bg: var(--menu-panel-bg, var(--color-canvas));\n    --_menu-panel-border-color: var(--menu-panel-border-color, var(--color-divider));\n    --_menu-panel-blur: var(--menu-panel-blur, var(--blur-md));\n    --_menu-panel-shadow: var(--menu-panel-shadow, var(--shadow-xl));\n\n    position: relative;\n    display: inline-block;\n  }\n\n  /* ========================================\n       Menu Panel\n       ======================================== */\n\n  .menu-panel {\n    position: fixed;\n    inset-inline-start: 0;\n    top: 0;\n    z-index: calc(var(--z-popover) + 1);\n    box-sizing: border-box;\n    min-width: var(--menu-panel-min-width, 10rem);\n    max-height: var(--menu-panel-max-height, min(70vh, 32rem));\n    padding: var(--size-1);\n    margin: 0;\n    overflow-y: auto;\n    pointer-events: none;\n    background: var(--_menu-panel-bg);\n    border: var(--border) solid var(--_menu-panel-border-color);\n    border-radius: var(--menu-panel-radius, var(--rounded-lg));\n    box-shadow: var(--_menu-panel-shadow);\n    opacity: 0;\n    backdrop-filter: blur(var(--_menu-panel-blur));\n    transform: translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale));\n    transform-origin: top left;\n    transition:\n      opacity 100ms var(--ease-spring),\n      transform 100ms var(--ease-spring),\n      display 100ms allow-discrete,\n      overlay 100ms allow-discrete;\n  }\n\n  .menu-panel[data-placement='top-start'],\n  .menu-panel[data-placement='top'],\n  .menu-panel[data-placement='top-end'] {\n    transform-origin: bottom left;\n  }\n\n  .menu-panel[data-placement='bottom-end'],\n  .menu-panel[data-placement='right-start'],\n  .menu-panel[data-placement='right'] {\n    transform-origin: top right;\n  }\n\n  .menu-panel[data-open] {\n    pointer-events: auto;\n    opacity: 1;\n    transform: translateY(0) scale(1);\n    transition:\n      opacity 150ms var(--ease-spring),\n      transform 150ms var(--ease-spring),\n      display 150ms allow-discrete,\n      overlay 150ms allow-discrete;\n\n    @starting-style {\n      opacity: 0;\n      transform: translateY(var(--overlay-enter-translate-y)) scale(var(--overlay-enter-scale));\n    }\n  }\n\n  /* ========================================\n       Menu Items (slotted ore-menu-item)\n       ======================================== */\n\n  ::slotted(ore-menu-item) {\n    display: block;\n  }\n\n  ::slotted(ore-menu-separator) {\n    display: block;\n  }\n}\n"],"mappings":""}

package/dist/overlay/menu/menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/overlay/menu/menu.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAEjD,OAAO,EAIL,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,EACvB,MAAM,gBAAgB,CAAC;AASxB,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,MAAM,eAAe,GAAG,UAAU,GAAG,OAAO,CAAC;AAEnD,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE;QAAE,MAAM,EAAE,mBAAmB,CAAA;KAAE,CAAC;IACvC,IAAI,EAAE,iBAAiB,CAAC;IACxB,MAAM,EAAE,gBAAgB,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,QAAQ,GAAG,cAAc,GAAG,YAAY,GAAG,KAAK,GAAG,WAAW,GAAG,SAAS,CAAC;IACvF,IAAI,CAAC,EAAE,aAAa,CAAC;CACtB,CAAC;AAMF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,eAAO,MAAM,aAAa,EAAG,eAAwB,CAAC;AAwDtD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,aAAa,EAAG,oBAA6B,CAAC;AAa3D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,eAAO,MAAM,QAAQ,EAAG,UAAmB,CAAC"}
+{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/overlay/menu/menu.ts"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAEjD,OAAO,EAIL,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,EACvB,MAAM,gBAAgB,CAAC;AASxB,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,MAAM,eAAe,GAAG,UAAU,GAAG,OAAO,CAAC;AAEnD,MAAM,MAAM,aAAa,GAAG;IAC1B,KAAK,EAAE;QAAE,MAAM,EAAE,mBAAmB,CAAA;KAAE,CAAC;IACvC,IAAI,EAAE,iBAAiB,CAAC;IACxB,MAAM,EAAE,gBAAgB,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,QAAQ,GAAG,cAAc,GAAG,YAAY,GAAG,KAAK,GAAG,WAAW,GAAG,SAAS,CAAC;IACvF,IAAI,CAAC,EAAE,aAAa,CAAC;CACtB,CAAC;AAMF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,eAAO,MAAM,aAAa,EAAG,eAAwB,CAAC;AAwDtD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,aAAa,EAAG,oBAA6B,CAAC;AAa3D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,eAAO,MAAM,QAAQ,EAAG,UAAmB,CAAC"}

package/dist/overlay/popover/{popover.css?inline.cjs → popover.css.cjs}

@@ -1,2 +1,2 @@
 var e=`@layer refine.base{:host{--_panel-bg:var(--popover-bg,var(--color-canvas));--_panel-blur:var(--popover-panel-blur,var(--blur-md));--_panel-border-color:var(--popover-border-color,var(--color-divider));--_panel-shadow:var(--popover-shadow,var(--shadow-xl));display:inline-block;position:relative}.panel{inset:unset;box-sizing:border-box;min-width:var(--popover-min-width,12rem);max-width:var(--popover-max-width,24rem);max-height:var(--popover-max-height,min(70vh, 32rem));word-break:auto-phrase;overflow-wrap:anywhere;background:var(--_panel-bg);border:var(--border) solid var(--_panel-border-color);border-radius:var(--rounded-lg);box-shadow:var(--_panel-shadow);opacity:0;-webkit-backdrop-filter:blur(var(--_panel-blur));backdrop-filter:blur(var(--_panel-blur));transform:scale(var(--overlay-enter-scale-dialog)) translateY(4px);transition:opacity var(--transition-fast), transform .2s var(--ease-spring), display var(--transition-fast) allow-discrete, overlay var(--transition-fast) allow-discrete;margin:0;padding:0;position:fixed;overflow:auto}.panel[data-open]{opacity:1;display:block;transform:scale(1)translateY(0)}.panel:popover-open{opacity:1;transform:scale(1)translateY(0)}@starting-style{.panel:popover-open{opacity:0;transform:scale(var(--overlay-enter-scale-dialog)) translateY(4px)}}@starting-style{.panel[data-open]{opacity:0;transform:scale(var(--overlay-enter-scale-dialog)) translateY(4px)}}}`;exports.default=e;
-//# sourceMappingURL=popover.css?inline.cjs.map
+//# sourceMappingURL=popover.css.cjs.map

package/dist/overlay/popover/popover.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover.css.cjs","names":[],"sources":["../../../src/overlay/popover/popover.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    --_panel-bg: var(--popover-bg, var(--color-canvas));\n    --_panel-blur: var(--popover-panel-blur, var(--blur-md));\n    --_panel-border-color: var(--popover-border-color, var(--color-divider));\n    --_panel-shadow: var(--popover-shadow, var(--shadow-xl));\n\n    position: relative;\n    display: inline-block;\n  }\n\n  .panel {\n    position: fixed;\n\n    /* Popover UA resets */\n    inset: unset;\n    box-sizing: border-box;\n    min-width: var(--popover-min-width, 12rem);\n    max-width: var(--popover-max-width, 24rem);\n    max-height: var(--popover-max-height, min(70vh, 32rem));\n    padding: 0;\n    margin: 0;\n    overflow: auto;\n    word-break: auto-phrase;\n    overflow-wrap: anywhere;\n    background: var(--_panel-bg);\n    border: var(--border) solid var(--_panel-border-color);\n    border-radius: var(--rounded-lg);\n    box-shadow: var(--_panel-shadow);\n\n    /* Hidden by default */\n    opacity: 0;\n    backdrop-filter: blur(var(--_panel-blur));\n    transform: scale(var(--overlay-enter-scale-dialog)) translateY(4px);\n    transition:\n      opacity var(--transition-fast),\n      transform 200ms var(--ease-spring),\n      display var(--transition-fast) allow-discrete,\n      overlay var(--transition-fast) allow-discrete;\n  }\n\n  .panel[data-open] {\n    display: block;\n  }\n\n  .panel:popover-open,\n  .panel[data-open] {\n    opacity: 1;\n    transform: scale(1) translateY(0);\n\n    @starting-style {\n      opacity: 0;\n      transform: scale(var(--overlay-enter-scale-dialog)) translateY(4px);\n    }\n  }\n}\n"],"mappings":""}

package/dist/overlay/popover/{popover.css?inline.js → popover.css.js}

@@ -3,4 +3,4 @@ var e = "@layer refine.base{:host{--_panel-bg:var(--popover-bg,var(--color-canva
 //#endregion
 export { e as default };
 
-//# sourceMappingURL=popover.css?inline.js.map
+//# sourceMappingURL=popover.css.js.map

package/dist/overlay/popover/popover.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover.css.js","names":[],"sources":["../../../src/overlay/popover/popover.css?inline"],"sourcesContent":["@layer refine.base {\n  :host {\n    --_panel-bg: var(--popover-bg, var(--color-canvas));\n    --_panel-blur: var(--popover-panel-blur, var(--blur-md));\n    --_panel-border-color: var(--popover-border-color, var(--color-divider));\n    --_panel-shadow: var(--popover-shadow, var(--shadow-xl));\n\n    position: relative;\n    display: inline-block;\n  }\n\n  .panel {\n    position: fixed;\n\n    /* Popover UA resets */\n    inset: unset;\n    box-sizing: border-box;\n    min-width: var(--popover-min-width, 12rem);\n    max-width: var(--popover-max-width, 24rem);\n    max-height: var(--popover-max-height, min(70vh, 32rem));\n    padding: 0;\n    margin: 0;\n    overflow: auto;\n    word-break: auto-phrase;\n    overflow-wrap: anywhere;\n    background: var(--_panel-bg);\n    border: var(--border) solid var(--_panel-border-color);\n    border-radius: var(--rounded-lg);\n    box-shadow: var(--_panel-shadow);\n\n    /* Hidden by default */\n    opacity: 0;\n    backdrop-filter: blur(var(--_panel-blur));\n    transform: scale(var(--overlay-enter-scale-dialog)) translateY(4px);\n    transition:\n      opacity var(--transition-fast),\n      transform 200ms var(--ease-spring),\n      display var(--transition-fast) allow-discrete,\n      overlay var(--transition-fast) allow-discrete;\n  }\n\n  .panel[data-open] {\n    display: block;\n  }\n\n  .panel:popover-open,\n  .panel[data-open] {\n    opacity: 1;\n    transform: scale(1) translateY(0);\n\n    @starting-style {\n      opacity: 0;\n      transform: scale(var(--overlay-enter-scale-dialog)) translateY(4px);\n    }\n  }\n}\n"],"mappings":""}

package/dist/overlay/popover/popover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../../../src/overlay/popover/popover.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAIjD,OAAO,EAAE,KAAK,iBAAiB,EAAE,KAAK,iBAAiB,EAAuB,MAAM,gBAAgB,CAAC;AAMrG,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;AASzD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,sCAAsC;IACtC,KAAK,EAAE;QAAE,MAAM,EAAE,iBAAiB,CAAA;KAAE,CAAC;IACrC,qCAAqC;IACrC,IAAI,EAAE;QAAE,MAAM,EAAE,iBAAiB,CAAA;KAAE,CAAC;CACrC,CAAC;AAEF,mCAAmC;AACnC,MAAM,MAAM,eAAe,GAAG;IAC5B,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0CAA0C;IAC1C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,4BAA4B;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,kDAAkD;IAClD,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,WAAW,EAAG,aAAsB,CAAC"}
+{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../../../src/overlay/popover/popover.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAejD,OAAO,EAAE,KAAK,iBAAiB,EAAE,KAAK,iBAAiB,EAAuB,MAAM,gBAAgB,CAAC;AAMrG,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;AASzD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,sCAAsC;IACtC,KAAK,EAAE;QAAE,MAAM,EAAE,iBAAiB,CAAA;KAAE,CAAC;IACrC,qCAAqC;IACrC,IAAI,EAAE;QAAE,MAAM,EAAE,iBAAiB,CAAA;KAAE,CAAC;CACrC,CAAC;AAEF,mCAAmC;AACnC,MAAM,MAAM,eAAe,GAAG;IAC5B,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0CAA0C;IAC1C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,4BAA4B;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,kDAAkD;IAClD,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,WAAW,EAAG,aAAsB,CAAC"}

package/dist/overlay/tooltip/{tooltip.css?inline.cjs → tooltip.css.cjs}

@@ -1,2 +1,2 @@
 var e=`.tooltip{inset:unset;padding:calc(var(--size-0-5) / 2) var(--size-2) var(--size-0-5);border:var(--_tooltip-border-width,var(--border-0)) solid var(--_tooltip-border-color,transparent);transform-origin:50%;margin:0;overflow:visible}@layer refine.base{:host{display:inline-block;position:relative}.tooltip{--_tooltip-fg:var(--color-contrast-100);--_tooltip-bg:color-mix(in oklch, var(--color-contrast-900) 80%, transparent);--_tooltip-border-width:var(--border);--_tooltip-border-color:color-mix(in oklch, var(--color-contrast-100) 12%, transparent);--_tooltip-shadow:var(--shadow-md);--_tooltip-closed-transform:translateY(4px) scale(.98);max-width:var(--tooltip-max-width,var(--size-72));font-size:var(--text-xs);font-weight:var(--font-medium);line-height:var(--leading-normal);color:var(--_tooltip-fg);word-break:auto-phrase;white-space:normal;pointer-events:none;background:var(--_tooltip-bg);border-radius:var(--tooltip-radius,var(--rounded-lg));box-shadow:var(--_tooltip-shadow);opacity:0;-webkit-backdrop-filter:blur(var(--blur-sm));backdrop-filter:blur(var(--blur-sm));transform:var(--_tooltip-closed-transform);transition:opacity var(--transition-fast), transform var(--transition-fast), display var(--transition-fast) allow-discrete, overlay var(--transition-fast) allow-discrete;position:fixed}@media (prefers-color-scheme:dark){.tooltip{--_tooltip-fg:var(--color-contrast-900);--_tooltip-bg:color-mix(in oklch, var(--color-contrast-100) 80%, transparent);--_tooltip-border-color:color-mix(in oklch, var(--color-contrast-900) 12%, transparent)}}.tooltip-text{white-space:pre-line;display:block}.tooltip[data-placement=top]{--_tooltip-closed-transform:translateY(4px) scale(var(--overlay-enter-scale-dialog))}.tooltip[data-placement=bottom]{--_tooltip-closed-transform:translateY(-4px) scale(var(--overlay-enter-scale-dialog))}.tooltip[data-placement=left]{--_tooltip-closed-transform:translateX(4px) scale(var(--overlay-enter-scale-dialog))}.tooltip[data-placement=right]{--_tooltip-closed-transform:translateX(-4px) scale(var(--overlay-enter-scale-dialog))}.tooltip[data-open]{opacity:1;transition:opacity var(--transition-normal), transform var(--transition-spring), display var(--transition-normal) allow-discrete, overlay var(--transition-normal) allow-discrete;will-change:opacity, transform;display:block;transform:translate(0)scale(1)}.tooltip:popover-open{opacity:1;transition:opacity var(--transition-normal), transform var(--transition-spring), display var(--transition-normal) allow-discrete, overlay var(--transition-normal) allow-discrete;will-change:opacity, transform;transform:translate(0)scale(1)}@starting-style{.tooltip:popover-open{opacity:0;transform:var(--_tooltip-closed-transform)}}@starting-style{.tooltip[data-open]{opacity:0;transform:var(--_tooltip-closed-transform)}}}@layer refine.variants{:host([variant=light]) .tooltip{--_tooltip-fg:var(--color-contrast-900);--_tooltip-bg:color-mix(in oklch, var(--color-contrast-100) 80%, transparent);--_tooltip-border-color:color-mix(in oklch, var(--color-contrast-900) 12%, transparent);--_tooltip-shadow:var(--shadow-md)}@media (prefers-color-scheme:dark){:host([variant=light]) .tooltip{--_tooltip-fg:var(--color-contrast-100);--_tooltip-bg:color-mix(in oklch, var(--color-contrast-900) 80%, transparent);--_tooltip-border-color:color-mix(in oklch, var(--color-contrast-100) 12%, transparent)}}}@layer refine.utilities{:host([size=sm]) .tooltip{font-size:var(--text-xs)}:host([size=lg]) .tooltip{font-size:var(--text-base)}}`;exports.default=e;
-//# sourceMappingURL=tooltip.css?inline.cjs.map
+//# sourceMappingURL=tooltip.css.cjs.map

package/dist/overlay/tooltip/tooltip.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.css.cjs","names":[],"sources":["../../../src/overlay/tooltip/tooltip.css?inline"],"sourcesContent":["/* ========================================\n   Popover UA resets — unlayered so they unconditionally beat\n   the browser's [popover] UA stylesheet (padding / inset / border / margin).\n   Must NOT be inside @layer; unlayered author rules win over every layer and\n   every UA default.\n   ======================================== */\n.tooltip {\n  inset: unset;\n  padding: calc(var(--size-0-5) / 2) var(--size-2) var(--size-0-5);\n  margin: 0;\n  overflow: visible;\n  border: var(--_tooltip-border-width, var(--border-0)) solid var(--_tooltip-border-color, transparent);\n  transform-origin: center;\n}\n\n@layer refine.base {\n  :host {\n    position: relative;\n    display: inline-block;\n  }\n\n  .tooltip {\n    --_tooltip-fg: var(--color-contrast-100);\n    --_tooltip-bg: color-mix(in oklch, var(--color-contrast-900) 80%, transparent);\n    --_tooltip-border-width: var(--border);\n    --_tooltip-border-color: color-mix(in oklch, var(--color-contrast-100) 12%, transparent);\n    --_tooltip-shadow: var(--shadow-md);\n    --_tooltip-closed-transform: translateY(4px) scale(0.98);\n\n    /* Positioning — JS sets top/left inline */\n    position: fixed;\n    max-width: var(--tooltip-max-width, var(--size-72));\n    font-size: var(--text-xs);\n    font-weight: var(--font-medium);\n    line-height: var(--leading-normal);\n    color: var(--_tooltip-fg);\n    word-break: auto-phrase;\n    white-space: normal;\n    pointer-events: none;\n    background: var(--_tooltip-bg);\n    border-radius: var(--tooltip-radius, var(--rounded-lg));\n    box-shadow: var(--_tooltip-shadow);\n\n    /* Hidden by default (also serves as exit state) */\n    opacity: 0;\n    backdrop-filter: blur(var(--blur-sm));\n    transform: var(--_tooltip-closed-transform);\n    transition:\n      opacity var(--transition-fast),\n      transform var(--transition-fast),\n      display var(--transition-fast) allow-discrete,\n      overlay var(--transition-fast) allow-discrete;\n  }\n\n  @media (prefers-color-scheme: dark) {\n    .tooltip {\n      --_tooltip-fg: var(--color-contrast-900);\n      --_tooltip-bg: color-mix(in oklch, var(--color-contrast-100) 80%, transparent);\n      --_tooltip-border-color: color-mix(in oklch, var(--color-contrast-900) 12%, transparent);\n    }\n  }\n\n  .tooltip-text {\n    display: block;\n    white-space: pre-line;\n  }\n\n  .tooltip[data-placement='top'] {\n    --_tooltip-closed-transform: translateY(4px) scale(var(--overlay-enter-scale-dialog));\n  }\n\n  .tooltip[data-placement='bottom'] {\n    --_tooltip-closed-transform: translateY(-4px) scale(var(--overlay-enter-scale-dialog));\n  }\n\n  .tooltip[data-placement='left'] {\n    --_tooltip-closed-transform: translateX(4px) scale(var(--overlay-enter-scale-dialog));\n  }\n\n  .tooltip[data-placement='right'] {\n    --_tooltip-closed-transform: translateX(-4px) scale(var(--overlay-enter-scale-dialog));\n  }\n\n  .tooltip[data-open] {\n    display: block;\n  }\n\n  /* Entry animation via @starting-style */\n  .tooltip:popover-open,\n  .tooltip[data-open] {\n    opacity: 1;\n    transform: translate(0, 0) scale(1);\n    transition:\n      opacity var(--transition-normal),\n      transform var(--transition-spring),\n      display var(--transition-normal) allow-discrete,\n      overlay var(--transition-normal) allow-discrete;\n    will-change: opacity, transform;\n\n    @starting-style {\n      opacity: 0;\n      transform: var(--_tooltip-closed-transform);\n    }\n  }\n}\n\n@layer refine.variants {\n  /* Light tooltip */\n  :host([variant='light']) .tooltip {\n    --_tooltip-fg: var(--color-contrast-900);\n    --_tooltip-bg: color-mix(in oklch, var(--color-contrast-100) 80%, transparent);\n    --_tooltip-border-color: color-mix(in oklch, var(--color-contrast-900) 12%, transparent);\n    --_tooltip-shadow: var(--shadow-md);\n  }\n\n  @media (prefers-color-scheme: dark) {\n    :host([variant='light']) .tooltip {\n      --_tooltip-fg: var(--color-contrast-100);\n      --_tooltip-bg: color-mix(in oklch, var(--color-contrast-900) 80%, transparent);\n      --_tooltip-border-color: color-mix(in oklch, var(--color-contrast-100) 12%, transparent);\n    }\n  }\n}\n\n@layer refine.utilities {\n  :host([size='sm']) .tooltip {\n    font-size: var(--text-xs);\n  }\n\n  :host([size='lg']) .tooltip {\n    font-size: var(--text-base);\n  }\n}\n"],"mappings":""}

package/dist/overlay/tooltip/{tooltip.css?inline.js → tooltip.css.js}

@@ -3,4 +3,4 @@ var e = ".tooltip{inset:unset;padding:calc(var(--size-0-5) / 2) var(--size-2) va
 //#endregion
 export { e as default };
 
-//# sourceMappingURL=tooltip.css?inline.js.map
+//# sourceMappingURL=tooltip.css.js.map

package/dist/overlay/tooltip/tooltip.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.css.js","names":[],"sources":["../../../src/overlay/tooltip/tooltip.css?inline"],"sourcesContent":["/* ========================================\n   Popover UA resets — unlayered so they unconditionally beat\n   the browser's [popover] UA stylesheet (padding / inset / border / margin).\n   Must NOT be inside @layer; unlayered author rules win over every layer and\n   every UA default.\n   ======================================== */\n.tooltip {\n  inset: unset;\n  padding: calc(var(--size-0-5) / 2) var(--size-2) var(--size-0-5);\n  margin: 0;\n  overflow: visible;\n  border: var(--_tooltip-border-width, var(--border-0)) solid var(--_tooltip-border-color, transparent);\n  transform-origin: center;\n}\n\n@layer refine.base {\n  :host {\n    position: relative;\n    display: inline-block;\n  }\n\n  .tooltip {\n    --_tooltip-fg: var(--color-contrast-100);\n    --_tooltip-bg: color-mix(in oklch, var(--color-contrast-900) 80%, transparent);\n    --_tooltip-border-width: var(--border);\n    --_tooltip-border-color: color-mix(in oklch, var(--color-contrast-100) 12%, transparent);\n    --_tooltip-shadow: var(--shadow-md);\n    --_tooltip-closed-transform: translateY(4px) scale(0.98);\n\n    /* Positioning — JS sets top/left inline */\n    position: fixed;\n    max-width: var(--tooltip-max-width, var(--size-72));\n    font-size: var(--text-xs);\n    font-weight: var(--font-medium);\n    line-height: var(--leading-normal);\n    color: var(--_tooltip-fg);\n    word-break: auto-phrase;\n    white-space: normal;\n    pointer-events: none;\n    background: var(--_tooltip-bg);\n    border-radius: var(--tooltip-radius, var(--rounded-lg));\n    box-shadow: var(--_tooltip-shadow);\n\n    /* Hidden by default (also serves as exit state) */\n    opacity: 0;\n    backdrop-filter: blur(var(--blur-sm));\n    transform: var(--_tooltip-closed-transform);\n    transition:\n      opacity var(--transition-fast),\n      transform var(--transition-fast),\n      display var(--transition-fast) allow-discrete,\n      overlay var(--transition-fast) allow-discrete;\n  }\n\n  @media (prefers-color-scheme: dark) {\n    .tooltip {\n      --_tooltip-fg: var(--color-contrast-900);\n      --_tooltip-bg: color-mix(in oklch, var(--color-contrast-100) 80%, transparent);\n      --_tooltip-border-color: color-mix(in oklch, var(--color-contrast-900) 12%, transparent);\n    }\n  }\n\n  .tooltip-text {\n    display: block;\n    white-space: pre-line;\n  }\n\n  .tooltip[data-placement='top'] {\n    --_tooltip-closed-transform: translateY(4px) scale(var(--overlay-enter-scale-dialog));\n  }\n\n  .tooltip[data-placement='bottom'] {\n    --_tooltip-closed-transform: translateY(-4px) scale(var(--overlay-enter-scale-dialog));\n  }\n\n  .tooltip[data-placement='left'] {\n    --_tooltip-closed-transform: translateX(4px) scale(var(--overlay-enter-scale-dialog));\n  }\n\n  .tooltip[data-placement='right'] {\n    --_tooltip-closed-transform: translateX(-4px) scale(var(--overlay-enter-scale-dialog));\n  }\n\n  .tooltip[data-open] {\n    display: block;\n  }\n\n  /* Entry animation via @starting-style */\n  .tooltip:popover-open,\n  .tooltip[data-open] {\n    opacity: 1;\n    transform: translate(0, 0) scale(1);\n    transition:\n      opacity var(--transition-normal),\n      transform var(--transition-spring),\n      display var(--transition-normal) allow-discrete,\n      overlay var(--transition-normal) allow-discrete;\n    will-change: opacity, transform;\n\n    @starting-style {\n      opacity: 0;\n      transform: var(--_tooltip-closed-transform);\n    }\n  }\n}\n\n@layer refine.variants {\n  /* Light tooltip */\n  :host([variant='light']) .tooltip {\n    --_tooltip-fg: var(--color-contrast-900);\n    --_tooltip-bg: color-mix(in oklch, var(--color-contrast-100) 80%, transparent);\n    --_tooltip-border-color: color-mix(in oklch, var(--color-contrast-900) 12%, transparent);\n    --_tooltip-shadow: var(--shadow-md);\n  }\n\n  @media (prefers-color-scheme: dark) {\n    :host([variant='light']) .tooltip {\n      --_tooltip-fg: var(--color-contrast-100);\n      --_tooltip-bg: color-mix(in oklch, var(--color-contrast-900) 80%, transparent);\n      --_tooltip-border-color: color-mix(in oklch, var(--color-contrast-100) 12%, transparent);\n    }\n  }\n}\n\n@layer refine.utilities {\n  :host([size='sm']) .tooltip {\n    font-size: var(--text-xs);\n  }\n\n  :host([size='lg']) .tooltip {\n    font-size: var(--text-base);\n  }\n}\n"],"mappings":""}

package/dist/pagination.cjs

@@ -1,4 +1,4 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./styles/mixins/accessibility.css.cjs"),t=require("./styles/mixins/shape.css.cjs"),n=require("./styles/mixins/theme.css.cjs"),r=require("./shared/prop-bundles.cjs"),i=require("./content/pagination/pagination.css?inline.cjs");let a=require("@vielzeug/ore"),o=require("@vielzeug/ripple");function s(e,t,n){let r=t,i=[];if(r<=2+2*n+3)return Array.from({length:r},(e,t)=>t+1);let a=Math.max(e-n,2),o=Math.min(e+n,r-1);i.push(1),a>3?i.push(`ellipsis-start`):a===3&&i.push(2);for(let e=a;e<=o;e++)i.push(e);return o<r-1-1?i.push(`ellipsis-end`):o===r-1-1&&i.push(r-1),i.push(r),i}var c=`ore-pagination`;(0,a.define)(c,{props:{...r.themableBundle,...r.sizableBundle,label:a.prop.string(`Pagination`),page:a.prop.number(1),"show-first-last":a.prop.bool(!1),"show-prev-next":a.prop.bool(!1),siblings:a.prop.number(1),"total-pages":a.prop.number(1),variant:a.prop.string()},setup(e,{bind:t,el:n,emit:r}){function i(t){let i=e[`total-pages`].value||1,a=Math.min(Math.max(1,t),i);a!==e.page.value&&(n.setAttribute(`page`,String(a)),r(`change`,{page:a}))}let c=(0,o.computed)(()=>s(e.page.value||1,e[`total-pages`].value||1,e.siblings.value??1)),l=(0,o.computed)(()=>(e.page.value||1)<=1),u=(0,o.computed)(()=>(e.page.value||1)>=(e[`total-pages`].value||1));return a.html`
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./styles/mixins/accessibility.css.cjs"),t=require("./styles/mixins/shape.css.cjs"),n=require("./styles/mixins/theme.css.cjs"),r=require("./shared/prop-bundles.cjs"),i=require("./content/pagination/pagination.css.cjs");let a=require("@vielzeug/ore"),o=require("@vielzeug/ripple");function s(e,t,n){let r=t,i=[];if(r<=2+2*n+3)return Array.from({length:r},(e,t)=>t+1);let a=Math.max(e-n,2),o=Math.min(e+n,r-1);i.push(1),a>3?i.push(`ellipsis-start`):a===3&&i.push(2);for(let e=a;e<=o;e++)i.push(e);return o<r-1-1?i.push(`ellipsis-end`):o===r-1-1&&i.push(r-1),i.push(r),i}var c=`ore-pagination`;(0,a.define)(c,{props:{...r.themableBundle,...r.sizableBundle,label:a.prop.string(`Pagination`),page:a.prop.number(1),"show-first-last":a.prop.bool(!1),"show-prev-next":a.prop.bool(!1),siblings:a.prop.number(1),"total-pages":a.prop.number(1),variant:a.prop.string()},setup(e){let t=(0,a.getHost)(),n=(0,a.useEmit)();function r(r){let i=e[`total-pages`].value||1,a=Math.min(Math.max(1,r),i);a!==e.page.value&&(t.setAttribute(`page`,String(a)),n(`change`,{page:a}))}let i=(0,o.computed)(()=>s(e.page.value||1,e[`total-pages`].value||1,e.siblings.value??1)),c=(0,o.computed)(()=>(e.page.value||1)<=1),l=(0,o.computed)(()=>(e.page.value||1)>=(e[`total-pages`].value||1));return a.html`
       <nav :aria-label="${e.label}" part="nav">
         <ol class="pagination" part="list">
           ${()=>e[`show-first-last`].value?a.html`<li>
@@ -7,8 +7,8 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
                     class="nav-btn"
                     part="first-btn"
                     aria-label="First page"
-                    ?disabled=${l}
-                    @click=${()=>i(1)}>
+                    ?disabled=${c}
+                    @click=${()=>r(1)}>
                     <ore-icon name="chevrons-left" size="16" aria-hidden="true"></ore-icon>
                   </button>
                 </li>`:``}
@@ -18,20 +18,20 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
                     class="nav-btn"
                     part="prev-btn"
                     aria-label="Previous page"
-                    ?disabled=${l}
-                    @click=${()=>i((e.page.value||1)-1)}>
+                    ?disabled=${c}
+                    @click=${()=>r((e.page.value||1)-1)}>
                     <ore-icon name="chevron-left" size="16" aria-hidden="true"></ore-icon>
                   </button>
                 </li>`:``}
           <li style="display: contents;">
-            ${()=>c.value.map(t=>{if(t===`ellipsis-start`||t===`ellipsis-end`)return a.html`<span class="ellipsis" aria-hidden="true">&hellip;</span>`;let n=t,r=n===(e.page.value||1),o=`Page ${n}`;return r?a.html`<button
+            ${()=>i.value.map(t=>{if(t===`ellipsis-start`||t===`ellipsis-end`)return a.html`<span class="ellipsis" aria-hidden="true">&hellip;</span>`;let n=t,i=n===(e.page.value||1),o=`Page ${n}`;return i?a.html`<button
                       type="button"
                       part="page-btn"
                       aria-label="${o}"
                       aria-current="page"
-                      @click=${()=>i(n)}>
+                      @click=${()=>r(n)}>
                       ${n}
-                    </button>`:a.html`<button type="button" part="page-btn" aria-label="${o}" @click=${()=>i(n)}>
+                    </button>`:a.html`<button type="button" part="page-btn" aria-label="${o}" @click=${()=>r(n)}>
                       ${n}
                     </button>`})}
           </li>
@@ -41,8 +41,8 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
                     class="nav-btn"
                     part="next-btn"
                     aria-label="Next page"
-                    ?disabled=${u}
-                    @click=${()=>i((e.page.value||1)+1)}>
+                    ?disabled=${l}
+                    @click=${()=>r((e.page.value||1)+1)}>
                     <ore-icon name="chevron-right" size="16" aria-hidden="true"></ore-icon>
                   </button>
                 </li>`:``}
@@ -52,8 +52,8 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
                     class="nav-btn"
                     part="last-btn"
                     aria-label="Last page"
-                    ?disabled=${u}
-                    @click=${()=>i(e[`total-pages`].value||1)}>
+                    ?disabled=${l}
+                    @click=${()=>r(e[`total-pages`].value||1)}>
                     <ore-icon name="chevrons-right" size="16" aria-hidden="true"></ore-icon>
                   </button>
                 </li>`:``}

package/dist/pagination.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"pagination.cjs","names":[],"sources":["../src/content/pagination/pagination.ts"],"sourcesContent":["import { define, html, prop } from '@vielzeug/ore';\nimport { computed } from '@vielzeug/ripple';\n\nimport '../icon/icon';\nimport '../../inputs/button/button';\nimport type { ComponentSize, ThemeColor, VisualVariant } from '../../types';\n\nimport { sizableBundle, themableBundle } from '../../shared';\nimport { coarsePointerMixin, colorThemeMixin, sizeVariantMixin } from '../../styles';\nimport componentStyles from './pagination.css?inline';\n\nexport type OrePaginationEvents = {\n  change: { page: number };\n};\n\nexport type OrePaginationProps = {\n  color?: ThemeColor;\n  label?: string;\n  page?: number;\n  'show-first-last'?: boolean;\n  'show-prev-next'?: boolean;\n  siblings?: number;\n  size?: ComponentSize;\n  'total-pages'?: number;\n  variant?: VisualVariant;\n};\n\nfunction buildPageRange(\n  currentPage: number,\n  totalPages: number,\n  siblings: number,\n): Array<number | 'ellipsis-start' | 'ellipsis-end'> {\n  const BOUNDARY = 1; // always show first and last page\n  const total = totalPages;\n  const pages: Array<number | 'ellipsis-start' | 'ellipsis-end'> = [];\n\n  // If total is small enough, show all pages\n  if (total <= 2 * BOUNDARY + 2 * siblings + 3) {\n    return Array.from({ length: total }, (_, i) => i + 1);\n  }\n\n  const leftSibling = Math.max(currentPage - siblings, BOUNDARY + 1);\n  const rightSibling = Math.min(currentPage + siblings, total - BOUNDARY);\n\n  pages.push(1);\n\n  if (leftSibling > BOUNDARY + 2) pages.push('ellipsis-start');\n  else if (leftSibling === BOUNDARY + 2) pages.push(BOUNDARY + 1);\n\n  for (let i = leftSibling; i <= rightSibling; i++) pages.push(i);\n\n  if (rightSibling < total - BOUNDARY - 1) pages.push('ellipsis-end');\n  else if (rightSibling === total - BOUNDARY - 1) pages.push(total - BOUNDARY);\n\n  pages.push(total);\n\n  return pages;\n}\n\n/**\n * Page-based navigation control.\n *\n * @element ore-pagination\n *\n * @attr {number} page - Current page (1-indexed, default: 1)\n * @attr {number} total-pages - Total number of pages (required)\n * @attr {number} siblings - Sibling pages around current (default: 1)\n * @attr {boolean} show-first-last - Show first/last page buttons (default: false)\n * @attr {boolean} show-prev-next - Show prev/next buttons (default: false)\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} variant - Visual variant for nav buttons: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost' | 'text' | 'frost' (default: 'ghost')\n * @attr {string} size - 'sm' | 'md' | 'lg'\n * @attr {string} label - Accessible nav label (default: 'Pagination')\n *\n * @fires change - Emitted when the page changes, with { page: number }\n *\n * @cssprop --pagination-item-size - Width/height of each item\n * @cssprop --pagination-gap - Gap between items\n * @cssprop --pagination-radius - Border radius of items\n *\n * @part page-btn - Page button.\n * @part nav - Navigation container.\n * @part list - List container.\n * @part first-btn - First page button.\n * @part prev-btn - Previous page button.\n * @part next-btn - Next page button.\n * @part last-btn - Last page button.\n * @example\n * ```html\n * <!-- Basic -->\n * <ore-pagination page=\"3\" total-pages=\"10\" color=\"primary\"></ore-pagination>\n *\n * <!-- With prev/next and first/last buttons -->\n * <ore-pagination page=\"5\" total-pages=\"20\" show-prev-next show-first-last siblings=\"2\"></ore-pagination>\n *\n * <!-- Compact size -->\n * <ore-pagination page=\"1\" total-pages=\"5\" size=\"sm\" variant=\"ghost\"></ore-pagination>\n * ```\n */\nexport const PAGINATION_TAG = 'ore-pagination' as const;\ndefine<OrePaginationProps, OrePaginationEvents>(PAGINATION_TAG, {\n  props: {\n    ...themableBundle,\n    ...sizableBundle,\n    label: prop.string('Pagination'),\n    page: prop.number(1),\n    'show-first-last': prop.bool(false),\n    'show-prev-next': prop.bool(false),\n    siblings: prop.number(1),\n    'total-pages': prop.number(1),\n    variant: prop.string<VisualVariant>(),\n  },\n  setup(props, { bind: _bind, el, emit }) {\n    function goTo(page: number) {\n      const total = props['total-pages'].value || 1;\n      const next = Math.min(Math.max(1, page), total);\n\n      if (next === props.page.value) return;\n\n      el.setAttribute('page', String(next));\n      emit('change', { page: next });\n    }\n\n    const pageItems = computed(() =>\n      buildPageRange(props.page.value || 1, props['total-pages'].value || 1, props.siblings.value ?? 1),\n    );\n\n    const isFirst = computed(() => (props.page.value || 1) <= 1);\n    const isLast = computed(() => (props.page.value || 1) >= (props['total-pages'].value || 1));\n\n    return html`\n      <nav :aria-label=\"${props.label}\" part=\"nav\">\n        <ol class=\"pagination\" part=\"list\">\n          ${() =>\n            props['show-first-last'].value\n              ? html`<li>\n                  <button\n                    type=\"button\"\n                    class=\"nav-btn\"\n                    part=\"first-btn\"\n                    aria-label=\"First page\"\n                    ?disabled=${isFirst}\n                    @click=${() => goTo(1)}>\n                    <ore-icon name=\"chevrons-left\" size=\"16\" aria-hidden=\"true\"></ore-icon>\n                  </button>\n                </li>`\n              : ''}\n          ${() =>\n            props['show-prev-next'].value\n              ? html`<li>\n                  <button\n                    type=\"button\"\n                    class=\"nav-btn\"\n                    part=\"prev-btn\"\n                    aria-label=\"Previous page\"\n                    ?disabled=${isFirst}\n                    @click=${() => goTo((props.page.value || 1) - 1)}>\n                    <ore-icon name=\"chevron-left\" size=\"16\" aria-hidden=\"true\"></ore-icon>\n                  </button>\n                </li>`\n              : ''}\n          <li style=\"display: contents;\">\n            ${() =>\n              pageItems.value.map((item) => {\n                if (item === 'ellipsis-start' || item === 'ellipsis-end') {\n                  return html`<span class=\"ellipsis\" aria-hidden=\"true\">&hellip;</span>`;\n                }\n\n                const pg = item as number;\n                const isCurrent = pg === (props.page.value || 1);\n                const pgLabel = `Page ${pg}`;\n\n                return isCurrent\n                  ? html`<button\n                      type=\"button\"\n                      part=\"page-btn\"\n                      aria-label=\"${pgLabel}\"\n                      aria-current=\"page\"\n                      @click=${() => goTo(pg)}>\n                      ${pg}\n                    </button>`\n                  : html`<button type=\"button\" part=\"page-btn\" aria-label=\"${pgLabel}\" @click=${() => goTo(pg)}>\n                      ${pg}\n                    </button>`;\n              })}\n          </li>\n          ${() =>\n            props['show-prev-next'].value\n              ? html`<li>\n                  <button\n                    type=\"button\"\n                    class=\"nav-btn\"\n                    part=\"next-btn\"\n                    aria-label=\"Next page\"\n                    ?disabled=${isLast}\n                    @click=${() => goTo((props.page.value || 1) + 1)}>\n                    <ore-icon name=\"chevron-right\" size=\"16\" aria-hidden=\"true\"></ore-icon>\n                  </button>\n                </li>`\n              : ''}\n          ${() =>\n            props['show-first-last'].value\n              ? html`<li>\n                  <button\n                    type=\"button\"\n                    class=\"nav-btn\"\n                    part=\"last-btn\"\n                    aria-label=\"Last page\"\n                    ?disabled=${isLast}\n                    @click=${() => goTo(props['total-pages'].value || 1)}>\n                    <ore-icon name=\"chevrons-right\" size=\"16\" aria-hidden=\"true\"></ore-icon>\n                  </button>\n                </li>`\n              : ''}\n        </ol>\n      </nav>\n    `;\n  },\n\n  styles: [coarsePointerMixin, colorThemeMixin, sizeVariantMixin(), componentStyles],\n});\n"],"mappings":"kXA2BA,SAAS,EACP,EACA,EACA,EACmD,CACnD,IACM,EAAQ,EACR,EAA2D,CAAC,EAGlE,GAAI,GAAS,EAAe,EAAI,EAAW,EACzC,OAAO,MAAM,KAAK,CAAE,OAAQ,CAAM,GAAI,EAAG,IAAM,EAAI,CAAC,EAGtD,IAAM,EAAc,KAAK,IAAI,EAAc,EAAU,CAAY,EAC3D,EAAe,KAAK,IAAI,EAAc,EAAU,EAAQ,CAAQ,EAEtE,EAAM,KAAK,CAAC,EAER,EAAc,EAAc,EAAM,KAAK,gBAAgB,EAClD,IAAgB,GAAc,EAAM,KAAK,CAAY,EAE9D,IAAK,IAAI,EAAI,EAAa,GAAK,EAAc,IAAK,EAAM,KAAK,CAAC,EAO9D,OALI,EAAe,EAAQ,EAAW,EAAG,EAAM,KAAK,cAAc,EACzD,IAAiB,EAAQ,EAAW,GAAG,EAAM,KAAK,EAAQ,CAAQ,EAE3E,EAAM,KAAK,CAAK,EAET,CACT,CA0CA,IAAa,EAAiB,8BACkB,EAAgB,CAC9D,MAAO,CACL,GAAG,EAAA,eACH,GAAG,EAAA,cACH,MAAO,EAAA,KAAK,OAAO,YAAY,EAC/B,KAAM,EAAA,KAAK,OAAO,CAAC,EACnB,kBAAmB,EAAA,KAAK,KAAK,EAAK,EAClC,iBAAkB,EAAA,KAAK,KAAK,EAAK,EACjC,SAAU,EAAA,KAAK,OAAO,CAAC,EACvB,cAAe,EAAA,KAAK,OAAO,CAAC,EAC5B,QAAS,EAAA,KAAK,OAAsB,CACtC,EACA,MAAM,EAAO,CAAE,KAAM,EAAO,KAAI,QAAQ,CACtC,SAAS,EAAK,EAAc,CAC1B,IAAM,EAAQ,EAAM,cAAc,CAAC,OAAS,EACtC,EAAO,KAAK,IAAI,KAAK,IAAI,EAAG,CAAI,EAAG,CAAK,EAE1C,IAAS,EAAM,KAAK,QAExB,EAAG,aAAa,OAAQ,OAAO,CAAI,CAAC,EACpC,EAAK,SAAU,CAAE,KAAM,CAAK,CAAC,EAC/B,CAEA,IAAM,GAAA,EAAA,EAAA,SAAA,KACJ,EAAe,EAAM,KAAK,OAAS,EAAG,EAAM,cAAc,CAAC,OAAS,EAAG,EAAM,SAAS,OAAS,CAAC,CAClG,EAEM,GAAA,EAAA,EAAA,SAAA,MAA0B,EAAM,KAAK,OAAS,IAAM,CAAC,EACrD,GAAA,EAAA,EAAA,SAAA,MAAyB,EAAM,KAAK,OAAS,KAAO,EAAM,cAAc,CAAC,OAAS,EAAE,EAE1F,MAAO,GAAA,IAAI;0BACW,EAAM,MAAM;;gBAG1B,EAAM,kBAAkB,CAAC,MACrB,EAAA,IAAI;;;;;;gCAMY,EAAQ;iCACL,EAAK,CAAC,EAAE;;;uBAI3B,GAAG;gBAEP,EAAM,iBAAiB,CAAC,MACpB,EAAA,IAAI;;;;;;gCAMY,EAAQ;iCACL,GAAM,EAAM,KAAK,OAAS,GAAK,CAAC,EAAE;;;uBAIrD,GAAG;;kBAGL,EAAU,MAAM,IAAK,GAAS,CAC5B,GAAI,IAAS,kBAAoB,IAAS,eACxC,MAAO,GAAA,IAAI,4DAGb,IAAM,EAAK,EACL,EAAY,KAAQ,EAAM,KAAK,OAAS,GACxC,EAAU,QAAQ,IAExB,OAAO,EACH,EAAA,IAAI;;;oCAGY,EAAQ;;mCAEP,EAAK,CAAE,EAAE;wBACtB,EAAG;+BAEP,EAAA,IAAI,qDAAqD,EAAQ,eAAiB,EAAK,CAAE,EAAE;wBACvF,EAAG;8BAEb,CAAC,EAAE;;gBAGL,EAAM,iBAAiB,CAAC,MACpB,EAAA,IAAI;;;;;;gCAMY,EAAO;iCACJ,GAAM,EAAM,KAAK,OAAS,GAAK,CAAC,EAAE;;;uBAIrD,GAAG;gBAEP,EAAM,kBAAkB,CAAC,MACrB,EAAA,IAAI;;;;;;gCAMY,EAAO;iCACJ,EAAK,EAAM,cAAc,CAAC,OAAS,CAAC,EAAE;;;uBAIzD,GAAG;;;KAIjB,EAEA,OAAQ,CAAC,EAAA,mBAAoB,EAAA,gBAAiB,EAAA,iBAAiB,EAAG,EAAA,OAAe,CACnF,CAAC"}
+{"version":3,"file":"pagination.cjs","names":[],"sources":["../src/content/pagination/pagination.ts"],"sourcesContent":["import { define, html, prop, getHost, useEmit } from '@vielzeug/ore';\nimport { computed } from '@vielzeug/ripple';\n\nimport '../icon/icon';\nimport '../../inputs/button/button';\nimport type { ComponentSize, ThemeColor, VisualVariant } from '../../types';\n\nimport { sizableBundle, themableBundle } from '../../shared';\nimport { coarsePointerMixin, colorThemeMixin, sizeVariantMixin } from '../../styles';\nimport componentStyles from './pagination.css?inline';\n\nexport type OrePaginationEvents = {\n  change: { page: number };\n};\n\nexport type OrePaginationProps = {\n  color?: ThemeColor;\n  label?: string;\n  page?: number;\n  'show-first-last'?: boolean;\n  'show-prev-next'?: boolean;\n  siblings?: number;\n  size?: ComponentSize;\n  'total-pages'?: number;\n  variant?: VisualVariant;\n};\n\nfunction buildPageRange(\n  currentPage: number,\n  totalPages: number,\n  siblings: number,\n): Array<number | 'ellipsis-start' | 'ellipsis-end'> {\n  const BOUNDARY = 1; // always show first and last page\n  const total = totalPages;\n  const pages: Array<number | 'ellipsis-start' | 'ellipsis-end'> = [];\n\n  // If total is small enough, show all pages\n  if (total <= 2 * BOUNDARY + 2 * siblings + 3) {\n    return Array.from({ length: total }, (_, i) => i + 1);\n  }\n\n  const leftSibling = Math.max(currentPage - siblings, BOUNDARY + 1);\n  const rightSibling = Math.min(currentPage + siblings, total - BOUNDARY);\n\n  pages.push(1);\n\n  if (leftSibling > BOUNDARY + 2) pages.push('ellipsis-start');\n  else if (leftSibling === BOUNDARY + 2) pages.push(BOUNDARY + 1);\n\n  for (let i = leftSibling; i <= rightSibling; i++) pages.push(i);\n\n  if (rightSibling < total - BOUNDARY - 1) pages.push('ellipsis-end');\n  else if (rightSibling === total - BOUNDARY - 1) pages.push(total - BOUNDARY);\n\n  pages.push(total);\n\n  return pages;\n}\n\n/**\n * Page-based navigation control.\n *\n * @element ore-pagination\n *\n * @attr {number} page - Current page (1-indexed, default: 1)\n * @attr {number} total-pages - Total number of pages (required)\n * @attr {number} siblings - Sibling pages around current (default: 1)\n * @attr {boolean} show-first-last - Show first/last page buttons (default: false)\n * @attr {boolean} show-prev-next - Show prev/next buttons (default: false)\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} variant - Visual variant for nav buttons: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost' | 'text' | 'frost' (default: 'ghost')\n * @attr {string} size - 'sm' | 'md' | 'lg'\n * @attr {string} label - Accessible nav label (default: 'Pagination')\n *\n * @fires change - Emitted when the page changes, with { page: number }\n *\n * @cssprop --pagination-item-size - Width/height of each item\n * @cssprop --pagination-gap - Gap between items\n * @cssprop --pagination-radius - Border radius of items\n *\n * @part page-btn - Page button.\n * @part nav - Navigation container.\n * @part list - List container.\n * @part first-btn - First page button.\n * @part prev-btn - Previous page button.\n * @part next-btn - Next page button.\n * @part last-btn - Last page button.\n * @example\n * ```html\n * <!-- Basic -->\n * <ore-pagination page=\"3\" total-pages=\"10\" color=\"primary\"></ore-pagination>\n *\n * <!-- With prev/next and first/last buttons -->\n * <ore-pagination page=\"5\" total-pages=\"20\" show-prev-next show-first-last siblings=\"2\"></ore-pagination>\n *\n * <!-- Compact size -->\n * <ore-pagination page=\"1\" total-pages=\"5\" size=\"sm\" variant=\"ghost\"></ore-pagination>\n * ```\n */\nexport const PAGINATION_TAG = 'ore-pagination' as const;\ndefine<OrePaginationProps>(PAGINATION_TAG, {\n  props: {\n    ...themableBundle,\n    ...sizableBundle,\n    label: prop.string('Pagination'),\n    page: prop.number(1),\n    'show-first-last': prop.bool(false),\n    'show-prev-next': prop.bool(false),\n    siblings: prop.number(1),\n    'total-pages': prop.number(1),\n    variant: prop.string<VisualVariant>(),\n  },\n  setup(props) {\n    const el = getHost();\n    const emit = useEmit<OrePaginationEvents>();\n\n    function goTo(page: number) {\n      const total = props['total-pages'].value || 1;\n      const next = Math.min(Math.max(1, page), total);\n\n      if (next === props.page.value) return;\n\n      el.setAttribute('page', String(next));\n      emit('change', { page: next });\n    }\n\n    const pageItems = computed(() =>\n      buildPageRange(props.page.value || 1, props['total-pages'].value || 1, props.siblings.value ?? 1),\n    );\n\n    const isFirst = computed(() => (props.page.value || 1) <= 1);\n    const isLast = computed(() => (props.page.value || 1) >= (props['total-pages'].value || 1));\n\n    return html`\n      <nav :aria-label=\"${props.label}\" part=\"nav\">\n        <ol class=\"pagination\" part=\"list\">\n          ${() =>\n            props['show-first-last'].value\n              ? html`<li>\n                  <button\n                    type=\"button\"\n                    class=\"nav-btn\"\n                    part=\"first-btn\"\n                    aria-label=\"First page\"\n                    ?disabled=${isFirst}\n                    @click=${() => goTo(1)}>\n                    <ore-icon name=\"chevrons-left\" size=\"16\" aria-hidden=\"true\"></ore-icon>\n                  </button>\n                </li>`\n              : ''}\n          ${() =>\n            props['show-prev-next'].value\n              ? html`<li>\n                  <button\n                    type=\"button\"\n                    class=\"nav-btn\"\n                    part=\"prev-btn\"\n                    aria-label=\"Previous page\"\n                    ?disabled=${isFirst}\n                    @click=${() => goTo((props.page.value || 1) - 1)}>\n                    <ore-icon name=\"chevron-left\" size=\"16\" aria-hidden=\"true\"></ore-icon>\n                  </button>\n                </li>`\n              : ''}\n          <li style=\"display: contents;\">\n            ${() =>\n              pageItems.value.map((item) => {\n                if (item === 'ellipsis-start' || item === 'ellipsis-end') {\n                  return html`<span class=\"ellipsis\" aria-hidden=\"true\">&hellip;</span>`;\n                }\n\n                const pg = item as number;\n                const isCurrent = pg === (props.page.value || 1);\n                const pgLabel = `Page ${pg}`;\n\n                return isCurrent\n                  ? html`<button\n                      type=\"button\"\n                      part=\"page-btn\"\n                      aria-label=\"${pgLabel}\"\n                      aria-current=\"page\"\n                      @click=${() => goTo(pg)}>\n                      ${pg}\n                    </button>`\n                  : html`<button type=\"button\" part=\"page-btn\" aria-label=\"${pgLabel}\" @click=${() => goTo(pg)}>\n                      ${pg}\n                    </button>`;\n              })}\n          </li>\n          ${() =>\n            props['show-prev-next'].value\n              ? html`<li>\n                  <button\n                    type=\"button\"\n                    class=\"nav-btn\"\n                    part=\"next-btn\"\n                    aria-label=\"Next page\"\n                    ?disabled=${isLast}\n                    @click=${() => goTo((props.page.value || 1) + 1)}>\n                    <ore-icon name=\"chevron-right\" size=\"16\" aria-hidden=\"true\"></ore-icon>\n                  </button>\n                </li>`\n              : ''}\n          ${() =>\n            props['show-first-last'].value\n              ? html`<li>\n                  <button\n                    type=\"button\"\n                    class=\"nav-btn\"\n                    part=\"last-btn\"\n                    aria-label=\"Last page\"\n                    ?disabled=${isLast}\n                    @click=${() => goTo(props['total-pages'].value || 1)}>\n                    <ore-icon name=\"chevrons-right\" size=\"16\" aria-hidden=\"true\"></ore-icon>\n                  </button>\n                </li>`\n              : ''}\n        </ol>\n      </nav>\n    `;\n  },\n\n  styles: [coarsePointerMixin, colorThemeMixin, sizeVariantMixin(), componentStyles],\n});\n"],"mappings":"2WA2BA,SAAS,EACP,EACA,EACA,EACmD,CACnD,IACM,EAAQ,EACR,EAA2D,CAAC,EAGlE,GAAI,GAAS,EAAe,EAAI,EAAW,EACzC,OAAO,MAAM,KAAK,CAAE,OAAQ,CAAM,GAAI,EAAG,IAAM,EAAI,CAAC,EAGtD,IAAM,EAAc,KAAK,IAAI,EAAc,EAAU,CAAY,EAC3D,EAAe,KAAK,IAAI,EAAc,EAAU,EAAQ,CAAQ,EAEtE,EAAM,KAAK,CAAC,EAER,EAAc,EAAc,EAAM,KAAK,gBAAgB,EAClD,IAAgB,GAAc,EAAM,KAAK,CAAY,EAE9D,IAAK,IAAI,EAAI,EAAa,GAAK,EAAc,IAAK,EAAM,KAAK,CAAC,EAO9D,OALI,EAAe,EAAQ,EAAW,EAAG,EAAM,KAAK,cAAc,EACzD,IAAiB,EAAQ,EAAW,GAAG,EAAM,KAAK,EAAQ,CAAQ,EAE3E,EAAM,KAAK,CAAK,EAET,CACT,CA0CA,IAAa,EAAiB,8BACH,EAAgB,CACzC,MAAO,CACL,GAAG,EAAA,eACH,GAAG,EAAA,cACH,MAAO,EAAA,KAAK,OAAO,YAAY,EAC/B,KAAM,EAAA,KAAK,OAAO,CAAC,EACnB,kBAAmB,EAAA,KAAK,KAAK,EAAK,EAClC,iBAAkB,EAAA,KAAK,KAAK,EAAK,EACjC,SAAU,EAAA,KAAK,OAAO,CAAC,EACvB,cAAe,EAAA,KAAK,OAAO,CAAC,EAC5B,QAAS,EAAA,KAAK,OAAsB,CACtC,EACA,MAAM,EAAO,CACX,IAAM,GAAA,EAAA,EAAA,QAAA,CAAa,EACb,GAAA,EAAA,EAAA,QAAA,CAAoC,EAE1C,SAAS,EAAK,EAAc,CAC1B,IAAM,EAAQ,EAAM,cAAc,CAAC,OAAS,EACtC,EAAO,KAAK,IAAI,KAAK,IAAI,EAAG,CAAI,EAAG,CAAK,EAE1C,IAAS,EAAM,KAAK,QAExB,EAAG,aAAa,OAAQ,OAAO,CAAI,CAAC,EACpC,EAAK,SAAU,CAAE,KAAM,CAAK,CAAC,EAC/B,CAEA,IAAM,GAAA,EAAA,EAAA,SAAA,KACJ,EAAe,EAAM,KAAK,OAAS,EAAG,EAAM,cAAc,CAAC,OAAS,EAAG,EAAM,SAAS,OAAS,CAAC,CAClG,EAEM,GAAA,EAAA,EAAA,SAAA,MAA0B,EAAM,KAAK,OAAS,IAAM,CAAC,EACrD,GAAA,EAAA,EAAA,SAAA,MAAyB,EAAM,KAAK,OAAS,KAAO,EAAM,cAAc,CAAC,OAAS,EAAE,EAE1F,MAAO,GAAA,IAAI;0BACW,EAAM,MAAM;;gBAG1B,EAAM,kBAAkB,CAAC,MACrB,EAAA,IAAI;;;;;;gCAMY,EAAQ;iCACL,EAAK,CAAC,EAAE;;;uBAI3B,GAAG;gBAEP,EAAM,iBAAiB,CAAC,MACpB,EAAA,IAAI;;;;;;gCAMY,EAAQ;iCACL,GAAM,EAAM,KAAK,OAAS,GAAK,CAAC,EAAE;;;uBAIrD,GAAG;;kBAGL,EAAU,MAAM,IAAK,GAAS,CAC5B,GAAI,IAAS,kBAAoB,IAAS,eACxC,MAAO,GAAA,IAAI,4DAGb,IAAM,EAAK,EACL,EAAY,KAAQ,EAAM,KAAK,OAAS,GACxC,EAAU,QAAQ,IAExB,OAAO,EACH,EAAA,IAAI;;;oCAGY,EAAQ;;mCAEP,EAAK,CAAE,EAAE;wBACtB,EAAG;+BAEP,EAAA,IAAI,qDAAqD,EAAQ,eAAiB,EAAK,CAAE,EAAE;wBACvF,EAAG;8BAEb,CAAC,EAAE;;gBAGL,EAAM,iBAAiB,CAAC,MACpB,EAAA,IAAI;;;;;;gCAMY,EAAO;iCACJ,GAAM,EAAM,KAAK,OAAS,GAAK,CAAC,EAAE;;;uBAIrD,GAAG;gBAEP,EAAM,kBAAkB,CAAC,MACrB,EAAA,IAAI;;;;;;gCAMY,EAAO;iCACJ,EAAK,EAAM,cAAc,CAAC,OAAS,CAAC,EAAE;;;uBAIzD,GAAG;;;KAIjB,EAEA,OAAQ,CAAC,EAAA,mBAAoB,EAAA,gBAAiB,EAAA,iBAAiB,EAAG,EAAA,OAAe,CACnF,CAAC"}