sibujs 1.0.0-beta.1

package/dist/patterns.d.cts

@@ -0,0 +1,163 @@
+export { C as ComponentProps, P as PropDef, a as PropSchema, R as RenderProp, V as Validator, b as assertType, c as composable, d as compose, e as createGuard, f as createSlots, g as defineComponent, h as defineSlottedComponent, i as defineStrictComponent, v as validateProps, j as validators, w as withBoundary, k as withDefaults, l as withProps, m as withWrapper } from './contracts-DOrhwbke.cjs';
+
+interface MachineConfig<S extends string, E extends string, C extends Record<string, unknown> = Record<string, unknown>> {
+    initial: S;
+    context?: C;
+    states: {
+        [K in S]: {
+            on?: {
+                [Event in E]?: {
+                    target: S;
+                    guard?: (context: C) => boolean;
+                    action?: (context: C) => Partial<C>;
+                } | S;
+            };
+            entry?: (context: C) => void;
+            exit?: (context: C) => void;
+        };
+    };
+}
+interface MachineReturn<S extends string, E extends string, C extends Record<string, unknown>> {
+    state: () => S;
+    context: () => C;
+    send: (event: E) => void;
+    matches: (state: S) => boolean;
+    can: (event: E) => boolean;
+}
+/**
+ * machine creates a finite state machine with states, events, guards, and actions.
+ */
+declare function machine<S extends string, E extends string, C extends Record<string, unknown> = Record<string, unknown>>(config: MachineConfig<S, E, C>): MachineReturn<S, E, C>;
+
+/**
+ * Creates a reactive state that automatically persists to localStorage
+ * or sessionStorage. Restores persisted value on initialization.
+ *
+ * @param key Storage key
+ * @param initial Default value when no persisted value exists
+ * @param options Storage options
+ * @returns Same tuple as signal: [getter, setter]
+ *
+ * @example
+ * ```ts
+ * const [theme, setTheme] = persisted("theme", "light");
+ * setTheme("dark"); // Automatically saved to localStorage
+ * // On page reload, theme() returns "dark"
+ * ```
+ */
+interface PersistOptions<T = unknown> {
+    /** Use sessionStorage instead of localStorage */
+    session?: boolean;
+    /** Custom serializer (defaults to JSON.stringify) */
+    serialize?: (value: unknown) => string;
+    /** Custom deserializer (defaults to JSON.parse) */
+    deserialize?: (raw: string) => unknown;
+    /** Optional type guard to validate deserialized data. Falls back to initial on failure. */
+    validate?: (value: unknown) => value is T;
+}
+declare function persisted<T>(key: string, initial: T, options?: PersistOptions<T>): [() => T, (next: T | ((prev: T) => T)) => void];
+
+interface OptimisticAction<T> {
+    optimisticValue: T;
+    revert: T;
+}
+/**
+ * optimistic provides optimistic UI updates that can be reverted on failure.
+ * The value updates immediately, then reverts if the async operation fails.
+ */
+declare function optimistic<T>(initialValue: T): [() => T, (optimisticValue: T, asyncAction: () => Promise<T>) => Promise<void>];
+/**
+ * optimisticList provides optimistic updates for array state.
+ */
+declare function optimisticList<T>(initialValue: T[]): {
+    items: () => T[];
+    addOptimistic: (item: T, asyncAction: () => Promise<T>) => Promise<void>;
+    removeOptimistic: (predicate: (item: T) => boolean, asyncAction: () => Promise<void>) => Promise<void>;
+    updateOptimistic: (predicate: (item: T) => boolean, update: Partial<T>, asyncAction: () => Promise<T>) => Promise<void>;
+};
+
+interface TimeTravelReturn<T> {
+    value: () => T;
+    set: (next: T | ((prev: T) => T)) => void;
+    undo: () => void;
+    redo: () => void;
+    canUndo: () => boolean;
+    canRedo: () => boolean;
+    history: () => T[];
+    index: () => number;
+    reset: () => void;
+    jumpTo: (index: number) => void;
+}
+/**
+ * timeline wraps a state value with undo/redo history.
+ */
+declare function timeline<T>(initial: T, maxHistory?: number): TimeTravelReturn<T>;
+
+type Middleware<S> = (state: S, action: string, payload: unknown, next: () => void) => void;
+type Selector<S, R> = (state: S) => R;
+interface GlobalStore<S extends Record<string, unknown>, A extends Record<string, (state: S, payload?: unknown) => Partial<S>>> {
+    getState: () => S;
+    select: <R>(selector: Selector<S, R>) => () => R;
+    dispatch: <K extends keyof A>(action: K, payload?: Parameters<A[K]>[1]) => void;
+    subscribe: (callback: (state: S) => void) => () => void;
+    reset: () => void;
+}
+/**
+ * globalStore creates a centralized state management store
+ * with actions, selectors, and middleware support.
+ */
+declare function globalStore<S extends Record<string, unknown>, A extends Record<string, (state: S, payload?: unknown) => Partial<S>>>(config: {
+    state: S;
+    actions: A;
+    middleware?: Middleware<S>[];
+}): GlobalStore<S, A>;
+
+/**
+ * SolidJS-style reactive primitives — standalone APIs that don't require
+ * being inside a component. These are thin wrappers around the signal system.
+ */
+/**
+ * Creates a reactive signal. Equivalent to signal but with SolidJS naming.
+ *
+ * @param value Initial value
+ * @returns Tuple [getter, setter]
+ *
+ * @example
+ * ```ts
+ * const [count, setCount] = createSignal(0);
+ * console.log(count()); // 0
+ * setCount(5);
+ * ```
+ */
+declare function createSignal<T>(value: T): [() => T, (next: T | ((prev: T) => T)) => void];
+/**
+ * Creates a derived/computed reactive value. Equivalent to derived.
+ *
+ * @param fn Computation function that reads other signals
+ * @returns Getter for the computed value
+ *
+ * @example
+ * ```ts
+ * const [count] = createSignal(5);
+ * const doubled = createMemo(() => count() * 2);
+ * console.log(doubled()); // 10
+ * ```
+ */
+declare function createMemo<T>(fn: () => T): () => T;
+/**
+ * Creates a reactive side effect. Equivalent to effect.
+ *
+ * @param fn Effect function that reads reactive signals
+ * @returns Cleanup/teardown function
+ *
+ * @example
+ * ```ts
+ * const [count] = createSignal(0);
+ * const cleanup = createEffect(() => {
+ *   console.log("Count is:", count());
+ * });
+ * ```
+ */
+declare function createEffect(fn: () => void): () => void;
+
+export { type GlobalStore, type MachineConfig, type MachineReturn, type Middleware, type OptimisticAction, type PersistOptions, type Selector, type TimeTravelReturn, createEffect, createMemo, createSignal, globalStore, machine, optimistic, optimisticList, persisted, timeline };

