zabi-components 6.0.0 → 7.0.1

package/dist/atoms/Toggle.svelte

@@ -1,17 +1,19 @@
 <script lang="ts">
-    import { generateId } from "../../routes/lib/ssr-safe.js";
+    import { generateId } from "../util/ssr-safe.js";
 
     interface Props {
         checked?: boolean;
         disabled?: boolean;
+        loading?: boolean;
         label?: string;
         onclick?: (event: MouseEvent) => void;
         onchange?: (event: { checked: boolean }) => void;
     }
 
     let {
-        checked = false,
+        checked = $bindable(false),
         disabled = false,
+        loading = false,
         label = "",
         onclick,
         onchange,
@@ -19,38 +21,40 @@
     }: Props = $props();
 
     const toggleId = generateId("toggle");
+    const isDisabled = $derived(disabled || loading);
 
     function handleClick(event: MouseEvent) {
-        if (disabled) return;
+        if (isDisabled) return;
         checked = !checked;
 
         if (onclick) onclick(event);
         if (onchange) onchange({ checked });
     }
 
-    const toggleButtonClasses = $derived(() =>
-        [
-            "relative inline-flex w-10 h-6 flex-shrink-0 cursor-pointer rounded-full border-0 transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-brand-500 focus:ring-offset-2",
-            checked ? "bg-action-primary" : "bg-base-400",
-            disabled && "opacity-50 cursor-not-allowed",
-        ]
-            .filter(Boolean)
-            .join(" "),
-    );
+    const toggleButtonClasses = $derived(() => {
+        const base =
+            "focus-ring relative inline-flex w-10 h-6 flex-shrink-0 rounded-full border-0 transition-colors duration-200 ease-in-out focus:outline-none focus-visible:outline-none";
+        const colorClass = checked
+            ? "bg-action-primary hover:bg-action-primary-hover active:bg-action-primary-active"
+            : "bg-base-400 hover:bg-base-500 active:bg-base-500";
+        const stateClass = isDisabled
+            ? "opacity-50 cursor-not-allowed"
+            : "cursor-pointer";
+        return `${base} ${colorClass} ${stateClass}`;
+    });
 
     const toggleThumbClasses = $derived(() => {
-        const baseClasses =
-            "pointer-events-none absolute top-0.5 left-0.5 w-5 h-5 rounded-full bg-card transition-transform duration-200 ease-in-out";
+        const base =
+            "pointer-events-none absolute top-0.5 left-0.5 w-5 h-5 rounded-full bg-card shadow transition-transform duration-200 ease-in-out flex items-center justify-center";
         const positionClasses = checked ? "translate-x-4" : "translate-x-0";
-
-        return `${baseClasses} ${positionClasses}`.trim();
+        return `${base} ${positionClasses}`;
     });
 
     function handleKeydown(event: KeyboardEvent) {
-        if (disabled) return;
+        if (isDisabled) return;
         if (event.key === " " || event.key === "Enter") {
             event.preventDefault();
-            handleClick(event as any);
+            handleClick(event as unknown as MouseEvent);
         }
     }
 </script>
@@ -61,19 +65,30 @@
         role="switch"
         id={toggleId}
         aria-checked={checked}
-        aria-label={label || "Toggle"}
-        {disabled}
+        aria-label={label ? undefined : "Toggle"}
+        aria-busy={loading ? "true" : undefined}
+        disabled={isDisabled}
         onclick={handleClick}
         onkeydown={handleKeydown}
         class={toggleButtonClasses()}
+        {...restProps}
     >
