@hyperpackai/hyperui 0.1.0

package/dist/components/Textarea/index.d.ts

@@ -0,0 +1,22 @@
+import { type VNode } from "../../theme/index.js";
+export interface TextareaProps {
+    value?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    required?: boolean;
+    rows?: number;
+    error?: string;
+    helper?: string;
+    label?: string;
+    resize?: boolean;
+    id?: string;
+    name?: string;
+    maxLength?: number;
+    class?: string;
+    onInput?: (e: InputEvent) => void;
+    onChange?: (e: Event) => void;
+    onBlur?: (e: FocusEvent) => void;
+}
+export declare function Textarea(props: TextareaProps): VNode;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Textarea/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAqBpE,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAClC,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;IAC9B,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;CAClC;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,GAAG,KAAK,CAapD"}

package/dist/components/Textarea/index.js

@@ -0,0 +1,27 @@
+import { injectCSS, cn, h } from "../../theme/index.js";
+import { Label } from "../Label/index.js";
+const TEXTAREA_CSS = `
+.hu-textarea {
+  width: 100%; font-family: var(--hu-font-sans); font-size: var(--hu-font-size-sm);
+  color: var(--hu-text); background: linear-gradient(180deg, var(--hu-bg), var(--hu-bg-2));
+  border: 1px solid var(--hu-border); border-radius: var(--hu-radius-md);
+  padding: 10px 12px; transition: border-color var(--hu-duration) var(--hu-ease), box-shadow var(--hu-duration) var(--hu-ease), background var(--hu-duration) var(--hu-ease);
+  outline: none; resize: vertical; min-height: 80px; line-height: var(--hu-line-height);
+  box-shadow: var(--hu-shadow-xs);
+}
+.hu-textarea::placeholder { color: var(--hu-text-3); }
+.hu-textarea:hover:not(:disabled) { border-color: color-mix(in srgb, var(--hu-primary) 35%, var(--hu-border-2)); }
+.hu-textarea:focus { border-color: var(--hu-primary); background: var(--hu-bg); box-shadow: 0 0 0 3px color-mix(in srgb, var(--hu-primary) 18%, transparent), var(--hu-shadow-sm); }
+.hu-textarea:disabled { opacity: .5; cursor: not-allowed; background: var(--hu-bg-3); }
+.hu-textarea--error { border-color: var(--hu-error) !important; }
+.hu-textarea--error:focus { box-shadow: 0 0 0 3px color-mix(in srgb, var(--hu-error) 18%, transparent); }
+.hu-textarea--no-resize { resize: none; }
+`;
+export function Textarea(props) {
+    injectCSS("hu-textarea", TEXTAREA_CSS);
+    const { error, helper, label, resize = true, id, ...rest } = props;
+    return h("div", { class: "hu-input-wrap" }, label && Label({ for: id, required: props.required, children: label }), h("textarea", {
+        ...rest, id,
+        class: cn("hu-textarea", error && "hu-textarea--error", !resize && "hu-textarea--no-resize", props.class)
+    }), error && h("span", { class: "hu-input-error-msg", role: "alert" }, error), !error && helper && h("span", { class: "hu-input-helper" }, helper));
+}

package/dist/components/Timeline/index.d.ts

@@ -0,0 +1,16 @@
+import { type VNode } from "../../theme/index.js";
+export interface TimelineItem {
+    id: string;
+    title: string;
+    description?: unknown;
+    time?: string;
+    status?: "default" | "success" | "warning" | "error" | "info";
+    marker?: unknown;
+    actions?: unknown;
+}
+export interface TimelineProps {
+    items: TimelineItem[];
+    class?: string;
+}
+export declare function Timeline(props: TimelineProps): VNode;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Timeline/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Timeline/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAyBpE,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;IAC9D,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,GAAG,KAAK,CAoBpD"}

package/dist/components/Timeline/index.js

