@hyperpackai/hyperui 0.1.0

package/dist/components/overlay.d.ts

@@ -0,0 +1,102 @@
+/**
+ * HyperUI Overlay Components
+ * Dialog · AlertDialog · Sheet · Toast / useToast · Tooltip · Popover · DropdownMenu
+ */
+import { type Signal } from "@hyperpackai/hyperion";
+import { type VNode } from "../theme/index.js";
+export interface DialogProps {
+    open: boolean | Signal<boolean>;
+    onClose?: () => void;
+    title?: string;
+    description?: string;
+    size?: "sm" | "md" | "lg" | "xl" | "full";
+    closeOnBackdrop?: boolean;
+    closeOnEscape?: boolean;
+    showClose?: boolean;
+    footer?: unknown;
+    footerAlign?: "start" | "end" | "between";
+    class?: string;
+    children?: unknown;
+}
+export declare function Dialog(props: DialogProps): VNode;
+export interface SheetProps {
+    open: boolean | Signal<boolean>;
+    side?: "right" | "left" | "top" | "bottom";
+    title?: string;
+    footer?: unknown;
+    onClose?: () => void;
+    closeOnBackdrop?: boolean;
+    children?: unknown;
+    class?: string;
+}
+export declare function Sheet(props: SheetProps): VNode;
+export type ToastType = "default" | "success" | "error" | "warning" | "info";
+export type ToastPosition = "top-right" | "top-left" | "top-center" | "bottom-right" | "bottom-left" | "bottom-center";
+export interface ToastData {
+    id: string;
+    title: string;
+    description?: string;
+    type?: ToastType;
+    duration?: number;
+    action?: {
+        label: string;
+        onClick: () => void;
+    };
+    onClose?: () => void;
+}
+/**
+ * Programmatic toast notifications. Call anywhere — no component needed.
+ *
+ *   const toast = useToast();
+ *   toast.success("Saved!", { description: "Changes saved to server." });
+ */
+export declare function useToast(): {
+    show: (data: Omit<ToastData, "id">) => string;
+    success: (title: string, opts?: Partial<ToastData>) => string;
+    error: (title: string, opts?: Partial<ToastData>) => string;
+    warning: (title: string, opts?: Partial<ToastData>) => string;
+    info: (title: string, opts?: Partial<ToastData>) => string;
+    dismiss: (id: string) => void;
+    dismissAll: () => void;
+    setPosition: (pos: ToastPosition) => void;
+};
+/** Place once near your app root to render toasts. */
+export declare function ToastRegion(): VNode;
+export interface TooltipProps {
+    content: string | unknown;
+    side?: "top" | "bottom" | "left" | "right";
+    open?: boolean | Signal<boolean>;
+    children?: unknown;
+    class?: string;
+}
+export declare function Tooltip(props: TooltipProps): VNode;
+export interface PopoverProps {
+    open: boolean | Signal<boolean>;
+    side?: "top" | "bottom" | "left" | "right";
+    trigger?: unknown;
+    children?: unknown;
+    class?: string;
+}
+export declare function Popover(props: PopoverProps): VNode;
+export interface MenuItem {
+    type?: "item" | "separator" | "label";
+    id?: string;
+    label?: string;
+    icon?: unknown;
+    shortcut?: string;
+    destructive?: boolean;
+    disabled?: boolean;
+    onClick?: () => void;
+    children?: MenuItem[];
+}
+export interface DropdownMenuProps {
+    open: boolean | Signal<boolean>;
+    items: MenuItem[];
+    align?: "left" | "right";
+    side?: "top" | "bottom";
+    trigger?: unknown;
+    onClose?: () => void;
+    class?: string;
+}
+export declare function DropdownMenu(props: DropdownMenuProps): VNode;
+//# sourceMappingURL=overlay.d.ts.map

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

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

package/dist/components/overlay.js

