@lab206/ui 0.1.0

package/dist/components/Command.js

@@ -0,0 +1,263 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@lab206/dom/jsx-runtime";
+import { signal, effect } from "@lab206/core";
+import { For, Show, component, mergeProps } from "@lab206/dom";
+import { cx } from "../utils.js";
+import { attachOverlay } from "../overlay.js";
+import { readBool, readStr } from "../reactive.js";
+const styles = `
+.pu-command-root {
+  position: fixed;
+  inset: 0;
+  z-index: var(--pu-z-overlay);
+  display: flex;
+  align-items: flex-start;
+  justify-content: center;
+  padding: min(20vh, 6rem) var(--pu-space-4) var(--pu-space-4);
+  pointer-events: none;
+  opacity: 0;
+  visibility: hidden;
+  transition: opacity var(--pu-duration) var(--pu-ease-out),
+    visibility var(--pu-duration) var(--pu-ease-out);
+}
+.pu-command-root--open {
+  pointer-events: auto;
+  opacity: 1;
+  visibility: visible;
+}
+.pu-command-backdrop {
+  position: absolute;
+  inset: 0;
+  background: var(--pu-overlay-scrim);
+  backdrop-filter: blur(6px);
+  -webkit-backdrop-filter: blur(6px);
+}
+.pu-command {
+  position: relative;
+  width: min(32rem, 100%);
+  max-height: min(28rem, 70vh);
+  display: flex;
+  flex-direction: column;
+  border-radius: var(--pu-radius-xl);
+  background: var(--pu-color-surface-elevated);
+  border: 1px solid var(--pu-color-border);
+  box-shadow: var(--pu-shadow-float);
+  overflow: hidden;
+  transform: translateY(8px) scale(0.98);
+  transition: transform var(--pu-duration-slow) var(--pu-ease-out);
+}
+.pu-command-root--open .pu-command {
+  transform: translateY(0) scale(1);
+}
+.pu-command__input {
+  width: 100%;
+  border: 0;
+  border-bottom: 1px solid var(--pu-color-border);
+  background: transparent;
+  color: var(--pu-color-text);
+  font: inherit;
+  font-size: var(--pu-text-md);
+  padding: 0.9rem 1rem;
+  outline: none;
+}
+.pu-command__input::placeholder { color: var(--pu-color-text-muted); }
+.pu-command__input:focus-visible {
+  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--pu-color-focus) 35%, transparent);
+}
+.pu-command__list {
+  overflow: auto;
+  padding: 0.35rem;
+  flex: 1;
+  min-height: 0;
+}
+.pu-command__item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.75rem;
+  width: 100%;
+  appearance: none;
+  border: 0;
+  background: transparent;
+  text-align: left;
+  font: inherit;
+  font-size: var(--pu-text-sm);
+  color: var(--pu-color-text);
+  padding: 0.55rem 0.7rem;
+  border-radius: var(--pu-radius-md);
+  cursor: pointer;
+}
+.pu-command__item:hover:not(:disabled),
+.pu-command__item.is-active:not(:disabled) {
+  background: color-mix(in srgb, var(--pu-color-accent) 12%, var(--pu-color-surface-2));
+}
+.pu-command__item:focus-visible:not(:disabled) {
+  outline: none;
+  box-shadow:
+    0 0 0 2px var(--pu-color-surface-elevated),
+    0 0 0 4px color-mix(in srgb, var(--pu-color-focus) 55%, transparent);
+  background: color-mix(in srgb, var(--pu-color-accent) 12%, var(--pu-color-surface-2));
+}
+.pu-command__item:disabled {
+  opacity: 0.45;
+  cursor: not-allowed;
+}
+.pu-command__hint {
+  font-size: var(--pu-text-xs);
+  color: var(--pu-color-text-muted);
+  font-family: var(--pu-font-mono);
+}
+.pu-command__status {
+  padding: 1.25rem;
+  text-align: center;
+  color: var(--pu-color-text-muted);
+  font-size: var(--pu-text-sm);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.55rem;
+}
+.pu-command__status--loading::before {
+  content: "";
+  width: 0.75rem;
+  height: 0.75rem;
+  border-radius: 50%;
+  border: 2px solid color-mix(in srgb, var(--pu-color-accent) 30%, transparent);
+  border-top-color: var(--pu-color-accent);
+  animation: pu-command-spin 0.7s linear infinite;
+  flex-shrink: 0;
+}
+@keyframes pu-command-spin {
+  to { transform: rotate(360deg); }
+}
+@media (prefers-reduced-motion: reduce) {
+  .pu-command__status--loading::before { animation: none; opacity: 0.7; }
+}
+.pu-command__footer {
+  border-top: 1px solid var(--pu-color-border);
+  padding: 0.45rem 0.75rem;
+  font-size: var(--pu-text-xs);
+  color: var(--pu-color-text-muted);
+  display: flex;
+  gap: 0.75rem;
+  flex-wrap: wrap;
+}
+@media (prefers-reduced-motion: reduce) {
+  .pu-command-root, .pu-command { transition: none; }
+}
+`;
+function ensureStyles(doc = document) {
+    if (typeof doc === "undefined")
+        return;
+    if (doc.querySelector('style[data-pu-ui="command"]'))
+        return;
+    const el = doc.createElement("style");
+    el.setAttribute("data-pu-ui", "command");
+    el.textContent = styles;
+    doc.head.appendChild(el);
+}
+/**
+ * Command palette (⌘K style): search + run an action.
+ * Control with `open` + `onOpenChange`. Esc / backdrop close via `attachOverlay`.
+ * For async sources: reactive `items` + `loading`.
+ */
+export const Command = component((raw) => {
+    ensureStyles();
+    const props = mergeProps({
+        placeholder: "Type a command…",
+        emptyText: "No commands match",
+        loadingText: "Loading…",
+    }, raw);
+    const isOpen = () => readBool(props.open);
+    const isLoading = () => readBool(props.loading);
+    const query = signal("");
+    const active = signal(0);
+    let rootEl = null;
+    let panelEl = null;
+    let inputEl = null;
+    const getItems = () => {
+        const i = props.items;
+        return typeof i === "function" ? i() : (i ?? []);
+    };
+    const filtered = () => {
+        if (isLoading())
+            return [];
+        const q = query().trim().toLowerCase();
+        const list = getItems();
+        if (!q)
+            return list;
+        return list.filter((it) => it.label.toLowerCase().includes(q) ||
+            (it.hint?.toLowerCase().includes(q) ?? false) ||
+            (it.group?.toLowerCase().includes(q) ?? false));
+    };
+    effect(() => {
+        if (!isOpen()) {
+            query.set("");
+            active.set(0);
+            return;
+        }
+        return attachOverlay({
+            getRoot: () => rootEl,
+            getFocusRoot: () => panelEl,
+            onClose: () => props.onOpenChange?.(false),
+            scrollLock: true,
+            escape: true,
+            onAttach: ({ doc, win }) => {
+                ensureStyles(doc);
+                const t = win.setTimeout(() => inputEl?.focus(), 0);
+                return () => win.clearTimeout(t);
+            },
+        });
+    });
+    const run = (item) => {
+        if (item.disabled || isLoading())
+            return;
+        props.onSelect?.(item.id);
+        props.onOpenChange?.(false);
+    };
+    return (_jsxs("div", { class: () => cx("pu-command-root", isOpen() && "pu-command-root--open", isLoading() && "pu-command-root--loading", typeof props.class === "function" ? props.class() : props.class), "aria-hidden": () => (!isOpen() ? "true" : "false"), ref: (el) => {
+            rootEl = el;
+            ensureStyles(el.ownerDocument);
+        }, children: [_jsx("div", { class: "pu-command-backdrop", onClick: () => props.onOpenChange?.(false), "aria-hidden": "true" }), _jsxs("div", { class: "pu-command", role: "dialog", "aria-modal": "true", "aria-label": "Command palette", "aria-busy": () => (isLoading() ? "true" : "false"), onClick: (e) => e.stopPropagation(), ref: (el) => {
+                    panelEl = el;
+                }, children: [_jsx("input", { class: "pu-command__input", type: "text", role: "combobox", "aria-expanded": "true", "aria-busy": () => (isLoading() ? "true" : "false"), placeholder: props.placeholder, value: query, ref: (el) => {
+                            inputEl = el;
+                        }, onInput: (e) => {
+                            query.set(e.target.value);
+                            active.set(0);
+                        }, onKeyDown: (e) => {
+                            if (isLoading())
+                                return;
+                            const list = filtered();
+                            if (e.key === "ArrowDown") {
+                                e.preventDefault();
+                                active.set(Math.min(Math.max(list.length - 1, 0), active() + 1));
+                            }
+                            else if (e.key === "ArrowUp") {
+                                e.preventDefault();
+                                active.set(Math.max(0, active() - 1));
+                            }
+                            else if (e.key === "Enter") {
+                                e.preventDefault();
+                                const item = list[active()];
+                                if (item)
+                                    run(item);
+                            }
+                        } }), _jsxs("div", { class: "pu-command__list", role: "listbox", children: [_jsx(Show, { when: () => isLoading(), children: () => {
+                                    const d = document.createElement("div");
+                                    d.className = "pu-command__status pu-command__status--loading";
+                                    d.setAttribute("role", "status");
+                                    d.textContent =
+                                        readStr(props.loadingText) ||
+                                            "Loading…";
+                                    return d;
+                                } }), _jsx(Show, { when: () => !isLoading() && filtered().length === 0, children: () => {
+                                    const d = document.createElement("div");
+                                    d.className = "pu-command__status";
+                                    d.setAttribute("role", "status");
+                                    d.textContent =
+                                        readStr(props.emptyText) ||
+                                            "No commands match";
+                                    return d;
+                                } }), _jsx(Show, { when: () => !isLoading(), children: () => (_jsx(For, { each: filtered, children: (item, index) => (_jsxs("button", { type: "button", role: "option", class: () => cx("pu-command__item", active() === index() && "is-active"), disabled: () => !!item().disabled, onClick: () => run(item()), onMouseEnter: () => active.set(index()), children: [_jsx("span", { children: () => item().label }), _jsx("span", { class: "pu-command__hint", children: () => item().hint ?? "" })] })) })) })] }), _jsxs("div", { class: "pu-command__footer", children: [_jsx("span", { children: "\u2191\u2193 navigate" }), _jsx("span", { children: "\u21B5 run" }), _jsx("span", { children: "esc close" })] })] })] }));
+});
+//# sourceMappingURL=Command.js.map