@@ -0,0 +1,30 @@
+import { injectCSS, cn, h } from "../../theme/index.js";
+const TIMELINE_CSS = `
+.hu-timeline { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; }
+.hu-timeline-item { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--hu-space-3); position: relative; min-width: 0; }
+.hu-timeline-item:not(:last-child) { padding-block-end: var(--hu-space-5); }
+.hu-timeline-marker-wrap { position: relative; display: flex; justify-content: center; min-width: 24px; }
+.hu-timeline-marker {
+  width: 12px; height: 12px; border-radius: var(--hu-radius-full);
+  margin-block-start: 5px; background: var(--hu-border-2); border: 2px solid var(--hu-bg); box-shadow: 0 0 0 1px var(--hu-border);
+}
+.hu-timeline-item:not(:last-child) .hu-timeline-marker-wrap::after {
+  content: ""; position: absolute; inset-block-start: 24px; inset-block-end: 0; width: 1px; background: var(--hu-border);
+}
+.hu-timeline-item--success .hu-timeline-marker { background: var(--hu-success); box-shadow: 0 0 0 1px var(--hu-success); }
+.hu-timeline-item--warning .hu-timeline-marker { background: var(--hu-warning); box-shadow: 0 0 0 1px var(--hu-warning); }
+.hu-timeline-item--error .hu-timeline-marker { background: var(--hu-error); box-shadow: 0 0 0 1px var(--hu-error); }
+.hu-timeline-item--info .hu-timeline-marker { background: var(--hu-info); box-shadow: 0 0 0 1px var(--hu-info); }
+.hu-timeline-content { min-width: 0; }
+.hu-timeline-title { font-size: var(--hu-font-size-sm); font-weight: var(--hu-font-weight-semibold); color: var(--hu-text); }
+.hu-timeline-time { margin-block-start: 1px; font-size: var(--hu-font-size-xs); color: var(--hu-text-3); }
+.hu-timeline-description { margin-block-start: var(--hu-space-1); font-size: var(--hu-font-size-sm); color: var(--hu-text-2); line-height: 1.55; }
+.hu-timeline-actions { margin-block-start: var(--hu-space-2); }
+`;
+export function Timeline(props) {
+    injectCSS("hu-timeline", TIMELINE_CSS);
+    return h("ol", { class: cn("hu-timeline", props.class), "aria-label": "Timeline" }, ...props.items.map((item) => h("li", {
+        key: item.id,
+        class: cn("hu-timeline-item", item.status && item.status !== "default" && `hu-timeline-item--${item.status}`)
+    }, h("div", { class: "hu-timeline-marker-wrap", "aria-hidden": "true" }, h("span", { class: "hu-timeline-marker" }, item.marker)), h("div", { class: "hu-timeline-content" }, h("div", { class: "hu-timeline-title" }, item.title), item.time && h("time", { class: "hu-timeline-time" }, item.time), item.description && h("div", { class: "hu-timeline-description" }, item.description), item.actions && h("div", { class: "hu-timeline-actions" }, item.actions)))));
+}

package/dist/components/Toast/index.d.ts

@@ -0,0 +1,34 @@
+import { type VNode } from "../../theme/index.js";
+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;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Toast/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Toast/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAoB,KAAK,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAyDpE,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;AAC7E,MAAM,MAAM,aAAa,GAAG,WAAW,GAAG,UAAU,GAAG,YAAY,GAAG,cAAc,GAAG,aAAa,GAAG,eAAe,CAAC;AAEvH,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,IAAI,CAAA;KAAE,CAAC;IAChD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAcD;;;;;GAKG;AACH,wBAAgB,QAAQ,IAAI;IAC1B,IAAI,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,KAAK,MAAM,CAAC;IAC9C,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,KAAK,MAAM,CAAC;IAC9D,KAAK,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,KAAK,MAAM,CAAC;IAC5D,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,KAAK,MAAM,CAAC;IAC9D,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,KAAK,MAAM,CAAC;IAC3D,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,WAAW,EAAE,CAAC,GAAG,EAAE,aAAa,KAAK,IAAI,CAAC;CAC3C,CA+BA;AAED,sDAAsD;AACtD,wBAAgB,WAAW,IAAI,KAAK,CAuBnC"}