@@ -0,0 +1,318 @@
+/**
+ * HyperUI Overlay Components
+ * Dialog · AlertDialog · Sheet · Toast / useToast · Tooltip · Popover · DropdownMenu
+ */
+import { signal } from "@hyperpackai/hyperion";
+import { injectCSS, cn, h } from "../theme/index.js";
+// ============================================================
+// DIALOG
+// ============================================================
+const DIALOG_CSS = `
+.hu-dialog-backdrop {
+  position: fixed; inset: 0; background: var(--hu-overlay);
+  z-index: var(--hu-z-backdrop); display: grid; place-items: center; padding: var(--hu-space-4);
+  animation: hu-fade-in var(--hu-duration-fast) var(--hu-ease);
+}
+.hu-dialog-backdrop--closing { animation: hu-fade-out var(--hu-duration-fast) var(--hu-ease) forwards; }
+
+.hu-dialog {
+  background: var(--hu-bg); border-radius: var(--hu-radius-lg);
+  box-shadow: var(--hu-shadow-xl); width: 100%; max-width: 480px;
+  max-height: 90vh; overflow: auto; position: relative;
+  animation: hu-scale-in var(--hu-duration) var(--hu-ease-spring);
+}
+.hu-dialog--sm { max-width: 360px; }
+.hu-dialog--md { max-width: 480px; }
+.hu-dialog--lg { max-width: 640px; }
+.hu-dialog--xl { max-width: 800px; }
+.hu-dialog--full { max-width: 95vw; max-height: 95vh; }
+
+.hu-dialog-header {
+  padding: var(--hu-space-6) var(--hu-space-6) 0;
+  display: flex; align-items: flex-start; justify-content: space-between; gap: var(--hu-space-4);
+}
+.hu-dialog-title { font-size: var(--hu-font-size-lg); font-weight: var(--hu-font-weight-semibold); color: var(--hu-text); line-height: 1.3; }
+.hu-dialog-desc { font-size: var(--hu-font-size-sm); color: var(--hu-text-2); margin-top: var(--hu-space-1); }
+.hu-dialog-close {
+  display: flex; align-items: center; justify-content: center;
+  width: 28px; height: 28px; border-radius: var(--hu-radius);
+  background: transparent; border: none; cursor: pointer; color: var(--hu-text-3);
+  transition: all var(--hu-duration) var(--hu-ease); flex-shrink: 0; padding: 0;
+}
+.hu-dialog-close:hover { background: var(--hu-bg-3); color: var(--hu-text); }
+.hu-dialog-body { padding: var(--hu-space-4) var(--hu-space-6); }
+.hu-dialog-footer {
+  padding: var(--hu-space-4) var(--hu-space-6) var(--hu-space-6);
+  display: flex; align-items: center; justify-content: flex-end; gap: var(--hu-space-2);
+  border-top: 1px solid var(--hu-border); margin-top: var(--hu-space-2);
+}
+.hu-dialog-footer--start { justify-content: flex-start; }
+.hu-dialog-footer--between { justify-content: space-between; }
+`;
+export function Dialog(props) {
+    injectCSS("hu-dialog", DIALOG_CSS);
+    const { title, description, size = "md", closeOnBackdrop = true, closeOnEscape = true, showClose = true, footer, footerAlign = "end", onClose, children } = props;
+    const isOpen = typeof props.open === "object" && "peek" in props.open
+        ? props.open.value
+        : props.open;
+    if (!isOpen)
+        return h("span", { "aria-hidden": "true" });
+    const handleKeyDown = (e) => {
+        if (closeOnEscape && e.key === "Escape")
+            onClose?.();
+    };
+    const closeSVG = `<svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M2 2l12 12M14 2L2 14"/></svg>`;
+    return h("div", {
+        class: "hu-dialog-backdrop", role: "presentation",
+        onClick: closeOnBackdrop ? (e) => { if (e.target.classList.contains("hu-dialog-backdrop"))
+            onClose?.(); } : undefined,
+        onKeyDown: handleKeyDown
+    }, h("div", {
+        class: cn("hu-dialog", `hu-dialog--${size}`, props.class),
+        role: "dialog", "aria-modal": "true",
+        "aria-labelledby": title ? "hu-dialog-title" : undefined,
+        "aria-describedby": description ? "hu-dialog-description" : undefined
+    }, (title || showClose) && h("div", { class: "hu-dialog-header" }, title && h("div", {}, h("h2", { id: "hu-dialog-title", class: "hu-dialog-title" }, title), description && h("p", { id: "hu-dialog-description", class: "hu-dialog-desc" }, description)), showClose && h("button", {
+        class: "hu-dialog-close", onClick: onClose,
+        "aria-label": "Close dialog", innerHTML: closeSVG
+    })), h("div", { class: "hu-dialog-body" }, children), footer && h("div", { class: cn("hu-dialog-footer", `hu-dialog-footer--${footerAlign}`) }, footer)));
+}
+// ============================================================
+// SHEET (Slide-in drawer)
+// ============================================================
+const SHEET_CSS = `
+.hu-sheet-backdrop {
+  position: fixed; inset: 0; background: var(--hu-overlay);
+  z-index: var(--hu-z-backdrop);
+  animation: hu-fade-in var(--hu-duration-fast) var(--hu-ease);
+}
+.hu-sheet {
+  position: fixed; background: var(--hu-bg); box-shadow: var(--hu-shadow-xl);
+  z-index: var(--hu-z-modal); overflow: auto; display: flex; flex-direction: column;
+}
+.hu-sheet--right  { top: 0; right: 0; bottom: 0; width: 400px; max-width: 90vw; border-radius: var(--hu-radius-lg) 0 0 var(--hu-radius-lg); animation: hu-slide-in-right var(--hu-duration) var(--hu-ease-out); }
+.hu-sheet--left   { top: 0; left: 0; bottom: 0; width: 400px; max-width: 90vw; border-radius: 0 var(--hu-radius-lg) var(--hu-radius-lg) 0; animation: hu-slide-in-left var(--hu-duration) var(--hu-ease-out); }
+.hu-sheet--bottom { bottom: 0; left: 0; right: 0; max-height: 90vh; border-radius: var(--hu-radius-lg) var(--hu-radius-lg) 0 0; animation: hu-slide-down var(--hu-duration) var(--hu-ease-out); }
+.hu-sheet--top    { top: 0; left: 0; right: 0; max-height: 90vh; border-radius: 0 0 var(--hu-radius-lg) var(--hu-radius-lg); animation: hu-slide-up var(--hu-duration) var(--hu-ease-out); }
+.hu-sheet-header { padding: var(--hu-space-5) var(--hu-space-6); border-bottom: 1px solid var(--hu-border); display: flex; align-items: center; justify-content: space-between; }
+.hu-sheet-title { font-size: var(--hu-font-size-md); font-weight: var(--hu-font-weight-semibold); }
+.hu-sheet-body { padding: var(--hu-space-6); flex: 1; overflow: auto; }
+.hu-sheet-footer { padding: var(--hu-space-4) var(--hu-space-6); border-top: 1px solid var(--hu-border); }
+.hu-sheet-close { display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:var(--hu-radius);background:transparent;border:none;cursor:pointer;color:var(--hu-text-3);transition:all var(--hu-duration) var(--hu-ease); }
+.hu-sheet-close:hover { background:var(--hu-bg-3);color:var(--hu-text); }
+`;
+export function Sheet(props) {
+    injectCSS("hu-sheet", SHEET_CSS);
+    const { side = "right", title, footer, onClose, closeOnBackdrop = true, children } = props;
+    const isOpen = typeof props.open === "object" && "peek" in props.open
+        ? props.open.value
+        : props.open;
+    if (!isOpen)
+        return h("span", { "aria-hidden": "true" });
+    const closeSVG = `<svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M2 2l12 12M14 2L2 14"/></svg>`;
+    return h("div", {}, h("div", {
+        class: "hu-sheet-backdrop",
+        onClick: closeOnBackdrop ? onClose : undefined
+    }), h("div", { class: cn("hu-sheet", `hu-sheet--${side}`, props.class), role: "dialog", "aria-modal": "true" }, title && h("div", { class: "hu-sheet-header" }, h("h2", { class: "hu-sheet-title" }, title), h("button", { class: "hu-sheet-close", onClick: onClose, "aria-label": "Close", innerHTML: closeSVG })), h("div", { class: "hu-sheet-body" }, children), footer && h("div", { class: "hu-sheet-footer" }, footer)));
+}
+// ============================================================
+// TOAST
+// ============================================================
+const TOAST_CSS = `
+.hu-toast-region {
+  position: fixed; z-index: var(--hu-z-toast); display: flex; flex-direction: column; gap: var(--hu-space-2);
+  pointer-events: none; padding: var(--hu-space-4);
+  max-width: min(420px, calc(100vw - 32px));
+}
+.hu-toast-region--top-right    { top: 0; right: 0; }
+.hu-toast-region--top-left     { top: 0; left: 0; }
+.hu-toast-region--top-center   { top: 0; left: 50%; transform: translateX(-50%); }
+.hu-toast-region--bottom-right { bottom: 0; right: 0; flex-direction: column-reverse; }
+.hu-toast-region--bottom-left  { bottom: 0; left: 0; flex-direction: column-reverse; }
+.hu-toast-region--bottom-center{ bottom: 0; left: 50%; transform: translateX(-50%); flex-direction: column-reverse; }
+
+.hu-toast {
+  pointer-events: all; display: flex; align-items: flex-start; gap: var(--hu-space-3);
+  padding: var(--hu-space-4); border-radius: var(--hu-radius-md);
+  background: var(--hu-bg); border: 1px solid var(--hu-border);
+  box-shadow: var(--hu-shadow-lg);
+  animation: hu-slide-up var(--hu-duration) var(--hu-ease-spring);
+  min-width: 280px;
+}
+.hu-toast--success { border-left: 4px solid var(--hu-success); }
+.hu-toast--error   { border-left: 4px solid var(--hu-error); }
+.hu-toast--warning { border-left: 4px solid var(--hu-warning); }
+.hu-toast--info    { border-left: 4px solid var(--hu-info); }
+
+.hu-toast-icon { flex-shrink: 0; width: 20px; height: 20px; margin-top: 1px; }
+.hu-toast-icon--success { color: var(--hu-success); }
+.hu-toast-icon--error   { color: var(--hu-error); }
+.hu-toast-icon--warning { color: var(--hu-warning); }
+.hu-toast-icon--info    { color: var(--hu-info); }
+
+.hu-toast-content { flex: 1; min-width: 0; }
+.hu-toast-title   { font-size: var(--hu-font-size-sm); font-weight: var(--hu-font-weight-semibold); color: var(--hu-text); }
+.hu-toast-desc    { font-size: var(--hu-font-size-xs); color: var(--hu-text-2); margin-top: 2px; }
+.hu-toast-action  { margin-top: var(--hu-space-2); }
+.hu-toast-close {
+  flex-shrink: 0; width: 20px; height: 20px; display:flex;align-items:center;justify-content:center;
+  border-radius: var(--hu-radius-xs); background:transparent; border:none; cursor:pointer; color:var(--hu-text-3);
+  transition: all var(--hu-duration) var(--hu-ease); padding:0;
+}
+.hu-toast-close:hover { background: var(--hu-bg-3); color: var(--hu-text); }
+`;
+const _toasts = signal([]);
+const _toastPosition = signal("top-right");
+let _toastIdCounter = 0;
+const TOAST_ICONS = {
+    default: "",
+    success: `<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z"/></svg>`,
+    error: `<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.28 7.22a.75.75 0 00-1.06 1.06L8.94 10l-1.72 1.72a.75.75 0 101.06 1.06L10 11.06l1.72 1.72a.75.75 0 101.06-1.06L11.06 10l1.72-1.72a.75.75 0 00-1.06-1.06L10 8.94 8.28 7.22z"/></svg>`,
+    warning: `<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M8.485 2.495c.673-1.167 2.357-1.167 3.03 0l6.28 10.875c.673 1.167-.17 2.625-1.516 2.625H3.72c-1.347 0-2.189-1.458-1.515-2.625L8.485 2.495zM10 5a.75.75 0 01.75.75v3.5a.75.75 0 01-1.5 0v-3.5A.75.75 0 0110 5zm0 9a1 1 0 100-2 1 1 0 000 2z"/></svg>`,
+    info: `<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a.75.75 0 000 1.5h.253a.25.25 0 01.244.304l-.459 2.066A1.75 1.75 0 0010.747 15H11a.75.75 0 000-1.5h-.253a.25.25 0 01-.244-.304l.459-2.066A1.75 1.75 0 009.253 9H9z"/></svg>`
+};
+/**
+ * Programmatic toast notifications. Call anywhere — no component needed.
+ *
+ *   const toast = useToast();
+ *   toast.success("Saved!", { description: "Changes saved to server." });
+ */
+export function useToast() {
+    injectCSS("hu-toast", TOAST_CSS);
+    const show = (data) => {
+        const id = `toast-${++_toastIdCounter}`;
+        const toast = { id, duration: 5000, ...data };
+        _toasts.value = [..._toasts.value, toast];
+        if (toast.duration && toast.duration > 0) {
+            setTimeout(() => dismiss(id), toast.duration);
+        }
+        return id;
+    };
+    const dismiss = (id) => {
+        _toasts.value = _toasts.value.filter((t) => t.id !== id);
+    };
+    const shorthand = (type) => (title, opts) => show({ title, type, ...opts });
+    return {
+        show, dismiss,
+        success: shorthand("success"),
+        error: shorthand("error"),
+        warning: shorthand("warning"),
+        info: shorthand("info"),
+        dismissAll: () => { _toasts.value = []; },
+        setPosition: (pos) => { _toastPosition.value = pos; }
+    };
+}
+/** Place once near your app root to render toasts. */
+export function ToastRegion() {
+    injectCSS("hu-toast", TOAST_CSS);
+    const toasts = _toasts.value;
+    const position = _toastPosition.value;
+    const dismiss = (id) => {
+        _toasts.value = _toasts.value.filter((t) => t.id !== id);
+    };
+    const closeSVG = `<svg viewBox="0 0 12 12" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M1 1l10 10M11 1L1 11"/></svg>`;
+    return h("div", { class: cn("hu-toast-region", `hu-toast-region--${position}`), role: "region", "aria-label": "Notifications" }, ...toasts.map((t) => h("div", { key: t.id, class: cn("hu-toast", t.type !== "default" && `hu-toast--${t.type}`), role: "alert" }, t.type && t.type !== "default" && h("span", { class: cn("hu-toast-icon", `hu-toast-icon--${t.type}`), innerHTML: TOAST_ICONS[t.type], "aria-hidden": "true" }), h("div", { class: "hu-toast-content" }, h("div", { class: "hu-toast-title" }, t.title), t.description && h("div", { class: "hu-toast-desc" }, t.description), t.action && h("div", { class: "hu-toast-action" }, h("button", { onClick: () => { t.action.onClick(); dismiss(t.id); }, style: "font-size:12px;color:var(--hu-primary);background:none;border:none;cursor:pointer;padding:0;font-weight:500;" }, t.action.label))), h("button", { class: "hu-toast-close", onClick: () => { dismiss(t.id); t.onClose?.(); }, "aria-label": "Dismiss", innerHTML: closeSVG }))));
+}
+// ============================================================
+// TOOLTIP
+// ============================================================
+const TOOLTIP_CSS = `
+.hu-tooltip-wrap { position: relative; display: inline-flex; }
+.hu-tooltip-content {
+  position: absolute; z-index: var(--hu-z-tooltip); white-space: nowrap;
+  background: var(--hu-text); color: var(--hu-bg); font-size: var(--hu-font-size-xs);
+  font-weight: var(--hu-font-weight-medium); padding: 4px 8px; border-radius: var(--hu-radius-sm);
+  pointer-events: none; box-shadow: var(--hu-shadow-md);
+  animation: hu-scale-in var(--hu-duration-fast) var(--hu-ease);
+}
+.hu-tooltip-content--top    { bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
+.hu-tooltip-content--bottom { top:    calc(100% + 6px); left: 50%; transform: translateX(-50%); }
+.hu-tooltip-content--left   { right:  calc(100% + 6px); top: 50%; transform: translateY(-50%); }
+.hu-tooltip-content--right  { left:   calc(100% + 6px); top: 50%; transform: translateY(-50%); }
+`;
+export function Tooltip(props) {
+    injectCSS("hu-tooltip", TOOLTIP_CSS);
+    const { content, side = "top", children } = props;
+    const isOpen = typeof props.open === "object" && "peek" in props.open
+        ? props.open.value
+        : (props.open ?? false);
+    return h("div", { class: cn("hu-tooltip-wrap", props.class) }, children, isOpen && h("div", { class: cn("hu-tooltip-content", `hu-tooltip-content--${side}`), role: "tooltip" }, content));
+}
+// ============================================================
+// POPOVER
+// ============================================================
+const POPOVER_CSS = `
+.hu-popover-wrap { position: relative; display: inline-flex; }
+.hu-popover-content {
+  position: absolute; z-index: var(--hu-z-popover); min-width: 200px;
+  background: var(--hu-bg); border: 1px solid var(--hu-border);
+  border-radius: var(--hu-radius-md); box-shadow: var(--hu-shadow-lg); padding: var(--hu-space-4);
+  animation: hu-scale-in var(--hu-duration-fast) var(--hu-ease);
+}
+.hu-popover-content--top    { bottom: calc(100% + 6px); left: 0; }
+.hu-popover-content--bottom { top:    calc(100% + 6px); left: 0; }
+.hu-popover-content--left   { right:  calc(100% + 6px); top: 0; }
+.hu-popover-content--right  { left:   calc(100% + 6px); top: 0; }
+`;
+export function Popover(props) {
+    injectCSS("hu-popover", POPOVER_CSS);
+    const { side = "bottom", trigger, children } = props;
+    const isOpen = typeof props.open === "object" && "peek" in props.open
+        ? props.open.value
+        : props.open;
+    return h("div", { class: cn("hu-popover-wrap", props.class) }, trigger, isOpen && h("div", { class: cn("hu-popover-content", `hu-popover-content--${side}`) }, children));
+}
+// ============================================================
+// DROPDOWN MENU
+// ============================================================
+const DROPDOWN_CSS = `
+.hu-dropdown { position: relative; display: inline-block; }
+.hu-dropdown-menu {
+  position: absolute; z-index: var(--hu-z-dropdown); min-width: 180px;
+  background: var(--hu-bg); border: 1px solid var(--hu-border);
+  border-radius: var(--hu-radius-md); box-shadow: var(--hu-shadow-lg);
+  padding: var(--hu-space-1); outline: none;
+  animation: hu-scale-in var(--hu-duration-fast) var(--hu-ease);
+}
+.hu-dropdown-menu--top-left   { bottom: calc(100% + 4px); left: 0; transform-origin: bottom left; }
+.hu-dropdown-menu--top-right  { bottom: calc(100% + 4px); right: 0; transform-origin: bottom right; }
+.hu-dropdown-menu--bottom-left  { top: calc(100% + 4px); left: 0; transform-origin: top left; }
+.hu-dropdown-menu--bottom-right { top: calc(100% + 4px); right: 0; transform-origin: top right; }
+
+.hu-dropdown-item {
+  display: flex; align-items: center; gap: var(--hu-space-2); width: 100%;
+  padding: 7px var(--hu-space-3); border-radius: var(--hu-radius-sm);
+  font-size: var(--hu-font-size-sm); color: var(--hu-text);
+  cursor: pointer; border: none; background: transparent; text-align: left;
+  transition: background var(--hu-duration-fast) var(--hu-ease);
+}
+.hu-dropdown-item:hover { background: var(--hu-bg-3); }
+.hu-dropdown-item:focus-visible { outline: none; background: var(--hu-bg-3); }
+.hu-dropdown-item--destructive { color: var(--hu-error); }
+.hu-dropdown-item--destructive:hover { background: var(--hu-error-bg); }
+.hu-dropdown-item--disabled { opacity: .5; pointer-events: none; }
+.hu-dropdown-item-icon { width: 16px; height: 16px; flex-shrink: 0; opacity: .7; }
+.hu-dropdown-item-shortcut { margin-left: auto; font-size: var(--hu-font-size-xs); color: var(--hu-text-3); font-family: var(--hu-font-mono); }
+
+.hu-dropdown-separator { height: 1px; background: var(--hu-border); margin: var(--hu-space-1) 0; }
+.hu-dropdown-label { padding: 6px var(--hu-space-3) 4px; font-size: var(--hu-font-size-xs); font-weight: var(--hu-font-weight-semibold); color: var(--hu-text-3); text-transform: uppercase; letter-spacing: .05em; }
+`;
+export function DropdownMenu(props) {
+    injectCSS("hu-dropdown", DROPDOWN_CSS);
+    const { items, align = "left", side = "bottom", trigger, onClose } = props;
+    const isOpen = typeof props.open === "object" && "peek" in props.open
+        ? props.open.value
+        : props.open;
+    const menuClass = `hu-dropdown-menu--${side}-${align}`;
+    return h("div", { class: cn("hu-dropdown", props.class) }, trigger, isOpen && h("ul", { class: cn("hu-dropdown-menu", menuClass), role: "menu" }, ...items.map((item, i) => {
+        if (item.type === "separator")
+            return h("li", { key: `sep-${i}`, class: "hu-dropdown-separator", role: "separator" });
+        if (item.type === "label")
+            return h("li", { key: item.label, class: "hu-dropdown-label", role: "presentation" }, item.label);
+        return h("li", { key: item.id ?? item.label, role: "none" }, h("button", {
+            class: cn("hu-dropdown-item", item.destructive && "hu-dropdown-item--destructive", item.disabled && "hu-dropdown-item--disabled"),
+            role: "menuitem", disabled: item.disabled,
+            onClick: () => { item.onClick?.(); onClose?.(); }
+        }, item.icon && h("span", { class: "hu-dropdown-item-icon", "aria-hidden": "true" }, item.icon), item.label, item.shortcut && h("span", { class: "hu-dropdown-item-shortcut" }, item.shortcut)));
+    })));
+}