package/dist/components/Command.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Command.js","sourceRoot":"","sources":["../../src/components/Command.tsx"],"names":[],"mappings":"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"}

package/dist/components/Container.d.ts

@@ -0,0 +1,11 @@
+export type ContainerProps = {
+    size?: "sm" | "md" | "lg" | "xl";
+    class?: string | (() => string);
+    children?: unknown;
+};
+export declare const Container: import("@lab206/dom").Component<{
+    size?: "sm" | "md" | "lg" | "xl";
+    class?: string | (() => string);
+    children?: unknown;
+}>;
+//# sourceMappingURL=Container.d.ts.map

package/dist/components/Container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.d.ts","sourceRoot":"","sources":["../../src/components/Container.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,cAAc,GAAG;IAC3B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,MAAM,CAAC,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAgCF,eAAO,MAAM,SAAS;WAnCb,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI;YACxB,MAAM,GAAG,CAAC,MAAM,MAAM,CAAC;eACpB,OAAO;EAmDlB,CAAC"}

package/dist/components/Container.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx } from "@lab206/dom/jsx-runtime";
+import { component, mergeProps } from "@lab206/dom";
+import { cx } from "../utils.js";
+const styles = `
+.pu-container {
+  width: 100%;
+  margin-inline: auto;
+  /* Prefer site-level gutters when demos define them (unified chrome) */
+  padding-inline: var(--site-gutter, var(--pu-space-4));
+  box-sizing: border-box;
+}
+@media (min-width: 640px) {
+  .pu-container {
+    padding-inline: var(--site-gutter, var(--pu-space-6));
+  }
+}
+.pu-container--sm { max-width: 40rem; }
+.pu-container--md { max-width: 48rem; }
+.pu-container--lg { max-width: 64rem; }
+/* Default “app shell” width — match site nav + main content */
+.pu-container--xl { max-width: var(--site-max, 80rem); }
+`;
+let injected = false;
+function ensureStyles() {
+    if (injected || typeof document === "undefined")
+        return;
+    injected = true;
+    const el = document.createElement("style");
+    el.setAttribute("data-pu-ui", "container");
+    el.textContent = styles;
+    document.head.appendChild(el);
+}
+export const Container = component((raw) => {
+    ensureStyles();
+    const props = mergeProps({ size: "lg" }, raw);
+    return (_jsx("div", { class: () => cx("pu-container", `pu-container--${props.size}`, typeof props.class === "function" ? props.class() : props.class), children: props.children }));
+});
+//# sourceMappingURL=Container.js.map

