@domql/element 3.1.1 → 3.2.3

package/dist/cjs/utils/extendUtils.js

@@ -0,0 +1,132 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var extendUtils_exports = {};
+__export(extendUtils_exports, {
+  cloneAndMergeArrayExtend: () => cloneAndMergeArrayExtend,
+  deepExtend: () => deepExtend,
+  deepMergeExtend: () => deepMergeExtend,
+  extendCachedRegistry: () => extendCachedRegistry,
+  extendStackRegistry: () => extendStackRegistry,
+  extractArrayExtend: () => extractArrayExtend,
+  fallbackStringExtend: () => fallbackStringExtend,
+  flattenExtend: () => flattenExtend,
+  generateHash: () => generateHash,
+  getExtendMerged: () => getExtendMerged,
+  getExtendStack: () => getExtendStack,
+  getExtendStackRegistry: () => getExtendStackRegistry,
+  getHashedExtend: () => getHashedExtend,
+  jointStacks: () => jointStacks,
+  setHashedExtend: () => setHashedExtend
+});
+module.exports = __toCommonJS(extendUtils_exports);
+var import_utils = require("@domql/utils");
+const generateHash = () => Math.random().toString(36).substring(2);
+const extendStackRegistry = {};
+const extendCachedRegistry = {};
+const getHashedExtend = (extend) => {
+  return extendStackRegistry[extend.__hash];
+};
+const setHashedExtend = (extend, stack) => {
+  const hash = generateHash();
+  if (!(0, import_utils.isString)(extend)) {
+    extend.__hash = hash;
+  }
+  extendStackRegistry[hash] = stack;
+  return stack;
+};
+const getExtendStackRegistry = (extend, stack) => {
+  if (extend.__hash) {
+    return stack.concat(getHashedExtend(extend));
+  }
+  return setHashedExtend(extend, stack);
+};
+const extractArrayExtend = (extend, stack, context) => {
+  extend.forEach((each) => flattenExtend(each, stack, context));
+  return stack;
+};
+const deepExtend = (extend, stack, context) => {
+  const extendOflattenExtend = extend.extend;
+  if (extendOflattenExtend) {
+    flattenExtend(extendOflattenExtend, stack, context);
+  }
+  return stack;
+};
+const flattenExtend = (extend, stack, context) => {
+  if (!extend) return stack;
+  if ((0, import_utils.isArray)(extend)) return extractArrayExtend(extend, stack, context);
+  if ((0, import_utils.isString)(extend)) extend = fallbackStringExtend(extend, context);
+  stack.push(extend);
+  if (extend.extend) deepExtend(extend, stack, context);
+  return stack;
+};
+const deepMergeExtend = (element, extend) => {
+  for (const e in extend) {
+    if (["parent", "node", "__element"].indexOf(e) > -1) continue;
+    const elementProp = element[e];
+    const extendProp = extend[e];
+    if (elementProp === void 0) {
+      element[e] = extendProp;
+    } else if ((0, import_utils.isObject)(elementProp) && (0, import_utils.isObject)(extendProp)) {
+      deepMergeExtend(elementProp, extendProp);
+    } else if ((0, import_utils.isArray)(elementProp) && (0, import_utils.isArray)(extendProp)) {
+      element[e] = elementProp.concat(extendProp);
+    } else if ((0, import_utils.isArray)(elementProp) && (0, import_utils.isObject)(extendProp)) {
+      const obj = deepMergeExtend({}, elementProp);
+      element[e] = deepMergeExtend(obj, extendProp);
+    } else if (elementProp === void 0 && (0, import_utils.isFunction)(extendProp)) {
+      element[e] = extendProp;
+    }
+  }
+  return element;
+};
+const cloneAndMergeArrayExtend = (stack) => {
+  return stack.reduce((a, c) => {
+    return deepMergeExtend(a, (0, import_utils.deepClone)(c));
+  }, {});
+};
+const fallbackStringExtend = (extend, context, options = {}, variant) => {
+  const COMPONENTS = context && context.components || options.components;
+  const PAGES = context && context.pages || options.pages;
+  if ((0, import_utils.isString)(extend)) {
+    const componentExists = COMPONENTS && (COMPONENTS[extend + "." + variant] || COMPONENTS[extend] || COMPONENTS["smbls." + extend]);
+    const pageExists = PAGES && extend.startsWith("/") && PAGES[extend];
+    if (componentExists) return componentExists;
+    else if (pageExists) return pageExists;
+    else {
+      if (options.verbose && (0, import_utils.isNotProduction)()) {
+        console.warn("Extend is string but component was not found:", extend);
+      }
+      return {};
+    }
+  }
+  return extend;
+};
+const jointStacks = (extendStack, childExtendStack) => {
+  return [].concat(extendStack.slice(0, 1)).concat(childExtendStack.slice(0, 1)).concat(extendStack.slice(1)).concat(childExtendStack.slice(1));
+};
+const getExtendStack = (extend, context) => {
+  if (!extend) return [];
+  if (extend.__hash) return getHashedExtend(extend) || [];
+  const stack = flattenExtend(extend, [], context);
+  return getExtendStackRegistry(extend, stack);
+};
+const getExtendMerged = (extend) => {
+  const stack = getExtendStack(extend);
+  return cloneAndMergeArrayExtend(stack);
+};

