@epoch32/visage 1.3.0 → 1.3.1

package/dist/{index-5s255b3w.js → index-xby428n5.js}

@@ -7,12 +7,13 @@ import {
   runInScope2,
   getActiveScope2,
   useContext2,
-  effect2
-} from "./index-6kfe1nr4.js";
+  effect2,
+  signal2
+} from "./index-1yhbg34h.js";
 import {
   SuspenseContext2,
   createResource2
-} from "./index-a4xns6cc.js";
+} from "./index-65j7a9et.js";
 
 // src/dom/lazy.ts
 function lazy2(importer) {
@@ -176,26 +177,24 @@ function For2(props) {
     const newItems = [];
     const prevMap = new Map;
     for (const rec of items) {
-      prevMap.set(rec.item, rec);
+      const group = prevMap.get(rec.item);
+      if (group) {
+        group.push(rec);
+      } else {
+        prevMap.set(rec.item, [rec]);
+      }
     }
     for (let i = 0;i < list.length; i++) {
       const item = list[i];
-      const existing = prevMap.get(item);
+      const existingGroup = prevMap.get(item);
+      const existing = existingGroup && existingGroup.length > 0 ? existingGroup.shift() : undefined;
       if (existing) {
-        existing.indexSignal(i);
+        untrack2(() => {
+          existing.indexSignal.set(i);
+        });
         newItems.push(existing);
-        prevMap.delete(item);
       } else {
-        let indexVal = i;
-        const indexSubscribers = new Set;
-        const indexSignal = (...args) => {
-          if (args.length > 0 && args[0] !== undefined && args[0] !== indexVal) {
-            indexVal = args[0];
-            for (const sub of Array.from(indexSubscribers))
-              sub();
-          }
-          return indexVal;
-        };
+        const indexSignal = signal2(i, { internal: true });
         const itemScope = new Scope2(getActiveScope2());
         let itemNodes = [];
         untrack2(() => {
@@ -214,11 +213,13 @@ function For2(props) {
         });
       }
     }
-    for (const [, removed] of prevMap) {
-      removed.scope.dispose();
-      for (const node of removed.nodes) {
-        if (node.parentNode)
-          node.parentNode.removeChild(node);
+    for (const [, remainingGroup] of prevMap) {
+      for (const removed of remainingGroup) {
+        removed.scope.dispose();
+        for (const node of removed.nodes) {
+          if (node.parentNode)
+            node.parentNode.removeChild(node);
+        }
       }
     }
     if (marker.parentNode) {

package/dist/{index-x2rs3vab.js → index-y3nprgn7.js}

@@ -2,7 +2,7 @@ import {
   insertChild2,
   onCleanup2,
   createRoot2
-} from "./index-6kfe1nr4.js";
+} from "./index-1yhbg34h.js";
 
 // src/server/hydrate.ts
 function hydrate2(fn, container) {

package/dist/index.js

@@ -40,7 +40,7 @@ import {
   createStore2,
   mutateStore2,
   unwrapStore2
-} from "./index-6kfe1nr4.js";
+} from "./index-1yhbg34h.js";
 import {
   createApiClient2,
   buildFileRouter2,
@@ -49,24 +49,24 @@ import {
   defineMiddleware2,
   ProcedureBuilder2,
   procedure2
-} from "./index-061jf06a.js";
+} from "./index-cgepvvd4.js";
 import {
   lazy2,
   Show2,
   For2,
   Portal2
-} from "./index-5s255b3w.js";
-import"./index-9fvarkrx.js";
+} from "./index-xby428n5.js";
+import"./index-3y73zgbk.js";
 import {
   DevToolsHub2,
   devtoolsHub2,
   highlightElement2,
   VisageDevTools2,
   connectDevTools2
-} from "./index-zr6cvset.js";
+} from "./index-ptj8rt6b.js";
 import {
   createForm2
-} from "./index-h6tjqk6e.js";
+} from "./index-1jcd8gjf.js";
 import"./index-921pn75b.js";
 import {
   Router2,
@@ -77,7 +77,7 @@ import {
   useNavigate2,
   useParams2,
   useSearchParams2
-} from "./index-grhdtcb5.js";
+} from "./index-0qat98zs.js";
 import {
   createClient2,
   RouterImpl2,
@@ -85,17 +85,17 @@ import {
   query3,
   mutation3,
   subscription3
-} from "./index-df5e614s.js";
+} from "./index-awcrz19g.js";
 import {
   hydrate2,
   renderChildToString2,
   renderToString2,
   renderToStream2
-} from "./index-x2rs3vab.js";
+} from "./index-y3nprgn7.js";
 import {
   template2,
   html2
-} from "./index-js199er4.js";
+} from "./index-g1drdx7k.js";
 import {
   useAccordionContext2,
   useAccordionItemContext2,
@@ -152,12 +152,12 @@ import {
   ToastDescription2,
   ToastClose2,
   Toast2
-} from "./index-dvq5f3s8.js";
+} from "./index-aagpn02x.js";
 import {
   createVirtualizer2,
   VirtualList2,
   VirtualGrid2
-} from "./index-8czhpea8.js";
+} from "./index-x6whpv54.js";
 import {
   ChartContext2,
   useChartContext2,
@@ -179,7 +179,7 @@ import {
   Line2,
   Pie2,
   ChartTooltip2
-} from "./index-dyvgtp43.js";
+} from "./index-9bez1tmf.js";
 import {
   createId2,
   createControllableSignal2,
@@ -198,7 +198,7 @@ import {
   Tooltip3,
   SwitchThumb2,
   Switch2
-} from "./index-8x8xz80v.js";
+} from "./index-b7emqmej.js";
 import {
   ERROR_CODE_TO_STATUS2,
   STATUS_TO_ERROR_CODE2,
@@ -228,7 +228,7 @@ import {
   createMutation2,
   createQuery2,
   createInfiniteQuery2
-} from "./index-y9bq7h9g.js";
+} from "./index-5jhzwtdz.js";
 import {
   hashString2,
   getScopeId2,
@@ -241,19 +241,19 @@ import {
   css2,
   useStyle2,
   Style2
-} from "./index-0madxn60.js";
+} from "./index-enc8cmea.js";
 import {
   Stack2,
   Row2,
   Center2,
   Grid2,
   Spacer2
-} from "./index-1xtrtz1t.js";
+} from "./index-dmhmde2z.js";
 import {
   createResource2,
   Suspense2,
   ErrorBoundary2
-} from "./index-a4xns6cc.js";
+} from "./index-65j7a9et.js";
 export {
   Accordion2 as Accordion,
   AccordionContent2 as AccordionContent,

package/dist/jsx-runtime/index.js

@@ -3,10 +3,10 @@ import {
   jsx2,
   jsxs2,
   jsxDEV2
-} from "../index-9fvarkrx.js";
-import"../index-5s255b3w.js";
-import"../index-a4xns6cc.js";
-import"../index-6kfe1nr4.js";
+} from "../index-3y73zgbk.js";
+import"../index-xby428n5.js";
+import"../index-65j7a9et.js";
+import"../index-1yhbg34h.js";
 export {
   Fragment2 as Fragment,
   jsx2 as jsx,

package/dist/query/index.js

@@ -21,9 +21,9 @@ import {
   createMutation2,
   createQuery2,
   createInfiniteQuery2
-} from "../index-y9bq7h9g.js";
-import"../index-a4xns6cc.js";
-import"../index-6kfe1nr4.js";
+} from "../index-5jhzwtdz.js";
+import"../index-65j7a9et.js";
+import"../index-1yhbg34h.js";
 export {
   FocusManager2 as FocusManager,
   Mutation2 as Mutation,

package/dist/router/index.js

@@ -7,13 +7,13 @@ import {
   useNavigate2,
   useParams2,
   useSearchParams2
-} from "../index-grhdtcb5.js";
-import"../index-9fvarkrx.js";
+} from "../index-0qat98zs.js";
+import"../index-3y73zgbk.js";
 import {
   lazy2
-} from "../index-5s255b3w.js";
-import"../index-a4xns6cc.js";
-import"../index-6kfe1nr4.js";
+} from "../index-xby428n5.js";
+import"../index-65j7a9et.js";
+import"../index-1yhbg34h.js";
 export {
   Link2 as Link,
   Route2 as Route,

package/dist/rpc/index.js

@@ -5,7 +5,7 @@ import {
   query3,
   mutation3,
   subscription3
-} from "../index-df5e614s.js";
+} from "../index-awcrz19g.js";
 import {
   ERROR_CODE_TO_STATUS2,
   STATUS_TO_ERROR_CODE2,
@@ -19,9 +19,9 @@ import {
   validateWithSchema2,
   v2
 } from "../index-2zz0g2n2.js";
-import"../index-y9bq7h9g.js";
-import"../index-a4xns6cc.js";
-import"../index-6kfe1nr4.js";
+import"../index-5jhzwtdz.js";
+import"../index-65j7a9et.js";
+import"../index-1yhbg34h.js";
 export {
   ERROR_CODE_TO_STATUS2 as ERROR_CODE_TO_STATUS,
   RPCError2 as RPCError,

package/dist/server/index.js

@@ -3,8 +3,8 @@ import {
   renderChildToString2,
   renderToString2,
   renderToStream2
-} from "../index-x2rs3vab.js";
-import"../index-6kfe1nr4.js";
+} from "../index-y3nprgn7.js";
+import"../index-1yhbg34h.js";
 export {
   hydrate2 as hydrate,
   renderChildToString2 as renderChildToString,

package/dist/signals/index.js

@@ -24,7 +24,7 @@ import {
   createStore2,
   mutateStore2,
   unwrapStore2
-} from "../index-6kfe1nr4.js";
+} from "../index-1yhbg34h.js";
 export {
   COMPUTED_BRAND2 as COMPUTED_BRAND,
   Computed2 as Computed,

package/dist/signals/system.d.ts

@@ -14,6 +14,8 @@ export declare function setCurrentScope(scope: any): void;
 export declare function getCurrentScope(): any;
 export declare function addPendingEffect(eff: any): void;
 export declare function removePendingEffect(eff: any): void;
+export declare function getBatchDepth(): number;
+export declare function getIsFlushing(): boolean;
 export declare function flushEffects(): void;
 /**
  * Batch multiple signal mutations so downstreams and effects update synchronously once at completion.

package/dist/style/index.js

@@ -16,9 +16,9 @@ import {
   radius2,
   glass2,
   formatStyleProp2
-} from "../index-6kfe1nr4.js";
-import"../index-5s255b3w.js";
-import"../index-9fvarkrx.js";
+} from "../index-1yhbg34h.js";
+import"../index-xby428n5.js";
+import"../index-3y73zgbk.js";
 import {
   hashString2,
   getScopeId2,
@@ -32,15 +32,15 @@ import {
   css2,
   useStyle2,
   Style2
-} from "../index-0madxn60.js";
+} from "../index-enc8cmea.js";
 import {
   Stack2,
   Row2,
   Center2,
   Grid2,
   Spacer2
-} from "../index-1xtrtz1t.js";
-import"../index-a4xns6cc.js";
+} from "../index-dmhmde2z.js";
+import"../index-65j7a9et.js";
 export {
   Center2 as Center,
   DIMENSION_KEYWORDS2 as DIMENSION_KEYWORDS,

package/dist/template/index.js

@@ -1,8 +1,8 @@
 import {
   template2,
   html2
-} from "../index-js199er4.js";
-import"../index-6kfe1nr4.js";
+} from "../index-g1drdx7k.js";
+import"../index-1yhbg34h.js";
 export {
   html2 as html,
   template2 as template

package/dist/ui/index.js

@@ -54,7 +54,7 @@ import {
   ToastDescription2,
   ToastClose2,
   Toast2
-} from "../index-dvq5f3s8.js";
+} from "../index-aagpn02x.js";
 import {
   createId2,
   createControllableSignal2,
@@ -73,18 +73,18 @@ import {
   Tooltip3,
   SwitchThumb2,
   Switch2
-} from "../index-8x8xz80v.js";
+} from "../index-b7emqmej.js";
 import {
   Stack2,
   Row2,
   Center2,
   Grid2,
   Spacer2
-} from "../index-1xtrtz1t.js";
-import"../index-9fvarkrx.js";
-import"../index-5s255b3w.js";
-import"../index-a4xns6cc.js";
-import"../index-6kfe1nr4.js";
+} from "../index-dmhmde2z.js";
+import"../index-3y73zgbk.js";
+import"../index-xby428n5.js";
+import"../index-65j7a9et.js";
+import"../index-1yhbg34h.js";
 export {
   Accordion2 as Accordion,
   AccordionContent2 as AccordionContent,

package/dist/virtual/index.js

@@ -2,11 +2,11 @@ import {
   createVirtualizer2,
   VirtualList2,
   VirtualGrid2
-} from "../index-8czhpea8.js";
-import"../index-9fvarkrx.js";
-import"../index-5s255b3w.js";
-import"../index-a4xns6cc.js";
-import"../index-6kfe1nr4.js";
+} from "../index-x6whpv54.js";
+import"../index-3y73zgbk.js";
+import"../index-xby428n5.js";
+import"../index-65j7a9et.js";
+import"../index-1yhbg34h.js";
 export {
   VirtualGrid2 as VirtualGrid,
   VirtualList2 as VirtualList,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epoch32/visage",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "description": "Lightning-fast, zero-VDOM, fine-grained reactive UI library with full TypeScript support",
   "type": "module",
   "main": "./dist/index.js",

package/src/dom/control-flow.ts

@@ -1,4 +1,13 @@
-import { effect, getActiveScope, onCleanup, runInScope, Scope, untrack } from "../signals";
+import {
+  effect,
+  getActiveScope,
+  onCleanup,
+  runInScope,
+  Scope,
+  signal,
+  untrack,
+  type WritableSignal
+} from "../signals";
 import { type Child, insertChild, type ReactiveValue, resolveValue } from "./render";
 
 export interface ShowProps<T> {
@@ -120,7 +129,7 @@ interface ItemRecord<T> {
   item: T;
   scope: Scope;
   nodes: Node[];
-  indexSignal: (val?: number) => number;
+  indexSignal: WritableSignal<number>;
 }
 
 /**
@@ -206,32 +215,31 @@ export function For<T>(props: ForProps<T>): any {
     if (!parent) return;
 
     const newItems: ItemRecord<T>[] = [];
-    const prevMap = new Map<T, ItemRecord<T>>();
+    const prevMap = new Map<T, ItemRecord<T>[]>();
 
     for (const rec of items) {
-      prevMap.set(rec.item, rec);
+      const group = prevMap.get(rec.item);
+      if (group) {
+        group.push(rec);
+      } else {
+        prevMap.set(rec.item, [rec]);
+      }
     }
 
     // Fast-path: map existing or create new item scopes
     for (let i = 0; i < list.length; i++) {
       const item = list[i]!;
-      const existing = prevMap.get(item);
+      const existingGroup = prevMap.get(item);
+      const existing =
+        existingGroup && existingGroup.length > 0 ? existingGroup.shift() : undefined;
 
       if (existing) {
-        existing.indexSignal(i);
+        untrack(() => {
+          existing.indexSignal.set(i);
+        });
         newItems.push(existing);
-        prevMap.delete(item);
       } else {
-        let indexVal = i;
-        const indexSubscribers = new Set<() => void>();
-        const indexSignal = (...args: [number?]): number => {
-          if (args.length > 0 && args[0] !== undefined && args[0] !== indexVal) {
-            indexVal = args[0];
-            for (const sub of Array.from(indexSubscribers)) sub();
-          }
-          return indexVal;
-        };
-
+        const indexSignal = signal(i, { internal: true });
         const itemScope = new Scope(getActiveScope());
         let itemNodes: Node[] = [];
 
@@ -254,10 +262,12 @@ export function For<T>(props: ForProps<T>): any {
     }
 
     // Clean up removed items
-    for (const [, removed] of prevMap) {
-      removed.scope.dispose();
-      for (const node of removed.nodes) {
-        if (node.parentNode) node.parentNode.removeChild(node);
+    for (const [, remainingGroup] of prevMap) {
+      for (const removed of remainingGroup) {
+        removed.scope.dispose();
+        for (const node of removed.nodes) {
+          if (node.parentNode) node.parentNode.removeChild(node);
+        }
       }
     }
 

package/src/form/form.ts

@@ -54,6 +54,32 @@ export function createForm<T extends Record<string, any> = Record<string, any>>(
   const submitCount = signal(0);
   const customErrors = signal<Partial<Record<keyof T, string>>>({});
 
+  const getValues = (): T => {
+    const res: Record<string, any> = {};
+    for (const key in fields) {
+      res[key] = (fields as any)[key].value();
+    }
+    return res as T;
+  };
+
+  const schemaValidation = computed(() => {
+    if (!options.schema) {
+      return { success: true, issuesMap: new Map<string, string>() };
+    }
+    const currentValues = getValues();
+    const res = validateWithSchema(options.schema, currentValues);
+    const issuesMap = new Map<string, string>();
+    if (!res.success && res.issues) {
+      for (const issue of res.issues) {
+        const pathKey = String(issue.path);
+        if (!issuesMap.has(pathKey)) {
+          issuesMap.set(pathKey, issue.message);
+        }
+      }
+    }
+    return { success: res.success, issuesMap };
+  });
+
   for (const key in initialValues) {
     const initVal = initialValues[key];
     const valSignal = signal(initVal);
@@ -74,25 +100,12 @@ export function createForm<T extends Record<string, any> = Record<string, any>>(
 
         if (!options.schema) return null;
 
-        const currentValues = getValues();
-        const res = validateWithSchema(options.schema, currentValues);
-        if (!res.success && res.issues) {
-          const match = res.issues.find((i) => i.path === key || i.path === `${key}`);
-          return match ? match.message : null;
-        }
-        return null;
+        const validation = schemaValidation();
+        return validation.issuesMap.get(key) ?? validation.issuesMap.get(String(key)) ?? null;
       })
     };
   }
 
-  const getValues = (): T => {
-    const res: Record<string, any> = {};
-    for (const key in fields) {
-      res[key] = (fields as any)[key].value();
-    }
-    return res as T;
-  };
-
   const errors = computed<Partial<Record<keyof T, string>>>(() => {
     const errMap: Partial<Record<keyof T, string>> = {};
     for (const key in fields) {
@@ -118,8 +131,7 @@ export function createForm<T extends Record<string, any> = Record<string, any>>(
 
   const validate = (): boolean => {
     if (!options.schema) return true;
-    const res = validateWithSchema(options.schema, getValues());
-    return res.success;
+    return schemaValidation().success;
   };
 
   const handleSubmit = async (e?: Event): Promise<boolean> => {

package/src/signals/effect.ts

@@ -5,8 +5,8 @@ import { Computed } from "./computed";
 import type { Scope } from "./scope";
 import {
   addPendingEffect,
-  batchDepth,
   flushEffects,
+  getBatchDepth,
   getCurrentScope,
   getCurrentSubscriber,
   removePendingEffect,
@@ -57,7 +57,7 @@ export class Effect implements ISubscriber {
     this.state = targetState;
     addPendingEffect(this);
 
-    if (batchDepth === 0) {
+    if (getBatchDepth() === 0) {
       flushEffects();
     }
   }

package/src/signals/scope.ts

@@ -1,7 +1,7 @@
 /**
  * Visage Reactive Scope & Lifecycle Management
  */
-import { currentScope, currentSubscriber, getCurrentScope, setCurrentScope } from "./system";
+import { getCurrentScope, getCurrentSubscriber, setCurrentScope } from "./system";
 import type { CleanupFn, ISubscriber } from "./types";
 
 /**
@@ -14,7 +14,7 @@ export class Scope {
   isDisposed = false;
   context?: Map<symbol, any>;
 
-  constructor(parent: Scope | null = currentScope) {
+  constructor(parent: Scope | null = getCurrentScope()) {
     this.parent = parent;
     if (parent && !parent.isDisposed) {
       parent.cleanups.push(() => this.dispose());
@@ -72,10 +72,12 @@ export class Scope {
  * ```
  */
 export function onCleanup(fn: CleanupFn): void {
-  if (currentSubscriber && "addCleanup" in currentSubscriber) {
-    (currentSubscriber as any).addCleanup(fn);
-  } else if (currentScope) {
-    currentScope.addCleanup(fn);
+  const curSub = getCurrentSubscriber();
+  const curScope = getCurrentScope();
+  if (curSub && "addCleanup" in curSub) {
+    (curSub as any).addCleanup(fn);
+  } else if (curScope) {
+    curScope.addCleanup(fn);
   }
 }
 
@@ -101,7 +103,7 @@ export function onCleanup(fn: CleanupFn): void {
  * @returns The return value of `fn`
  */
 export function createRoot<T>(fn: (dispose: () => void) => T): T {
-  const prevScope = currentScope;
+  const prevScope = getCurrentScope();
   const scope = new Scope(null);
   setCurrentScope(scope);
   try {
@@ -115,7 +117,7 @@ export function createRoot<T>(fn: (dispose: () => void) => T): T {
  * Run a function with a specified reactive scope active.
  */
 export function runInScope<T>(scope: Scope | null, fn: () => T): T {
-  const prevScope = currentScope;
+  const prevScope = getCurrentScope();
   setCurrentScope(scope);
   try {
     return fn();