package/dist/components/Container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.js","sourceRoot":"","sources":["../../src/components/Container.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAuB,MAAM,aAAa,CAAC;AACzE,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAQjC,MAAM,MAAM,GAAG;;;;;;;;;;;;;;;;;;CAkBd,CAAC;AAEF,IAAI,QAAQ,GAAG,KAAK,CAAC;AACrB,SAAS,YAAY;IACnB,IAAI,QAAQ,IAAI,OAAO,QAAQ,KAAK,WAAW;QAAE,OAAO;IACxD,QAAQ,GAAG,IAAI,CAAC;IAChB,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAC3C,EAAE,CAAC,YAAY,CAAC,YAAY,EAAE,WAAW,CAAC,CAAC;IAC3C,EAAE,CAAC,WAAW,GAAG,MAAM,CAAC;IACxB,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;AAChC,CAAC;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,SAAS,CAAC,CAAC,GAAmB,EAAE,EAAE;IACzD,YAAY,EAAE,CAAC;IACf,MAAM,KAAK,GAAG,UAAU,CAAC,EAAE,IAAI,EAAE,IAAa,EAAE,EAAE,GAAG,CAEpD,CAAC;IACF,OAAO,CACL,cACE,KAAK,EAAE,GAAG,EAAE,CACV,EAAE,CACA,cAAc,EACd,iBAAiB,KAAK,CAAC,IAAI,EAAE,EAC7B,OAAO,KAAK,CAAC,KAAK,KAAK,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAChE,YAGF,KAAK,CAAC,QAAiB,GACpB,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/dist/components/Dialog.d.ts