package/dist/patterns.d.ts

@@ -0,0 +1,163 @@
+export { C as ComponentProps, P as PropDef, a as PropSchema, R as RenderProp, V as Validator, b as assertType, c as composable, d as compose, e as createGuard, f as createSlots, g as defineComponent, h as defineSlottedComponent, i as defineStrictComponent, v as validateProps, j as validators, w as withBoundary, k as withDefaults, l as withProps, m as withWrapper } from './contracts-DOrhwbke.js';
+
+interface MachineConfig<S extends string, E extends string, C extends Record<string, unknown> = Record<string, unknown>> {
+    initial: S;
+    context?: C;
+    states: {
+        [K in S]: {
+            on?: {
+                [Event in E]?: {
+                    target: S;
+                    guard?: (context: C) => boolean;
+                    action?: (context: C) => Partial<C>;
+                } | S;
+            };
+            entry?: (context: C) => void;
+            exit?: (context: C) => void;
+        };
+    };
+}
+interface MachineReturn<S extends string, E extends string, C extends Record<string, unknown>> {
+    state: () => S;
+    context: () => C;
+    send: (event: E) => void;
+    matches: (state: S) => boolean;
+    can: (event: E) => boolean;
+}
+/**
+ * machine creates a finite state machine with states, events, guards, and actions.
+ */
+declare function machine<S extends string, E extends string, C extends Record<string, unknown> = Record<string, unknown>>(config: MachineConfig<S, E, C>): MachineReturn<S, E, C>;
+
+/**
+ * Creates a reactive state that automatically persists to localStorage
+ * or sessionStorage. Restores persisted value on initialization.
+ *
+ * @param key Storage key
+ * @param initial Default value when no persisted value exists
+ * @param options Storage options
+ * @returns Same tuple as signal: [getter, setter]
+ *
+ * @example
+ * ```ts
+ * const [theme, setTheme] = persisted("theme", "light");
+ * setTheme("dark"); // Automatically saved to localStorage
+ * // On page reload, theme() returns "dark"
+ * ```
+ */
+interface PersistOptions<T = unknown> {
+    /** Use sessionStorage instead of localStorage */
+    session?: boolean;
+    /** Custom serializer (defaults to JSON.stringify) */
+    serialize?: (value: unknown) => string;
+    /** Custom deserializer (defaults to JSON.parse) */
+    deserialize?: (raw: string) => unknown;
+    /** Optional type guard to validate deserialized data. Falls back to initial on failure. */
+    validate?: (value: unknown) => value is T;
+}
+declare function persisted<T>(key: string, initial: T, options?: PersistOptions<T>): [() => T, (next: T | ((prev: T) => T)) => void];
+
+interface OptimisticAction<T> {
+    optimisticValue: T;
+    revert: T;
+}
+/**
+ * optimistic provides optimistic UI updates that can be reverted on failure.
+ * The value updates immediately, then reverts if the async operation fails.
+ */
+declare function optimistic<T>(initialValue: T): [() => T, (optimisticValue: T, asyncAction: () => Promise<T>) => Promise<void>];
+/**
+ * optimisticList provides optimistic updates for array state.
+ */
+declare function optimisticList<T>(initialValue: T[]): {
+    items: () => T[];
+    addOptimistic: (item: T, asyncAction: () => Promise<T>) => Promise<void>;
+    removeOptimistic: (predicate: (item: T) => boolean, asyncAction: () => Promise<void>) => Promise<void>;
+    updateOptimistic: (predicate: (item: T) => boolean, update: Partial<T>, asyncAction: () => Promise<T>) => Promise<void>;
+};
+
+interface TimeTravelReturn<T> {
+    value: () => T;
+    set: (next: T | ((prev: T) => T)) => void;
+    undo: () => void;
+    redo: () => void;
+    canUndo: () => boolean;
+    canRedo: () => boolean;
+    history: () => T[];
+    index: () => number;
+    reset: () => void;
+    jumpTo: (index: number) => void;
+}
+/**
+ * timeline wraps a state value with undo/redo history.
+ */
+declare function timeline<T>(initial: T, maxHistory?: number): TimeTravelReturn<T>;
+
+type Middleware<S> = (state: S, action: string, payload: unknown, next: () => void) => void;
+type Selector<S, R> = (state: S) => R;
+interface GlobalStore<S extends Record<string, unknown>, A extends Record<string, (state: S, payload?: unknown) => Partial<S>>> {
+    getState: () => S;
+    select: <R>(selector: Selector<S, R>) => () => R;
+    dispatch: <K extends keyof A>(action: K, payload?: Parameters<A[K]>[1]) => void;
+    subscribe: (callback: (state: S) => void) => () => void;
+    reset: () => void;
+}
+/**
+ * globalStore creates a centralized state management store
+ * with actions, selectors, and middleware support.
+ */
+declare function globalStore<S extends Record<string, unknown>, A extends Record<string, (state: S, payload?: unknown) => Partial<S>>>(config: {
+    state: S;
+    actions: A;
+    middleware?: Middleware<S>[];
+}): GlobalStore<S, A>;
+
+/**
+ * SolidJS-style reactive primitives — standalone APIs that don't require
+ * being inside a component. These are thin wrappers around the signal system.
+ */
+/**
+ * Creates a reactive signal. Equivalent to signal but with SolidJS naming.
+ *
+ * @param value Initial value
+ * @returns Tuple [getter, setter]
+ *
+ * @example
+ * ```ts
+ * const [count, setCount] = createSignal(0);
+ * console.log(count()); // 0
+ * setCount(5);
+ * ```
+ */
+declare function createSignal<T>(value: T): [() => T, (next: T | ((prev: T) => T)) => void];
+/**
+ * Creates a derived/computed reactive value. Equivalent to derived.
+ *
+ * @param fn Computation function that reads other signals
+ * @returns Getter for the computed value
+ *
+ * @example
+ * ```ts
+ * const [count] = createSignal(5);
+ * const doubled = createMemo(() => count() * 2);
+ * console.log(doubled()); // 10
+ * ```
+ */
+declare function createMemo<T>(fn: () => T): () => T;
+/**
+ * Creates a reactive side effect. Equivalent to effect.
+ *
+ * @param fn Effect function that reads reactive signals
+ * @returns Cleanup/teardown function
+ *
+ * @example
+ * ```ts
+ * const [count] = createSignal(0);
+ * const cleanup = createEffect(() => {
+ *   console.log("Count is:", count());
+ * });
+ * ```
+ */
+declare function createEffect(fn: () => void): () => void;
+
+export { type GlobalStore, type MachineConfig, type MachineReturn, type Middleware, type OptimisticAction, type PersistOptions, type Selector, type TimeTravelReturn, createEffect, createMemo, createSignal, globalStore, machine, optimistic, optimisticList, persisted, timeline };