package/dist/components/Toast/index.js

@@ -0,0 +1,106 @@
+import { signal } from "@hyperpackai/hyperion";
+import { injectCSS, cn, h } from "../../theme/index.js";
+import { renderInPortal } from "../../portal.js";
+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-lg);
+  background: linear-gradient(180deg, var(--hu-bg), color-mix(in srgb, var(--hu-bg-2) 66%, var(--hu-bg)));
+  border: 1px solid color-mix(in srgb, var(--hu-border) 82%, transparent);
+  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-action-btn {
+  font-size: var(--hu-font-size-xs); color: var(--hu-primary); background: var(--hu-primary-bg);
+  border: 1px solid color-mix(in srgb, var(--hu-primary) 24%, transparent);
+  border-radius: var(--hu-radius); cursor: pointer; padding: 5px 9px; font-weight: var(--hu-font-weight-semibold);
+  font-family: var(--hu-font-sans);
+}
+.hu-toast-action-btn:hover { border-color: var(--hu-primary); }
+.hu-toast-action-btn:focus-visible { outline: 2px solid var(--hu-primary); outline-offset: 2px; }
+.hu-toast-close {
+  flex-shrink: 0; width: 24px; height: 24px; display:flex;align-items:center;justify-content:center;
+  border-radius: var(--hu-radius); background:transparent; border:1px solid transparent; cursor:pointer; color:var(--hu-text-3);
+  transition: background var(--hu-duration) var(--hu-ease), border-color var(--hu-duration) var(--hu-ease), color var(--hu-duration) var(--hu-ease); padding:0;
+}
+.hu-toast-close:hover { background: var(--hu-bg-3); color: var(--hu-text); border-color: var(--hu-border); }
+.hu-toast-close:focus-visible { outline: 2px solid var(--hu-primary); outline-offset: 2px; }
+`;
+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 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 (() => renderInPortal(h("div", { class: cn("hu-toast-region", `hu-toast-region--${_toastPosition.value}`), role: "region", "aria-label": "Notifications" }, ..._toasts.value.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", { class: "hu-toast-action-btn", onClick: () => { t.action.onClick(); dismiss(t.id); } }, t.action.label))), h("button", { class: "hu-toast-close", onClick: () => { dismiss(t.id); t.onClose?.(); }, "aria-label": "Dismiss", innerHTML: closeSVG })))), "toast"));
+}

package/dist/components/ToggleButton/index.d.ts

@@ -0,0 +1,21 @@
+import type { Signal } from "@hyperpackai/hyperion";
+import { type VNode } from "../../theme/index.js";
+export interface ToggleButtonProps {
+    value: string;
+    selected?: boolean | Signal<boolean> | (() => boolean);
+    disabled?: boolean;
+    onChange?: (value: string) => void;
+    class?: string;
+    children?: unknown;
+}
+export declare function ToggleButton(props: ToggleButtonProps): VNode;
+export interface ToggleButtonGroupProps {
+    value?: string | string[] | Signal<string | string[]> | (() => string | string[]);
+    exclusive?: boolean;
+    orientation?: "horizontal" | "vertical";
+    onChange?: (value: string | string[]) => void;
+    class?: string;
+    children?: ToggleButtonProps[];
+}
+export declare function ToggleButtonGroup(props: ToggleButtonGroupProps): VNode;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ToggleButton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ToggleButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAoB,KAAK,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAuCpE,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,OAAO,CAAC,CAAC;IACvD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAQD,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,KAAK,CAW5D;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,GAAG,MAAM,EAAE,CAAC,GAAG,CAAC,MAAM,MAAM,GAAG,MAAM,EAAE,CAAC,CAAC;IAClF,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAC;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,iBAAiB,EAAE,CAAC;CAChC;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,GAAG,KAAK,CA0BtE"}

package/dist/components/ToggleButton/index.js

@@ -0,0 +1,81 @@
+import { injectCSS, cn, h } from "../../theme/index.js";
+const TOGGLE_BTN_CSS = `
+.hu-toggle-btn {
+  display: inline-flex; align-items: center; justify-content: center; gap: var(--hu-space-1);
+  min-height: 38px; padding: var(--hu-space-2) var(--hu-space-3); font-size: var(--hu-font-size-sm);
+  font-family: var(--hu-font-sans); border: 1px solid transparent;
+  border-radius: var(--hu-radius-md);
+  background: linear-gradient(180deg, var(--hu-bg), var(--hu-bg-2)); color: var(--hu-text-2); cursor: pointer;
+  box-shadow: inset 0 0 0 1px var(--hu-border), var(--hu-shadow-xs);
+  transition: background var(--hu-duration) var(--hu-ease), border-color var(--hu-duration) var(--hu-ease), box-shadow var(--hu-duration) var(--hu-ease), color var(--hu-duration) var(--hu-ease), transform var(--hu-duration) var(--hu-ease);
+  user-select: none; white-space: nowrap;
+}
+.hu-toggle-btn:hover { background: var(--hu-bg-3); color: var(--hu-text); box-shadow: inset 0 0 0 1px var(--hu-border-2), var(--hu-shadow-sm); transform: translateY(-1px); }
+.hu-toggle-btn:focus-visible { outline: 2px solid var(--hu-primary); outline-offset: 2px; z-index: 2; }
+.hu-toggle-btn--selected {
+  background: linear-gradient(180deg, color-mix(in srgb, var(--hu-primary) 13%, var(--hu-bg)), color-mix(in srgb, var(--hu-primary-bg) 82%, var(--hu-bg)));
+  color: var(--hu-primary);
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--hu-primary) 58%, transparent), inset 0 -2px 0 color-mix(in srgb, var(--hu-primary) 72%, transparent), var(--hu-shadow-xs);
+}
+.hu-toggle-btn:disabled { opacity: .4; pointer-events: none; }
+.hu-toggle-btn-group {
+  display: inline-flex; max-width: 100%; overflow-x: auto;
+  padding: 3px; gap: 3px;
+  border: 1px solid var(--hu-border); border-radius: var(--hu-radius-lg);
+  background: color-mix(in srgb, var(--hu-bg-2) 84%, var(--hu-bg));
+  box-shadow: var(--hu-shadow-xs);
+}
+.hu-toggle-btn-group .hu-toggle-btn { border-radius: var(--hu-radius-md); box-shadow: none; }
+.hu-toggle-btn-group .hu-toggle-btn:not(:last-child) { border-right-width: 1px; }
+.hu-toggle-btn-group .hu-toggle-btn:first-child,
+.hu-toggle-btn-group .hu-toggle-btn:last-child { border-radius: var(--hu-radius-md); }
+.hu-toggle-btn-group--vertical { flex-direction: column; overflow-x: visible; overflow: hidden; }
+.hu-toggle-btn-group--vertical .hu-toggle-btn { border-radius: var(--hu-radius-md); border-right-width: 1px; }
+.hu-toggle-btn-group--vertical .hu-toggle-btn:not(:last-child) { border-bottom-width: 1px; }
+.hu-toggle-btn-group--vertical .hu-toggle-btn:first-child,
+.hu-toggle-btn-group--vertical .hu-toggle-btn:last-child { border-radius: var(--hu-radius-md); }
+`;
+function readReactive(value) {
+    if (typeof value === "function")
+        return value();
+    if (typeof value === "object" && value !== null && "peek" in value)
+        return value.value;
+    return value;
+}
+export function ToggleButton(props) {
+    injectCSS("hu-toggle-btn", TOGGLE_BTN_CSS);
+    const { value, selected, disabled, onChange, children } = props;
+    const isSelected = () => selected ? readReactive(selected) : false;
+    return h("button", {
+        class: () => cn("hu-toggle-btn", isSelected() && "hu-toggle-btn--selected", props.class),
+        type: "button",
+        "aria-pressed": () => isSelected(),
+        disabled,
+        onClick: () => onChange?.(value)
+    }, children);
+}
+export function ToggleButtonGroup(props) {
+    injectCSS("hu-toggle-btn", TOGGLE_BTN_CSS);
+    const { value, exclusive = false, orientation = "horizontal", onChange, children = [] } = props;
+    const getValue = () => value === undefined ? undefined : readReactive(value);
+    const isSelected = (v) => {
+        const current = getValue();
+        return Array.isArray(current) ? current.includes(v) : current === v;
+    };
+    const handleChange = (v) => {
+        if (!onChange)
+            return;
+        if (exclusive) {
+            onChange(isSelected(v) ? "" : v);
+        }
+        else {
+            const current = getValue();
+            const arr = Array.isArray(current) ? current : (current ? [current] : []);
+            onChange(isSelected(v) ? arr.filter(x => x !== v) : [...arr, v]);
+        }
+    };
+    return h("div", {
+        class: cn("hu-toggle-btn-group", orientation === "vertical" && "hu-toggle-btn-group--vertical", props.class),
+        role: "group"
+    }, ...children.map(child => ToggleButton({ ...child, selected: () => isSelected(child.value), onChange: handleChange })));
+}

package/dist/components/Tooltip/index.d.ts

@@ -0,0 +1,14 @@
+import { type Signal } from "@hyperpackai/hyperion";
+import { type VNode } from "../../theme/index.js";
+export interface TooltipProps {
+    content: string | unknown;
+    side?: "top" | "bottom" | "left" | "right";
+    open?: boolean | Signal<boolean>;
+    onOpen?: () => void;
+    onClose?: () => void;
+    onOpenChange?: (open: boolean) => void;
+    children?: unknown;
+    class?: string;
+}
+export declare function Tooltip(props: TooltipProps): VNode;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Tooltip/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Tooltip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAoB,KAAK,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAoBpE,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,MAAM,GAAG,OAAO,CAAC;IAC1B,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;IAC3C,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;IACjC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,GAAG,KAAK,CA8BlD"}

package/dist/components/Tooltip/index.js

@@ -0,0 +1,47 @@
+import { signal } from "@hyperpackai/hyperion";
+import { injectCSS, cn, h } from "../../theme/index.js";
+const TOOLTIP_CSS = `
+.hu-tooltip-wrap { position: relative; display: inline-flex; align-items: center; }
+.hu-tooltip-content {
+  position: absolute; z-index: var(--hu-z-tooltip); white-space: nowrap;
+  background: color-mix(in srgb, var(--hu-text) 94%, black); color: var(--hu-bg);
+  font-size: var(--hu-font-size-xs); line-height: 1.35;
+  font-weight: var(--hu-font-weight-medium); padding: 7px 10px; border-radius: var(--hu-radius-md);
+  pointer-events: none; box-shadow: var(--hu-shadow-lg);
+  border: 1px solid color-mix(in srgb, var(--hu-bg) 14%, transparent);
+  animation: hu-scale-in var(--hu-duration-fast) var(--hu-ease);
+  max-width: min(280px, 80vw); white-space: normal;
+}
+.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 tooltipNode = () => h("div", { class: cn("hu-tooltip-content", `hu-tooltip-content--${side}`), role: "tooltip" }, content);
+    const uncontrolledOpen = signal(false);
+    const getOpen = () => typeof props.open === "object" && "peek" in props.open
+        ? props.open.value
+        : props.open ?? uncontrolledOpen.value;
+    const overlay = typeof props.open === "boolean"
+        ? (props.open ? tooltipNode() : null)
+        : (() => getOpen() ? tooltipNode() : null);
+    const setOpen = (next) => {
+        if (props.open === undefined)
+            uncontrolledOpen.value = next;
+        props.onOpenChange?.(next);
+        if (next)
+            props.onOpen?.();
+        else
+            props.onClose?.();
+    };
+    return h("div", { class: cn("hu-tooltip-wrap", props.class) }, h("span", {
+        class: "hu-tooltip-trigger",
+        onMouseEnter: () => setOpen(true),
+        onMouseLeave: () => setOpen(false),
+        onFocus: () => setOpen(true),
+        onBlur: () => setOpen(false)
+    }, children), overlay);
+}