@@ -0,0 +1,26 @@
+import { type MaybeReactive } from "../reactive.js";
+export type DialogProps = {
+    /** Controlled open state (boolean, signal, or accessor) */
+    open: MaybeReactive<boolean>;
+    onClose?: () => void;
+    title?: string;
+    description?: string;
+    /** Panel size */
+    size?: "sm" | "md" | "lg";
+    class?: MaybeReactive<string>;
+    children?: unknown;
+};
+/**
+ * Modal dialog with scrim. Control via `open` + `onClose`.
+ * Escape, scroll lock, and focus trap via shared `attachOverlay`.
+ */
+export declare const Dialog: import("@lab206/dom").Component<{
+    open: MaybeReactive<boolean>;
+    onClose?: () => void;
+    title?: string;
+    description?: string;
+    size?: "sm" | "md" | "lg";
+    class?: MaybeReactive<string>;
+    children?: unknown;
+}>;
+//# sourceMappingURL=Dialog.d.ts.map

package/dist/components/Dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../src/components/Dialog.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAE9D,MAAM,MAAM,WAAW,GAAG;IACxB,2DAA2D;IAC3D,IAAI,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB;IACjB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,KAAK,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAwHF;;;GAGG;AACH,eAAO,MAAM,MAAM;UApIX,aAAa,CAAC,OAAO,CAAC;cAClB,MAAM,IAAI;YACZ,MAAM;kBACA,MAAM;WAEb,IAAI,GAAG,IAAI,GAAG,IAAI;YACjB,aAAa,CAAC,MAAM,CAAC;eAClB,OAAO;EAkNlB,CAAC"}

