@domql/element 3.7.4 → 3.7.6

package/README.md

@@ -55,6 +55,20 @@ variables, on, component, context
 
 Plus mixin handlers: `attr`, `style`, `text`, `html`, `data`, `classlist`, `state`, `scope`, `deps`.
 
+## Scope and globalScope
+
+During `create()`, `createScope(element, parent)` establishes a prototype chain:
+
+```
+el.scope → parent.scope → ... → root.scope → context.globalScope
+```
+
+- Elements without a `scope` property inherit their parent's scope (same reference)
+- Elements with `scope: { ... }` get their own scope with parent's scope as prototype
+- `context.globalScope` is auto-initialized as `{}` and sits at the chain's root
+
+This enables serialized functions to access module-scoped values (constants, helpers) via `el.scope.X` without closures or imports — the values are placed in `globalScope` by the serialization pipeline and are accessible through prototype lookup.
+
 > **v3 note:** `childExtend` (singular) is deprecated v2 syntax — use `childExtends` (plural) in new code. The singular forms remain in REGISTRY for backwards compatibility with older projects. If a key is missing from REGISTRY, it gets interpreted as a child element name, causing silent rendering failures.
 
 ## set.js — Content Setting

package/create.js

@@ -91,7 +91,6 @@ export const create = (
   createScope(element, parent)
 
   createState(element, parent)
-  if (element.scope === 'state') element.scope = element.state
 
   createIfConditionFlag(element, parent)
 
@@ -103,9 +102,6 @@ export const create = (
   if (!element.tag) element.tag = detectTag(element)
   // Populate element.attr from props matching the tag's HTML spec
   applyPropsAsAttrs(element)
-  if (element.scope === 'props' || element.scope === true) {
-    element.scope = element.props
-  }
 
   // recatch if it passess props again
   createIfConditionFlag(element, parent)
@@ -240,7 +236,6 @@ const onlyResolveExtends = (element, parent, key, options) => {
   createScope(element, parent)
 
   createState(element, parent)
-  if (element.scope === 'state') element.scope = element.state
 
   createIfConditionFlag(element, parent)
 
@@ -248,9 +243,6 @@ const onlyResolveExtends = (element, parent, key, options) => {
   initProps(element, parent, options)
   // Re-pickup component-named properties that entered props via childProps/inheritParentProps
   pickupElementFromProps.call(element, element, { cachedKeys: [] })
-  if (element.scope === 'props' || element.scope === true) {
-    element.scope = element.props
-  }
 
   if (element.node && ref.__if) {
     parent[key || element.key] = element
@@ -286,7 +278,11 @@ const onlyResolveExtends = (element, parent, key, options) => {
         !optionsHasDefine &&
         !contextHasDefine
       ) {
-        create(exec(element[k], element), element, k, options)
+        try {
+          create(exec(element[k], element), element, k, options)
+        } catch (e) {
+          console.warn('[DOMQL] onlyResolveExtends child error in', k, ':', e?.message || e)
+        }
       }
     }
   }

package/dist/cjs/create.js

@@ -72,15 +72,11 @@ const create = (props, parentEl, passedKey, options = import_utils.OPTIONS.creat
   (0, import_set.addMethods)(element, parent, options);
   (0, import_utils.createScope)(element, parent);
   (0, import_state.createState)(element, parent);
-  if (element.scope === "state") element.scope = element.state;
   (0, import_utils.createIfConditionFlag)(element, parent);
   (0, import_utils.initProps)(element, parent, options);
   import_utils.pickupElementFromProps.call(element, element, { cachedKeys: [] });
   if (!element.tag) element.tag = (0, import_cache.detectTag)(element);
   applyPropsAsAttrs(element);
-  if (element.scope === "props" || element.scope === true) {
-    element.scope = element.props;
-  }
   (0, import_utils.createIfConditionFlag)(element, parent);
   if (element.node) {
     if (ref.__if) return (0, import_render.assignNode)(element, parent, key, attachOptions);
@@ -176,13 +172,9 @@ const onlyResolveExtends = (element, parent, key, options) => {
   (0, import_set.addMethods)(element, parent, options);
   (0, import_utils.createScope)(element, parent);
   (0, import_state.createState)(element, parent);
-  if (element.scope === "state") element.scope = element.state;
   (0, import_utils.createIfConditionFlag)(element, parent);
   (0, import_utils.initProps)(element, parent, options);
   import_utils.pickupElementFromProps.call(element, element, { cachedKeys: [] });
-  if (element.scope === "props" || element.scope === true) {
-    element.scope = element.props;
-  }
   if (element.node && ref.__if) {
     parent[key || element.key] = element;
   }
@@ -201,7 +193,11 @@ const onlyResolveExtends = (element, parent, key, options) => {
       if (!ref.__skipCreate && import_mixins.REGISTRY[k] && !optionsHasDefine) {
         continue;
       } else if (element[k] && !hasDefine && !optionsHasDefine && !contextHasDefine) {
-        create((0, import_utils.exec)(element[k], element), element, k, options);
+        try {
+          create((0, import_utils.exec)(element[k], element), element, k, options);
+        } catch (e) {
+          console.warn("[DOMQL] onlyResolveExtends child error in", k, ":", e?.message || e);
+        }
       }
     }
   }

package/dist/cjs/iterate.js

@@ -33,13 +33,19 @@ const throughInitialExec = (element, exclude = {}) => {
     const prop = element[param];
     if ((0, import_utils.isFunction)(prop) && !(0, import_utils.isMethod)(param, element)) {
       ref.__exec[param] = prop;
-      const result = prop(element, element.state, element.context);
-      if (result && typeof result.then === "function") {
-        result.then((resolved) => {
-          element[param] = resolved;
-        });
-      } else {
-        element[param] = result;
+      try {
+        const result = prop(element, element.state, element.context);
+        if (result && typeof result.then === "function") {
+          result.then((resolved) => {
+            element[param] = resolved;
+          }).catch((e) => {
+            console.warn("[DOMQL] Async exec error in", param, ":", e?.message || e);
+          });
+        } else {
+          element[param] = result;
+        }
+      } catch (e) {
+        console.warn("[DOMQL] Exec error in", param, ":", e?.message || e);
       }
     }
   }

package/dist/cjs/mixins/html.js

@@ -24,10 +24,7 @@ __export(html_exports, {
 module.exports = __toCommonJS(html_exports);
 var import_utils = require("@domql/utils");
 function html(param, element, node) {
-  let prop = (0, import_utils.exec)(param ?? element?.props?.html, element);
-  if ((0, import_utils.isString)(prop) && prop.includes("{{") && element.call) {
-    prop = element.call("replaceLiteralsWithObjectFields", prop, element.state);
-  }
+  const prop = (0, import_utils.exec)(param ?? element?.props?.html, element);
   const { __ref } = element;
   if (prop !== __ref.__html) {
     if (node.nodeName === "SVG") node.textContent = prop;

package/dist/esm/create.js

@@ -63,15 +63,11 @@ const create = (props, parentEl, passedKey, options = OPTIONS.create || {}, atta
   addMethods(element, parent, options);
   createScope(element, parent);
   createState(element, parent);
-  if (element.scope === "state") element.scope = element.state;
   createIfConditionFlag(element, parent);
   initProps(element, parent, options);
   pickupElementFromProps.call(element, element, { cachedKeys: [] });
   if (!element.tag) element.tag = detectTag(element);
   applyPropsAsAttrs(element);
-  if (element.scope === "props" || element.scope === true) {
-    element.scope = element.props;
-  }
   createIfConditionFlag(element, parent);
   if (element.node) {
     if (ref.__if) return assignNode(element, parent, key, attachOptions);
@@ -167,13 +163,9 @@ const onlyResolveExtends = (element, parent, key, options) => {
   addMethods(element, parent, options);
   createScope(element, parent);
   createState(element, parent);
-  if (element.scope === "state") element.scope = element.state;
   createIfConditionFlag(element, parent);
   initProps(element, parent, options);
   pickupElementFromProps.call(element, element, { cachedKeys: [] });
-  if (element.scope === "props" || element.scope === true) {
-    element.scope = element.props;
-  }
   if (element.node && ref.__if) {
     parent[key || element.key] = element;
   }
@@ -192,7 +184,11 @@ const onlyResolveExtends = (element, parent, key, options) => {
       if (!ref.__skipCreate && REGISTRY[k] && !optionsHasDefine) {
         continue;
       } else if (element[k] && !hasDefine && !optionsHasDefine && !contextHasDefine) {
-        create(exec(element[k], element), element, k, options);
+        try {
+          create(exec(element[k], element), element, k, options);
+        } catch (e) {
+          console.warn("[DOMQL] onlyResolveExtends child error in", k, ":", e?.message || e);
+        }
       }
     }
   }

package/dist/esm/iterate.js

@@ -16,13 +16,19 @@ const throughInitialExec = (element, exclude = {}) => {
     const prop = element[param];
     if (isFunction(prop) && !isMethod(param, element)) {
       ref.__exec[param] = prop;
-      const result = prop(element, element.state, element.context);
-      if (result && typeof result.then === "function") {
-        result.then((resolved) => {
-          element[param] = resolved;
-        });
-      } else {
-        element[param] = result;
+      try {
+        const result = prop(element, element.state, element.context);
+        if (result && typeof result.then === "function") {
+          result.then((resolved) => {
+            element[param] = resolved;
+          }).catch((e) => {
+            console.warn("[DOMQL] Async exec error in", param, ":", e?.message || e);
+          });
+        } else {
+          element[param] = result;
+        }
+      } catch (e) {
+        console.warn("[DOMQL] Exec error in", param, ":", e?.message || e);
       }
     }
   }

package/dist/esm/mixins/html.js

@@ -1,9 +1,6 @@
-import { exec, isString } from "@domql/utils";
+import { exec } from "@domql/utils";
 function html(param, element, node) {
-  let prop = exec(param ?? element?.props?.html, element);
-  if (isString(prop) && prop.includes("{{") && element.call) {
-    prop = element.call("replaceLiteralsWithObjectFields", prop, element.state);
-  }
+  const prop = exec(param ?? element?.props?.html, element);
   const { __ref } = element;
   if (prop !== __ref.__html) {
     if (node.nodeName === "SVG") node.textContent = prop;

package/dist/iife/index.js

@@ -1813,7 +1813,24 @@ var DomqlElement = (() => {
     "../utils/dist/esm/scope.js"() {
       createScope = (element, parent) => {
         const { __ref: ref } = element;
-        if (!element.scope) element.scope = parent.scope || ref.root?.scope || {};
+        const context = element.context || parent.context || ref.root?.context;
+        if (context && !context.globalScope) context.globalScope = {};
+        const parentScope = parent.scope || ref.root?.scope;
+        const globalScope = context?.globalScope;
+        if (!element.scope) {
+          if (parentScope) {
+            element.scope = parentScope;
+          } else if (globalScope) {
+            element.scope = Object.create(globalScope);
+          } else {
+            element.scope = {};
+          }
+        } else if (typeof element.scope === "object" && element.scope !== null) {
+          if (Object.getPrototypeOf(element.scope) === Object.prototype) {
+            const proto = parentScope || globalScope;
+            if (proto) Object.setPrototypeOf(element.scope, proto);
+          }
+        }
       };
     }
   });
@@ -1941,7 +1958,9 @@ var DomqlElement = (() => {
           );
           createClient = mod.createClient;
         }
-        return supabaseAdapter(createClient(supabaseUrl, key, options));
+        const client = createClient(supabaseUrl, key, options);
+        if (!client || !client.auth) return null;
+        return supabaseAdapter(client);
       };
       applyFilters = (query, params) => {
         if (!params) return query;
@@ -2573,7 +2592,7 @@ var DomqlElement = (() => {
         return resolved;
       };
       initAdapterAuth = async (adapter, context) => {
-        if (adapter.__authInitialized) return;
+        if (!adapter || adapter.__authInitialized) return;
         adapter.__authInitialized = true;
         if (!adapter.getSession) return;
         const updateAuth = (user, session) => {
@@ -2605,9 +2624,10 @@ var DomqlElement = (() => {
         if (db.__resolving) return db.__resolving;
         db.__resolving = resolveDb(db);
         const resolved = await db.__resolving;
+        delete db.__resolving;
+        if (!resolved) return null;
         db.__resolved = resolved;
         context.fetch = resolved;
-        delete db.__resolving;
         if (db.auth !== false) await initAdapterAuth(resolved, context);
         return resolved;
       };
@@ -4140,13 +4160,19 @@ ${element}` : "";
       const prop = element[param];
       if (isFunction(prop) && !isMethod(param, element)) {
         ref.__exec[param] = prop;
-        const result = prop(element, element.state, element.context);
-        if (result && typeof result.then === "function") {
-          result.then((resolved) => {
-            element[param] = resolved;
-          });
-        } else {
-          element[param] = result;
+        try {
+          const result = prop(element, element.state, element.context);
+          if (result && typeof result.then === "function") {
+            result.then((resolved) => {
+              element[param] = resolved;
+            }).catch((e) => {
+              console.warn("[DOMQL] Async exec error in", param, ":", e?.message || e);
+            });
+          } else {
+            element[param] = result;
+          }
+        } catch (e) {
+          console.warn("[DOMQL] Exec error in", param, ":", e?.message || e);
         }
       }
     }
@@ -4366,10 +4392,7 @@ ${element}` : "";
   // mixins/html.js
   init_esm();
   function html(param, element, node) {
-    let prop = exec(param ?? element?.props?.html, element);
-    if (isString(prop) && prop.includes("{{") && element.call) {
-      prop = element.call("replaceLiteralsWithObjectFields", prop, element.state);
-    }
+    const prop = exec(param ?? element?.props?.html, element);
     const { __ref } = element;
     if (prop !== __ref.__html) {
       if (node.nodeName === "SVG") node.textContent = prop;
@@ -6508,15 +6531,11 @@ ${element}` : "";
     addMethods(element, parent, options);
     createScope(element, parent);
     createState(element, parent);
-    if (element.scope === "state") element.scope = element.state;
     createIfConditionFlag(element, parent);
     initProps(element, parent, options);
     pickupElementFromProps.call(element, element, { cachedKeys: [] });
     if (!element.tag) element.tag = detectTag(element);
     applyPropsAsAttrs(element);
-    if (element.scope === "props" || element.scope === true) {
-      element.scope = element.props;
-    }
     createIfConditionFlag(element, parent);
     if (element.node) {
       if (ref.__if) return assignNode(element, parent, key, attachOptions);
@@ -6612,13 +6631,9 @@ ${element}` : "";
     addMethods(element, parent, options);
     createScope(element, parent);
     createState(element, parent);
-    if (element.scope === "state") element.scope = element.state;
     createIfConditionFlag(element, parent);
     initProps(element, parent, options);
     pickupElementFromProps.call(element, element, { cachedKeys: [] });
-    if (element.scope === "props" || element.scope === true) {
-      element.scope = element.props;
-    }
     if (element.node && ref.__if) {
       parent[key || element.key] = element;
     }
@@ -6637,7 +6652,11 @@ ${element}` : "";
         if (!ref.__skipCreate && REGISTRY[k] && !optionsHasDefine) {
           continue;
         } else if (element[k] && !hasDefine && !optionsHasDefine && !contextHasDefine) {
-          create(exec(element[k], element), element, k, options);
+          try {
+            create(exec(element[k], element), element, k, options);
+          } catch (e) {
+            console.warn("[DOMQL] onlyResolveExtends child error in", k, ":", e?.message || e);
+          }
         }
       }
     }

package/iterate.js

@@ -19,13 +19,19 @@ export const throughInitialExec = (element, exclude = {}) => {
     const prop = element[param]
     if (isFunction(prop) && !isMethod(param, element)) {
       ref.__exec[param] = prop
-      const result = prop(element, element.state, element.context)
-      if (result && typeof result.then === 'function') {
-        result.then(resolved => {
-          element[param] = resolved
-        })
-      } else {
-        element[param] = result
+      try {
+        const result = prop(element, element.state, element.context)
+        if (result && typeof result.then === 'function') {
+          result.then(resolved => {
+            element[param] = resolved
+          }).catch(e => {
+            console.warn('[DOMQL] Async exec error in', param, ':', e?.message || e)
+          })
+        } else {
+          element[param] = result
+        }
+      } catch (e) {
+        console.warn('[DOMQL] Exec error in', param, ':', e?.message || e)
       }
     }
   }

package/mixins/html.js

@@ -1,16 +1,13 @@
 'use strict'
 
-import { exec, isString } from '@domql/utils'
+import { exec } from '@domql/utils'
 
 /**
  * Appends raw HTML as content
  * an original one as a child
  */
 export function html (param, element, node) {
-  let prop = exec(param ?? element?.props?.html, element)
-  if (isString(prop) && prop.includes('{{') && element.call) {
-    prop = element.call('replaceLiteralsWithObjectFields', prop, element.state)
-  }
+  const prop = exec(param ?? element?.props?.html, element)
   const { __ref } = element
   if (prop !== __ref.__html) {
     if (node.nodeName === 'SVG') node.textContent = prop

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domql/element",
-  "version": "3.7.4",
+  "version": "3.7.6",
   "license": "CC-BY-NC-4.0",
   "type": "module",
   "module": "./dist/esm/index.js",
@@ -46,10 +46,10 @@
     "build:iife": "cross-env NODE_ENV=$NODE_ENV esbuild index.js --bundle --target=es2020 --format=iife --global-name=DomqlElement --outfile=dist/iife/index.js --define:process.env.NODE_ENV=process.env.NODE_ENV"
   },
   "dependencies": {
-    "@domql/report": "^3.7.4",
-    "@domql/state": "^3.7.4",
-    "@domql/utils": "^3.7.4",
-    "attrs-in-props": "^3.7.4"
+    "@domql/report": "^3.7.6",
+    "@domql/state": "^3.7.6",
+    "@domql/utils": "^3.7.6",
+    "attrs-in-props": "^3.7.6"
   },
   "gitHead": "9fc1b79b41cdc725ca6b24aec64920a599634681",
   "devDependencies": {