package/dist/patterns.js

@@ -0,0 +1,296 @@
+import {
+  RenderProp,
+  assertType,
+  composable,
+  compose,
+  createGuard,
+  createSlots,
+  defineComponent,
+  defineSlottedComponent,
+  defineStrictComponent,
+  validateProps,
+  validators,
+  withBoundary,
+  withDefaults,
+  withProps,
+  withWrapper
+} from "./chunk-XYU6TZOW.js";
+import {
+  derived
+} from "./chunk-2ABBWCGC.js";
+import {
+  effect
+} from "./chunk-AX5VEQTY.js";
+import "./chunk-MJNB47HB.js";
+import {
+  signal
+} from "./chunk-M5GNLDEO.js";
+import "./chunk-MLKGABMK.js";
+
+// src/patterns/machine.ts
+function machine(config) {
+  const [state, setState] = signal(config.initial);
+  const [context, setContext] = signal(config.context || {});
+  const initialDef = config.states[config.initial];
+  if (initialDef?.entry) {
+    initialDef.entry(context());
+  }
+  function send(event) {
+    const currentState = state();
+    const stateDef = config.states[currentState];
+    if (!stateDef?.on) return;
+    const transition = stateDef.on[event];
+    if (!transition) return;
+    let target;
+    let guard;
+    let action;
+    if (typeof transition === "string") {
+      target = transition;
+    } else {
+      target = transition.target;
+      guard = transition.guard;
+      action = transition.action;
+    }
+    const ctx = context();
+    if (guard && !guard(ctx)) return;
+    if (stateDef.exit) {
+      stateDef.exit(ctx);
+    }
+    if (action) {
+      const patch = action(ctx);
+      setContext({ ...ctx, ...patch });
+    }
+    setState(target);
+    const targetDef = config.states[target];
+    if (targetDef?.entry) {
+      targetDef.entry(context());
+    }
+  }
+  function matches(s) {
+    return state() === s;
+  }
+  function can(event) {
+    const currentState = state();
+    const stateDef = config.states[currentState];
+    if (!stateDef?.on) return false;
+    const transition = stateDef.on[event];
+    if (!transition) return false;
+    if (typeof transition === "string") return true;
+    if (transition.guard) {
+      return transition.guard(context());
+    }
+    return true;
+  }
+  return { state, context, send, matches, can };
+}
+
+// src/patterns/persist.ts
+function persisted(key, initial, options = {}) {
+  const storage = options.session ? sessionStorage : localStorage;
+  const serialize = options.serialize || JSON.stringify;
+  const deserialize = options.deserialize || JSON.parse;
+  let restored = initial;
+  try {
+    const raw = storage.getItem(key);
+    if (raw !== null) {
+      const parsed = deserialize(raw);
+      restored = options.validate && !options.validate(parsed) ? initial : parsed;
+    }
+  } catch {
+  }
+  const [value, setValue] = signal(restored);
+  effect(() => {
+    const current = value();
+    try {
+      storage.setItem(key, serialize(current));
+    } catch {
+    }
+  });
+  return [value, setValue];
+}
+
+// src/patterns/optimistic.ts
+function optimistic(initialValue) {
+  const [value, setValue] = signal(initialValue);
+  const [_pending, setPending] = signal(false);
+  async function addOptimistic(optimisticValue, asyncAction) {
+    const previousValue = value();
+    setValue(optimisticValue);
+    setPending(true);
+    try {
+      const result = await asyncAction();
+      setValue(result);
+    } catch {
+      setValue(previousValue);
+    } finally {
+      setPending(false);
+    }
+  }
+  return [value, addOptimistic];
+}
+function optimisticList(initialValue) {
+  const [items, setItems] = signal([...initialValue]);
+  async function addOptimistic(item, asyncAction) {
+    const prev = items();
+    setItems([...prev, item]);
+    try {
+      const result = await asyncAction();
+      setItems([...prev, result]);
+    } catch {
+      setItems(prev);
+    }
+  }
+  async function removeOptimistic(predicate, asyncAction) {
+    const prev = items();
+    setItems(prev.filter((item) => !predicate(item)));
+    try {
+      await asyncAction();
+    } catch {
+      setItems(prev);
+    }
+  }
+  async function updateOptimistic(predicate, update, asyncAction) {
+    const prev = items();
+    setItems(prev.map((item) => predicate(item) ? { ...item, ...update } : item));
+    try {
+      const result = await asyncAction();
+      setItems(prev.map((item) => predicate(item) ? result : item));
+    } catch {
+      setItems(prev);
+    }
+  }
+  return { items, addOptimistic, removeOptimistic, updateOptimistic };
+}
+
+// src/patterns/timeTravel.ts
+function timeline(initial, maxHistory = 100) {
+  const [history, setHistory] = signal([initial]);
+  const [index, setIndex] = signal(0);
+  const value = derived(() => history()[index()]);
+  const canUndo = derived(() => index() > 0);
+  const canRedo = derived(() => index() < history().length - 1);
+  function set(next) {
+    const current = value();
+    const newValue = typeof next === "function" ? next(current) : next;
+    if (Object.is(newValue, current)) return;
+    const hist = history();
+    const idx = index();
+    const newHistory = hist.slice(0, idx + 1);
+    newHistory.push(newValue);
+    if (newHistory.length > maxHistory) {
+      newHistory.shift();
+      setHistory(newHistory);
+      setIndex(newHistory.length - 1);
+    } else {
+      setHistory(newHistory);
+      setIndex(idx + 1);
+    }
+  }
+  function undo() {
+    if (canUndo()) {
+      setIndex(index() - 1);
+    }
+  }
+  function redo() {
+    if (canRedo()) {
+      setIndex(index() + 1);
+    }
+  }
+  function reset() {
+    setHistory([initial]);
+    setIndex(0);
+  }
+  function jumpTo(targetIndex) {
+    const hist = history();
+    if (targetIndex >= 0 && targetIndex < hist.length) {
+      setIndex(targetIndex);
+    }
+  }
+  return { value, set, undo, redo, canUndo, canRedo, history, index, reset, jumpTo };
+}
+
+// src/patterns/globalStore.ts
+function globalStore(config) {
+  const initialState = { ...config.state };
+  const [getState, setState] = signal({ ...initialState });
+  const listeners = /* @__PURE__ */ new Set();
+  const middlewares = config.middleware || [];
+  function dispatch(action, payload) {
+    const actionFn = config.actions[action];
+    if (!actionFn) throw new Error(`Unknown action: ${String(action)}`);
+    const execute = () => {
+      const current = getState();
+      const patch = actionFn(current, payload);
+      setState({ ...current, ...patch });
+      const newState = getState();
+      for (const listener of listeners) {
+        listener(newState);
+      }
+    };
+    if (middlewares.length === 0) {
+      execute();
+      return;
+    }
+    let index = 0;
+    const next = () => {
+      if (index < middlewares.length) {
+        const mw = middlewares[index++];
+        mw(getState(), String(action), payload, next);
+      } else {
+        execute();
+      }
+    };
+    next();
+  }
+  function select(selector) {
+    return derived(() => selector(getState()));
+  }
+  function subscribe(callback) {
+    listeners.add(callback);
+    return () => listeners.delete(callback);
+  }
+  function reset() {
+    setState({ ...initialState });
+    for (const listener of listeners) {
+      listener(getState());
+    }
+  }
+  return { getState, select, dispatch, subscribe, reset };
+}
+
+// src/patterns/primitives.ts
+function createSignal(value) {
+  return signal(value);
+}
+function createMemo(fn) {
+  return derived(fn);
+}
+function createEffect(fn) {
+  return effect(fn);
+}
+export {
+  RenderProp,
+  assertType,
+  composable,
+  compose,
+  createEffect,
+  createGuard,
+  createMemo,
+  createSignal,
+  createSlots,
+  defineComponent,
+  defineSlottedComponent,
+  defineStrictComponent,
+  globalStore,
+  machine,
+  optimistic,
+  optimisticList,
+  persisted,
+  timeline,
+  validateProps,
+  validators,
+  withBoundary,
+  withDefaults,
+  withProps,
+  withWrapper
+};