package/dist/components/Dialog.js

@@ -0,0 +1,159 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@lab206/dom/jsx-runtime";
+import { effect } from "@lab206/core";
+import { component, mergeProps } from "@lab206/dom";
+import { cx, puId } from "../utils.js";
+import { attachOverlay } from "../overlay.js";
+import { readBool } from "../reactive.js";
+const styles = `
+.pu-dialog-root {
+  position: fixed;
+  inset: 0;
+  z-index: var(--pu-z-overlay);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: var(--pu-space-4);
+  pointer-events: none;
+  opacity: 0;
+  visibility: hidden;
+  transition:
+    opacity var(--pu-duration-slow) var(--pu-ease-out),
+    visibility var(--pu-duration-slow) var(--pu-ease-out);
+}
+.pu-dialog-root--open {
+  pointer-events: auto;
+  opacity: 1;
+  visibility: visible;
+}
+.pu-dialog-backdrop {
+  position: absolute;
+  inset: 0;
+  background: var(--pu-overlay-scrim);
+  backdrop-filter: blur(6px);
+  -webkit-backdrop-filter: blur(6px);
+}
+.pu-dialog-panel {
+  position: relative;
+  width: 100%;
+  max-height: min(88vh, 720px);
+  overflow: auto;
+  background: var(--pu-color-surface-elevated);
+  color: var(--pu-color-text);
+  border: 1px solid var(--pu-color-border);
+  border-radius: var(--pu-radius-xl);
+  box-shadow: var(--pu-shadow-float);
+  padding: var(--pu-space-6);
+  transform: translateY(12px) scale(0.96);
+  transition: transform var(--pu-duration-slow) var(--pu-ease-spring);
+}
+.pu-dialog-root--open .pu-dialog-panel {
+  transform: translateY(0) scale(1);
+}
+.pu-dialog-panel--sm { max-width: 22rem; }
+.pu-dialog-panel--md { max-width: 28rem; }
+.pu-dialog-panel--lg { max-width: 36rem; }
+.pu-dialog__head {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: var(--pu-space-3);
+  margin-bottom: var(--pu-space-4);
+}
+.pu-dialog__title {
+  margin: 0;
+  font-size: var(--pu-text-xl);
+  font-weight: var(--pu-font-bold);
+  letter-spacing: var(--pu-tracking-tight);
+  line-height: var(--pu-leading-tight);
+  color: var(--pu-color-text);
+}
+.pu-dialog__desc {
+  margin: var(--pu-space-2) 0 0;
+  color: var(--pu-color-text-muted);
+  font-size: var(--pu-text-sm);
+  line-height: 1.5;
+}
+.pu-dialog__close {
+  flex-shrink: 0;
+  width: 2rem;
+  height: 2rem;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid transparent;
+  border-radius: var(--pu-radius-md);
+  background: transparent;
+  color: var(--pu-color-text-muted);
+  cursor: pointer;
+  font-size: 1.15rem;
+  line-height: 1;
+  transition:
+    background var(--pu-duration) var(--pu-ease),
+    color var(--pu-duration) var(--pu-ease);
+}
+.pu-dialog__close:hover {
+  background: var(--pu-color-surface-2);
+  color: var(--pu-color-text);
+}
+.pu-dialog__close:focus-visible {
+  outline: none;
+  color: var(--pu-color-text);
+  box-shadow:
+    0 0 0 2px var(--pu-color-surface-elevated),
+    0 0 0 4px color-mix(in srgb, var(--pu-color-focus) 55%, transparent);
+}
+.pu-dialog__body {
+  font-size: var(--pu-text-sm);
+  line-height: 1.55;
+  color: var(--pu-color-text);
+}
+@media (prefers-reduced-motion: reduce) {
+  .pu-dialog-root,
+  .pu-dialog-panel { transition: none; }
+}
+`;
+function ensureStyles(doc = document) {
+    if (typeof doc === "undefined")
+        return;
+    if (doc.querySelector('style[data-pu-ui="dialog"]'))
+        return;
+    const el = doc.createElement("style");
+    el.setAttribute("data-pu-ui", "dialog");
+    el.textContent = styles;
+    doc.head.appendChild(el);
+}
+/**
+ * Modal dialog with scrim. Control via `open` + `onClose`.
+ * Escape, scroll lock, and focus trap via shared `attachOverlay`.
+ */
+export const Dialog = component((raw) => {
+    ensureStyles();
+    const props = mergeProps({ size: "md" }, raw);
+    const isOpen = () => readBool(props.open);
+    const titleId = puId("pu-dialog-title");
+    let rootEl = null;
+    let panelEl = null;
+    effect(() => {
+        if (!isOpen())
+            return;
+        return attachOverlay({
+            getRoot: () => rootEl,
+            getFocusRoot: () => panelEl,
+            onClose: () => props.onClose?.(),
+            scrollLock: true,
+            escape: true,
+            onAttach: ({ doc }) => {
+                ensureStyles(doc);
+            },
+        });
+    });
+    return (_jsxs("div", { class: () => cx("pu-dialog-root", isOpen() && "pu-dialog-root--open", typeof props.class === "function"
+            ? props.class()
+            : props.class), "aria-hidden": () => (!isOpen() ? "true" : "false"), ref: (el) => {
+            rootEl = el;
+            ensureStyles(el.ownerDocument);
+        }, children: [_jsx("div", { class: "pu-dialog-backdrop", onClick: () => props.onClose?.(), "aria-hidden": "true" }), _jsxs("div", { class: () => cx("pu-dialog-panel", `pu-dialog-panel--${props.size}`), role: "dialog", "aria-modal": "true", "aria-labelledby": props.title ? titleId : undefined, onClick: (e) => e.stopPropagation(), ref: (el) => {
+                    panelEl = el;
+                }, children: [(props.title || props.onClose) && (_jsxs("div", { class: "pu-dialog__head", children: [_jsxs("div", { children: [props.title ? (_jsx("h2", { class: "pu-dialog__title", id: titleId, children: props.title })) : null, props.description ? (_jsx("p", { class: "pu-dialog__desc", children: props.description })) : null] }), props.onClose ? (_jsx("button", { type: "button", class: "pu-dialog__close", "aria-label": "Close", onClick: () => props.onClose?.(), children: "\u00D7" })) : null] })), _jsx("div", { class: "pu-dialog__body", children: props.children })] })] }));
+});
+//# sourceMappingURL=Dialog.js.map