package/dist/components/TreeView/index.d.ts

@@ -0,0 +1,19 @@
+import { type VNode } from "../../theme/index.js";
+export interface TreeViewItem {
+    id: string;
+    label: string;
+    icon?: unknown;
+    badge?: unknown;
+    disabled?: boolean;
+    children?: TreeViewItem[];
+}
+export interface TreeViewProps {
+    items: TreeViewItem[];
+    expanded?: string[];
+    selected?: string;
+    onToggle?: (id: string, expanded: boolean) => void;
+    onSelect?: (id: string) => void;
+    class?: string;
+}
+export declare function TreeView(props: TreeViewProps): VNode;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/TreeView/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TreeView/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAuBpE,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC;CAC3B;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,YAAY,EAAE,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,GAAG,KAAK,CAqCpD"}

package/dist/components/TreeView/index.js

@@ -0,0 +1,50 @@
+import { injectCSS, cn, h } from "../../theme/index.js";
+const TREE_VIEW_CSS = `
+.hu-tree { list-style: none; margin: 0; padding: 0; font-size: var(--hu-font-size-sm); color: var(--hu-text); }
+.hu-tree-group { list-style: none; margin: 0; padding: 0 0 0 var(--hu-space-5); }
+[dir="rtl"] .hu-tree-group { padding: 0 var(--hu-space-5) 0 0; }
+.hu-tree-item { margin: 1px 0; }
+.hu-tree-row {
+  display: flex; align-items: center; gap: var(--hu-space-2); width: 100%;
+  min-height: 32px; padding: 4px var(--hu-space-2); border-radius: var(--hu-radius);
+  color: var(--hu-text-2); background: transparent; border: none; text-align: start;
+  font: inherit; cursor: pointer;
+}
+.hu-tree-row:hover { background: var(--hu-bg-3); color: var(--hu-text); }
+.hu-tree-row[aria-selected="true"] { background: var(--hu-primary-bg); color: var(--hu-primary); font-weight: var(--hu-font-weight-medium); }
+.hu-tree-row:focus-visible { outline: 2px solid var(--hu-primary); outline-offset: 1px; }
+.hu-tree-toggle { width: 16px; display: inline-flex; align-items: center; justify-content: center; color: var(--hu-text-3); flex: none; }
+.hu-tree-toggle--leaf { visibility: hidden; }
+.hu-tree-icon { width: 18px; display: inline-flex; align-items: center; justify-content: center; flex: none; }
+.hu-tree-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.hu-tree-badge { margin-inline-start: auto; }
+`;
+export function TreeView(props) {
+    injectCSS("hu-tree", TREE_VIEW_CSS);
+    const expanded = new Set(props.expanded ?? []);
+    const renderItems = (items, level) => items.map((item) => {
+        const hasChildren = Boolean(item.children?.length);
+        const isExpanded = hasChildren && expanded.has(item.id);
+        const isSelected = props.selected === item.id;
+        return h("li", { key: item.id, class: "hu-tree-item", role: "none" }, h("button", {
+            class: "hu-tree-row",
+            role: "treeitem",
+            type: "button",
+            disabled: item.disabled,
+            "aria-level": level,
+            "aria-expanded": hasChildren ? String(isExpanded) : undefined,
+            "aria-selected": isSelected ? "true" : "false",
+            onClick: () => {
+                if (item.disabled)
+                    return;
+                if (hasChildren)
+                    props.onToggle?.(item.id, !isExpanded);
+                props.onSelect?.(item.id);
+            }
+        }, h("span", {
+            class: cn("hu-tree-toggle", !hasChildren && "hu-tree-toggle--leaf"),
+            "aria-hidden": "true"
+        }, isExpanded ? "▾" : "▸"), item.icon && h("span", { class: "hu-tree-icon", "aria-hidden": "true" }, item.icon), h("span", { class: "hu-tree-label" }, item.label), item.badge && h("span", { class: "hu-tree-badge" }, item.badge)), hasChildren && isExpanded && h("ul", { class: "hu-tree-group", role: "group" }, ...renderItems(item.children, level + 1)));
+    });
+    return h("ul", { class: cn("hu-tree", props.class), role: "tree" }, ...renderItems(props.items, 1));
+}

