@domql/element 3.7.5 → 3.8.0

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

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;
   }

package/dist/cjs/mixins/text.js

@@ -26,6 +26,7 @@ var import_create = require("../create.js");
 var import_utils = require("@domql/utils");
 function text(param, element, node) {
   let prop = (0, import_utils.exec)(element.props.text || param, element);
+  if ((0, import_utils.isFunction)(prop)) prop = (0, import_utils.exec)(prop, element);
   if ((0, import_utils.isString)(prop) && prop.includes("{{")) {
     prop = element.call("replaceLiteralsWithObjectFields", prop, element.state);
   }

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;
   }

package/dist/esm/mixins/text.js

@@ -1,7 +1,8 @@
 import { create } from "../create.js";
-import { exec, isString, SVG_TAGS } from "@domql/utils";
+import { exec, isFunction, isString, SVG_TAGS } from "@domql/utils";
 function text(param, element, node) {
   let prop = exec(element.props.text || param, element);
+  if (isFunction(prop)) prop = exec(prop, element);
   if (isString(prop) && prop.includes("{{")) {
     prop = element.call("replaceLiteralsWithObjectFields", prop, element.state);
   }

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);
+          }
+        }
       };
     }
   });
@@ -4408,6 +4425,7 @@ ${element}` : "";
   init_esm();
   function text(param, element, node) {
     let prop = exec(element.props.text || param, element);
+    if (isFunction(prop)) prop = exec(prop, element);
     if (isString(prop) && prop.includes("{{")) {
       prop = element.call("replaceLiteralsWithObjectFields", prop, element.state);
     }
@@ -6514,15 +6532,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);
@@ -6618,13 +6632,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;
     }

package/mixins/text.js

@@ -1,7 +1,7 @@
 'use strict'
 
 import { create } from '../create.js'
-import { exec, isString, SVG_TAGS } from '@domql/utils'
+import { exec, isFunction, isString, SVG_TAGS } from '@domql/utils'
 
 /**
  * Creates a text node and appends into
@@ -9,6 +9,7 @@ import { exec, isString, SVG_TAGS } from '@domql/utils'
  */
 export function text (param, element, node) {
   let prop = exec(element.props.text || param, element)
+  if (isFunction(prop)) prop = exec(prop, element)
   if (isString(prop) && prop.includes('{{')) {
     prop = element.call('replaceLiteralsWithObjectFields', prop, element.state)
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domql/element",
-  "version": "3.7.5",
+  "version": "3.8.0",
   "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.5",
-    "@domql/state": "^3.7.5",
-    "@domql/utils": "^3.7.5",
-    "attrs-in-props": "^3.7.5"
+    "@domql/report": "^3.8.0",
+    "@domql/state": "^3.8.0",
+    "@domql/utils": "^3.8.0",
+    "attrs-in-props": "^3.8.0"
   },
   "gitHead": "9fc1b79b41cdc725ca6b24aec64920a599634681",
   "devDependencies": {