-        <span class={toggleThumbClasses()}></span>
+        <span class={toggleThumbClasses()}>
+            {#if loading}
+                <span
+                    class="inline-block size-3 shrink-0 animate-spin rounded-full border-2 border-brand-500 border-t-transparent"
+                    aria-hidden="true"
+                ></span>
+            {/if}
+        </span>
     </button>
 
     {#if label}
         <label
             for={toggleId}
-            class="text-sm font-medium text-label cursor-pointer"
+            class="text-sm font-medium text-label {isDisabled
+                ? 'cursor-not-allowed opacity-50'
+                : 'cursor-pointer'}"
         >
             {label}
         </label>

package/dist/atoms/Toggle.svelte.d.ts

@@ -1,12 +1,13 @@
 interface Props {
     checked?: boolean;
     disabled?: boolean;
+    loading?: boolean;
     label?: string;
     onclick?: (event: MouseEvent) => void;
     onchange?: (event: {
         checked: boolean;
     }) => void;
 }
-declare const Toggle: import("svelte").Component<Props, {}, "">;
+declare const Toggle: import("svelte").Component<Props, {}, "checked">;
 type Toggle = ReturnType<typeof Toggle>;
 export default Toggle;

package/dist/atoms/Tooltip.svelte

@@ -1,12 +1,21 @@
 <script lang="ts">
-    import { generateId } from "../../routes/lib/ssr-safe.js";
+    import type { Snippet } from "svelte";
+    import type { HTMLAttributes } from "svelte/elements";
+    import { onDestroy } from "svelte";
+    import { generateId } from "../util/ssr-safe.js";
 
-    interface Props {
+    type Props = Omit<HTMLAttributes<HTMLDivElement>, "class"> & {
         content?: string;
         placement?: "top" | "bottom" | "left" | "right";
         delay?: number;
         disabled?: boolean;
-    }
+        class?: string;
+        children?: Snippet;
+    };
+
+    /** First matching focusable inside the slot receives `aria-describedby` (wrapper div is skipped). */
+    const FOCUSABLE_SELECTOR =
+        'button:not([disabled]), a[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
 
     let {
         content = "",
@@ -15,36 +24,110 @@
         disabled = false,
         children,
         ...restProps
-    }: Props & { children?: any } = $props();
+    }: Props = $props();
 
     const triggerId = generateId("tooltip-trigger");
     const tooltipId = generateId("tooltip");
     let isVisible = $state(false);
     let triggerElement: HTMLElement | null = $state(null);