package/dist/components/Dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../src/components/Dialog.tsx"],"names":[],"mappings":"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"}

package/dist/components/Divider.d.ts

@@ -0,0 +1,10 @@
+export type DividerProps = {
+    /** Visual label centered on the line */
+    label?: string;
+    class?: string | (() => string);
+};
+export declare const Divider: import("@lab206/dom").Component<{
+    label?: string;
+    class?: string | (() => string);
+}>;
+//# sourceMappingURL=Divider.d.ts.map

package/dist/components/Divider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.d.ts","sourceRoot":"","sources":["../../src/components/Divider.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,YAAY,GAAG;IACzB,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,MAAM,CAAC,CAAC;CACjC,CAAC;AA6CF,eAAO,MAAM,OAAO;YA/CV,MAAM;YACN,MAAM,GAAG,CAAC,MAAM,MAAM,CAAC;EAiE/B,CAAC"}

package/dist/components/Divider.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx } from "@lab206/dom/jsx-runtime";
+import { component, mergeProps } from "@lab206/dom";
+import { cx } from "../utils.js";
+const styles = `
+.pu-divider {
+  display: flex;
+  align-items: center;
+  gap: var(--pu-space-3);
+  width: 100%;
+  border: 0;
+  margin: var(--pu-space-4) 0;
+  color: var(--pu-color-text-muted);
+  font-size: var(--pu-text-xs);
+  font-weight: var(--pu-font-semibold);
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+}
+.pu-divider::before,
+.pu-divider::after {
+  content: "";
+  flex: 1;
+  height: 1px;
+  background: var(--pu-color-border);
+}
+.pu-divider--plain {
+  height: 1px;
+  margin: var(--pu-space-4) 0;
+  background: var(--pu-color-border);
+  gap: 0;
+  text-indent: -9999px;
+  overflow: hidden;
+}
+.pu-divider--plain::before,
+.pu-divider--plain::after { display: none; }
+`;
+let injected = false;
+function ensureStyles() {
+    if (injected || typeof document === "undefined")
+        return;
+    injected = true;
+    const el = document.createElement("style");
+    el.setAttribute("data-pu-ui", "divider");
+    el.textContent = styles;
+    document.head.appendChild(el);
+}
+export const Divider = component((raw) => {
+    ensureStyles();
+    const props = mergeProps({}, raw);
+    const hasLabel = !!props.label;
+    return (_jsx("div", { role: "separator", class: () => cx("pu-divider", !hasLabel && "pu-divider--plain", typeof props.class === "function" ? props.class() : props.class), children: hasLabel ? props.label : "\u00a0" }));
+});
+//# sourceMappingURL=Divider.js.map