package/dist/components/Typography/index.d.ts

@@ -0,0 +1,17 @@
+import { type VNode } from "../../theme/index.js";
+export type TypographyVariant = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "subtitle1" | "subtitle2" | "body1" | "body2" | "caption" | "overline" | "inherit";
+export type TypographyColor = "primary" | "secondary" | "error" | "warning" | "info" | "success";
+export type TypographyAlign = "left" | "center" | "right" | "justify";
+export interface TypographyProps {
+    variant?: TypographyVariant;
+    component?: string;
+    color?: TypographyColor;
+    align?: TypographyAlign;
+    gutterBottom?: boolean;
+    noWrap?: boolean;
+    paragraph?: boolean;
+    class?: string;
+    children?: unknown;
+}
+export declare function Typography(props: TypographyProps): VNode;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Typography/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Typography/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAuCpE,MAAM,MAAM,iBAAiB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,WAAW,GAAG,WAAW,GAAG,OAAO,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,GAAG,SAAS,CAAC;AAC7J,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAC;AACjG,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;AAEtE,MAAM,WAAW,eAAe;IAC9B,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,KAAK,CAgBxD"}

package/dist/components/Typography/index.js

@@ -0,0 +1,44 @@
+import { injectCSS, cn, h } from "../../theme/index.js";
+const TYPOGRAPHY_CSS = `
+.hu-typography { margin: 0; color: var(--hu-text); font-family: var(--hu-font-sans); }
+.hu-typography--h1 { font-size: var(--hu-font-size-5xl); font-weight: var(--hu-font-weight-bold); letter-spacing: -.025em; line-height: 1.1; }
+.hu-typography--h2 { font-size: var(--hu-font-size-4xl); font-weight: var(--hu-font-weight-bold); letter-spacing: -.02em; line-height: 1.15; }
+.hu-typography--h3 { font-size: var(--hu-font-size-3xl); font-weight: var(--hu-font-weight-semibold); letter-spacing: -.015em; line-height: 1.2; }
+.hu-typography--h4 { font-size: var(--hu-font-size-2xl); font-weight: var(--hu-font-weight-semibold); line-height: 1.25; }
+.hu-typography--h5 { font-size: var(--hu-font-size-xl);  font-weight: var(--hu-font-weight-semibold); line-height: 1.3; }
+.hu-typography--h6 { font-size: var(--hu-font-size-md);  font-weight: var(--hu-font-weight-semibold); line-height: 1.4; }
+.hu-typography--subtitle1 { font-size: var(--hu-font-size-base); font-weight: var(--hu-font-weight-medium); line-height: 1.6; }
+.hu-typography--subtitle2 { font-size: var(--hu-font-size-sm);   font-weight: var(--hu-font-weight-medium); line-height: 1.6; }
+.hu-typography--body1 { font-size: var(--hu-font-size-base); line-height: 1.7; }
+.hu-typography--body2 { font-size: var(--hu-font-size-sm);   line-height: 1.65; }
+.hu-typography--caption { font-size: var(--hu-font-size-xs); line-height: 1.5; color: var(--hu-text-2); }
+.hu-typography--overline { font-size: 11px; font-weight: var(--hu-font-weight-semibold); letter-spacing: .1em; text-transform: uppercase; color: var(--hu-text-2); }
+.hu-typography--inherit { font-size: inherit; font-weight: inherit; line-height: inherit; }
+.hu-typography--gutterBottom { margin-bottom: .35em; }
+.hu-typography--noWrap { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.hu-typography--paragraph { margin-bottom: var(--hu-space-4); }
+.hu-typography--color-primary   { color: var(--hu-primary); }
+.hu-typography--color-secondary { color: var(--hu-text-2); }
+.hu-typography--color-error     { color: var(--hu-error); }
+.hu-typography--color-warning   { color: var(--hu-warning); }
+.hu-typography--color-info      { color: var(--hu-info); }
+.hu-typography--color-success   { color: var(--hu-success); }
+.hu-typography--align-left    { text-align: left; }
+.hu-typography--align-center  { text-align: center; }
+.hu-typography--align-right   { text-align: right; }
+.hu-typography--align-justify { text-align: justify; }
+`;
+const VARIANT_TAGS = {
+    h1: "h1", h2: "h2", h3: "h3", h4: "h4", h5: "h5", h6: "h6",
+    subtitle1: "h6", subtitle2: "h6",
+    body1: "p", body2: "p",
+    caption: "span", overline: "span", inherit: "span"
+};
+export function Typography(props) {
+    injectCSS("hu-typography", TYPOGRAPHY_CSS);
+    const { variant = "body1", color, align, gutterBottom, noWrap, paragraph, children } = props;
+    const tag = props.component ?? (paragraph ? "p" : VARIANT_TAGS[variant] ?? "span");
+    return h(tag, {
+        class: cn("hu-typography", `hu-typography--${variant}`, color && `hu-typography--color-${color}`, align && `hu-typography--align-${align}`, gutterBottom && "hu-typography--gutterBottom", noWrap && "hu-typography--noWrap", paragraph && "hu-typography--paragraph", props.class)
+    }, children);
+}