package/dist/cjs/utils/propEvents.js

@@ -0,0 +1,39 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var propEvents_exports = {};
+__export(propEvents_exports, {
+  propagateEventsFromProps: () => propagateEventsFromProps
+});
+module.exports = __toCommonJS(propEvents_exports);
+var import_utils = require("@domql/utils");
+const propagateEventsFromProps = (element) => {
+  const { props, on } = element;
+  const eventKeysFromProps = Object.keys(props).filter((key) => key.startsWith("on"));
+  eventKeysFromProps.forEach((v) => {
+    const eventName = (0, import_utils.lowercaseFirstLetter)(v.split("on")[1]);
+    const origEvent = on[eventName];
+    const funcFromProps = props[v];
+    if ((0, import_utils.isFunction)(origEvent)) {
+      on[eventName] = (...args) => {
+        const originalEventRetunrs = origEvent(...args);
+        if (originalEventRetunrs !== false) return funcFromProps(...args);
+      };
+    } else on[eventName] = funcFromProps;
+  });
+};

package/dist/esm/children.js

@@ -1,7 +1,7 @@
 import {
   concatAddExtends,
   deepClone,
-  execPromise,
+  exec,
   getChildStateInKey,
   isArray,
   isDefined,
@@ -13,10 +13,12 @@ import {
   isString,
   matchesComponentNaming
 } from "@domql/utils";
-async function setChildren(param, element, opts) {
+function setChildren(param, element, opts) {
   let { children, __ref: ref, state } = element;
   let { childrenAs } = element.props || {};
-  children = await execPromise(param, element, state) || await execPromise(children, element, state);
+  let execParam = exec(param, element, state);
+  let execChildren = exec(children, element, state);
+  children = execParam || execChildren;
   if (children) {
     if (isState(children)) children = children.parse();
     if (isString(children) || isNumber(children)) {

package/dist/esm/create.js

@@ -23,22 +23,22 @@ import { addMethods } from "./methods/set.js";
 import { assignKeyAsClassname } from "./mixins/classList.js";
 import { throughInitialExec, throughInitialDefine } from "./iterate.js";
 const ENV = "development";
-const create = async (props, parentEl, passedKey, options = OPTIONS.create || {}, attachOptions) => {
+const create = (props, parentEl, passedKey, options = OPTIONS.create || {}, attachOptions) => {
   cacheOptions(options);
   const element = createElement(props, parentEl, passedKey, options, ROOT);
   if (!element) return;
   const { key, parent, __ref: ref } = element;
   createRoot(element, parent);
   applyExtends(element, parent, options);
-  propertizeElement.call(element, element);
-  await triggerEventOn("start", element, options);
   if (options.onlyResolveExtends) {
     return onlyResolveExtends(element, parent, key, options);
   }
+  propertizeElement.call(element, element);
+  triggerEventOn("start", element, options);
   resetOptions(element, parent, options);
   addMethods(element, parent, options);
   createScope(element, parent);
-  await createState(element, parent);
+  createState(element, parent);
   if (element.scope === "state") element.scope = element.state;
   createIfConditionFlag(element, parent);
   initProps(element, parent, options);
@@ -49,13 +49,13 @@ const create = async (props, parentEl, passedKey, options = OPTIONS.create || {}
   if (element.node) {
     if (ref.__if) return assignNode(element, parent, key, attachOptions);
   }
-  const onInit = await triggerEventOn("init", element, options);
+  const onInit = triggerEventOn("init", element, options);
   if (onInit === false) return element;
   triggerEventOn("beforeClassAssign", element, options);
   assignKeyAsClassname(element);
-  await renderElement(element, parent, options, attachOptions);
+  renderElement(element, parent, options, attachOptions);
   addElementIntoParentChildren(element, parent);
-  await triggerEventOn("complete", element, options);
+  triggerEventOn("complete", element, options);
   return element;
 };
 const cacheOptions = (options) => {
@@ -76,7 +76,7 @@ const addElementIntoParentChildren = (element, parent) => {
   }
 };
 const visitedElements = /* @__PURE__ */ new WeakMap();
-const renderElement = async (element, parent, options, attachOptions) => {
+const renderElement = (element, parent, options, attachOptions) => {
   var _a, _b, _c;
   if (visitedElements.has(element)) {
     if (ENV === "test" || ENV === "development") {
@@ -85,17 +85,17 @@ const renderElement = async (element, parent, options, attachOptions) => {
   }
   visitedElements.set(element, true);
   const { __ref: ref, key } = element;
-  const createNestedChild = async () => {
+  const createNestedChild = () => {
     const isInfiniteLoopDetected = detectInfiniteLoop(ref.path);
     if (ref.__uniqId || isInfiniteLoopDetected) return;
-    await createNode(element, options);
+    createNode(element, options);
     ref.__uniqId = Math.random();
   };
   if (ENV === "test" || ENV === "development") {
-    await createNestedChild();
+    createNestedChild();
   } else {
     try {
-      await createNestedChild();
+      createNestedChild();
     } catch (e) {
       const path = ref.path;
       if (path.includes("ComponentsGrid")) {
@@ -122,10 +122,10 @@ const renderElement = async (element, parent, options, attachOptions) => {
   }
   assignNode(element, parent, key, attachOptions);
   applyAnimationFrame(element, options);
-  await triggerEventOn("render", element, options);
-  await triggerEventOn("renderRouter", element, options);
-  await triggerEventOn("done", element, options);
-  await triggerEventOn("create", element, options);
+  triggerEventOn("render", element, options);
+  triggerEventOn("renderRouter", element, options);
+  triggerEventOn("done", element, options);
+  triggerEventOn("create", element, options);
 };
 const onlyResolveExtends = (element, parent, key, options) => {
   const { __ref: ref } = element;

package/dist/esm/extend.js

@@ -0,0 +1,74 @@
+import { isFunction, exec, isProduction } from "@domql/utils";
+import {
+  getExtendStack,
+  jointStacks,
+  cloneAndMergeArrayExtend,
+  deepMergeExtend,
+  fallbackStringExtend
+} from "./utils/index.js";
+let mainExtend;
+const applyExtend = (element, parent, options = {}) => {
+  if (isFunction(element)) element = exec(element, parent);
+  const { props, __ref } = element;
+  let extend = (props == null ? void 0 : props.extends) || element.extends || element.extend;
+  const variant = props == null ? void 0 : props.variant;
+  const context = element.context || parent.context;
+  extend = fallbackStringExtend(extend, context, options, variant);
+  const extendStack = getExtendStack(extend, context);
+  delete element.extend;
+  let childExtendStack = [];
+  if (parent) {
+    element.parent = parent;
+    if (!options.ignoreChildExtend && !(props && props.ignoreChildExtend)) {
+      childExtendStack = getExtendStack(parent.childExtend, context);
+      const ignoreChildExtendRecursive = props && props.ignoreChildExtendRecursive;
+      if (parent.childExtendRecursive && !ignoreChildExtendRecursive) {
+        const canExtendRecursive = element.key !== "__text";
+        if (canExtendRecursive) {
+          const childExtendRecursiveStack = getExtendStack(
+            parent.childExtendRecursive,
+            context
+          );
+          childExtendStack = childExtendStack.concat(childExtendRecursiveStack);
+          element.childExtendRecursive = parent.childExtendRecursive;
+        }
+      }
+    }
+  }
+  const extendLength = extendStack.length;
+  const childExtendLength = childExtendStack.length;
+  let stack = [];
+  if (extendLength && childExtendLength) {
+    stack = jointStacks(extendStack, childExtendStack);
+  } else if (extendLength) {
+    stack = extendStack;
+  } else if (childExtendLength) {
+    stack = childExtendStack;
+  } else if (!context.defaultExtends) return element;
+  if (context.defaultExtends) {
+    if (!mainExtend) {
+      const defaultOptionsExtend = getExtendStack(
+        context.defaultExtends,
+        context
+      );
+      mainExtend = cloneAndMergeArrayExtend(defaultOptionsExtend);
+      delete mainExtend.extend;
+    }
+    stack = [].concat(stack, mainExtend);
+  }
+  if (__ref) __ref.__extend = stack;
+  let mergedExtend = cloneAndMergeArrayExtend(stack);
+  const COMPONENTS = context && context.components || options.components;
+  const component = exec(element.component || mergedExtend.component, element);
+  if (component && COMPONENTS && COMPONENTS[component]) {
+    const componentExtend = cloneAndMergeArrayExtend(
+      getExtendStack(COMPONENTS[component])
+    );
+    mergedExtend = deepMergeExtend(componentExtend, mergedExtend);
+  }
+  const merged = deepMergeExtend(element, mergedExtend);
+  return merged;
+};
+export {
+  applyExtend
+};

package/dist/esm/iterate.js

@@ -1,6 +1,5 @@
 import {
   isObject,
-  exec,
   isFunction,
   isNumber,
   isString,
@@ -8,16 +7,23 @@ import {
   isContextComponent,
   isMethod,
   overwrite,
-  execPromise
+  exec
 } from "@domql/utils";
-const throughInitialExec = async (element, exclude = {}) => {
+const throughInitialExec = (element, exclude = {}) => {
   const { __ref: ref } = element;
   for (const param in element) {
     if (exclude[param]) continue;
     const prop = element[param];
     if (isFunction(prop) && !isMethod(param, element)) {
       ref.__exec[param] = prop;
-      element[param] = await prop(element, element.state, element.context);
+      const result = prop(element, element.state, element.context);
+      if (result && typeof result.then === "function") {
+        result.then((resolved) => {
+          element[param] = resolved;
+        });
+      } else {
+        element[param] = result;
+      }
     }
   }
 };
@@ -29,6 +35,12 @@ const throughUpdatedExec = (element, options = {}) => {
     const isDefinedParam = ref.__defineCache[param];
     if (isDefinedParam) continue;
     const newExec = ref.__exec[param](element, element.state, element.context);
+    if (newExec && typeof newExec.then === "function") {
+      newExec.then((resolved) => {
+        element[param] = resolved;
+      });
+      continue;
+    }
     const execReturnsString = isString(newExec) || isNumber(newExec);
     if (prop && prop.node && execReturnsString) {
       overwrite(prop, { text: newExec });
@@ -48,23 +60,37 @@ const throughUpdatedExec = (element, options = {}) => {
   }
   return changes;
 };
-const throughExecProps = async (element) => {
+const throughExecProps = (element) => {
   const { __ref: ref } = element;
   const { props } = element;
   for (const k in props) {
     const isDefine = k.startsWith("is") || k.startsWith("has") || k.startsWith("use");
     const cachedExecProp = ref.__execProps[k];
     if (isFunction(cachedExecProp)) {
-      props[k] = await execPromise(cachedExecProp, element);
+      const result = exec(cachedExecProp, element);
+      if (result && typeof result.then === "function") {
+        result.then((resolved) => {
+          props[k] = resolved;
+        });
+      } else {
+        props[k] = result;
+      }
     } else if (isDefine && isFunction(props[k])) {
       ref.__execProps[k] = props[k];
-      props[k] = await execPromise(props[k], element);
+      const result = exec(props[k], element);
+      if (result && typeof result.then === "function") {
+        result.then((resolved) => {
+          props[k] = resolved;
+        });
+      } else {
+        props[k] = result;
+      }
     }
   }
 };
 const isPropertyInDefines = (key, element) => {
 };
-const throughInitialDefine = async (element) => {
+const throughInitialDefine = (element) => {
   const { define, context, __ref: ref } = element;
   let defineObj = {};
   const hasGlobalDefine = context && isObject(context.define);
@@ -74,23 +100,38 @@ const throughInitialDefine = async (element) => {
     let elementProp = element[param];
     if (isFunction(elementProp) && !isMethod(param, element)) {
       ref.__exec[param] = elementProp;
-      const execParam2 = elementProp = await execPromise(elementProp, element);
-      if (execParam2) {
-        elementProp = element[param] = execParam2.parse ? execParam2.parse() : execParam2;
-        ref.__defineCache[param] = elementProp;
+      let execParam2 = exec(elementProp, element);
+      if (execParam2 && typeof execParam2.then === "function") {
+        execParam2.then((resolved) => {
+          elementProp = element[param] = resolved && resolved.parse ? resolved.parse() : resolved;
+          if (resolved) {
+            ref.__defineCache[param] = elementProp;
+          }
+        });
+      } else {
+        elementProp = element[param] = execParam2 && execParam2.parse ? execParam2.parse() : execParam2;
+        if (execParam2) {
+          ref.__defineCache[param] = elementProp;
+        }
       }
     }
-    const execParam = await defineObj[param](
+    const execParam = defineObj[param](
       elementProp,
       element,
       element.state,
       element.context
     );
-    if (execParam) element[param] = execParam;
+    if (execParam && typeof execParam.then === "function") {
+      execParam.then((resolved) => {
+        if (resolved) element[param] = resolved;
+      });
+    } else if (execParam) {
+      element[param] = execParam;
+    }
   }
   return element;
 };
-const throughUpdatedDefine = async (element) => {
+const throughUpdatedDefine = (element) => {
   const { context, define, __ref: ref } = element;
   const changes = {};
   let obj = {};
@@ -99,15 +140,29 @@ const throughUpdatedDefine = async (element) => {
   for (const param in obj) {
     const execParam = ref.__exec[param];
     if (execParam) {
-      ref.__defineCache[param] = await execParam(
-        element,
-        element.state,
-        element.context
-      );
+      const result = execParam(element, element.state, element.context);
+      if (result && typeof result.then === "function") {
+        result.then((resolved) => {
+          ref.__defineCache[param] = resolved;
+        });
+      } else {
+        ref.__defineCache[param] = result;
+      }
+    }
+    const cached = exec(ref.__defineCache[param], element);
+    if (cached && typeof cached.then === "function") {
+      cached.then((resolved) => {
+      });
+      continue;
     }
-    const cached = await execPromise(ref.__defineCache[param], element);
     const newExecParam = typeof obj[param] === "function" ? obj[param](cached, element, element.state, element.context) : void 0;
-    if (newExecParam) element[param] = newExecParam;
+    if (newExecParam && typeof newExecParam.then === "function") {
+      newExecParam.then((resolved) => {
+        element[param] = resolved;
+      });
+    } else if (newExecParam) {
+      element[param] = newExecParam;
+    }
   }
   return changes;
 };

package/dist/esm/mixins/content.js

@@ -0,0 +1,53 @@
+import { isFunction, setContentKey } from "@domql/utils";
+import { set } from "../set.js";
+const updateContent = function(params, options) {
+  const element = this;
+  const ref = element.__ref;
+  const contentKey = ref.contentElementKey;
+  if (!element[contentKey]) return;
+  if (element[contentKey].update) element[contentKey].update(params, options);
+};
+const removeContent = function(el, opts = {}) {
+  const element = el || this;
+  const { __ref: ref } = element;
+  const contentElementKey = setContentKey(element, opts);
+  if (opts.contentElementKey !== "content") opts.contentElementKey = "content";
+  if (element[contentElementKey]) {
+    if (element[contentElementKey].node && element.node) {
+      if (element[contentElementKey].tag === "fragment")
+        element.node.innerHTML = "";
+      else {
+        const contentNode = element[contentElementKey].node;
+        if (contentNode.parentNode === element.node)
+          element.node.removeChild(element[contentElementKey].node);
+      }
+    }
+    const { __cached } = ref;
+    if (__cached && __cached[contentElementKey]) {
+      if (__cached[contentElementKey].tag === "fragment")
+        __cached[contentElementKey].parent.node.innerHTML = "";
+      else if (__cached[contentElementKey] && isFunction(__cached[contentElementKey].remove))
+        __cached[contentElementKey].remove();
+    }
+    ref.__children.splice(ref.__children.indexOf(element[contentElementKey]), 1);
+    delete element[contentElementKey];
+  }
+};
+function setContent(param, element, node, opts) {
+  var _a;
+  const contentElementKey = setContentKey(element, opts);
+  if (param && element) {
+    if ((_a = element[contentElementKey]) == null ? void 0 : _a.update) {
+      element[contentElementKey].update({}, opts);
+    } else {
+      set.call(element, param, opts);
+    }
+  }
+}
+var content_default = setContent;
+export {
+  content_default as default,
+  removeContent,
+  setContent,
+  updateContent
+};

package/dist/esm/mixins/html.js

@@ -1,7 +1,7 @@
 import { exec } from "@domql/utils";
 function html(param, element, node) {
   var _a;
-  const prop = exec(param, element) || exec((_a = element == null ? void 0 : element.props) == null ? void 0 : _a.html, element);
+  const prop = exec(((_a = element == null ? void 0 : element.props) == null ? void 0 : _a.html) || param, element);
   const { __ref } = element;
   if (prop !== __ref.__html) {
     if (node.nodeName === "SVG") node.textContent = prop;

package/dist/esm/mixins/registry.js

@@ -1,4 +1,4 @@
-import attr from "./attr.js";
+import { attr } from "./attr.js";
 import { classList } from "./classList.js";
 import data from "./data.js";
 import html from "./html.js";

package/dist/esm/mixins/scope.js

@@ -1,5 +1,5 @@
 import { isFunction, isObject } from "@domql/utils";
-async function scope(params, element, node) {
+function scope(params, element, node) {
   if (!isObject(params)) return;
   for (const scopeItem in params) {
     const value = params[scopeItem];

package/dist/esm/mixins/state.js

@@ -1,6 +1,6 @@
-import { execPromise, isObject, STATE_METHODS } from "@domql/utils";
-async function state(params, element, node) {
-  const state2 = await execPromise(params, element);
+import { exec, isObject, STATE_METHODS } from "@domql/utils";
+function state(params, element, node) {
+  const state2 = exec(params, element);
   if (isObject(state2)) {
     for (const param in state2) {
       if (STATE_METHODS.includes(param)) continue;

package/dist/esm/mixins/text.js

@@ -1,9 +1,9 @@
 import { create } from "../create.js";
 import { exec, isString } from "@domql/utils";
-async function text(param, element, node) {
-  let prop = exec(param || element.props.text, element);
+function text(param, element, node) {
+  let prop = exec(element.props.text || param, element);
   if (isString(prop) && prop.includes("{{")) {
-    prop = element.call("replaceLiteralsWithObjectFields", prop);
+    prop = element.call("replaceLiteralsWithObjectFields", prop, element.state);
   }
   if (element.tag === "string") {
     node.nodeValue = prop;
@@ -12,7 +12,7 @@ async function text(param, element, node) {
       if (element.__text.text === prop) return;
       element.__text.text = prop;
       if (element.__text.node) element.__text.node.nodeValue = prop;
-    } else await create({ tag: "string", text: prop }, element, "__text");
+    } else create({ tag: "string", text: prop }, element, "__text");
   }
 }
 var text_default = text;