package/dist/components/Divider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.js","sourceRoot":"","sources":["../../src/components/Divider.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAuB,MAAM,aAAa,CAAC;AACzE,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAQjC,MAAM,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+Bd,CAAC;AAEF,IAAI,QAAQ,GAAG,KAAK,CAAC;AACrB,SAAS,YAAY;IACnB,IAAI,QAAQ,IAAI,OAAO,QAAQ,KAAK,WAAW;QAAE,OAAO;IACxD,QAAQ,GAAG,IAAI,CAAC;IAChB,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAC3C,EAAE,CAAC,YAAY,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;IACzC,EAAE,CAAC,WAAW,GAAG,MAAM,CAAC;IACxB,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;AAChC,CAAC;AAED,MAAM,CAAC,MAAM,OAAO,GAAG,SAAS,CAAC,CAAC,GAAiB,EAAE,EAAE;IACrD,YAAY,EAAE,CAAC;IACf,MAAM,KAAK,GAAG,UAAU,CAAC,EAAE,EAAE,GAAG,CAAiC,CAAC;IAClE,MAAM,QAAQ,GAAG,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC;IAE/B,OAAO,CACL,cACE,IAAI,EAAC,WAAW,EAChB,KAAK,EAAE,GAAG,EAAE,CACV,EAAE,CACA,YAAY,EACZ,CAAC,QAAQ,IAAI,mBAAmB,EAChC,OAAO,KAAK,CAAC,KAAK,KAAK,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAChE,YAGF,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,GAC9B,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/dist/components/Drawer.d.ts

@@ -0,0 +1,19 @@
+import { type MaybeReactive } from "../reactive.js";
+export type DrawerProps = {
+    open: MaybeReactive<boolean>;
+    onClose?: () => void;
+    title?: string;
+    side?: "left" | "right";
+    class?: MaybeReactive<string>;
+    children?: unknown;
+};
+/** Slide-over panel. Esc + backdrop + focus trap via shared `attachOverlay`. */
+export declare const Drawer: import("@lab206/dom").Component<{
+    open: MaybeReactive<boolean>;
+    onClose?: () => void;
+    title?: string;
+    side?: "left" | "right";
+    class?: MaybeReactive<string>;
+    children?: unknown;
+}>;
+//# sourceMappingURL=Drawer.d.ts.map

package/dist/components/Drawer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../src/components/Drawer.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAE9D,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,KAAK,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAmGF,gFAAgF;AAChF,eAAO,MAAM,MAAM;UA1GX,aAAa,CAAC,OAAO,CAAC;cAClB,MAAM,IAAI;YACZ,MAAM;WACP,MAAM,GAAG,OAAO;YACf,aAAa,CAAC,MAAM,CAAC;eAClB,OAAO;EAiLlB,CAAC"}