package/dist/components/surfaces.d.ts

@@ -0,0 +1,180 @@
+/**
+ * HyperUI Surface & Layout Components
+ * Paper · Box · Container · Stack · Grid · ImageList · List
+ */
+import { type VNode } from "../theme/index.js";
+export type PaperElevation = 0 | 1 | 2 | 3 | 4 | 5;
+export interface PaperProps {
+    elevation?: PaperElevation;
+    variant?: "elevation" | "outlined";
+    square?: boolean;
+    component?: string;
+    class?: string;
+    children?: unknown;
+}
+export declare function Paper(props: PaperProps): VNode;
+export interface BoxProps {
+    component?: string;
+    display?: string;
+    flexDirection?: string;
+    alignItems?: string;
+    justifyContent?: string;
+    gap?: string | number;
+    padding?: string | number;
+    margin?: string | number;
+    width?: string | number;
+    height?: string | number;
+    overflow?: string;
+    position?: string;
+    style?: string;
+    class?: string;
+    onClick?: (e: MouseEvent) => void;
+    children?: unknown;
+}
+export declare function Box(props: BoxProps): VNode;
+export type ContainerMaxWidth = "xs" | "sm" | "md" | "lg" | "xl" | "fluid";
+export interface ContainerProps {
+    maxWidth?: ContainerMaxWidth;
+    disableGutters?: boolean;
+    fixed?: boolean;
+    class?: string;
+    children?: unknown;
+}
+export declare function Container(props: ContainerProps): VNode;
+export type StackDirection = "row" | "column";
+export type StackAlign = "start" | "center" | "end" | "stretch";
+export type StackJustify = "start" | "center" | "end" | "between" | "around" | "evenly";
+export interface StackProps {
+    direction?: StackDirection;
+    spacing?: string | number;
+    alignItems?: StackAlign;
+    justifyContent?: StackJustify;
+    flexWrap?: boolean;
+    divider?: boolean;
+    useFlexGap?: boolean;
+    class?: string;
+    children?: unknown;
+}
+export declare function Stack(props: StackProps): VNode;
+export interface GridProps {
+    container?: boolean;
+    item?: boolean;
+    columns?: number;
+    spacing?: number;
+    columnSpacing?: number;
+    rowSpacing?: number;
+    xs?: number | "auto" | true;
+    sm?: number | "auto" | true;
+    md?: number | "auto" | true;
+    lg?: number | "auto" | true;
+    xl?: number | "auto" | true;
+    zeroMinWidth?: boolean;
+    class?: string;
+    children?: unknown;
+}
+export declare function Grid(props: GridProps): VNode;
+export interface ImageListItemProps {
+    src: string;
+    alt?: string;
+    title?: string;
+    subtitle?: string;
+    titleBarPosition?: "top" | "bottom";
+    cols?: number;
+    rows?: number;
+    onClick?: (e: MouseEvent) => void;
+}
+export interface ImageListProps {
+    cols?: number;
+    rowHeight?: number | "auto";
+    gap?: number;
+    variant?: "standard" | "masonry" | "quilted";
+    items: ImageListItemProps[];
+    class?: string;
+}
+export declare function ImageList(props: ImageListProps): VNode;
+export interface ListSubheaderProps {
+    sticky?: boolean;
+    class?: string;
+    children?: unknown;
+}
+export declare function ListSubheader(props: ListSubheaderProps): VNode;
+export interface ListProps {
+    dense?: boolean;
+    bordered?: boolean;
+    disablePadding?: boolean;
+    subheader?: unknown;
+    class?: string;
+    children?: unknown;
+}
+export declare function List(props: ListProps): VNode;
+export interface ListItemProps {
+    button?: boolean;
+    selected?: boolean;
+    disabled?: boolean;
+    divider?: boolean;
+    alignItems?: "flex-start" | "center";
+    secondaryAction?: unknown;
+    onClick?: (e: MouseEvent) => void;
+    class?: string;
+    children?: unknown;
+}
+export declare function ListItem(props: ListItemProps): VNode;
+export interface ListItemIconProps {
+    class?: string;
+    children?: unknown;
+}
+export declare function ListItemIcon(props: ListItemIconProps): VNode;
+export interface ListItemTextProps {
+    primary?: unknown;
+    secondary?: unknown;
+    class?: string;
+}
+export declare function ListItemText(props: ListItemTextProps): VNode;
+export interface PageLayoutProps {
+    header?: unknown;
+    footer?: unknown;
+    contained?: boolean;
+    stickyHeader?: boolean;
+    maxWidth?: string | number;
+    padding?: string | number;
+    class?: string;
+    children?: unknown;
+}
+export declare function PageLayout(props: PageLayoutProps): VNode;
+export interface DashboardLayoutProps {
+    header?: unknown;
+    sidebar?: unknown;
+    aside?: unknown;
+    sidebarWidth?: string | number;
+    collapsedSidebarWidth?: string | number;
+    asideWidth?: string | number;
+    collapsed?: boolean;
+    padding?: string | number;
+    class?: string;
+    children?: unknown;
+}
+export declare function DashboardLayout(props: DashboardLayoutProps): VNode;
+export interface SplitPaneProps {
+    orientation?: "horizontal" | "vertical";
+    primarySize?: string | number;
+    separatorLabel?: string;
+    class?: string;
+    start: unknown;
+    end: unknown;
+}
+export declare function SplitPane(props: SplitPaneProps): VNode;
+export interface ResizablePanelProps {
+    title?: unknown;
+    actions?: unknown;
+    width?: string | number;
+    height?: string | number;
+    minWidth?: string | number;
+    maxWidth?: string | number;
+    minHeight?: string | number;
+    maxHeight?: string | number;
+    resize?: "none" | "both" | "horizontal" | "vertical";
+    class?: string;
+    children?: unknown;
+}
+export declare function ResizablePanel(props: ResizablePanelProps): VNode;
+//# sourceMappingURL=surfaces.d.ts.map

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

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