package/dist/components/VisuallyHidden/index.d.ts

@@ -0,0 +1,7 @@
+import { type VNode } from "../../theme/index.js";
+export interface VisuallyHiddenProps {
+    class?: string;
+    children?: unknown;
+}
+export declare function VisuallyHidden(props: VisuallyHiddenProps): VNode;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/VisuallyHidden/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/VisuallyHidden/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAgBpE,MAAM,WAAW,mBAAmB;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,KAAK,CAGhE"}

package/dist/components/VisuallyHidden/index.js

@@ -0,0 +1,18 @@
+import { injectCSS, cn, h } from "../../theme/index.js";
+const CSS = `
+.hu-visually-hidden {
+  position: absolute !important;
+  width: 1px !important;
+  height: 1px !important;
+  padding: 0 !important;
+  margin: -1px !important;
+  overflow: hidden !important;
+  clip: rect(0, 0, 0, 0) !important;
+  white-space: nowrap !important;
+  border: 0 !important;
+}
+`;
+export function VisuallyHidden(props) {
+    injectCSS("hu-visually-hidden", CSS);
+    return h("span", { class: cn("hu-visually-hidden", props.class) }, props.children);
+}

package/dist/components/Zoom/index.d.ts

@@ -0,0 +1,10 @@
+import { type VNode } from "../../theme/index.js";
+export interface ZoomProps {
+    in: boolean;
+    timeout?: number;
+    unmountOnExit?: boolean;
+    class?: string;
+    children?: unknown;
+}
+export declare function Zoom(props: ZoomProps): VNode | null;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Zoom/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Zoom/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAQpE,MAAM,WAAW,SAAS;IAAG,EAAE,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,aAAa,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE;AAEzH,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,GAAG,KAAK,GAAG,IAAI,CAKnD"}