lightview 2.2.2 → 2.3.4

package/lightview-cdom.js

@@ -17,6 +17,9 @@ var LightviewCDOM = function(exports) {
   };
   const registerHelper = (name, fn, options = {}) => {
     helpers.set(name, fn);
+    if (globalThis.__LIGHTVIEW_INTERNALS__) {
+      globalThis.__LIGHTVIEW_INTERNALS__.helpers.set(name, fn);
+    }
     if (options) helperOptions.set(name, options);
   };
   const registerOperator = (helperName, symbol, position, precedence) => {
@@ -31,7 +34,7 @@ var LightviewCDOM = function(exports) {
     operators[position].set(symbol, { helper: helperName, precedence: prec });
   };
   const getLV = () => globalThis.Lightview || null;
-  const getRegistry$1 = () => {
+  const getRegistry = () => {
     var _a;
     return ((_a = getLV()) == null ? void 0 : _a.registry) || null;
   };
@@ -88,21 +91,14 @@ var LightviewCDOM = function(exports) {
   };
   const resolvePath = (path, context) => {
     if (typeof path !== "string") return path;
-    const registry = getRegistry$1();
+    const registry = getRegistry();
     if (path === ".") return unwrapSignal(context);
-    if (path.startsWith("$/")) {
+    if (path.startsWith("=/")) {
       const [rootName, ...rest] = path.slice(2).split("/");
-      let cur = context;
-      while (cur) {
-        const localState = cur.__state__;
-        if (localState && rootName in localState) {
-          return traverse(localState[rootName], rest);
-        }
-        cur = cur.__parent__;
-      }
-      const rootSignal = registry == null ? void 0 : registry.get(rootName);
-      if (!rootSignal) return void 0;
-      return traverse(rootSignal, rest);
+      const LV = getLV();
+      const root = LV ? LV.get(rootName, { scope: (context == null ? void 0 : context.__node__) || context }) : registry == null ? void 0 : registry.get(rootName);
+      if (!root) return void 0;
+      return traverse(root, rest);
     }
     if (path.startsWith("./")) {
       return traverse(context, path.slice(2).split("/"));
@@ -123,22 +119,15 @@ var LightviewCDOM = function(exports) {
   };
   const resolvePathAsContext = (path, context) => {
     if (typeof path !== "string") return path;
-    const registry = getRegistry$1();
+    const registry = getRegistry();
     if (path === ".") return context;
-    if (path.startsWith("$/")) {
+    if (path.startsWith("=/")) {
       const segments = path.slice(2).split(/[/.]/);
       const rootName = segments.shift();
-      let cur = context;
-      while (cur) {
-        const localState = cur.__state__;
-        if (localState && rootName in localState) {
-          return traverseAsContext(localState[rootName], segments);
-        }
-        cur = cur.__parent__;
-      }
-      const rootSignal = registry == null ? void 0 : registry.get(rootName);
-      if (!rootSignal) return void 0;
-      return traverseAsContext(rootSignal, segments);
+      const LV = getLV();
+      const root = LV ? LV.get(rootName, { scope: (context == null ? void 0 : context.__node__) || context }) : registry == null ? void 0 : registry.get(rootName);
+      if (!root) return void 0;
+      return traverseAsContext(root, segments);
     }
     if (path.startsWith("./")) {
       return traverseAsContext(context, path.slice(2).split(/[\/.]/));
@@ -166,6 +155,7 @@ var LightviewCDOM = function(exports) {
       return this.fn(context);
     }
   }
+  const isNode = (val) => val && typeof val === "object" && globalThis.Node && val instanceof globalThis.Node;
   const resolveArgument = (arg, context, globalMode = false) => {
     if (arg.startsWith("'") && arg.endsWith("'") || arg.startsWith('"') && arg.endsWith('"')) {
       return { value: arg.slice(1, -1), isLiteral: true };
@@ -186,9 +176,21 @@ var LightviewCDOM = function(exports) {
         isLazy: true
       };
     }
+    if (arg === "$this" || arg.startsWith("$this/") || arg.startsWith("$this.")) {
+      return {
+        value: new LazyValue((context2) => {
+          const node = (context2 == null ? void 0 : context2.__node__) || context2;
+          if (arg === "$this") return node;
+          const path = arg.startsWith("$this.") ? arg.slice(6) : arg.slice(6);
+          return resolvePath(path, node);
+        }),
+        isLazy: true
+      };
+    }
     if (arg === "$event" || arg.startsWith("$event/") || arg.startsWith("$event.")) {
       return {
-        value: new LazyValue((event) => {
+        value: new LazyValue((context2) => {
+          const event = (context2 == null ? void 0 : context2.$event) || (context2 == null ? void 0 : context2.event) || context2;
           if (arg === "$event") return event;
           const path = arg.startsWith("$event.") ? arg.slice(7) : arg.slice(7);
           return resolvePath(path, event);
@@ -201,11 +203,23 @@ var LightviewCDOM = function(exports) {
         const data = parseJPRX(arg);
         const resolveTemplate = (node, context2) => {
           if (typeof node === "string") {
-            if (node.startsWith("$")) {
+            if (node.startsWith("=")) {
               const res = resolveExpression(node, context2);
               const final = res instanceof LazyValue ? res.resolve(context2) : res;
               return unwrapSignal(final);
             }
+            if (node === "$this" || node.startsWith("$this/") || node.startsWith("$this.")) {
+              const path = node.startsWith("$this.") || node.startsWith("$this/") ? node.slice(6) : node.slice(6);
+              const ctxNode = (context2 == null ? void 0 : context2.__node__) || context2;
+              const res = node === "$this" ? ctxNode : resolvePath(path, ctxNode);
+              return unwrapSignal(res);
+            }
+            if (node === "$event" || node.startsWith("$event/") || node.startsWith("$event.")) {
+              const path = node.startsWith("$event.") || node.startsWith("$event/") ? node.slice(7) : node.slice(7);
+              const event = (context2 == null ? void 0 : context2.$event) || (context2 == null ? void 0 : context2.event) || (context2 && !isNode(context2) ? context2 : null);
+              const res = node === "$event" ? event : resolvePath(path, event);
+              return unwrapSignal(res);
+            }
             if (node === "_" || node.startsWith("_/") || node.startsWith("_.")) {
               const path = node.startsWith("_.") || node.startsWith("_/") ? node.slice(2) : node.slice(2);
               const res = node === "_" ? context2 : resolvePath(path, context2);
@@ -223,7 +237,7 @@ var LightviewCDOM = function(exports) {
         };
         const hasReactive = (obj) => {
           if (typeof obj === "string") {
-            return obj.startsWith("$") || obj.startsWith("_") || obj.startsWith("../");
+            return obj.startsWith("=") || obj.startsWith("_") || obj.startsWith("../");
           }
           if (Array.isArray(obj)) return obj.some(hasReactive);
           if (obj && typeof obj === "object") return Object.values(obj).some(hasReactive);
@@ -242,9 +256,9 @@ var LightviewCDOM = function(exports) {
     if (arg.includes("(")) {
       let nestedExpr = arg;
       if (arg.startsWith("/")) {
-        nestedExpr = "$" + arg;
-      } else if (globalMode && !arg.startsWith("$") && !arg.startsWith("./")) {
-        nestedExpr = `$/${arg}`;
+        nestedExpr = "=" + arg;
+      } else if (globalMode && !arg.startsWith("=") && !arg.startsWith("./")) {
+        nestedExpr = `=/${arg}`;
       }
       const val = resolveExpression(nestedExpr, context);
       if (val instanceof LazyValue) {
@@ -254,11 +268,11 @@ var LightviewCDOM = function(exports) {
     }
     let normalizedPath;
     if (arg.startsWith("/")) {
-      normalizedPath = "$" + arg;
-    } else if (arg.startsWith("$") || arg.startsWith("./") || arg.startsWith("../")) {
+      normalizedPath = "=" + arg;
+    } else if (arg.startsWith("=") || arg.startsWith("./") || arg.startsWith("../")) {
       normalizedPath = arg;
     } else if (globalMode) {
-      normalizedPath = `$/${arg}`;
+      normalizedPath = `=/${arg}`;
     } else {
       normalizedPath = `./${arg}`;
     }
@@ -303,6 +317,8 @@ var LightviewCDOM = function(exports) {
     // ... suffix
     PLACEHOLDER: "PLACEHOLDER",
     // _, _/path
+    THIS: "THIS",
+    // $this
     EVENT: "EVENT",
     // $event, $event.target
     EOF: "EOF"
@@ -325,15 +341,16 @@ var LightviewCDOM = function(exports) {
         i++;
         continue;
       }
-      if (expr[i] === "$" && i + 1 < len2) {
-        let isOpAfter = false;
-        for (const op of opSymbols) {
+      if (expr[i] === "=" && i + 1 < len2) {
+        const prefixOps = [...operators.prefix.keys()].sort((a, b) => b.length - a.length);
+        let isPrefixOp = false;
+        for (const op of prefixOps) {
           if (expr.slice(i + 1, i + 1 + op.length) === op) {
-            isOpAfter = true;
+            isPrefixOp = true;
             break;
           }
         }
-        if (isOpAfter) {
+        if (isPrefixOp) {
           i++;
           continue;
         }
@@ -369,7 +386,7 @@ var LightviewCDOM = function(exports) {
             continue;
           }
           const validBefore = /[\s)]/.test(before) || i === 0 || tokens.length === 0 || tokens[tokens.length - 1].type === TokenType.LPAREN || tokens[tokens.length - 1].type === TokenType.COMMA || tokens[tokens.length - 1].type === TokenType.OPERATOR;
-          const validAfter = /[\s($./'"0-9_]/.test(after) || i + op.length >= len2 || opSymbols.some((o) => expr.slice(i + op.length).startsWith(o));
+          const validAfter = /[\s(=./'"0-9_]/.test(after) || i + op.length >= len2 || opSymbols.some((o) => expr.slice(i + op.length).startsWith(o));
           if (validBefore || validAfter) {
             matchedOp = op;
             break;
@@ -425,6 +442,16 @@ var LightviewCDOM = function(exports) {
         tokens.push({ type: TokenType.PLACEHOLDER, value: placeholder });
         continue;
       }
+      if (expr.slice(i, i + 5) === "$this") {
+        let thisPath = "$this";
+        i += 5;
+        while (i < len2 && /[a-zA-Z0-9_./]/.test(expr[i])) {
+          thisPath += expr[i];
+          i++;
+        }
+        tokens.push({ type: TokenType.THIS, value: thisPath });
+        continue;
+      }
       if (expr.slice(i, i + 6) === "$event") {
         let eventPath = "$event";
         i += 6;
@@ -435,7 +462,7 @@ var LightviewCDOM = function(exports) {
         tokens.push({ type: TokenType.EVENT, value: eventPath });
         continue;
       }
-      if (expr[i] === "$" || expr[i] === "." || expr[i] === "/") {
+      if (expr[i] === "=" || expr[i] === "." || expr[i] === "/") {
         let path = "";
         while (i < len2) {
           let isOp = false;
@@ -495,7 +522,7 @@ var LightviewCDOM = function(exports) {
   const hasOperatorSyntax = (expr) => {
     if (!expr || typeof expr !== "string") return false;
     if (expr.includes("(")) return false;
-    if (/^\$(\+\+|--|!!)\/?/.test(expr)) {
+    if (/^=(\+\+|--|!!)\/?/.test(expr)) {
       return true;
     }
     if (/(\+\+|--)$/.test(expr)) {
@@ -558,6 +585,9 @@ var LightviewCDOM = function(exports) {
           tok = this.peek();
           continue;
         }
+        if (!operators.postfix.has(tok.value) && !operators.infix.has(tok.value)) {
+          break;
+        }
         this.consume();
         const nextTok = this.peek();
         if (nextTok.type === TokenType.PATH || nextTok.type === TokenType.LITERAL || nextTok.type === TokenType.LPAREN || nextTok.type === TokenType.PLACEHOLDER || nextTok.type === TokenType.EVENT || nextTok.type === TokenType.OPERATOR && operators.prefix.has(nextTok.value)) {
@@ -595,6 +625,10 @@ var LightviewCDOM = function(exports) {
         this.consume();
         return { type: "Placeholder", value: tok.value };
       }
+      if (tok.type === TokenType.THIS) {
+        this.consume();
+        return { type: "This", value: tok.value };
+      }
       if (tok.type === TokenType.EVENT) {
         this.consume();
         return { type: "Event", value: tok.value };
@@ -630,8 +664,17 @@ var LightviewCDOM = function(exports) {
           return resolvePath(path, item);
         });
       }
+      case "This": {
+        return new LazyValue((context2) => {
+          const node = (context2 == null ? void 0 : context2.__node__) || context2;
+          if (ast.value === "$this") return node;
+          const path = ast.value.startsWith("$this.") ? ast.value.slice(6) : ast.value.slice(6);
+          return resolvePath(path, node);
+        });
+      }
       case "Event": {
-        return new LazyValue((event) => {
+        return new LazyValue((context2) => {
+          const event = (context2 == null ? void 0 : context2.$event) || (context2 == null ? void 0 : context2.event) || context2;
           if (ast.value === "$event") return event;
           const path = ast.value.startsWith("$event.") ? ast.value.slice(7) : ast.value.slice(7);
           return resolvePath(path, event);
@@ -679,7 +722,12 @@ var LightviewCDOM = function(exports) {
         const opts = helperOptions.get(opInfo.helper) || {};
         const left = evaluateAST(ast.left, context, opts.pathAware);
         const right = evaluateAST(ast.right, context, false);
-        return helper(unwrapSignal(left), unwrapSignal(right));
+        const finalArgs = [];
+        if (Array.isArray(left) && ast.left.type === "Explosion") finalArgs.push(...left);
+        else finalArgs.push(unwrapSignal(left));
+        if (Array.isArray(right) && ast.right.type === "Explosion") finalArgs.push(...right);
+        else finalArgs.push(unwrapSignal(right));
+        return helper(...finalArgs);
       }
       default:
         throw new Error(`JPRX: Unknown AST node type: ${ast.type}`);
@@ -706,14 +754,14 @@ var LightviewCDOM = function(exports) {
       const fullPath = expr.slice(0, funcStart).trim();
       const argsStr = expr.slice(funcStart + 1, -1);
       const segments = fullPath.split("/");
-      let funcName = segments.pop().replace(/^\$/, "");
+      let funcName = segments.pop().replace(/^=/, "");
       if (funcName === "" && (segments.length > 0 || fullPath === "/")) {
         funcName = "/";
       }
       const navPath = segments.join("/");
-      const isGlobalExpr = expr.startsWith("$/") || expr.startsWith("$");
+      const isGlobalExpr = expr.startsWith("=/") || expr.startsWith("=");
       let baseContext = context;
-      if (navPath && navPath !== "$") {
+      if (navPath && navPath !== "=") {
         baseContext = resolvePathAsContext(navPath, context);
       }
       const helper = helpers.get(funcName);
@@ -746,7 +794,7 @@ var LightviewCDOM = function(exports) {
       let hasLazy = false;
       for (let i = 0; i < argsList.length; i++) {
         const arg = argsList[i];
-        const useGlobalMode = isGlobalExpr && (navPath === "$" || !navPath);
+        const useGlobalMode = isGlobalExpr && (navPath === "=" || !navPath);
         const res = resolveArgument(arg, baseContext, useGlobalMode);
         if (res.isLazy) hasLazy = true;
         const shouldUnwrap = !(options.pathAware && i === 0);
@@ -770,7 +818,7 @@ var LightviewCDOM = function(exports) {
           return helper(...finalArgs);
         });
       }
-      const result = helper(...resolvedArgs);
+      const result = helper.apply((context == null ? void 0 : context.__node__) || null, resolvedArgs);
       return unwrapSignal(result);
     }
     return unwrapSignal(resolvePath(expr, context));
@@ -892,7 +940,7 @@ var LightviewCDOM = function(exports) {
         i++;
       }
       const word = input.slice(start, i);
-      if (word.startsWith("$")) {
+      if (word.startsWith("=")) {
         return word;
       }
       if (word === "true") return true;
@@ -1030,7 +1078,7 @@ var LightviewCDOM = function(exports) {
         i++;
         continue;
       }
-      if (char === "$") {
+      if (char === "=") {
         let expr = "";
         let parenDepth = 0;
         let braceDepth = 0;
@@ -1059,7 +1107,7 @@ var LightviewCDOM = function(exports) {
         result += JSON.stringify(expr);
         continue;
       }
-      if (/[a-zA-Z_./]/.test(char)) {
+      if (/[a-zA-Z_$/./]/.test(char)) {
         let word = "";
         while (i < len2 && /[a-zA-Z0-9_$/.-]/.test(input[i])) {
           word += input[i];
@@ -1449,6 +1497,21 @@ var LightviewCDOM = function(exports) {
     if (typeof current === "object" && current !== null) return set(target, {});
     return set(target, null);
   };
+  function state(val, options) {
+    if (globalThis.Lightview) {
+      const finalOptions = typeof options === "string" ? { name: options } : options;
+      return globalThis.Lightview.state(val, finalOptions);
+    }
+    throw new Error("JPRX: $state requires a UI library implementation.");
+  }
+  function signal(val, options) {
+    if (globalThis.Lightview) {
+      const finalOptions = typeof options === "string" ? { name: options } : options;
+      return globalThis.Lightview.signal(val, finalOptions);
+    }
+    throw new Error("JPRX: $signal requires a UI library implementation.");
+  }
+  const bind = (path, options) => ({ __JPRX_BIND__: true, path, options });
   const registerStateHelpers = (register) => {
     const opts = { pathAware: true };
     register("set", set, opts);
@@ -1462,6 +1525,9 @@ var LightviewCDOM = function(exports) {
     register("pop", pop, opts);
     register("assign", assign, opts);
     register("clear", clear, opts);
+    register("state", state);
+    register("signal", signal);
+    register("bind", bind);
   };
   const fetchHelper = (url, options = {}) => {
     const fetchOptions = { ...options };
@@ -1490,281 +1556,27 @@ var LightviewCDOM = function(exports) {
   const _LV = globalThis.__LIGHTVIEW_INTERNALS__ || (globalThis.__LIGHTVIEW_INTERNALS__ = {
     currentEffect: null,
     registry: /* @__PURE__ */ new Map(),
-    dependencyMap: /* @__PURE__ */ new WeakMap()
-    // Tracking signals -> subscribers
-  });
-  const signal = (initialValue, optionsOrName) => {
-    let name = typeof optionsOrName === "string" ? optionsOrName : optionsOrName == null ? void 0 : optionsOrName.name;
-    const storage = optionsOrName == null ? void 0 : optionsOrName.storage;
-    if (name && storage) {
-      try {
-        const stored = storage.getItem(name);
-        if (stored !== null) {
-          initialValue = JSON.parse(stored);
-        }
-      } catch (e) {
-      }
+    // Global name -> Signal/Proxy
+    localRegistries: /* @__PURE__ */ new WeakMap(),
+    // Object/Element -> Map(name -> Signal/Proxy)
+    futureSignals: /* @__PURE__ */ new Map(),
+    // name -> Set of (signal) => void
+    schemas: /* @__PURE__ */ new Map(),
+    // name -> Schema (Draft 7+ or Shorthand)
+    parents: /* @__PURE__ */ new WeakMap(),
+    // Proxy -> Parent (Proxy/Element)
+    helpers: /* @__PURE__ */ new Map(),
+    // name -> function (used for transforms and expressions)
+    hooks: {
+      validate: (value, schema) => true
+      // Hook for extensions (like JPRX) to provide full validation
     }
-    let value = initialValue;
-    const subscribers = /* @__PURE__ */ new Set();
-    const f = (...args) => {
-      if (args.length === 0) return f.value;
-      f.value = args[0];
-    };
-    Object.defineProperty(f, "value", {
-      get() {
-        if (_LV.currentEffect) {
-          subscribers.add(_LV.currentEffect);
-          _LV.currentEffect.dependencies.add(subscribers);
-        }
-        return value;
-      },
-      set(newValue) {
-        if (value !== newValue) {
-          value = newValue;
-          if (name && storage) {
-            try {
-              storage.setItem(name, JSON.stringify(value));
-            } catch (e) {
-            }
-          }
-          [...subscribers].forEach((effect2) => effect2());
-        }
-      }
-    });
-    if (name) {
-      if (_LV.registry.has(name)) {
-        if (_LV.registry.get(name) !== f) {
-          throw new Error(`Lightview: A signal or state with the name "${name}" is already registered.`);
-        }
-      } else {
-        _LV.registry.set(name, f);
-      }
-    }
-    return f;
-  };
-  const getSignal = (name, defaultValue) => {
-    if (!_LV.registry.has(name) && defaultValue !== void 0) {
-      return signal(defaultValue, name);
-    }
-    return _LV.registry.get(name);
-  };
-  signal.get = getSignal;
-  const effect = (fn) => {
-    const execute = () => {
-      if (!execute.active || execute.running) return;
-      execute.dependencies.forEach((dep) => dep.delete(execute));
-      execute.dependencies.clear();
-      execute.running = true;
-      _LV.currentEffect = execute;
-      try {
-        fn();
-      } finally {
-        _LV.currentEffect = null;
-        execute.running = false;
-      }
-    };
-    execute.active = true;
-    execute.running = false;
-    execute.dependencies = /* @__PURE__ */ new Set();
-    execute.stop = () => {
-      execute.dependencies.forEach((dep) => dep.delete(execute));
-      execute.dependencies.clear();
-      execute.active = false;
-    };
-    execute();
-    return execute;
-  };
-  const getRegistry = () => _LV.registry;
-  const stateCache = /* @__PURE__ */ new WeakMap();
-  const stateSignals = /* @__PURE__ */ new WeakMap();
-  const parents = /* @__PURE__ */ new WeakMap();
+  });
+  const internals = _LV;
+  const { parents, schemas, hooks } = internals;
   const protoMethods = (proto, test) => Object.getOwnPropertyNames(proto).filter((k) => typeof proto[k] === "function" && test(k));
-  const DATE_TRACKING = protoMethods(Date.prototype, (k) => /^(to|get|valueOf)/.test(k));
-  const DATE_MUTATING = protoMethods(Date.prototype, (k) => /^set/.test(k));
-  const ARRAY_TRACKING = [
-    "map",
-    "forEach",
-    "filter",
-    "find",
-    "findIndex",
-    "some",
-    "every",
-    "reduce",
-    "reduceRight",
-    "includes",
-    "indexOf",
-    "lastIndexOf",
-    "join",
-    "slice",
-    "concat",
-    "flat",
-    "flatMap",
-    "at",
-    "entries",
-    "keys",
-    "values"
-  ];
-  const ARRAY_MUTATING = ["push", "pop", "shift", "unshift", "splice", "sort", "reverse", "fill", "copyWithin"];
-  const ARRAY_ITERATION = ["map", "forEach", "filter", "find", "findIndex", "some", "every", "flatMap"];
-  const getOrSet = (map2, key, factory) => {
-    let v = map2.get(key);
-    if (!v) {
-      v = factory();
-      map2.set(key, v);
-    }
-    return v;
-  };
-  const proxyGet = (target, prop, receiver, signals) => {
-    if (prop === "__parent__") return parents.get(receiver);
-    if (!signals.has(prop)) {
-      signals.set(prop, signal(Reflect.get(target, prop, receiver)));
-    }
-    const signal$1 = signals.get(prop);
-    const val = signal$1.value;
-    if (typeof val === "object" && val !== null) {
-      const childProxy = state(val);
-      parents.set(childProxy, receiver);
-      return childProxy;
-    }
-    return val;
-  };
-  const proxySet = (target, prop, value, receiver, signals) => {
-    if (!signals.has(prop)) {
-      signals.set(prop, signal(Reflect.get(target, prop, receiver)));
-    }
-    const success = Reflect.set(target, prop, value, receiver);
-    const signal$1 = signals.get(prop);
-    if (success && signal$1) signal$1.value = value;
-    return success;
-  };
-  const createSpecialProxy = (obj, monitor, trackingProps = []) => {
-    const signals = getOrSet(stateSignals, obj, () => /* @__PURE__ */ new Map());
-    if (!signals.has(monitor)) {
-      const initialValue = typeof obj[monitor] === "function" ? obj[monitor].call(obj) : obj[monitor];
-      signals.set(monitor, signal(initialValue));
-    }
-    const isDate = obj instanceof Date;
-    const isArray = Array.isArray(obj);
-    const trackingMethods = isDate ? DATE_TRACKING : isArray ? ARRAY_TRACKING : trackingProps;
-    const mutatingMethods = isDate ? DATE_MUTATING : isArray ? ARRAY_MUTATING : [];
-    return new Proxy(obj, {
-      get(target, prop, receiver) {
-        if (prop === "__parent__") return parents.get(receiver);
-        const value = target[prop];
-        if (typeof value === "function") {
-          const isTracking = trackingMethods.includes(prop);
-          const isMutating = mutatingMethods.includes(prop);
-          return function(...args) {
-            if (isTracking) {
-              const sig = signals.get(monitor);
-              if (sig) void sig.value;
-            }
-            const startValue = typeof target[monitor] === "function" ? target[monitor].call(target) : target[monitor];
-            if (isArray && ARRAY_ITERATION.includes(prop) && typeof args[0] === "function") {
-              const originalCallback = args[0];
-              args[0] = function(element, index2, array) {
-                const wrappedElement = typeof element === "object" && element !== null ? state(element) : element;
-                if (wrappedElement && typeof wrappedElement === "object") {
-                  parents.set(wrappedElement, receiver);
-                }
-                return originalCallback.call(this, wrappedElement, index2, array);
-              };
-            }
-            const result = value.apply(target, args);
-            const endValue = typeof target[monitor] === "function" ? target[monitor].call(target) : target[monitor];
-            if (startValue !== endValue || isMutating) {
-              const sig = signals.get(monitor);
-              if (sig && sig.value !== endValue) {
-                sig.value = endValue;
-              }
-            }
-            return result;
-          };
-        }
-        if (prop === monitor) {
-          const sig = signals.get(monitor);
-          return sig ? sig.value : Reflect.get(target, prop, receiver);
-        }
-        if (isArray && !isNaN(parseInt(prop))) {
-          const monitorSig = signals.get(monitor);
-          if (monitorSig) void monitorSig.value;
-        }
-        return proxyGet(target, prop, receiver, signals);
-      },
-      set(target, prop, value, receiver) {
-        if (prop === monitor) {
-          const success = Reflect.set(target, prop, value, receiver);
-          if (success) {
-            const sig = signals.get(monitor);
-            if (sig) sig.value = value;
-          }
-          return success;
-        }
-        return proxySet(target, prop, value, receiver, signals);
-      }
-    });
-  };
-  const state = (obj, optionsOrName) => {
-    if (typeof obj !== "object" || obj === null) return obj;
-    const name = typeof optionsOrName === "string" ? optionsOrName : optionsOrName == null ? void 0 : optionsOrName.name;
-    const storage = optionsOrName == null ? void 0 : optionsOrName.storage;
-    if (name && storage) {
-      try {
-        const item = storage.getItem(name);
-        if (item) {
-          const loaded = JSON.parse(item);
-          Array.isArray(obj) && Array.isArray(loaded) ? (obj.length = 0, obj.push(...loaded)) : Object.assign(obj, loaded);
-        }
-      } catch (e) {
-      }
-    }
-    let proxy = stateCache.get(obj);
-    if (!proxy) {
-      const isArray = Array.isArray(obj), isDate = obj instanceof Date;
-      const isSpecial = isArray || isDate;
-      const monitor = isArray ? "length" : isDate ? "getTime" : null;
-      if (isSpecial || !(obj instanceof RegExp || obj instanceof Map || obj instanceof Set || obj instanceof WeakMap || obj instanceof WeakSet)) {
-        proxy = isSpecial ? createSpecialProxy(obj, monitor) : new Proxy(obj, {
-          get(t, p, r) {
-            if (p === "__parent__") return parents.get(r);
-            return proxyGet(t, p, r, getOrSet(stateSignals, t, () => /* @__PURE__ */ new Map()));
-          },
-          set(t, p, v, r) {
-            return proxySet(t, p, v, r, getOrSet(stateSignals, t, () => /* @__PURE__ */ new Map()));
-          }
-        });
-        stateCache.set(obj, proxy);
-      } else return obj;
-    }
-    if (name && storage) {
-      effect(() => {
-        try {
-          storage.setItem(name, JSON.stringify(proxy));
-        } catch (e) {
-        }
-      });
-    }
-    if (name) {
-      const registry = getRegistry();
-      if (registry.has(name)) {
-        if (registry.get(name) !== proxy) {
-          throw new Error(`Lightview: A signal or state with the name "${name}" is already registered.`);
-        }
-      } else {
-        registry.set(name, proxy);
-      }
-    }
-    return proxy;
-  };
-  const getState = (name, defaultValue) => {
-    const registry = getRegistry();
-    if (!registry.has(name) && defaultValue !== void 0) {
-      return state(defaultValue, name);
-    }
-    return registry.get(name);
-  };
-  state.get = getState;
+  protoMethods(Date.prototype, (k) => /^(to|get|valueOf)/.test(k));
+  protoMethods(Date.prototype, (k) => /^set/.test(k));
   registerMathHelpers(registerHelper);
   registerLogicHelpers(registerHelper);
   registerStringHelpers(registerHelper);
@@ -1777,6 +1589,74 @@ var LightviewCDOM = function(exports) {
   registerStatsHelpers(registerHelper);
   registerStateHelpers((name, fn) => registerHelper(name, fn, { pathAware: true }));
   registerNetworkHelpers(registerHelper);
+  registerHelper("move", (selector, location = "beforeend") => {
+    return {
+      isLazy: true,
+      resolve: (eventOrNode) => {
+        const isEvent = eventOrNode && typeof eventOrNode === "object" && "target" in eventOrNode;
+        const node = isEvent ? eventOrNode.currentTarget || eventOrNode.target : eventOrNode;
+        if (!(node instanceof Node) || !selector) return;
+        const target = document.querySelector(selector);
+        if (!target) {
+          console.warn(`[Lightview-CDOM] move target not found: ${selector}`);
+          return;
+        }
+        if (node.id) {
+          const escapedId = CSS.escape(node.id);
+          if (target.id === node.id && target !== node) {
+            target.replaceWith(node);
+            return;
+          }
+          const existing = target.querySelector(`#${escapedId}`);
+          if (existing && existing !== node) {
+            existing.replaceWith(node);
+            return;
+          }
+        }
+        globalThis.Lightview.$(target).content(node, location);
+      }
+    };
+  }, { pathAware: true });
+  registerHelper("mount", async (url, options = {}) => {
+    const { target = "body", location = "beforeend" } = options;
+    try {
+      const fetchOptions = { ...options };
+      delete fetchOptions.target;
+      delete fetchOptions.location;
+      const headers = { ...fetchOptions.headers };
+      let body = fetchOptions.body;
+      if (body !== void 0) {
+        if (body !== null && typeof body === "object") {
+          body = JSON.stringify(body);
+          if (!headers["Content-Type"]) headers["Content-Type"] = "application/json";
+        } else {
+          body = String(body);
+          if (!headers["Content-Type"]) headers["Content-Type"] = "text/plain";
+        }
+        fetchOptions.body = body;
+        fetchOptions.headers = headers;
+      }
+      const response = await globalThis.fetch(url, fetchOptions);
+      const contentType = response.headers.get("Content-Type") || "";
+      const text = await response.text();
+      let content = text;
+      const isCDOM = contentType.includes("application/cdom") || contentType.includes("application/jprx") || contentType.includes("application/vdom") || contentType.includes("application/odom") || url.endsWith(".cdom") || url.endsWith(".jprx") || url.endsWith(".vdom") || url.endsWith(".odom");
+      if (isCDOM || contentType.includes("application/json") && text.trim().startsWith("{")) {
+        try {
+          content = hydrate(parseJPRX(text));
+        } catch (e) {
+        }
+      }
+      const targetEl = document.querySelector(target);
+      if (targetEl) {
+        globalThis.Lightview.$(targetEl).content(content, location);
+      } else {
+        console.warn(`[Lightview-CDOM] $mount target not found: ${target}`);
+      }
+    } catch (err) {
+      console.error(`[Lightview-CDOM] $mount failed for ${url}:`, err);
+    }
+  });
   registerOperator("increment", "++", "prefix", 80);
   registerOperator("increment", "++", "postfix", 80);
   registerOperator("decrement", "--", "prefix", 80);
@@ -1791,309 +1671,135 @@ var LightviewCDOM = function(exports) {
   registerOperator("gte", ">=", "infix", 40);
   registerOperator("lte", "<=", "infix", 40);
   registerOperator("neq", "!=", "infix", 40);
-  const localStates = /* @__PURE__ */ new WeakMap();
   const getContext = (node, event = null) => {
-    const chain = [];
-    let cur = node;
-    const ShadowRoot = globalThis.ShadowRoot;
-    while (cur) {
-      const local = localStates.get(cur) || (cur && typeof cur === "object" ? cur.__state__ : null);
-      if (local) chain.unshift(local);
-      cur = cur.parentElement || (cur && typeof cur === "object" ? cur.__parent__ : null) || (ShadowRoot && cur.parentNode instanceof ShadowRoot ? cur.parentNode.host : null);
-    }
-    const globalRegistry = getRegistry();
-    const handler = {
-      get(target, prop, receiver) {
-        var _a;
+    return new Proxy({}, {
+      get(_, prop) {
         if (prop === "$event" || prop === "event") return event;
-        if (prop === "__parent__") return void 0;
-        for (let i = chain.length - 1; i >= 0; i--) {
-          const s = chain[i];
-          if (prop in s) return s[prop];
-        }
-        if (globalRegistry && globalRegistry.has(prop)) return unwrapSignal(globalRegistry.get(prop));
-        const globalState = (_a = globalThis.Lightview) == null ? void 0 : _a.state;
-        if (globalState && prop in globalState) return unwrapSignal(globalState[prop]);
-        return void 0;
+        if (prop === "$this" || prop === "this" || prop === "__node__") return node;
+        return unwrapSignal(globalThis.Lightview.getState(prop, { scope: node }));
       },
-      set(target, prop, value, receiver) {
-        var _a;
-        for (let i = chain.length - 1; i >= 0; i--) {
-          const s = chain[i];
-          if (prop in s) {
-            s[prop] = value;
-            return true;
-          }
-        }
-        if (chain.length > 0) {
-          chain[chain.length - 1][prop] = value;
+      set(_, prop, value) {
+        const res = globalThis.Lightview.getState(prop, { scope: node });
+        if (res && (typeof res === "object" || typeof res === "function") && "value" in res) {
+          res.value = value;
           return true;
         }
-        const globalState = (_a = globalThis.Lightview) == null ? void 0 : _a.state;
-        if (globalState && prop in globalState) {
-          globalState[prop] = value;
-          return true;
-        }
-        if (globalRegistry && globalRegistry.has(prop)) {
-          const s = globalRegistry.get(prop);
-          if (s && (typeof s === "object" || typeof s === "function") && "value" in s) {
-            s.value = value;
-            return true;
-          }
-        }
         return false;
-      },
-      has(target, prop) {
-        var _a;
-        const exists = prop === "$event" || prop === "event" || !!chain.find((s) => prop in s);
-        const inGlobal = ((_a = globalThis.Lightview) == null ? void 0 : _a.state) && prop in globalThis.Lightview.state || globalRegistry && globalRegistry.has(prop);
-        return exists || inGlobal;
-      },
-      ownKeys(target) {
-        var _a;
-        const keys = /* @__PURE__ */ new Set();
-        if (event) {
-          keys.add("$event");
-          keys.add("event");
-        }
-        for (const s of chain) {
-          for (const key in s) keys.add(key);
-        }
-        const globalState = (_a = globalThis.Lightview) == null ? void 0 : _a.state;
-        if (globalState) {
-          for (const key in globalState) keys.add(key);
-        }
-        return Array.from(keys);
-      },
-      getOwnPropertyDescriptor(target, prop) {
-        return { enumerable: true, configurable: true };
-      }
-    };
-    return new Proxy({}, handler);
-  };
-  const handleCDOMState = (node) => {
-    var _a;
-    const attr = node["cdom-state"] || node.getAttribute && node.getAttribute("cdom-state");
-    if (!attr || localStates.has(node)) return;
-    try {
-      const data = typeof attr === "object" ? attr : JSON.parse(attr);
-      const s = state(data);
-      localStates.set(node, s);
-      if (node && typeof node === "object") {
-        node.__state__ = s;
-      }
-    } catch (e) {
-      (_a = globalThis.console) == null ? void 0 : _a.error("LightviewCDOM: Failed to parse cdom-state", e);
-    }
-  };
-  const handleCDOMBind = (node) => {
-    const path = node["cdom-bind"] || node.getAttribute("cdom-bind");
-    if (!path) return;
-    const type = node.type || "";
-    const tagName = node.tagName.toLowerCase();
-    let prop = "value";
-    let event = "input";
-    if (type === "checkbox" || type === "radio") {
-      prop = "checked";
-      event = "change";
-    } else if (tagName === "select") {
-      event = "change";
-    }
-    const context = getContext(node);
-    let target = resolvePathAsContext(path, context);
-    if (target && target.isBindingTarget && target.value === void 0) {
-      const val = node[prop];
-      if (val !== void 0 && val !== "") {
-        set(context, { [target.key]: val });
-        target = resolvePathAsContext(path, context);
-      }
-    }
-    effect(() => {
-      const val = unwrapSignal(target);
-      if (node[prop] !== val) {
-        node[prop] = val === void 0 ? "" : val;
-      }
-    });
-    node.addEventListener(event, () => {
-      const val = node[prop];
-      if (target && target.isBindingTarget) {
-        target.value = val;
-      } else {
-        set(context, { [path]: val });
       }
     });
   };
+  globalThis.Lightview.hooks.processAttribute = (domNode, key, value) => {
+    if (value == null ? void 0 : value.__JPRX_BIND__) {
+      const { path, options } = value;
+      const type = domNode.type || "";
+      const tagName = domNode.tagName.toLowerCase();
+      let prop = "value";
+      let event = "input";
+      if (type === "checkbox" || type === "radio") {
+        prop = "checked";
+        event = "change";
+      } else if (tagName === "select") {
+        event = "change";
+      }
+      const res = globalThis.Lightview.get(path.replace(/^=/, ""), { scope: domNode });
+      const runner = globalThis.Lightview.effect(() => {
+        const val = unwrapSignal(res);
+        if (domNode[prop] !== val) {
+          domNode[prop] = val === void 0 ? "" : val;
+        }
+      });
+      globalThis.Lightview.internals.trackEffect(domNode, runner);
+      domNode.addEventListener(event, () => {
+        if (res && "value" in res) res.value = domNode[prop];
+      });
+      return unwrapSignal(res) ?? domNode[prop];
+    }
+    return void 0;
+  };
   const activate = (root = document.body) => {
-    const walk = (node) => {
-      if (node.nodeType === 1) {
-        if (node.hasAttribute("cdom-state")) handleCDOMState(node);
-        if (node.hasAttribute("cdom-bind")) handleCDOMBind(node);
-      }
-      let child = node.firstChild;
-      while (child) {
-        walk(child);
-        child = child.nextSibling;
-      }
-    };
-    walk(root);
+  };
+  const makeEventHandler = (expr) => (eventOrNode) => {
+    const isEvent = eventOrNode && typeof eventOrNode === "object" && "target" in eventOrNode;
+    const target = isEvent ? eventOrNode.currentTarget || eventOrNode.target : eventOrNode;
+    const context = getContext(target, isEvent ? eventOrNode : null);
+    const result = resolveExpression(expr, context);
+    if (result && typeof result === "object" && result.isLazy) return result.resolve(eventOrNode);
+    return result;
   };
   const hydrate = (node, parent = null) => {
+    var _a, _b, _c;
     if (!node) return node;
-    if (typeof node === "string" && node.startsWith("$")) {
+    if (typeof node === "string" && node.startsWith("'=")) {
+      return node.slice(1);
+    }
+    if (typeof node === "string" && node.startsWith("=")) {
       return parseExpression(node, parent);
     }
+    if (typeof node !== "object") return node;
     if (Array.isArray(node)) {
       return node.map((item) => hydrate(item, parent));
     }
-    if (node instanceof String) {
-      return node.toString();
+    if (node instanceof String) return node.toString();
+    if (parent && !("__parent__" in node)) {
+      Object.defineProperty(node, "__parent__", { value: parent, enumerable: false, writable: true });
+      (_c = (_b = (_a = globalThis.Lightview) == null ? void 0 : _a.internals) == null ? void 0 : _b.parents) == null ? void 0 : _c.set(node, parent);
     }
-    if (typeof node === "object" && node !== null) {
-      if (parent && !("__parent__" in node)) {
-        Object.defineProperty(node, "__parent__", {
-          value: parent,
-          enumerable: false,
-          writable: true,
-          configurable: true
-        });
+    if (!node.tag) {
+      let potentialTag = null;
+      const reserved = ["children", "attributes", "tag", "__parent__"];
+      for (const key in node) {
+        if (reserved.includes(key) || key.startsWith("on")) continue;
+        potentialTag = key;
+        break;
       }
-      if (!node.tag) {
-        let potentialTag = null;
-        for (const key in node) {
-          if (key === "children" || key === "attributes" || key === "tag" || key.startsWith("cdom-") || key.startsWith("on") || key === "__parent__") {
-            continue;
+      if (potentialTag) {
+        const content = node[potentialTag];
+        node.tag = potentialTag;
+        if (Array.isArray(content)) {
+          node.children = content;
+        } else if (typeof content === "object") {
+          node.attributes = node.attributes || {};
+          for (const k in content) {
+            if (k === "children") node.children = content[k];
+            else node.attributes[k] = content[k];
           }
-          const attrNames = [
-            // Form/input attributes
-            "type",
-            "name",
-            "value",
-            "placeholder",
-            "step",
-            "min",
-            "max",
-            "pattern",
-            "disabled",
-            "checked",
-            "selected",
-            "readonly",
-            "required",
-            "multiple",
-            "rows",
-            "cols",
-            "size",
-            "maxlength",
-            "minlength",
-            "autocomplete",
-            // Common element attributes
-            "id",
-            "class",
-            "className",
-            "style",
-            "title",
-            "tabindex",
-            "role",
-            "href",
-            "src",
-            "alt",
-            "width",
-            "height",
-            "target",
-            "rel",
-            // Data attributes
-            "data",
-            "label",
-            "text",
-            "description",
-            "content",
-            // Common data property names
-            "price",
-            "qty",
-            "items",
-            "count",
-            "total",
-            "amount",
-            "url"
-          ];
-          if (attrNames.includes(key)) {
-            continue;
-          }
-          potentialTag = key;
-          break;
-        }
-        if (potentialTag) {
-          const content = node[potentialTag];
-          if (content !== void 0 && content !== null) {
-            node.tag = potentialTag;
-            if (Array.isArray(content)) {
-              node.children = content;
-            } else if (typeof content === "object") {
-              node.attributes = node.attributes || {};
-              for (const k in content) {
-                if (k === "children") {
-                  node.children = content[k];
-                } else if (k.startsWith("cdom-")) {
-                  node[k] = content[k];
-                } else {
-                  node.attributes[k] = content[k];
-                }
-              }
+        } else node.children = [content];
+        delete node[potentialTag];
+      }
+    }
+    for (const key in node) {
+      if (key === "tag" || key === "__parent__") continue;
+      const value = node[key];
+      if (key === "attributes" && typeof value === "object" && value !== null) {
+        for (const attrKey in value) {
+          const attrVal = value[attrKey];
+          if (typeof attrVal === "string" && attrVal.startsWith("'=")) {
+            value[attrKey] = attrVal.slice(1);
+          } else if (typeof attrVal === "string" && attrVal.startsWith("=")) {
+            if (attrKey.startsWith("on")) {
+              value[attrKey] = makeEventHandler(attrVal);
             } else {
-              node.children = [content];
+              value[attrKey] = parseExpression(attrVal, node);
             }
-            delete node[potentialTag];
+          } else if (typeof attrVal === "object" && attrVal !== null) {
+            value[attrKey] = hydrate(attrVal, node);
           }
         }
+        continue;
       }
-      if (node["cdom-state"]) {
-        handleCDOMState(node);
-      }
-      for (const key in node) {
-        const value = node[key];
-        if (key === "cdom-state") {
-          continue;
-        }
-        if (typeof value === "string" && value.startsWith("$")) {
-          if (key.startsWith("on")) {
-            node[key] = (event) => {
-              const element = event.currentTarget;
-              const context = getContext(element, event);
-              const result = resolveExpression(value, context);
-              if (result && typeof result === "object" && result.isLazy && typeof result.resolve === "function") {
-                return result.resolve(event);
-              }
-              return result;
-            };
-          } else if (key === "children") {
-            node[key] = [parseExpression(value, node)];
-          } else {
-            node[key] = parseExpression(value, node);
-          }
-        } else if (key === "attributes" && typeof value === "object" && value !== null) {
-          for (const attrKey in value) {
-            const attrValue = value[attrKey];
-            if (typeof attrValue === "string" && attrValue.startsWith("$")) {
-              if (attrKey.startsWith("on")) {
-                value[attrKey] = (event) => {
-                  const element = event.currentTarget;
-                  const context = getContext(element, event);
-                  const result = resolveExpression(attrValue, context);
-                  if (result && typeof result === "object" && result.isLazy && typeof result.resolve === "function") {
-                    return result.resolve(event);
-                  }
-                  return result;
-                };
-              } else {
-                value[attrKey] = parseExpression(attrValue, node);
-              }
-            }
-          }
-          node[key] = value;
+      if (typeof value === "string" && value.startsWith("'=")) {
+        node[key] = value.slice(1);
+      } else if (typeof value === "string" && value.startsWith("=")) {
+        if (key === "onmount" || key === "onunmount" || key.startsWith("on")) {
+          node[key] = makeEventHandler(value);
+        } else if (key === "children") {
+          node[key] = [parseExpression(value, node)];
         } else {
-          node[key] = hydrate(value, node);
+          node[key] = parseExpression(value, node);
         }
+      } else {
+        node[key] = hydrate(value, node);
       }
-      return node;
     }
     return node;
   };
@@ -2108,8 +1814,10 @@ var LightviewCDOM = function(exports) {
     parseJPRX,
     unwrapSignal,
     getContext,
-    handleCDOMState,
-    handleCDOMBind,
+    handleCDOMState: () => {
+    },
+    handleCDOMBind: () => {
+    },
     activate,
     hydrate,
     version: "1.0.0"
@@ -2120,8 +1828,6 @@ var LightviewCDOM = function(exports) {
   exports.activate = activate;
   exports.default = LightviewCDOM2;
   exports.getContext = getContext;
-  exports.handleCDOMBind = handleCDOMBind;
-  exports.handleCDOMState = handleCDOMState;
   exports.hydrate = hydrate;
   Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
   return exports;