@epoch32/visage 1.0.0 → 1.1.1

package/dist/{src/ui → ui}/index.js

@@ -848,10 +848,12 @@ class Signal {
   _value;
   _subscribers = new Set;
   _equals;
+  _onSet;
   version = 0;
-  constructor(initialValue, equals) {
+  constructor(initialValue, equals, onSet) {
     this._value = initialValue;
     this._equals = equals ?? Object.is;
+    this._onSet = onSet;
   }
   get() {
     if (currentSubscriber !== null && currentSubscriber.state !== 3 /* DISPOSED */) {
@@ -876,6 +878,9 @@ class Signal {
     }
     this._value = newValue;
     this.version++;
+    if (this._onSet) {
+      this._onSet(newValue);
+    }
     batch(() => {
       this.notify();
     });
@@ -901,11 +906,91 @@ class Signal {
     }
   }
 }
+function resolveStorage(storageOption) {
+  if (storageOption && typeof storageOption === "object") {
+    return storageOption;
+  }
+  if (storageOption === "session") {
+    try {
+      if (typeof sessionStorage !== "undefined")
+        return sessionStorage;
+    } catch {}
+    try {
+      if (typeof window !== "undefined" && window.sessionStorage) {
+        return window.sessionStorage;
+      }
+    } catch {}
+    try {
+      if (typeof globalThis !== "undefined" && globalThis.sessionStorage) {
+        return globalThis.sessionStorage;
+      }
+    } catch {}
+    return null;
+  }
+  try {
+    if (typeof localStorage !== "undefined")
+      return localStorage;
+  } catch {}
+  try {
+    if (typeof window !== "undefined" && window.localStorage) {
+      return window.localStorage;
+    }
+  } catch {}
+  try {
+    if (typeof globalThis !== "undefined" && globalThis.localStorage) {
+      return globalThis.localStorage;
+    }
+  } catch {}
+  return null;
+}
 function signal(initialValue, optionsOrEquals) {
   const equals = typeof optionsOrEquals === "function" ? optionsOrEquals : optionsOrEquals?.equals;
   const isInternal = typeof optionsOrEquals === "object" ? optionsOrEquals?.internal : false;
   const customName = typeof optionsOrEquals === "object" ? optionsOrEquals?.name : undefined;
-  const s = new Signal(initialValue, equals);
+  const persistOption = typeof optionsOrEquals === "object" ? optionsOrEquals?.persist : undefined;
+  const persistConfig = persistOption ? typeof persistOption === "string" ? { key: persistOption } : persistOption : undefined;
+  let effectiveInitial = initialValue;
+  const storage = persistConfig ? resolveStorage(persistConfig.storage) : null;
+  const serialize = persistConfig?.serialize ?? JSON.stringify;
+  const deserialize = persistConfig?.deserialize ?? JSON.parse;
+  if (persistConfig && storage) {
+    try {
+      const stored = storage.getItem(persistConfig.key);
+      if (stored !== null) {
+        effectiveInitial = deserialize(stored);
+      }
+    } catch {}
+  }
+  let isSyncing = false;
+  const onSet = persistConfig && storage ? (val) => {
+    if (isSyncing)
+      return;
+    try {
+      storage.setItem(persistConfig.key, serialize(val));
+    } catch {}
+  } : undefined;
+  const s = new Signal(effectiveInitial, equals, onSet);
+  if (persistConfig && storage && (persistConfig.syncTabs ?? true) && typeof window !== "undefined" && typeof window.addEventListener === "function") {
+    const onStorage = (e) => {
+      if (e.key === persistConfig.key) {
+        try {
+          const nextVal = e.newValue !== null ? deserialize(e.newValue) : initialValue;
+          isSyncing = true;
+          try {
+            s.set(nextVal);
+          } finally {
+            isSyncing = false;
+          }
+        } catch {}
+      }
+    };
+    window.addEventListener("storage", onStorage);
+    if (currentScope) {
+      currentScope.addCleanup(() => {
+        window.removeEventListener("storage", onStorage);
+      });
+    }
+  }
   const accessor = (...args) => {
     if (args.length === 0) {
       return s.get();

package/dist/ui/layout.d.ts

@@ -0,0 +1 @@
+export { type BaseLayoutProps, Center, type CenterProps, Grid, type GridProps, Row, type RowProps, Spacer, type SpacerProps, Stack, type StackProps } from "../style/layout";

package/dist/ui/popover.d.ts

@@ -0,0 +1,68 @@
+import type { Child } from "../dom/render";
+import { type ReadonlySignal } from "../signals";
+export interface PopoverContextValue {
+    open: ReadonlySignal<boolean>;
+    setOpen: (open: boolean) => void;
+    triggerRef: {
+        current: HTMLElement | null;
+    };
+    contentRef: {
+        current: HTMLElement | null;
+    };
+    contentId: string;
+}
+export declare const PopoverContext: import("..").Context<PopoverContextValue | null>;
+export declare function usePopoverContext(): PopoverContextValue | null;
+export interface PopoverProps {
+    open?: () => boolean | undefined;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    trigger?: Child | (() => Child);
+    content?: Child | (() => Child);
+    triggerClass?: any;
+    contentClass?: any;
+    portalled?: boolean;
+    children?: Child | (() => Child);
+}
+export declare function PopoverRoot(props: PopoverProps): Child;
+export interface PopoverTriggerProps {
+    as?: string;
+    class?: any;
+    style?: any;
+    onClick?: (e: MouseEvent) => void;
+    children: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function PopoverTrigger(props: PopoverTriggerProps): Child;
+export interface PopoverPortalProps {
+    mount?: HTMLElement | null;
+    children: Child | (() => Child);
+}
+export declare function PopoverPortal(props: PopoverPortalProps): Child;
+export interface PopoverContentProps {
+    as?: string;
+    portalled?: boolean;
+    mount?: HTMLElement | null;
+    class?: any;
+    style?: any;
+    onKeyDown?: (e: KeyboardEvent) => void;
+    children: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function PopoverContent(props: PopoverContentProps): Child;
+export interface PopoverCloseProps {
+    as?: string;
+    class?: any;
+    style?: any;
+    onClick?: (e: MouseEvent) => void;
+    children: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function PopoverClose(props: PopoverCloseProps): Child;
+export declare const Popover: typeof PopoverRoot & {
+    Root: typeof PopoverRoot;
+    Trigger: typeof PopoverTrigger;
+    Portal: typeof PopoverPortal;
+    Content: typeof PopoverContent;
+    Close: typeof PopoverClose;
+};

package/dist/ui/switch.d.ts

@@ -0,0 +1,31 @@
+import type { Child } from "../dom/render";
+export interface SwitchProps {
+    checked?: () => boolean | undefined;
+    defaultChecked?: boolean;
+    onCheckedChange?: (checked: boolean) => void;
+    disabled?: boolean | (() => boolean);
+    required?: boolean;
+    name?: string;
+    value?: string;
+    thumbClass?: any;
+    thumbStyle?: any;
+    as?: string;
+    class?: any;
+    style?: any;
+    children?: Child | (() => Child);
+    onClick?: (e: MouseEvent) => void;
+    onKeyDown?: (e: KeyboardEvent) => void;
+    [key: string]: any;
+}
+export declare function SwitchRoot(props: SwitchProps): Child;
+export interface SwitchThumbProps {
+    as?: string;
+    class?: any;
+    style?: any;
+    [key: string]: any;
+}
+export declare function SwitchThumb(props: SwitchThumbProps): Child;
+export declare const Switch: typeof SwitchRoot & {
+    Root: typeof SwitchRoot;
+    Thumb: typeof SwitchThumb;
+};

package/dist/ui/tabs.d.ts

@@ -0,0 +1,71 @@
+import type { Child } from "../dom/render";
+import type { ReadonlySignal } from "../signals";
+export interface TabsContextValue {
+    value: ReadonlySignal<string>;
+    setValue: (value: string) => void;
+    orientation: "horizontal" | "vertical";
+    activationMode: "automatic" | "manual";
+    baseId: string;
+}
+export declare const TabsContext: import("..").Context<TabsContextValue | null>;
+export declare function useTabsContext(): TabsContextValue | null;
+export interface TabItem {
+    value: string;
+    label: Child | (() => Child);
+    icon?: Child | (() => Child);
+    content?: Child | (() => Child);
+    disabled?: boolean | (() => boolean);
+}
+export interface TabsProps {
+    value?: () => string | undefined;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    orientation?: "horizontal" | "vertical";
+    activationMode?: "automatic" | "manual";
+    items?: TabItem[];
+    listClass?: any;
+    triggerClass?: any;
+    contentClass?: any;
+    class?: any;
+    style?: any;
+    as?: string;
+    children?: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function TabsRoot(props: TabsProps): Child;
+export interface TabsListProps {
+    as?: string;
+    class?: any;
+    style?: any;
+    onKeyDown?: (e: KeyboardEvent) => void;
+    children: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function TabsList(props: TabsListProps): Child;
+export interface TabsTriggerProps {
+    value: string;
+    disabled?: boolean | (() => boolean);
+    as?: string;
+    class?: any;
+    style?: any;
+    onClick?: (e: MouseEvent) => void;
+    children: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function TabsTrigger(props: TabsTriggerProps): Child;
+export interface TabsContentProps {
+    value: string;
+    forceMount?: boolean;
+    as?: string;
+    class?: any;
+    style?: any;
+    children: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function TabsContent(props: TabsContentProps): Child;
+export declare const Tabs: typeof TabsRoot & {
+    Root: typeof TabsRoot;
+    List: typeof TabsList;
+    Trigger: typeof TabsTrigger;
+    Content: typeof TabsContent;
+};

package/dist/ui/toast.d.ts

@@ -0,0 +1,91 @@
+import type { Child } from "../dom/render";
+import { type ReadonlySignal } from "../signals";
+export type ToastVariant = "default" | "success" | "error" | "warning" | "info";
+export interface ToastData {
+    id: string;
+    title?: Child;
+    description?: Child;
+    variant?: ToastVariant;
+    duration?: number;
+    onDismiss?: () => void;
+}
+export interface ToastOptions {
+    title?: Child;
+    description?: Child;
+    variant?: ToastVariant;
+    duration?: number;
+    onDismiss?: () => void;
+}
+export interface ToastManager {
+    (options: ToastOptions | string): string;
+    toasts: ReadonlySignal<ToastData[]>;
+    show: (options: ToastOptions | string) => string;
+    success: (title: string, options?: Omit<ToastOptions, "title" | "variant">) => string;
+    error: (title: string, options?: Omit<ToastOptions, "title" | "variant">) => string;
+    warning: (title: string, options?: Omit<ToastOptions, "title" | "variant">) => string;
+    info: (title: string, options?: Omit<ToastOptions, "title" | "variant">) => string;
+    dismiss: (id: string) => void;
+    clear: () => void;
+}
+export declare function createToastManager(): ToastManager;
+export declare const defaultToastManager: ToastManager;
+export declare const toast: ToastManager;
+export declare const ToastContext: import("..").Context<ToastManager>;
+export declare function useToast(): ToastManager;
+export interface ToastProviderProps {
+    manager?: ToastManager;
+    children: Child | (() => Child);
+}
+export declare function ToastProvider(props: ToastProviderProps): Child;
+export interface ToastViewportProps {
+    as?: string;
+    class?: any;
+    style?: any;
+    children?: (item: ToastData) => Child;
+    [key: string]: any;
+}
+export declare function ToastViewport(props: ToastViewportProps): Child;
+export interface ToastProps {
+    id?: string;
+    variant?: ToastVariant;
+    onDismiss?: () => void;
+    as?: string;
+    class?: any;
+    style?: any;
+    children: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function ToastRoot(props: ToastProps): Child;
+export interface ToastTitleProps {
+    as?: string;
+    class?: any;
+    style?: any;
+    children: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function ToastTitle(props: ToastTitleProps): Child;
+export interface ToastDescriptionProps {
+    as?: string;
+    class?: any;
+    style?: any;
+    children: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function ToastDescription(props: ToastDescriptionProps): Child;
+export interface ToastCloseProps {
+    as?: string;
+    class?: any;
+    style?: any;
+    onClick?: (e: MouseEvent) => void;
+    children?: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function ToastClose(props: ToastCloseProps): Child;
+export declare const Toast: typeof ToastRoot & {
+    Root: typeof ToastRoot;
+    Provider: typeof ToastProvider;
+    Viewport: typeof ToastViewport;
+    Title: typeof ToastTitle;
+    Description: typeof ToastDescription;
+    Close: typeof ToastClose;
+};

package/dist/ui/tooltip.d.ts

@@ -0,0 +1,64 @@
+import type { Child } from "../dom/render";
+import { type ReadonlySignal } from "../signals";
+export interface TooltipContextValue {
+    open: ReadonlySignal<boolean>;
+    setOpen: (open: boolean) => void;
+    openDelay: number;
+    closeDelay: number;
+    tooltipId: string;
+    triggerRef: {
+        current: HTMLElement | null;
+    };
+}
+export declare const TooltipContext: import("..").Context<TooltipContextValue | null>;
+export declare function useTooltipContext(): TooltipContextValue | null;
+export interface TooltipProps {
+    open?: () => boolean | undefined;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    openDelay?: number;
+    closeDelay?: number;
+    content?: Child | (() => Child);
+    side?: "top" | "bottom" | "left" | "right";
+    triggerClass?: any;
+    triggerAs?: string;
+    contentClass?: any;
+    contentStyle?: any;
+    portalled?: boolean;
+    children?: Child | (() => Child);
+}
+export declare function TooltipRoot(props: TooltipProps): Child;
+export interface TooltipTriggerProps {
+    as?: string;
+    class?: any;
+    style?: any;
+    onMouseEnter?: (e: MouseEvent) => void;
+    onMouseLeave?: (e: MouseEvent) => void;
+    onFocus?: (e: FocusEvent) => void;
+    onBlur?: (e: FocusEvent) => void;
+    children: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function TooltipTrigger(props: TooltipTriggerProps): Child;
+export interface TooltipPortalProps {
+    mount?: HTMLElement | null;
+    children: Child | (() => Child);
+}
+export declare function TooltipPortal(props: TooltipPortalProps): Child;
+export interface TooltipContentProps {
+    forceMount?: boolean;
+    portalled?: boolean;
+    mount?: HTMLElement | null;
+    as?: string;
+    class?: any;
+    style?: any;
+    children: Child | (() => Child);
+    [key: string]: any;
+}
+export declare function TooltipContent(props: TooltipContentProps): Child;
+export declare const Tooltip: typeof TooltipRoot & {
+    Root: typeof TooltipRoot;
+    Trigger: typeof TooltipTrigger;
+    Portal: typeof TooltipPortal;
+    Content: typeof TooltipContent;
+};

package/dist/ui/utils.d.ts

@@ -0,0 +1,21 @@
+import { type ReadonlySignal } from "../signals";
+/**
+ * Generate a unique, deterministic ID for ARIA attributes
+ */
+export declare function createId(prefix?: string): string;
+/**
+ * Helper for components that support both controlled and uncontrolled signal/value patterns
+ */
+export declare function createControllableSignal<T>(options: {
+    value?: () => T | undefined;
+    defaultValue?: T;
+    onChange?: (value: T) => void;
+}): [ReadonlySignal<T>, (next: T | ((prev: T) => T)) => void];
+/**
+ * Setup a focus trap inside a container element
+ */
+export declare function trapFocus(container: HTMLElement, event: KeyboardEvent): void;
+/**
+ * Listen for click outside a target element
+ */
+export declare function onClickOutside(elements: Array<HTMLElement | null | undefined> | HTMLElement | null | undefined, handler: (event: MouseEvent | TouchEvent) => void): () => void;

package/dist/virtual/index.d.ts

@@ -0,0 +1,2 @@
+export { VirtualGrid, type VirtualGridProps, VirtualList, type VirtualListProps } from "./virtual-list";
+export { createVirtualizer, type VirtualItem, type Virtualizer, type VirtualizerOptions } from "./virtualizer";

package/dist/{src/virtual → virtual}/index.js

@@ -848,10 +848,12 @@ class Signal {
   _value;
   _subscribers = new Set;
   _equals;
+  _onSet;
   version = 0;
-  constructor(initialValue, equals) {
+  constructor(initialValue, equals, onSet) {
     this._value = initialValue;
     this._equals = equals ?? Object.is;
+    this._onSet = onSet;
   }
   get() {
     if (currentSubscriber !== null && currentSubscriber.state !== 3 /* DISPOSED */) {
@@ -876,6 +878,9 @@ class Signal {
     }
     this._value = newValue;
     this.version++;
+    if (this._onSet) {
+      this._onSet(newValue);
+    }
     batch(() => {
       this.notify();
     });
@@ -901,11 +906,91 @@ class Signal {
     }
   }
 }
+function resolveStorage(storageOption) {
+  if (storageOption && typeof storageOption === "object") {
+    return storageOption;
+  }
+  if (storageOption === "session") {
+    try {
+      if (typeof sessionStorage !== "undefined")
+        return sessionStorage;
+    } catch {}
+    try {
+      if (typeof window !== "undefined" && window.sessionStorage) {
+        return window.sessionStorage;
+      }
+    } catch {}
+    try {
+      if (typeof globalThis !== "undefined" && globalThis.sessionStorage) {
+        return globalThis.sessionStorage;
+      }
+    } catch {}
+    return null;
+  }
+  try {
+    if (typeof localStorage !== "undefined")
+      return localStorage;
+  } catch {}
+  try {
+    if (typeof window !== "undefined" && window.localStorage) {
+      return window.localStorage;
+    }
+  } catch {}
+  try {
+    if (typeof globalThis !== "undefined" && globalThis.localStorage) {
+      return globalThis.localStorage;
+    }
+  } catch {}
+  return null;
+}
 function signal(initialValue, optionsOrEquals) {
   const equals = typeof optionsOrEquals === "function" ? optionsOrEquals : optionsOrEquals?.equals;
   const isInternal = typeof optionsOrEquals === "object" ? optionsOrEquals?.internal : false;
   const customName = typeof optionsOrEquals === "object" ? optionsOrEquals?.name : undefined;
-  const s = new Signal(initialValue, equals);
+  const persistOption = typeof optionsOrEquals === "object" ? optionsOrEquals?.persist : undefined;
+  const persistConfig = persistOption ? typeof persistOption === "string" ? { key: persistOption } : persistOption : undefined;
+  let effectiveInitial = initialValue;
+  const storage = persistConfig ? resolveStorage(persistConfig.storage) : null;
+  const serialize = persistConfig?.serialize ?? JSON.stringify;
+  const deserialize = persistConfig?.deserialize ?? JSON.parse;
+  if (persistConfig && storage) {
+    try {
+      const stored = storage.getItem(persistConfig.key);
+      if (stored !== null) {
+        effectiveInitial = deserialize(stored);
+      }
+    } catch {}
+  }
+  let isSyncing = false;
+  const onSet = persistConfig && storage ? (val) => {
+    if (isSyncing)
+      return;
+    try {
+      storage.setItem(persistConfig.key, serialize(val));
+    } catch {}
+  } : undefined;
+  const s = new Signal(effectiveInitial, equals, onSet);
+  if (persistConfig && storage && (persistConfig.syncTabs ?? true) && typeof window !== "undefined" && typeof window.addEventListener === "function") {
+    const onStorage = (e) => {
+      if (e.key === persistConfig.key) {
+        try {
+          const nextVal = e.newValue !== null ? deserialize(e.newValue) : initialValue;
+          isSyncing = true;
+          try {
+            s.set(nextVal);
+          } finally {
+            isSyncing = false;
+          }
+        } catch {}
+      }
+    };
+    window.addEventListener("storage", onStorage);
+    if (currentScope) {
+      currentScope.addCleanup(() => {
+        window.removeEventListener("storage", onStorage);
+      });
+    }
+  }
   const accessor = (...args) => {
     if (args.length === 0) {
       return s.get();

package/dist/virtual/virtual-list.d.ts

@@ -0,0 +1,21 @@
+export interface VirtualListProps<T> {
+    each: T[] | (() => T[]);
+    itemHeight: number | ((index: number) => number);
+    height?: number | string;
+    width?: number | string;
+    overscan?: number;
+    class?: string;
+    style?: Record<string, any> | (() => Record<string, any>);
+    children: (item: T, index: () => number) => any;
+}
+export declare function VirtualList<T>(props: VirtualListProps<T>): import("..").JSX.Element;
+export interface VirtualGridProps<T> {
+    data: T[][] | (() => T[][]);
+    rowHeight: number;
+    columnWidth: number;
+    height?: number | string;
+    width?: number | string;
+    overscan?: number;
+    children: (item: T, rowIndex: number, colIndex: number) => any;
+}
+export declare function VirtualGrid<T>(props: VirtualGridProps<T>): import("..").JSX.Element;

package/dist/virtual/virtualizer.d.ts

@@ -0,0 +1,31 @@
+import { type ReadonlySignal } from "../signals";
+export interface VirtualItem {
+    index: number;
+    start: number;
+    size: number;
+    end: number;
+    key: number | string;
+}
+export interface VirtualizerOptions {
+    count: number | (() => number);
+    itemHeight: number | ((index: number) => number);
+    getScrollElement: () => HTMLElement | null;
+    overscan?: number;
+    horizontal?: boolean;
+    initialSize?: number;
+    estimateSize?: (index: number) => number;
+}
+export interface Virtualizer {
+    virtualItems: ReadonlySignal<VirtualItem[]>;
+    totalSize: ReadonlySignal<number>;
+    scrollOffset: ReadonlySignal<number>;
+    containerSize: ReadonlySignal<number>;
+    startIndex: ReadonlySignal<number>;
+    endIndex: ReadonlySignal<number>;
+    scrollToIndex: (index: number, options?: {
+        align?: "start" | "center" | "end" | "auto";
+    }) => void;
+    scrollToOffset: (offset: number) => void;
+    measureElement: (element: HTMLElement | null, index: number) => void;
+}
+export declare function createVirtualizer(options: VirtualizerOptions): Virtualizer;

package/dist/vite/hmr.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Transform JSX/TSX modules to attach Hot Module Replacement (HMR) acceptance
+ */
+export declare function transformHmr(code: string, id: string): {
+    code: string;
+    map?: any;
+} | null;

package/dist/vite/index.d.ts

@@ -0,0 +1,3 @@
+export { type VisageLucideOptions, visageLucide } from "./lucide";
+export { default, visage } from "./plugin";
+export type { VisagePluginOptions, VisageVitePlugin } from "./types";

package/dist/{src/vite → vite}/index.js

@@ -941,6 +941,10 @@ function visage(options = {}) {
           ]
         },
         resolve: {
+          alias: [
+            { find: /^visage\/(.*)/, replacement: "@epoch32/visage/$1" },
+            { find: /^visage$/, replacement: "@epoch32/visage" }
+          ],
           dedupe: ["@epoch32/visage", "visage"]
         }
       };