+    let showDelayTimeout: ReturnType<typeof setTimeout> | null = null;
+    let hideBlurTimeout: ReturnType<typeof setTimeout> | null = null;
+
+    function clearShowDelay(): void {
+        if (showDelayTimeout !== null) {
+            clearTimeout(showDelayTimeout);
+            showDelayTimeout = null;
+        }
+    }
+
+    function clearHideBlurTimeout(): void {
+        if (hideBlurTimeout !== null) {
+            clearTimeout(hideBlurTimeout);
+            hideBlurTimeout = null;
+        }
+    }
+
+    function findDescribedTarget(root: HTMLElement): HTMLElement | null {
+        const found = root.querySelector<HTMLElement>(FOCUSABLE_SELECTOR);
+        if (found) {
+            return found;
+        }
+        try {
+            if (root.matches(FOCUSABLE_SELECTOR)) {
+                return root;
+            }
+        } catch {
+            /* `matches()` can throw on unusual roots */
+        }
+        return null;
+    }
+
+    $effect(() => {
+        const root = triggerElement;
+        const describe =
+            isVisible && content && !disabled ? tooltipId : null;
+        if (!root) {
+            return;
+        }
+        const target = findDescribedTarget(root);
+        if (!target) {
+            return;
+        }
+        if (describe) {
+            target.setAttribute("aria-describedby", describe);
+        } else {
+            target.removeAttribute("aria-describedby");
+        }
+        return () => {
+            target.removeAttribute("aria-describedby");
+        };
+    });
+
+    $effect(() => {
+        if (!content || disabled) {
+            clearShowDelay();
+            clearHideBlurTimeout();
+        }
+    });
+
+    onDestroy(() => {
+        clearShowDelay();
+        clearHideBlurTimeout();
+    });
 
     function handleKeydown(event: KeyboardEvent) {
         if (event.key === "Escape" && isVisible) {
+            clearShowDelay();
+            clearHideBlurTimeout();
             isVisible = false;
             triggerElement?.focus();
         }
     }
 
     function handleFocus() {
+        clearShowDelay();
+        clearHideBlurTimeout();
         if (!disabled && content) {
             isVisible = true;
         }
     }
 
     function handleBlur() {
-        setTimeout(() => {
+        clearHideBlurTimeout();
+        // Defer hide so brief focus moves within the trigger subtree do not flash the tooltip off.
+        hideBlurTimeout = setTimeout(() => {
+            hideBlurTimeout = null;
             isVisible = false;
         }, 100);
     }
 
     function handleMouseEnter() {
+        clearShowDelay();
+        clearHideBlurTimeout();
         if (!disabled && content) {
             if (delay > 0) {
-                setTimeout(() => {
+                showDelayTimeout = setTimeout(() => {
+                    showDelayTimeout = null;
                     isVisible = true;
                 }, delay);
             } else {
@@ -54,6 +137,8 @@
     }
 
     function handleMouseLeave() {
+        clearShowDelay();
+        clearHideBlurTimeout();
         isVisible = false;
     }
 </script>
@@ -70,11 +155,7 @@
     onfocusout={handleBlur}
     {...restProps}
 >
-    <div
-        bind:this={triggerElement}
-        id={triggerId}
-        aria-describedby={isVisible ? tooltipId : undefined}
-    >
+    <div bind:this={triggerElement} id={triggerId}>
         {@render children?.()}
     </div>
 
@@ -268,9 +349,11 @@
         }
     }
 
-    .tooltip-container:focus-visible {
-        outline: 2px solid var(--color-focus);
-        outline-offset: 2px;
+    .tooltip-container:has(:focus-visible) {
+        outline: none;
+        box-shadow:
+            0 0 0 2px var(--color-focus-ring-offset),
+            0 0 0 4px var(--color-focus-ring);
         border-radius: var(--tooltip-radius);
     }
 </style>

package/dist/atoms/Tooltip.svelte.d.ts

@@ -1,12 +1,13 @@
-interface Props {
+import type { Snippet } from "svelte";
+import type { HTMLAttributes } from "svelte/elements";
+type Props = Omit<HTMLAttributes<HTMLDivElement>, "class"> & {
     content?: string;
     placement?: "top" | "bottom" | "left" | "right";
     delay?: number;
     disabled?: boolean;
-}
-type $$ComponentProps = Props & {
-    children?: any;
+    class?: string;
+    children?: Snippet;
 };
-declare const Tooltip: import("svelte").Component<$$ComponentProps, {}, "">;
+declare const Tooltip: import("svelte").Component<Props, {}, "">;
 type Tooltip = ReturnType<typeof Tooltip>;
 export default Tooltip;

package/dist/atoms/index.d.ts

@@ -14,3 +14,9 @@ export { default as List } from './List.svelte';
 export { default as ListItem } from './ListItem.svelte';
 export { default as Heading } from './Heading.svelte';
 export { default as ThemeToggle } from './ThemeToggle.svelte';
+export { default as ActionPanel } from './ActionPanel.svelte';
+export { default as Divider } from './Divider.svelte';
+export { default as Container } from './Container.svelte';
+export { default as Text } from './Text.svelte';
+export { default as Table } from './Table.svelte';
+export { default as Radio } from './Radio.svelte';

package/dist/atoms/index.js

@@ -14,3 +14,9 @@ export { default as List } from './List.svelte';
 export { default as ListItem } from './ListItem.svelte';
 export { default as Heading } from './Heading.svelte';
 export { default as ThemeToggle } from './ThemeToggle.svelte';
+export { default as ActionPanel } from './ActionPanel.svelte';
+export { default as Divider } from './Divider.svelte';
+export { default as Container } from './Container.svelte';
+export { default as Text } from './Text.svelte';
+export { default as Table } from './Table.svelte';
+export { default as Radio } from './Radio.svelte';

package/dist/atoms/selection-control.styles.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Layout strings for selection controls. Interaction states live in `app.css`
+ * (`.selection-control-label-row-interaction`, etc.) — keep class names in sync.
+ */
+/** With `app.css`: hover, disabled, `:focus-visible` ring on the row. */
+export declare const SELECTION_CONTROL_LABEL_ROW_INTERACTION = "selection-control-label-row-interaction";
+/** With `app.css`: `:checked` ring for radio list rows. */
+export declare const SELECTION_CONTROL_OPTION_ROW = "selection-control-option-row";
+/** Control + label row; `p-2 -m-2` aligns hit area with text; `group` is not valid inside `@apply`. */
+export declare const SELECTION_CONTROL_LABEL_ROW_BASE: string;
+export declare const SELECTION_CONTROL_LABEL_ROW: string;
+/** Radio option row: stacked label/description; `p-2` only (no `-m-2`) so vertical gaps stay even. */
+export declare const RADIO_GROUP_OPTION_LABEL_ROW: string;
+/** Control shell: border/fill/hover/checked/disabled. `group/control` drives inner mark states. */
+export declare const SELECTION_CONTROL_SHELL_STATE = "group/control relative inline-flex items-center justify-center w-5 h-5 transition-all duration-200 border-2 group-active:scale-95 border-base-400 bg-transparent group-hover:border-brand-500 group-hover:bg-brand-50 has-[:checked]:border-brand-500 has-[:checked]:bg-brand-500 has-[:checked]:group-hover:bg-brand-600 has-[:checked]:group-hover:border-brand-600 has-[:disabled]:opacity-50 has-[:disabled]:cursor-not-allowed";
+export type SelectionControlShape = "square" | "circle";
+export declare function selectionControlShellClasses(shape: SelectionControlShape): string;
+/** Radio circle control; `mt-0.5` aligns with multi-line labels. */
+export declare const RADIO_GROUP_CONTROL_SHELL: string;
+/** Full-bleed ring behind the mark (same geometry as SelectionControl inner ring). */
+export declare function selectionControlRingOverlayClasses(shape: SelectionControlShape): string;
+/** Radio row: circle overlay + `pointer-events-none` so clicks hit the input. */
+export declare const RADIO_GROUP_RING_OVERLAY: string;
+/** Checked radio dot (shared with `Radio.svelte`). */
+export declare const RADIO_CHECKED_DOT_CLASSES = "absolute size-2 rounded-full bg-base-50 pointer-events-none z-10 opacity-0 group-has-checked/control:opacity-100";

package/dist/atoms/selection-control.styles.js

@@ -0,0 +1,30 @@
+/**
+ * Layout strings for selection controls. Interaction states live in `app.css`
+ * (`.selection-control-label-row-interaction`, etc.) — keep class names in sync.
+ */
+/** With `app.css`: hover, disabled, `:focus-visible` ring on the row. */
+export const SELECTION_CONTROL_LABEL_ROW_INTERACTION = "selection-control-label-row-interaction";
+/** With `app.css`: `:checked` ring for radio list rows. */
+export const SELECTION_CONTROL_OPTION_ROW = "selection-control-option-row";
+/** Control + label row; `p-2 -m-2` aligns hit area with text; `group` is not valid inside `@apply`. */
+export const SELECTION_CONTROL_LABEL_ROW_BASE = `p-2 -m-2 group ${SELECTION_CONTROL_LABEL_ROW_INTERACTION}`.trim();
+export const SELECTION_CONTROL_LABEL_ROW = `flex items-center gap-2 ${SELECTION_CONTROL_LABEL_ROW_BASE}`;
+/** Radio option row: stacked label/description; `p-2` only (no `-m-2`) so vertical gaps stay even. */
+export const RADIO_GROUP_OPTION_LABEL_ROW = `flex items-start gap-2 p-2 group ${SELECTION_CONTROL_LABEL_ROW_INTERACTION} ${SELECTION_CONTROL_OPTION_ROW}`.trim();
+/** Control shell: border/fill/hover/checked/disabled. `group/control` drives inner mark states. */
+export const SELECTION_CONTROL_SHELL_STATE = "group/control relative inline-flex items-center justify-center w-5 h-5 transition-all duration-200 border-2 group-active:scale-95 border-base-400 bg-transparent group-hover:border-brand-500 group-hover:bg-brand-50 has-[:checked]:border-brand-500 has-[:checked]:bg-brand-500 has-[:checked]:group-hover:bg-brand-600 has-[:checked]:group-hover:border-brand-600 has-[:disabled]:opacity-50 has-[:disabled]:cursor-not-allowed";
+export function selectionControlShellClasses(shape) {
+    const rounding = shape === "circle" ? "rounded-full" : "rounded";
+    return `${SELECTION_CONTROL_SHELL_STATE} ${rounding}`.trim();
+}
+/** Radio circle control; `mt-0.5` aligns with multi-line labels. */
+export const RADIO_GROUP_CONTROL_SHELL = `${SELECTION_CONTROL_SHELL_STATE} mt-0.5 shrink-0 rounded-full`.trim();
+/** Full-bleed ring behind the mark (same geometry as SelectionControl inner ring). */
+export function selectionControlRingOverlayClasses(shape) {
+    const rounding = shape === "circle" ? "rounded-full" : "rounded";
+    return `absolute inset-0 ${rounding}`.trim();
+}
+/** Radio row: circle overlay + `pointer-events-none` so clicks hit the input. */
+export const RADIO_GROUP_RING_OVERLAY = `pointer-events-none ${selectionControlRingOverlayClasses("circle")}`;
+/** Checked radio dot (shared with `Radio.svelte`). */
+export const RADIO_CHECKED_DOT_CLASSES = "absolute size-2 rounded-full bg-base-50 pointer-events-none z-10 opacity-0 group-has-checked/control:opacity-100";

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

@@ -14,4 +14,10 @@ export { default as List } from './List.svelte';
 export { default as ListItem } from './ListItem.svelte';
 export { default as Heading } from './Heading.svelte';
 export { default as ThemeToggle } from './ThemeToggle.svelte';
+export { default as ActionPanel } from './ActionPanel.svelte';
+export { default as Divider } from './Divider.svelte';
+export { default as Container } from './Container.svelte';
+export { default as Text } from './Text.svelte';
+export { default as Table } from './Table.svelte';
+export { default as Radio } from './Radio.svelte';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/atoms/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/atoms/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/atoms/selection-control.styles.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Layout strings for selection controls. Interaction states live in `app.css`
+ * (`.selection-control-label-row-interaction`, etc.) — keep class names in sync.
+ */
+/** With `app.css`: hover, disabled, `:focus-visible` ring on the row. */
+export declare const SELECTION_CONTROL_LABEL_ROW_INTERACTION = "selection-control-label-row-interaction";
+/** With `app.css`: `:checked` ring for radio list rows. */
+export declare const SELECTION_CONTROL_OPTION_ROW = "selection-control-option-row";
+/** Control + label row; `p-2 -m-2` aligns hit area with text; `group` is not valid inside `@apply`. */
+export declare const SELECTION_CONTROL_LABEL_ROW_BASE: string;
+export declare const SELECTION_CONTROL_LABEL_ROW: string;
+/** Radio option row: stacked label/description; `p-2` only (no `-m-2`) so vertical gaps stay even. */
+export declare const RADIO_GROUP_OPTION_LABEL_ROW: string;
+/** Control shell: border/fill/hover/checked/disabled. `group/control` drives inner mark states. */
+export declare const SELECTION_CONTROL_SHELL_STATE = "group/control relative inline-flex items-center justify-center w-5 h-5 transition-all duration-200 border-2 group-active:scale-95 border-base-400 bg-transparent group-hover:border-brand-500 group-hover:bg-brand-50 has-[:checked]:border-brand-500 has-[:checked]:bg-brand-500 has-[:checked]:group-hover:bg-brand-600 has-[:checked]:group-hover:border-brand-600 has-[:disabled]:opacity-50 has-[:disabled]:cursor-not-allowed";
+export type SelectionControlShape = "square" | "circle";
+export declare function selectionControlShellClasses(shape: SelectionControlShape): string;
+/** Radio circle control; `mt-0.5` aligns with multi-line labels. */
+export declare const RADIO_GROUP_CONTROL_SHELL: string;
+/** Full-bleed ring behind the mark (same geometry as SelectionControl inner ring). */
+export declare function selectionControlRingOverlayClasses(shape: SelectionControlShape): string;
+/** Radio row: circle overlay + `pointer-events-none` so clicks hit the input. */
+export declare const RADIO_GROUP_RING_OVERLAY: string;
+/** Checked radio dot (shared with `Radio.svelte`). */
+export declare const RADIO_CHECKED_DOT_CLASSES = "absolute size-2 rounded-full bg-base-50 pointer-events-none z-10 opacity-0 group-has-checked/control:opacity-100";
+//# sourceMappingURL=selection-control.styles.d.ts.map

package/dist/components/atoms/selection-control.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"selection-control.styles.d.ts","sourceRoot":"","sources":["../../../src/components/atoms/selection-control.styles.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,yEAAyE;AACzE,eAAO,MAAM,uCAAuC,4CACP,CAAC;AAE9C,2DAA2D;AAC3D,eAAO,MAAM,4BAA4B,iCAAiC,CAAC;AAE3E,uGAAuG;AACvG,eAAO,MAAM,gCAAgC,QACyB,CAAC;AAEvE,eAAO,MAAM,2BAA2B,QAAgE,CAAC;AAEzG,sGAAsG;AACtG,eAAO,MAAM,4BAA4B,QAC+E,CAAC;AAEzH,mGAAmG;AACnG,eAAO,MAAM,6BAA6B,waAC+X,CAAC;AAE1a,MAAM,MAAM,qBAAqB,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAExD,wBAAgB,4BAA4B,CAAC,KAAK,EAAE,qBAAqB,GAAG,MAAM,CAGjF;AAED,oEAAoE;AACpE,eAAO,MAAM,yBAAyB,QAAyE,CAAC;AAEhH,sFAAsF;AACtF,wBAAgB,kCAAkC,CAC9C,KAAK,EAAE,qBAAqB,GAC7B,MAAM,CAGR;AAED,iFAAiF;AACjF,eAAO,MAAM,wBAAwB,QAAwE,CAAC;AAE9G,sDAAsD;AACtD,eAAO,MAAM,yBAAyB,qHACgF,CAAC"}

package/dist/components/index.d.ts

@@ -1,7 +1,11 @@
 export { default as Toggle } from './atoms/Toggle.svelte';
 export { default as Badge } from './atoms/Badge.svelte';
 export { default as Button } from './atoms/Button.svelte';
+export { default as IconButton } from './atoms/IconButton.svelte';
 export { default as Card } from './atoms/Card.svelte';
+export { default as CardHeader } from './atoms/CardHeader.svelte';
+export { default as CardContent } from './atoms/CardContent.svelte';
+export { default as CardFooter } from './atoms/CardFooter.svelte';
 export { default as Input } from './atoms/Input.svelte';
 export { default as Textarea } from './atoms/Textarea.svelte';
 export { default as Select } from './atoms/Select.svelte';
@@ -10,27 +14,59 @@ export { default as List } from './atoms/List.svelte';
 export { default as ListItem } from './atoms/ListItem.svelte';
 export { default as Heading } from './atoms/Heading.svelte';
 export { default as ThemeToggle } from './atoms/ThemeToggle.svelte';
+export { default as Divider } from './atoms/Divider.svelte';
+export { default as Container } from './atoms/Container.svelte';
+export { default as Text } from './atoms/Text.svelte';
+export { default as Table } from './atoms/Table.svelte';
+export { default as Toast } from './atoms/Toast.svelte';
+export { default as Tooltip } from './atoms/Tooltip.svelte';
+export { default as Progress } from './atoms/Progress.svelte';
+export { default as Skeleton } from './atoms/Skeleton.svelte';
+export { default as Checkbox } from './atoms/Checkbox.svelte';
+export { default as Radio } from './atoms/Radio.svelte';
+export { default as CodeBlock } from './atoms/CodeBlock.svelte';
+export { default as FeatureCard } from './atoms/FeatureCard.svelte';
+export { default as OptimizedImage } from './atoms/OptimizedImage.svelte';
+export { default as ActionPanel } from './atoms/ActionPanel.svelte';
 export { default as Alert } from './molecules/Alert.svelte';
 export { default as ComponentDemo } from './molecules/ComponentDemo.svelte';
 export { default as ContactForm } from './molecules/ContactForm.svelte';
 export { default as Dropdown } from './molecules/Dropdown.svelte';
 export { default as Form } from './molecules/Form.svelte';
+export { default as FormField } from './molecules/FormField.svelte';
+export { default as Header } from './molecules/Header.svelte';
+export { default as EmptyState } from './molecules/EmptyState.svelte';
+export { default as Toaster } from './molecules/Toaster.svelte';
 export { default as ImageUpload } from './molecules/ImageUpload.svelte';
 export { default as Modal } from './molecules/Modal.svelte';
 export { default as SlideUp } from './molecules/SlideUp.svelte';
 export { default as Tabs } from './molecules/Tabs.svelte';
-export { default as Navbar } from './organisms/Navbar.svelte';
+export { default as RadioGroup } from './molecules/RadioGroup.svelte';
+export { default as NavigationMenu } from './molecules/NavigationMenu.svelte';
+export { default as NavigationMenuList } from './molecules/NavigationMenuList.svelte';
+export { default as NavigationMenuItem } from './molecules/NavigationMenuItem.svelte';
+export { default as NavigationMenuTrigger } from './molecules/NavigationMenuTrigger.svelte';
+export { default as NavigationMenuContent } from './molecules/NavigationMenuContent.svelte';
+export { default as NavigationMenuLink } from './molecules/NavigationMenuLink.svelte';
+export { default as Page } from './molecules/Page.svelte';
+export { default as Section } from './molecules/Section.svelte';
+export { default as SidebarBrandHeader } from './molecules/SidebarBrandHeader.svelte';
+export { default as SidebarFooter } from './molecules/SidebarFooter.svelte';
+export { default as SidebarNavSection } from './molecules/SidebarNavSection.svelte';
+export { toastStore, pushToast, dismissToast, type ToastItem, type ToastLevel, } from './molecules/toast-store.js';
+export { default as TopNavbar } from './organisms/TopNavbar.svelte';
 export { default as SidebarNavigation } from './organisms/SidebarNavigation.svelte';
+export { default as SidebarAccountPanel } from './organisms/SidebarAccountPanel.svelte';
 export { default as SidebarPanel } from './organisms/SidebarPanel.svelte';
+export declare const generateId: (prefix?: string) => string;
 export declare const createId: (prefix?: string) => string;
 export declare const cn: (...classes: (string | undefined | null | false)[]) => string;
-export declare const getFormData: (form: HTMLFormElement) => Record<string, any>;
+export declare const getFormData: (form: HTMLFormElement) => Record<string, unknown>;
 export declare const validateEmail: (email: string) => boolean;
-export declare const validateRequired: (value: any) => boolean;
+export declare const validateRequired: (value: unknown) => boolean;
 export declare const isBrowser: () => boolean;
 export declare const safeWindow: () => Window | undefined;
 export declare const safeDocument: () => Document | undefined;
 export declare const safeLocalStorage: () => Storage | undefined;
-export declare const generateId: (prefix?: string) => string;
-export { Sun, Moon, Monitor, Grip, GripVertical, ChevronUp, ChevronDown, ChevronRight, Zap, Briefcase, Clipboard, Settings } from '@lucide/svelte';
+export { Sun, Moon, Monitor, Grip, GripVertical, ChevronUp, ChevronDown, ChevronRight, Zap, Briefcase, Clipboard, Settings, } from '@lucide/svelte';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAEpE,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,kCAAkC,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,gCAAgC,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,gCAAgC,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAE1E,eAAO,MAAM,QAAQ,GAAI,SAAQ,MAAa,KAAG,MAA4B,CAAC;AAE9E,eAAO,MAAM,EAAE,GAAI,GAAG,SAAS,CAAC,MAAM,GAAG,SAAS,GAAG,IAAI,GAAG,KAAK,CAAC,EAAE,KAAG,MAClC,CAAC;AAEtC,eAAO,MAAM,WAAW,GAAI,MAAM,eAAe,KAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAGrE,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,OAAO,MAAM,KAAG,OAG7C,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,OAAO,GAAG,KAAG,OAE7C,CAAC;AAEF,eAAO,MAAM,SAAS,QAAO,OAE5B,CAAC;AAEF,eAAO,MAAM,UAAU,QAAO,MAAM,GAAG,SAEtC,CAAC;AAEF,eAAO,MAAM,YAAY,QAAO,QAAQ,GAAG,SAE1C,CAAC;AAEF,eAAO,MAAM,gBAAgB,QAAO,OAAO,GAAG,SAE7C,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,SAAQ,MAAa,KAAG,MAKlD,CAAC;AAEF,OAAO,EACH,GAAG,EACH,IAAI,EACJ,OAAO,EACP,IAAI,EACJ,YAAY,EACZ,SAAS,EACT,WAAW,EACX,YAAY,EACZ,GAAG,EACH,SAAS,EACT,SAAS,EACT,QAAQ,EACX,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"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"}

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

@@ -11,7 +11,17 @@ export { default as NavigationMenuItem } from './NavigationMenuItem.svelte';
 export { default as NavigationMenuTrigger } from './NavigationMenuTrigger.svelte';
 export { default as NavigationMenuContent } from './NavigationMenuContent.svelte';
 export { default as NavigationMenuLink } from './NavigationMenuLink.svelte';
+export { default as Page } from './Page.svelte';
 export { default as Section } from './Section.svelte';
+export { default as SidebarBrandHeader } from './SidebarBrandHeader.svelte';
+export { default as SidebarFooter } from './SidebarFooter.svelte';
+export { default as SidebarNavSection } from './SidebarNavSection.svelte';
 export { default as SlideUp } from './SlideUp.svelte';
 export { default as Tabs } from './Tabs.svelte';
+export { default as FormField } from './FormField.svelte';
+export { default as Header } from './Header.svelte';
+export { default as EmptyState } from './EmptyState.svelte';
+export { default as Toaster } from './Toaster.svelte';
+export { default as RadioGroup } from './RadioGroup.svelte';
+export * from './toast-store.js';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/molecules/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/molecules/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC1E,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,cAAc,kBAAkB,CAAC"}

package/dist/components/molecules/navigation-menu-context.d.ts

@@ -2,6 +2,17 @@ export interface NavigationMenuContextValue {
     activeItem: string | null;
     setActiveItem: (item: string | null) => void;
     isMobile: boolean;
+    /** Prefix for panel `id` / trigger `aria-controls` (one menu instance). */
+    menuInstanceId: string;
 }
 export declare const NAVIGATION_MENU_CONTEXT_KEY: unique symbol;
+/** Panel element id; `itemValue` is sanitized for HTML id rules. */
+export declare function navigationMenuPanelId(menuInstanceId: string, itemValue: string): string;
+/**
+ * Deterministic menu id from item order + values (FNV-1a).
+ * SSR and client must agree — do not use `generateId()` for this pairing.
+ */
+export declare function navigationMenuStableInstanceId(items: ReadonlyArray<{
+    value: string;
+}>): string;
 //# sourceMappingURL=navigation-menu-context.d.ts.map

package/dist/components/molecules/navigation-menu-context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-menu-context.d.ts","sourceRoot":"","sources":["../../../src/components/molecules/navigation-menu-context.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,0BAA0B;IACvC,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7C,QAAQ,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,2BAA2B,eAA4B,CAAC"}
+{"version":3,"file":"navigation-menu-context.d.ts","sourceRoot":"","sources":["../../../src/components/molecules/navigation-menu-context.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,0BAA0B;IACvC,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC7C,QAAQ,EAAE,OAAO,CAAC;IAClB,2EAA2E;IAC3E,cAAc,EAAE,MAAM,CAAC;CAC1B;AAED,eAAO,MAAM,2BAA2B,eAA4B,CAAC;AAErE,oEAAoE;AACpE,wBAAgB,qBAAqB,CACjC,cAAc,EAAE,MAAM,EACtB,SAAS,EAAE,MAAM,GAClB,MAAM,CAGR;AAED;;;GAGG;AACH,wBAAgB,8BAA8B,CAC1C,KAAK,EAAE,aAAa,CAAC;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,GACxC,MAAM,CAQR"}