@symbo.ls/create 2.11.239 → 2.11.243

package/dist/cjs/bundle/index.js

@@ -213,11 +213,11 @@ var require_types = __commonJS({
       isFunction: () => isFunction4,
       isNot: () => isNot2,
       isNull: () => isNull,
-      isNumber: () => isNumber,
+      isNumber: () => isNumber2,
       isObject: () => isObject12,
       isObjectLike: () => isObjectLike3,
       isString: () => isString11,
-      isUndefined: () => isUndefined4
+      isUndefined: () => isUndefined5
     });
     module2.exports = __toCommonJS2(types_exports);
     var import_node = require_node();
@@ -227,7 +227,7 @@ var require_types = __commonJS({
       return typeof arg === "object" && arg.constructor === Object;
     };
     var isString11 = (arg) => typeof arg === "string";
-    var isNumber = (arg) => typeof arg === "number";
+    var isNumber2 = (arg) => typeof arg === "number";
     var isFunction4 = (arg) => typeof arg === "function";
     var isBoolean = (arg) => arg === true || arg === false;
     var isNull = (arg) => arg === null;
@@ -239,9 +239,9 @@ var require_types = __commonJS({
       return typeof arg === "object";
     };
     var isDefined2 = (arg) => {
-      return isObject12(arg) || isObjectLike3(arg) || isString11(arg) || isNumber(arg) || isFunction4(arg) || isArray6(arg) || isObjectLike3(arg) || isBoolean(arg) || isDate(arg) || isNull(arg);
+      return isObject12(arg) || isObjectLike3(arg) || isString11(arg) || isNumber2(arg) || isFunction4(arg) || isArray6(arg) || isObjectLike3(arg) || isBoolean(arg) || isDate(arg) || isNull(arg);
     };
-    var isUndefined4 = (arg) => {
+    var isUndefined5 = (arg) => {
       return arg === void 0;
     };
     var TYPES = {
@@ -250,7 +250,7 @@ var require_types = __commonJS({
       object: isObject12,
       string: isString11,
       date: isDate,
-      number: isNumber,
+      number: isNumber2,
       null: isNull,
       function: isFunction4,
       objectLike: isObjectLike3,
@@ -1455,11 +1455,11 @@ var require_tree = __commonJS({
       TREE: () => TREE
     });
     module2.exports = __toCommonJS2(tree_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_report = require_cjs2();
     var ROOT = {
       key: ":root",
-      node: import_utils25.document ? import_utils25.document.body : (0, import_report.report)("DocumentNotDefined", import_utils25.document)
+      node: import_utils26.document ? import_utils26.document.body : (0, import_report.report)("DocumentNotDefined", import_utils26.document)
     };
     var TREE = ROOT;
   }
@@ -1495,12 +1495,12 @@ var require_on = __commonJS({
       triggerEventOnUpdate: () => triggerEventOnUpdate
     });
     module2.exports = __toCommonJS2(on_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var applyEvent = (param, element, state, context, options) => {
       return param(element, state || element.state, context || element.context, options);
     };
     var triggerEventOn = (param, element, options) => {
-      if (element.on && (0, import_utils25.isFunction)(element.on[param])) {
+      if (element.on && (0, import_utils26.isFunction)(element.on[param])) {
         const { state, context } = element;
         return applyEvent(element.on[param], element, state, context, options);
       }
@@ -1509,7 +1509,7 @@ var require_on = __commonJS({
       return param(updatedObj, element, state || element.state, context || element.context, options);
     };
     var triggerEventOnUpdate = (param, updatedObj, element, options) => {
-      if (element.on && (0, import_utils25.isFunction)(element.on[param])) {
+      if (element.on && (0, import_utils26.isFunction)(element.on[param])) {
         const { state, context } = element;
         return applyEventUpdate(element.on[param], updatedObj, element, state, context, options);
       }
@@ -1520,7 +1520,7 @@ var require_on = __commonJS({
         if (param === "init" || param === "beforeClassAssign" || param === "render" || param === "renderRouter" || param === "attachNode" || param === "stateInit" || param === "stateCreated" || param === "initStateUpdated" || param === "stateUpdated" || param === "initUpdate" || param === "update")
           continue;
         const appliedFunction = element.on[param];
-        if ((0, import_utils25.isFunction)(appliedFunction)) {
+        if ((0, import_utils26.isFunction)(appliedFunction)) {
           node2.addEventListener(param, (event) => {
             const { state, context } = element;
             appliedFunction(event, element, state, context);
@@ -1558,10 +1558,10 @@ var require_can = __commonJS({
     });
     module2.exports = __toCommonJS2(can_exports);
     var import_report = require_cjs2();
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var canRender = (element) => {
       const tag = element.tag || "div";
-      return (0, import_utils25.isValidHtmlTag)(tag) || (0, import_report.report)("HTMLInvalidTag");
+      return (0, import_utils26.isValidHtmlTag)(tag) || (0, import_report.report)("HTMLInvalidTag");
     };
   }
 });
@@ -1652,7 +1652,7 @@ var require_cache = __commonJS({
     module2.exports = __toCommonJS2(cache_exports);
     var import_report = require_cjs2();
     var import_event = require_cjs3();
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var cache2 = {};
     var createHTMLNode = (element) => {
       const { tag } = element;
@@ -1671,20 +1671,20 @@ var require_cache = __commonJS({
     };
     var detectTag = (element) => {
       let { tag, key, props: props4 } = element;
-      tag = (0, import_utils25.exec)(tag, element);
+      tag = (0, import_utils26.exec)(tag, element);
       if (tag === true)
         tag = key;
-      if ((0, import_utils25.isObject)(props4) && (0, import_utils25.isString)(props4.tag)) {
-        const tagExists = (0, import_utils25.isValidHtmlTag)(props4.tag);
+      if ((0, import_utils26.isObject)(props4) && (0, import_utils26.isString)(props4.tag)) {
+        const tagExists = (0, import_utils26.isValidHtmlTag)(props4.tag);
         if (tagExists)
           return props4.tag;
       }
-      if ((0, import_utils25.isString)(tag)) {
-        const tagExists = (0, import_utils25.isValidHtmlTag)(tag);
+      if ((0, import_utils26.isString)(tag)) {
+        const tagExists = (0, import_utils26.isValidHtmlTag)(tag);
         if (tagExists)
           return tag;
       } else {
-        const isKeyATag = (0, import_utils25.isValidHtmlTag)(key);
+        const isKeyATag = (0, import_utils26.isValidHtmlTag)(key);
         if (isKeyATag)
           return key;
       }
@@ -1817,16 +1817,16 @@ var require_attr = __commonJS({
       default: () => attr_default
     });
     module2.exports = __toCommonJS2(attr_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_report = require_cjs2();
     var attr_default = (params, element, node2) => {
       const { __ref } = element;
       const { __attr } = __ref;
-      if ((0, import_utils25.isNot)("object"))
+      if ((0, import_utils26.isNot)("object"))
         (0, import_report.report)("HTMLInvalidAttr", params);
       if (params) {
         for (const attr in params) {
-          const val = (0, import_utils25.exec)(params[attr], element);
+          const val = (0, import_utils26.exec)(params[attr], element);
           if (val && node2.setAttribute)
             node2.setAttribute(attr, val);
           else if (node2.removeAttribute)
@@ -1869,7 +1869,7 @@ var require_classList = __commonJS({
       default: () => classList_default
     });
     module2.exports = __toCommonJS2(classList_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var assignKeyAsClassname = (element) => {
       const { key } = element;
       if (element.class === true)
@@ -1887,7 +1887,7 @@ var require_classList = __commonJS({
         else if (typeof param === "string")
           className += ` ${param}`;
         else if (typeof param === "function") {
-          className += ` ${(0, import_utils25.exec)(param, element)}`;
+          className += ` ${(0, import_utils26.exec)(param, element)}`;
         }
       }
       return className;
@@ -1898,9 +1898,9 @@ var require_classList = __commonJS({
       const { key } = element;
       if (params === true)
         params = element.class = { key };
-      if ((0, import_utils25.isString)(params))
+      if ((0, import_utils26.isString)(params))
         params = element.class = { default: params };
-      if ((0, import_utils25.isObject)(params))
+      if ((0, import_utils26.isObject)(params))
         params = classify2(params, element);
       const className = params.replace(/\s+/g, " ").trim();
       if (element.ref)
@@ -1984,7 +1984,7 @@ var require_set = __commonJS({
       default: () => set_default
     });
     module2.exports = __toCommonJS2(set_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_create = __toESM2(require_create4(), 1);
     var import_options3 = __toESM2(require_options(), 1);
     var import_mixins = require_mixins();
@@ -1994,7 +1994,7 @@ var require_set = __commonJS({
       const { __ref: ref, content } = element;
       const __contentRef = content && content.__ref;
       const lazyLoad = element.props && element.props.lazyLoad;
-      if (ref.__noCollectionDifference || __contentRef && __contentRef.__cached && (0, import_utils25.deepContains)(params, content)) {
+      if (ref.__noCollectionDifference || __contentRef && __contentRef.__cached && (0, import_utils26.deepContains)(params, content)) {
         return content.update();
       }
       if (options.preventContentUpdate === true)
@@ -2062,7 +2062,7 @@ var require_content = __commonJS({
       updateContent: () => updateContent
     });
     module2.exports = __toCommonJS2(content_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_set = __toESM2(require_set(), 1);
     var updateContent = function(params, options) {
       const element = this;
@@ -2085,7 +2085,7 @@ var require_content = __commonJS({
         if (__cached && __cached.content) {
           if (__cached.content.tag === "fragment")
             __cached.content.parent.node.innerHTML = "";
-          else if (__cached.content && (0, import_utils25.isFunction)(__cached.content.remove))
+          else if (__cached.content && (0, import_utils26.isFunction)(__cached.content.remove))
             __cached.content.remove();
         }
         delete element.content;
@@ -2130,15 +2130,15 @@ var require_data = __commonJS({
       default: () => data_default
     });
     module2.exports = __toCommonJS2(data_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_report = require_cjs2();
     var data_default = (params, element, node2) => {
       if (params && params.showOnNode) {
-        if (!(0, import_utils25.isObject)(params))
+        if (!(0, import_utils26.isObject)(params))
           (0, import_report.report)("HTMLInvalidData", params);
         for (const dataset in params) {
           if (dataset !== "showOnNode") {
-            node2.dataset[dataset] = (0, import_utils25.exec)(params[dataset], element);
+            node2.dataset[dataset] = (0, import_utils26.exec)(params[dataset], element);
           }
         }
       }
@@ -2172,9 +2172,9 @@ var require_html = __commonJS({
       default: () => html_default
     });
     module2.exports = __toCommonJS2(html_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var html_default = (param, element, node2) => {
-      const prop = (0, import_utils25.exec)(param, element);
+      const prop = (0, import_utils26.exec)(param, element);
       const { __ref } = element;
       if (prop !== __ref.__html) {
         if (node2.nodeName === "SVG")
@@ -2213,12 +2213,12 @@ var require_style = __commonJS({
       default: () => style_default2
     });
     module2.exports = __toCommonJS2(style_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_report = require_cjs2();
     var style_default2 = (params, element, node2) => {
       if (params) {
-        if ((0, import_utils25.isObject)(params))
-          (0, import_utils25.map)(node2.style, params, element);
+        if ((0, import_utils26.isObject)(params))
+          (0, import_utils26.map)(node2.style, params, element);
         else
           (0, import_report.report)("HTMLInvalidStyles", params);
       }
@@ -2253,11 +2253,11 @@ var require_text = __commonJS({
     });
     module2.exports = __toCommonJS2(text_exports);
     var import__ = require_cjs8();
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var text_default = (param, element, node2) => {
-      let prop = (0, import_utils25.exec)(param, element);
-      if ((0, import_utils25.isString)(prop) && prop.includes("{{")) {
-        prop = (0, import_utils25.replaceLiteralsWithObjectFields)(prop, element.state);
+      let prop = (0, import_utils26.exec)(param, element);
+      if ((0, import_utils26.isString)(prop) && prop.includes("{{")) {
+        prop = (0, import_utils26.replaceLiteralsWithObjectFields)(prop, element.state);
       }
       if (element.tag === "string") {
         node2.nodeValue = prop;
@@ -2361,11 +2361,11 @@ var require_methods = __commonJS({
       toggle: () => toggle
     });
     module2.exports = __toCommonJS2(methods_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_ignore = require_ignore();
     var parse3 = function() {
       const state = this;
-      if ((0, import_utils25.isObject)(state)) {
+      if ((0, import_utils26.isObject)(state)) {
         const obj = {};
         for (const param in state) {
           if (!import_ignore.IGNORE_STATE_PARAMS.includes(param)) {
@@ -2373,7 +2373,7 @@ var require_methods = __commonJS({
           }
         }
         return obj;
-      } else if ((0, import_utils25.isArray)(state)) {
+      } else if ((0, import_utils26.isArray)(state)) {
         return state.filter((item) => !import_ignore.IGNORE_STATE_PARAMS.includes(item));
       }
     };
@@ -2393,7 +2393,7 @@ var require_methods = __commonJS({
       const state = this;
       const element = state.__element;
       const stateKey = element.__ref.__state;
-      if ((0, import_utils25.isString)(stateKey)) {
+      if ((0, import_utils26.isString)(stateKey)) {
         element.parent.state.remove(stateKey, { isHoisted: true, ...options });
         return element.state;
       }
@@ -2406,7 +2406,7 @@ var require_methods = __commonJS({
         for (const key in state.__children) {
           const child = state.__children[key];
           if (child.state) {
-            if ((0, import_utils25.isArray)(child.state)) {
+            if ((0, import_utils26.isArray)(child.state)) {
               Object.defineProperty(child.state, "parent", {
                 value: state.parent,
                 enumerable: false,
@@ -2440,10 +2440,10 @@ var require_methods = __commonJS({
     };
     var add = function(value2, options = {}) {
       const state = this;
-      if ((0, import_utils25.isArray)(state)) {
+      if ((0, import_utils26.isArray)(state)) {
         state.push(value2);
         state.update(state.parse(), { overwrite: "replace", ...options });
-      } else if ((0, import_utils25.isObject)(state)) {
+      } else if ((0, import_utils26.isObject)(state)) {
         const key = Object.keys(state).length;
         state.update({ [key]: value2 }, options);
       }
@@ -2454,25 +2454,25 @@ var require_methods = __commonJS({
     };
     var remove = function(key, options = {}) {
       const state = this;
-      if ((0, import_utils25.isArray)(state))
-        (0, import_utils25.removeFromArray)(state, key);
-      if ((0, import_utils25.isObject)(state))
-        (0, import_utils25.removeFromObject)(state, key);
+      if ((0, import_utils26.isArray)(state))
+        (0, import_utils26.removeFromArray)(state, key);
+      if ((0, import_utils26.isObject)(state))
+        (0, import_utils26.removeFromObject)(state, key);
       return state.update(state.parse(), { replace: true, ...options });
     };
     var set5 = function(val, options = {}) {
       const state = this;
-      const value2 = (0, import_utils25.deepCloneWithExtnd)(val);
+      const value2 = (0, import_utils26.deepCloneWithExtnd)(val);
       return state.clean({ preventStateUpdate: true, ...options }).update(value2, { replace: true, ...options });
     };
     var reset = function(options = {}) {
       const state = this;
-      const value2 = (0, import_utils25.deepCloneWithExtnd)(state.parse());
+      const value2 = (0, import_utils26.deepCloneWithExtnd)(state.parse());
       return state.set(value2, { replace: true, ...options });
     };
     var apply = function(func, options = {}) {
       const state = this;
-      if ((0, import_utils25.isFunction)(func)) {
+      if ((0, import_utils26.isFunction)(func)) {
         func(state);
         return state.update(state.parse(), { replace: true, ...options });
       }
@@ -2512,7 +2512,7 @@ var require_inherit = __commonJS({
       isState: () => isState2
     });
     module2.exports = __toCommonJS2(inherit_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_ignore = require_ignore();
     var getParentStateInKey = (stateKey, parentState) => {
       if (!stateKey.includes("../"))
@@ -2564,11 +2564,11 @@ var require_inherit = __commonJS({
     var createInheritedState = (element, parent) => {
       const ref = element.__ref;
       const inheritedState = findInheritedState(element, parent);
-      if ((0, import_utils25.isUndefined)(inheritedState))
+      if ((0, import_utils26.isUndefined)(inheritedState))
         return element.state;
-      if ((0, import_utils25.is)(inheritedState)("object", "array")) {
-        return (0, import_utils25.deepCloneWithExtnd)(inheritedState, import_ignore.IGNORE_STATE_PARAMS);
-      } else if ((0, import_utils25.is)(inheritedState)("string", "number", "boolean")) {
+      if ((0, import_utils26.is)(inheritedState)("object", "array")) {
+        return (0, import_utils26.deepCloneWithExtnd)(inheritedState, import_ignore.IGNORE_STATE_PARAMS);
+      } else if ((0, import_utils26.is)(inheritedState)("string", "number", "boolean")) {
         ref.__stateType = typeof inheritedState;
         return { value: inheritedState };
       }
@@ -2577,12 +2577,12 @@ var require_inherit = __commonJS({
     var checkIfInherits = (element) => {
       const ref = element.__ref;
       const stateKey = ref.__state;
-      if (stateKey && (0, import_utils25.is)(stateKey)("number", "string", "boolean"))
+      if (stateKey && (0, import_utils26.is)(stateKey)("number", "string", "boolean"))
         return true;
       return false;
     };
     var isState2 = function(state) {
-      if (!(0, import_utils25.isObjectLike)(state))
+      if (!(0, import_utils26.isObjectLike)(state))
         return false;
       return state.update && state.parse && state.clean && state.create && state.parent && state.destroy && state.rootUpdate && state.parentUpdate && state.toggle && state.add && state.apply && state.__element && state.__children;
     };
@@ -2631,7 +2631,7 @@ var require_updateState = __commonJS({
     var import_report = require_cjs2();
     var import_event = require_cjs3();
     var import_ignore = require_ignore();
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_inherit = require_inherit();
     var STATE_UPDATE_OPTIONS = {
       overwrite: true,
@@ -2644,7 +2644,7 @@ var require_updateState = __commonJS({
       const state = this;
       const element = state.__element;
       if (!options.updateByState)
-        (0, import_utils25.merge)(options, STATE_UPDATE_OPTIONS);
+        (0, import_utils26.merge)(options, STATE_UPDATE_OPTIONS);
       if (!state.__element)
         (0, import_report.report)("ElementOnStateIsNotDefined");
       if (options.preventInheritAtCurrentState === true) {
@@ -2674,10 +2674,10 @@ var require_updateState = __commonJS({
       const shallow = overwrite === "shallow";
       const merge22 = overwrite === "merge";
       if (merge22) {
-        (0, import_utils25.deepMerge)(state, obj, import_ignore.IGNORE_STATE_PARAMS);
+        (0, import_utils26.deepMerge)(state, obj, import_ignore.IGNORE_STATE_PARAMS);
         return;
       }
-      const overwriteFunc = shallow ? import_utils25.overwriteShallow : import_utils25.overwriteDeep;
+      const overwriteFunc = shallow ? import_utils26.overwriteShallow : import_utils26.overwriteDeep;
       overwriteFunc(state, obj, import_ignore.IGNORE_STATE_PARAMS);
     };
     var hoistStateUpdate = (state, obj, options) => {
@@ -2699,7 +2699,7 @@ var require_updateState = __commonJS({
       const changesValue = (0, import_inherit.createChangesByKey)(stateKey, passedValue);
       const targetParent = findGrandParentState || parent.state;
       if (options.replace)
-        (0, import_utils25.overwriteDeep)(targetParent, changesValue || value2);
+        (0, import_utils26.overwriteDeep)(targetParent, changesValue || value2);
       targetParent.update(changesValue, {
         execStateFunction: false,
         isHoisted: true,
@@ -2768,7 +2768,7 @@ var require_create2 = __commonJS({
     });
     module2.exports = __toCommonJS2(create_exports);
     var import_event = require_cjs3();
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_ignore = require_ignore();
     var import_methods = require_methods();
     var import_updateState = require_updateState();
@@ -2782,13 +2782,13 @@ var require_create2 = __commonJS({
       if (objectizeState === false)
         return parent.state || {};
       else
-        element.state = (0, import_utils25.deepCloneWithExtnd)(objectizeState, import_ignore.IGNORE_STATE_PARAMS);
+        element.state = (0, import_utils26.deepCloneWithExtnd)(objectizeState, import_ignore.IGNORE_STATE_PARAMS);
       const whatInitReturns = (0, import_event.triggerEventOn)("stateInit", element, options);
       if (whatInitReturns === false)
         return element.state;
       if ((0, import_inherit.checkIfInherits)(element)) {
         const inheritedState = (0, import_inherit.createInheritedState)(element, parent);
-        element.state = (0, import_utils25.isUndefined)(inheritedState) ? {} : inheritedState;
+        element.state = (0, import_utils26.isUndefined)(inheritedState) ? {} : inheritedState;
       }
       const dependentState = applyDependentState(element, element.state);
       if (dependentState)
@@ -2801,17 +2801,17 @@ var require_create2 = __commonJS({
       const { __ref: ref } = state;
       if (!ref)
         return;
-      const dependentState = (0, import_utils25.deepCloneWithExtnd)(ref, import_ignore.IGNORE_STATE_PARAMS);
+      const dependentState = (0, import_utils26.deepCloneWithExtnd)(ref, import_ignore.IGNORE_STATE_PARAMS);
       const newDepends = { [element.key]: dependentState };
-      ref.__depends = (0, import_utils25.isObject)(ref.__depends) ? { ...ref.__depends, ...newDepends } : newDepends;
+      ref.__depends = (0, import_utils26.isObject)(ref.__depends) ? { ...ref.__depends, ...newDepends } : newDepends;
       return dependentState;
     };
     var checkForTypes = (element) => {
       const { state, __ref: ref } = element;
-      if ((0, import_utils25.isFunction)(state)) {
+      if ((0, import_utils26.isFunction)(state)) {
         ref.__state = state;
-        return (0, import_utils25.exec)(state, element);
-      } else if ((0, import_utils25.is)(state)("string", "number")) {
+        return (0, import_utils26.exec)(state, element);
+      } else if ((0, import_utils26.is)(state)("string", "number")) {
         ref.__state = state;
         return {};
       } else if (state === true) {
@@ -2859,7 +2859,7 @@ var require_create2 = __commonJS({
         __children: {},
         __root: ref.__root ? ref.__root.state : state
       };
-      if ((0, import_utils25.isArray)(state)) {
+      if ((0, import_utils26.isArray)(state)) {
         addProtoToArray(state, proto);
       } else {
         Object.setPrototypeOf(state, proto);
@@ -2927,16 +2927,16 @@ var require_state = __commonJS({
     });
     module2.exports = __toCommonJS2(state_exports);
     var import_state2 = require_cjs5();
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var state = (params, element, node2) => {
-      const state2 = (0, import_utils25.exec)(params, element);
-      if ((0, import_utils25.isObject)(state2)) {
+      const state2 = (0, import_utils26.exec)(params, element);
+      if ((0, import_utils26.isObject)(state2)) {
         for (const param in state2) {
           if (import_state2.IGNORE_STATE_PARAMS.includes(param))
             continue;
           if (!Object.hasOwnProperty.call(state2, param))
             continue;
-          element.state[param] = (0, import_utils25.exec)(state2[param], element);
+          element.state[param] = (0, import_utils26.exec)(state2[param], element);
         }
       }
       return element;
@@ -2971,13 +2971,13 @@ var require_scope = __commonJS({
       default: () => scope_default
     });
     module2.exports = __toCommonJS2(scope_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var scope_default = (params, element, node2) => {
-      if (!(0, import_utils25.isObject)(params))
+      if (!(0, import_utils26.isObject)(params))
         return;
       for (const scopeItem in params) {
         const value2 = params[scopeItem];
-        if ((0, import_utils25.isFunction)(value2)) {
+        if ((0, import_utils26.isFunction)(value2)) {
           element.scope[scopeItem] = value2.bind(element);
         } else {
           element.scope[scopeItem] = value2;
@@ -3184,7 +3184,7 @@ var require_methods2 = __commonJS({
       spotByPath: () => spotByPath
     });
     module2.exports = __toCommonJS2(methods_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_tree = require_tree();
     var import_mixins = require_mixins();
     var spotByPath = function(path) {
@@ -3217,9 +3217,9 @@ var require_methods2 = __commonJS({
     };
     var remove = function(params) {
       const element = this;
-      if ((0, import_utils25.isFunction)(element.node.remove))
+      if ((0, import_utils26.isFunction)(element.node.remove))
         element.node.remove();
-      else if (!(0, import_utils25.isProduction)()) {
+      else if (!(0, import_utils26.isProduction)()) {
         console.warn("This item cant be removed");
         element.log();
       }
@@ -3259,12 +3259,12 @@ var require_methods2 = __commonJS({
         if (v === "state") {
           if (element.__ref && element.__ref.__hasRootState)
             return;
-          if ((0, import_utils25.isFunction)(val && val.parse))
+          if ((0, import_utils26.isFunction)(val && val.parse))
             val = val.parse();
         } else if (v === "props") {
           const { __element, update, ...props4 } = element[v];
           obj[v] = props4;
-        } else if ((0, import_utils25.isDefined)(val))
+        } else if ((0, import_utils26.isDefined)(val))
           obj[v] = val;
       });
       return obj;
@@ -3275,7 +3275,7 @@ var require_methods2 = __commonJS({
       for (const v in obj) {
         if (excl.includes(v))
           return;
-        if ((0, import_utils25.isObjectLike)(obj[v])) {
+        if ((0, import_utils26.isObjectLike)(obj[v])) {
           obj[v] = parseDeep.call(obj[v], excl);
         }
       }
@@ -3393,18 +3393,18 @@ var require_inherit2 = __commonJS({
       inheritParentProps: () => inheritParentProps
     });
     module2.exports = __toCommonJS2(inherit_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var objectizeStringProperty = (propValue) => {
-      if ((0, import_utils25.is)(propValue)("string", "number")) {
+      if ((0, import_utils26.is)(propValue)("string", "number")) {
         return { inheritedString: propValue };
       }
       return propValue;
     };
     var inheritParentProps = (element, parent) => {
       let propsStack = [];
-      const parentProps = (0, import_utils25.exec)(parent, parent.state).props;
+      const parentProps = (0, import_utils26.exec)(parent, parent.state).props;
       const matchParent = parent.props && parentProps[element.key];
-      const matchParentIsString = (0, import_utils25.isString)(matchParent);
+      const matchParentIsString = (0, import_utils26.isString)(matchParent);
       const matchParentChildProps = parentProps && parentProps.childProps;
       if (matchParent) {
         if (matchParentIsString) {
@@ -3452,19 +3452,19 @@ var require_create3 = __commonJS({
       syncProps: () => syncProps
     });
     module2.exports = __toCommonJS2(create_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_ignore = require_ignore2();
     var import_inherit = require_inherit2();
     var createPropsStack = (element, parent) => {
       const { props: props4, __ref } = element;
       const propsStack = __ref.__props = (0, import_inherit.inheritParentProps)(element, parent);
-      if ((0, import_utils25.isObject)(props4))
+      if ((0, import_utils26.isObject)(props4))
         propsStack.push(props4);
       else if (props4 === "inherit" && parent.props)
         propsStack.push(parent.props);
       else if (props4)
         propsStack.push(props4);
-      if ((0, import_utils25.isArray)(__ref.__extend)) {
+      if ((0, import_utils26.isArray)(__ref.__extend)) {
         __ref.__extend.forEach((extend) => {
           if (extend.props && extend.props !== props4)
             propsStack.push(extend.props);
@@ -3479,10 +3479,10 @@ var require_create3 = __commonJS({
       props4.forEach((v) => {
         if (import_ignore.IGNORE_PROPS_PARAMS.includes(v))
           return;
-        const execProps = (0, import_utils25.exec)(v, element);
-        element.props = (0, import_utils25.deepMerge)(
+        const execProps = (0, import_utils26.exec)(v, element);
+        element.props = (0, import_utils26.deepMerge)(
           mergedProps,
-          (0, import_utils25.deepClone)(execProps, import_ignore.IGNORE_PROPS_PARAMS),
+          (0, import_utils26.deepClone)(execProps, import_ignore.IGNORE_PROPS_PARAMS),
           import_ignore.IGNORE_PROPS_PARAMS
         );
       });
@@ -3630,11 +3630,11 @@ var require_object2 = __commonJS({
       overwriteShallow: () => overwriteShallow2
     });
     module2.exports = __toCommonJS2(object_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_state2 = require_cjs5();
     var import_props = require_props();
     var import_methods = require_methods2();
-    var METHODS_EXL = (0, import_utils25.joinArrays)(
+    var METHODS_EXL = (0, import_utils26.joinArrays)(
       ["node", "state", "context", "extend"],
       import_methods.METHODS,
       import_state2.IGNORE_STATE_PARAMS,
@@ -3648,7 +3648,7 @@ var require_object2 = __commonJS({
         const extendProp = extend[e];
         if (elementProp === void 0) {
           element[e] = extendProp;
-        } else if ((0, import_utils25.isObjectLike)(elementProp) && (0, import_utils25.isObject)(extendProp)) {
+        } else if ((0, import_utils26.isObjectLike)(elementProp) && (0, import_utils26.isObject)(extendProp)) {
           deepMerge7(elementProp, extendProp);
         }
       }
@@ -3664,15 +3664,15 @@ var require_object2 = __commonJS({
       return o;
     };
     var deepClone4 = (obj, exclude = METHODS_EXL) => {
-      const o = (0, import_utils25.isArray)(obj) ? [] : {};
+      const o = (0, import_utils26.isArray)(obj) ? [] : {};
       for (const e in obj) {
         if (exclude.includes(e))
           continue;
         let objProp = obj[e];
-        if (e === "extend" && (0, import_utils25.isArray)(objProp)) {
+        if (e === "extend" && (0, import_utils26.isArray)(objProp)) {
           objProp = mergeArray(objProp, exclude);
         }
-        if ((0, import_utils25.isObjectLike)(objProp)) {
+        if ((0, import_utils26.isObjectLike)(objProp)) {
           o[e] = deepClone4(objProp, exclude);
         } else
           o[e] = objProp;
@@ -3711,7 +3711,7 @@ var require_object2 = __commonJS({
           continue;
         const objProp = obj[e];
         const paramsProp = params[e];
-        if ((0, import_utils25.isObjectLike)(objProp) && (0, import_utils25.isObjectLike)(paramsProp)) {
+        if ((0, import_utils26.isObjectLike)(objProp) && (0, import_utils26.isObjectLike)(paramsProp)) {
           overwriteDeep(objProp, paramsProp);
         } else if (paramsProp !== void 0) {
           obj[e] = paramsProp;
@@ -3720,7 +3720,7 @@ var require_object2 = __commonJS({
       return obj;
     };
     var mergeIfExisted = (a, b) => {
-      if ((0, import_utils25.isObjectLike)(a) && (0, import_utils25.isObjectLike)(b))
+      if ((0, import_utils26.isObjectLike)(a) && (0, import_utils26.isObjectLike)(b))
         return deepMerge7(a, b);
       return a || b;
     };
@@ -3728,7 +3728,7 @@ var require_object2 = __commonJS({
       return arr.reduce((a, c) => deepMerge7(a, deepClone4(c, exclude)), {});
     };
     var mergeAndCloneIfArray = (obj) => {
-      return (0, import_utils25.isArray)(obj) ? mergeArray(obj) : deepClone4(obj);
+      return (0, import_utils26.isArray)(obj) ? mergeArray(obj) : deepClone4(obj);
     };
     var flattenRecursive = (param, prop, stack = []) => {
       const objectized = mergeAndCloneIfArray(param);
@@ -3783,7 +3783,7 @@ var require_extendUtils = __commonJS({
       setHashedExtend: () => setHashedExtend
     });
     module2.exports = __toCommonJS2(extendUtils_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var ENV2 = "development";
     var generateHash = () => Math.random().toString(36).substring(2);
     var extendStackRegistry = {};
@@ -3793,7 +3793,7 @@ var require_extendUtils = __commonJS({
     };
     var setHashedExtend = (extend, stack) => {
       const hash2 = generateHash();
-      if (!(0, import_utils25.isString)(extend)) {
+      if (!(0, import_utils26.isString)(extend)) {
         extend.__hash = hash2;
       }
       extendStackRegistry[hash2] = stack;
@@ -3819,9 +3819,9 @@ var require_extendUtils = __commonJS({
     var flattenExtend = (extend, stack, context) => {
       if (!extend)
         return stack;
-      if ((0, import_utils25.isArray)(extend))
+      if ((0, import_utils26.isArray)(extend))
         return extractArrayExtend(extend, stack, context);
-      if ((0, import_utils25.isString)(extend))
+      if ((0, import_utils26.isString)(extend))
         extend = fallbackStringExtend(extend, context);
       stack.push(extend);
       if (extend.extend)
@@ -3834,9 +3834,9 @@ var require_extendUtils = __commonJS({
         if (["parent", "node", "__element"].indexOf(prop) > -1)
           continue;
         const objProp = obj[prop];
-        if ((0, import_utils25.isObject)(objProp)) {
+        if ((0, import_utils26.isObject)(objProp)) {
           o[prop] = deepCloneExtend(objProp);
-        } else if ((0, import_utils25.isArray)(objProp)) {
+        } else if ((0, import_utils26.isArray)(objProp)) {
           o[prop] = objProp.map((x) => x);
         } else
           o[prop] = objProp;
@@ -3851,14 +3851,14 @@ var require_extendUtils = __commonJS({
         const extendProp = extend[e];
         if (elementProp === void 0) {
           element[e] = extendProp;
-        } else if ((0, import_utils25.isObject)(elementProp) && (0, import_utils25.isObject)(extendProp)) {
+        } else if ((0, import_utils26.isObject)(elementProp) && (0, import_utils26.isObject)(extendProp)) {
           deepMergeExtend(elementProp, extendProp);
-        } else if ((0, import_utils25.isArray)(elementProp) && (0, import_utils25.isArray)(extendProp)) {
+        } else if ((0, import_utils26.isArray)(elementProp) && (0, import_utils26.isArray)(extendProp)) {
           element[e] = elementProp.concat(extendProp);
-        } else if ((0, import_utils25.isArray)(elementProp) && (0, import_utils25.isObject)(extendProp)) {
+        } else if ((0, import_utils26.isArray)(elementProp) && (0, import_utils26.isObject)(extendProp)) {
           const obj = deepMergeExtend({}, elementProp);
           element[e] = deepMergeExtend(obj, extendProp);
-        } else if (elementProp === void 0 && (0, import_utils25.isFunction)(extendProp)) {
+        } else if (elementProp === void 0 && (0, import_utils26.isFunction)(extendProp)) {
           element[e] = extendProp;
         }
       }
@@ -3871,7 +3871,7 @@ var require_extendUtils = __commonJS({
     };
     var fallbackStringExtend = (extend, context, options = {}) => {
       const COMPONENTS = context && context.components || options.components;
-      if ((0, import_utils25.isString)(extend)) {
+      if ((0, import_utils26.isString)(extend)) {
         const componentExists = COMPONENTS[extend] || COMPONENTS["smbls." + extend];
         if (COMPONENTS && componentExists) {
           return componentExists;
@@ -3928,27 +3928,27 @@ var require_extend = __commonJS({
       applyExtend: () => applyExtend
     });
     module2.exports = __toCommonJS2(extend_exports);
-    var import_utils25 = require_cjs();
-    var import_utils26 = require_utils();
+    var import_utils26 = require_cjs();
+    var import_utils27 = require_utils();
     var ENV2 = "development";
     var applyExtend = (element, parent, options = {}) => {
-      if ((0, import_utils25.isFunction)(element))
-        element = (0, import_utils25.exec)(element, parent);
+      if ((0, import_utils26.isFunction)(element))
+        element = (0, import_utils26.exec)(element, parent);
       let { extend, props: props4, context, __ref } = element;
-      extend = (0, import_utils26.fallbackStringExtend)(extend, context, options);
-      const extendStack = (0, import_utils26.getExtendStack)(extend, context);
+      extend = (0, import_utils27.fallbackStringExtend)(extend, context, options);
+      const extendStack = (0, import_utils27.getExtendStack)(extend, context);
       if (ENV2 !== "test" || ENV2 !== "development")
         delete element.extend;
       let childExtendStack = [];
       if (parent) {
         element.parent = parent;
         if (!options.ignoreChildExtend && !(props4 && props4.ignoreChildExtend)) {
-          childExtendStack = (0, import_utils26.getExtendStack)(parent.childExtend, context);
+          childExtendStack = (0, import_utils27.getExtendStack)(parent.childExtend, context);
           const ignoreChildExtendRecursive = props4 && props4.ignoreChildExtendRecursive;
           if (parent.childExtendRecursive && !ignoreChildExtendRecursive) {
             const canExtendRecursive = element.key !== "__text";
             if (canExtendRecursive) {
-              const childExtendRecursiveStack = (0, import_utils26.getExtendStack)(parent.childExtendRecursive, context);
+              const childExtendRecursiveStack = (0, import_utils27.getExtendStack)(parent.childExtendRecursive, context);
               childExtendStack = childExtendStack.concat(childExtendRecursiveStack);
               element.childExtendRecursive = parent.childExtendRecursive;
             }
@@ -3959,7 +3959,7 @@ var require_extend = __commonJS({
       const childExtendLength = childExtendStack.length;
       let stack = [];
       if (extendLength && childExtendLength) {
-        stack = (0, import_utils26.jointStacks)(extendStack, childExtendStack);
+        stack = (0, import_utils27.jointStacks)(extendStack, childExtendStack);
       } else if (extendLength) {
         stack = extendStack;
       } else if (childExtendLength) {
@@ -3967,19 +3967,19 @@ var require_extend = __commonJS({
       } else if (!options.extend)
         return element;
       if (options.extend) {
-        const defaultOptionsExtend = (0, import_utils26.getExtendStack)(options.extend, context);
+        const defaultOptionsExtend = (0, import_utils27.getExtendStack)(options.extend, context);
         stack = [].concat(stack, defaultOptionsExtend);
       }
       if (__ref)
         __ref.__extend = stack;
-      let mergedExtend = (0, import_utils26.cloneAndMergeArrayExtend)(stack);
+      let mergedExtend = (0, import_utils27.cloneAndMergeArrayExtend)(stack);
       const COMPONENTS = context && context.components || options.components;
-      const component = (0, import_utils25.exec)(element.component || mergedExtend.component, element);
+      const component = (0, import_utils26.exec)(element.component || mergedExtend.component, element);
       if (component && COMPONENTS && COMPONENTS[component]) {
-        const componentExtend = (0, import_utils26.cloneAndMergeArrayExtend)((0, import_utils26.getExtendStack)(COMPONENTS[component]));
-        mergedExtend = (0, import_utils26.deepMergeExtend)(componentExtend, mergedExtend);
+        const componentExtend = (0, import_utils27.cloneAndMergeArrayExtend)((0, import_utils27.getExtendStack)(COMPONENTS[component]));
+        mergedExtend = (0, import_utils27.deepMergeExtend)(componentExtend, mergedExtend);
       }
-      return (0, import_utils26.deepMergeExtend)(element, mergedExtend);
+      return (0, import_utils27.deepMergeExtend)(element, mergedExtend);
     };
   }
 });
@@ -4018,11 +4018,11 @@ var require_component = __commonJS({
       overwriteVariant: () => overwriteVariant
     });
     module2.exports = __toCommonJS2(component_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_extend = require_extend();
     var ENV2 = "development";
     var checkIfKeyIsComponent2 = (key) => {
-      const isFirstKeyString = (0, import_utils25.isString)(key);
+      const isFirstKeyString = (0, import_utils26.isString)(key);
       if (!isFirstKeyString)
         return;
       const firstCharKey = key.slice(0, 1);
@@ -4030,7 +4030,7 @@ var require_component = __commonJS({
     };
     var addAdditionalExtend = (newExtend, element) => {
       const { extend } = element;
-      const preserveExtend = (0, import_utils25.isArray)(extend) ? extend : [extend];
+      const preserveExtend = (0, import_utils26.isArray)(extend) ? extend : [extend];
       return {
         ...element,
         extend: [newExtend].concat(preserveExtend)
@@ -4055,12 +4055,12 @@ var require_component = __commonJS({
         };
       } else if (extend) {
         addAdditionalExtend(extendKey, element);
-      } else if ((0, import_utils25.isFunction)(element)) {
+      } else if ((0, import_utils26.isFunction)(element)) {
         console.log(element);
         return {
           extend: extendKey,
           tag,
-          props: { ...(0, import_utils25.exec)(element, parent) }
+          props: { ...(0, import_utils26.exec)(element, parent) }
         };
       }
     };
@@ -4073,8 +4073,8 @@ var require_component = __commonJS({
         return;
       const { components } = context;
       const { extend } = element;
-      const execExtend = (0, import_utils25.exec)(extend, element);
-      if ((0, import_utils25.isString)(execExtend)) {
+      const execExtend = (0, import_utils26.exec)(extend, element);
+      if ((0, import_utils26.isString)(execExtend)) {
         const componentExists = components[execExtend] || components["smbls." + execExtend];
         if (componentExists)
           element.extend = componentExists;
@@ -4088,29 +4088,29 @@ var require_component = __commonJS({
       }
     };
     var isVariant = (param) => {
-      if (!(0, import_utils25.isString)(param))
+      if (!(0, import_utils26.isString)(param))
         return;
       const firstCharKey = param.slice(0, 1);
       return firstCharKey === ".";
     };
     var hasVariantProp = (element) => {
       const { props: props4 } = element;
-      if ((0, import_utils25.isObject)(props4) && (0, import_utils25.isString)(props4.variant))
+      if ((0, import_utils26.isObject)(props4) && (0, import_utils26.isString)(props4.variant))
         return true;
     };
     var overwriteVariant = (element, variant, variantProps) => {
       let variantElement = element[variant];
       if (!variantElement)
         return;
-      const props4 = (0, import_utils25.isObject)(variantProps) ? variantProps : {};
-      if ((0, import_utils25.isString)(variantElement)) {
+      const props4 = (0, import_utils26.isObject)(variantProps) ? variantProps : {};
+      if ((0, import_utils26.isString)(variantElement)) {
         variantElement = {
           extend: [{ props: props4 }, variantElement]
         };
       } else if (variantElement.extend) {
         variantElement = addAdditionalExtend({ props: props4 }, variantElement);
       }
-      return (0, import_utils25.overwriteDeep)(element, (0, import_extend.applyExtend)(variantElement));
+      return (0, import_utils26.overwriteDeep)(element, (0, import_extend.applyExtend)(variantElement));
     };
     var applyVariant = (element) => {
       const { props: props4 } = element;
@@ -4185,8 +4185,8 @@ var require_iterate = __commonJS({
       throughUpdatedExec: () => throughUpdatedExec
     });
     module2.exports = __toCommonJS2(iterate_exports);
-    var import_utils25 = require_cjs();
-    var import_utils26 = require_utils();
+    var import_utils26 = require_cjs();
+    var import_utils27 = require_utils();
     var import_methods = require_methods2();
     var throughInitialExec = (element, exclude = {}) => {
       const { __ref: ref } = element;
@@ -4194,13 +4194,13 @@ var require_iterate = __commonJS({
         if (exclude[param])
           continue;
         const prop = element[param];
-        if ((0, import_utils25.isFunction)(prop) && !(0, import_methods.isMethod)(param) && !(0, import_utils26.isVariant)(param)) {
+        if ((0, import_utils26.isFunction)(prop) && !(0, import_methods.isMethod)(param) && !(0, import_utils27.isVariant)(param)) {
           ref.__exec[param] = prop;
           element[param] = prop(element, element.state);
         }
       }
     };
-    var throughUpdatedExec = (element, options = { excludes: import_utils26.METHODS_EXL }) => {
+    var throughUpdatedExec = (element, options = { excludes: import_utils27.METHODS_EXL }) => {
       const { __ref: ref } = element;
       const changes = {};
       for (const param in ref.__exec) {
@@ -4209,13 +4209,13 @@ var require_iterate = __commonJS({
         if (isDefinedParam)
           continue;
         const newExec = ref.__exec[param](element, element.state, element.context);
-        const execReturnsString = (0, import_utils25.isString)(newExec) || (0, import_utils25.isNumber)(newExec);
+        const execReturnsString = (0, import_utils26.isString)(newExec) || (0, import_utils26.isNumber)(newExec);
         if (prop && prop.node && execReturnsString) {
-          (0, import_utils26.overwrite)(prop, { text: newExec }, options);
+          (0, import_utils27.overwrite)(prop, { text: newExec }, options);
         } else if (newExec !== prop) {
-          if ((0, import_utils26.checkIfKeyIsComponent)(param)) {
-            const { extend, ...newElem } = (0, import_utils26.extendizeByKey)(newExec, element, param);
-            (0, import_utils26.overwrite)(prop, newElem, options);
+          if ((0, import_utils27.checkIfKeyIsComponent)(param)) {
+            const { extend, ...newElem } = (0, import_utils27.extendizeByKey)(newExec, element, param);
+            (0, import_utils27.overwrite)(prop, newElem, options);
           } else {
             ref.__cached[param] = changes[param] = prop;
             element[param] = newExec;
@@ -4227,16 +4227,16 @@ var require_iterate = __commonJS({
     var throughInitialDefine = (element) => {
       const { define, context, __ref: ref } = element;
       let defineObj = {};
-      const hasGlobalDefine = context && (0, import_utils25.isObject)(context.define);
-      if ((0, import_utils25.isObject)(define))
+      const hasGlobalDefine = context && (0, import_utils26.isObject)(context.define);
+      if ((0, import_utils26.isObject)(define))
         defineObj = { ...define };
       if (hasGlobalDefine)
         defineObj = { ...defineObj, ...context.define };
       for (const param in defineObj) {
         let elementProp = element[param];
-        if ((0, import_utils25.isFunction)(elementProp) && !(0, import_methods.isMethod)(param) && !(0, import_utils26.isVariant)(param)) {
+        if ((0, import_utils26.isFunction)(elementProp) && !(0, import_methods.isMethod)(param) && !(0, import_utils27.isVariant)(param)) {
           ref.__exec[param] = elementProp;
-          const execParam2 = elementProp = (0, import_utils25.exec)(elementProp, element);
+          const execParam2 = elementProp = (0, import_utils26.exec)(elementProp, element);
           if (execParam2) {
             elementProp = element[param] = execParam2.parse ? execParam2.parse() : execParam2;
             ref.__defineCache[param] = elementProp;
@@ -4252,15 +4252,15 @@ var require_iterate = __commonJS({
       const { context, define, __ref: ref } = element;
       const changes = {};
       let obj = {};
-      if ((0, import_utils25.isObject)(define))
+      if ((0, import_utils26.isObject)(define))
         obj = { ...define };
-      if ((0, import_utils25.isObject)(context && context.define))
+      if ((0, import_utils26.isObject)(context && context.define))
         obj = { ...obj, ...context.define };
       for (const param in obj) {
         const execParam = ref.__exec[param];
         if (execParam)
           ref.__defineCache[param] = execParam(element, element.state, element.context);
-        const cached = (0, import_utils25.exec)(ref.__defineCache[param], element);
+        const cached = (0, import_utils26.exec)(ref.__defineCache[param], element);
         const newExecParam = obj[param](cached, element, element.state, element.context);
         if (newExecParam)
           element[param] = newExecParam;
@@ -4296,7 +4296,7 @@ var require_applyParam = __commonJS({
       applyParam: () => applyParam
     });
     module2.exports = __toCommonJS2(applyParam_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_mixins = require_mixins();
     var applyParam = (param, element, options) => {
       const { node: node2, context, __ref: ref } = element;
@@ -4309,7 +4309,7 @@ var require_applyParam = __commonJS({
       if (!ref.__if)
         return;
       if (isGlobalTransformer && !hasContextDefine) {
-        if ((0, import_utils25.isFunction)(isGlobalTransformer)) {
+        if ((0, import_utils26.isFunction)(isGlobalTransformer)) {
           isGlobalTransformer(prop, element, node2, options);
           return;
         }
@@ -4356,7 +4356,7 @@ var require_node2 = __commonJS({
       default: () => node_default
     });
     module2.exports = __toCommonJS2(node_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_event = require_cjs3();
     var import_render = require_cjs4();
     var import_methods = require_methods2();
@@ -4364,7 +4364,7 @@ var require_node2 = __commonJS({
     var import_iterate = require_iterate();
     var import_mixins = require_mixins();
     var import_applyParam = require_applyParam();
-    var import_utils26 = require_utils();
+    var import_utils27 = require_utils();
     var ENV2 = "development";
     var createNode = (element, options) => {
       let { node: node2, tag, __ref: ref } = element;
@@ -4381,24 +4381,24 @@ var require_node2 = __commonJS({
       }
       if (ENV2 === "test" || ENV2 === "development" || options.alowRefReference) {
         node2.ref = element;
-        if ((0, import_utils25.isFunction)(node2.setAttribute))
+        if ((0, import_utils26.isFunction)(node2.setAttribute))
           node2.setAttribute("key", element.key);
       }
       (0, import_iterate.throughInitialDefine)(element);
       (0, import_iterate.throughInitialExec)(element);
       if (element.tag !== "string" && element.tag !== "fragment") {
-        if (isNewNode && (0, import_utils25.isObject)(element.on))
+        if (isNewNode && (0, import_utils26.isObject)(element.on))
           (0, import_event.applyEventsOnNode)(element);
       }
       for (const param in element) {
         const value2 = element[param];
-        if ((0, import_utils25.isUndefined)(value2) || (0, import_methods.isMethod)(param) || (0, import_utils26.isVariant)(param) || (0, import_utils25.isObject)(import_mixins.registry[param]))
+        if ((0, import_utils26.isUndefined)(value2) || (0, import_methods.isMethod)(param) || (0, import_utils27.isVariant)(param) || (0, import_utils26.isObject)(import_mixins.registry[param]))
           continue;
         const isElement = (0, import_applyParam.applyParam)(param, element, options);
         if (isElement) {
           const { hasDefine, hasContextDefine } = isElement;
           if (element[param] && !hasDefine && !hasContextDefine) {
-            const createAsync = () => (0, import_create.default)((0, import_utils25.exec)(value2, element), element, param, options);
+            const createAsync = () => (0, import_create.default)((0, import_utils26.exec)(value2, element), element, param, options);
             if (element.props && element.props.lazyLoad || options.lazyLoad) {
               window.requestAnimationFrame(() => createAsync());
             } else
@@ -4593,11 +4593,11 @@ var require_types2 = __commonJS({
       isFunction: () => isFunction4,
       isNot: () => isNot2,
       isNull: () => isNull,
-      isNumber: () => isNumber,
+      isNumber: () => isNumber2,
       isObject: () => isObject12,
       isObjectLike: () => isObjectLike3,
       isString: () => isString11,
-      isUndefined: () => isUndefined4
+      isUndefined: () => isUndefined5
     });
     module2.exports = __toCommonJS2(types_exports);
     var import_node = require_node3();
@@ -4607,7 +4607,7 @@ var require_types2 = __commonJS({
       return typeof arg === "object" && arg.constructor === Object;
     };
     var isString11 = (arg) => typeof arg === "string";
-    var isNumber = (arg) => typeof arg === "number";
+    var isNumber2 = (arg) => typeof arg === "number";
     var isFunction4 = (arg) => typeof arg === "function";
     var isBoolean = (arg) => arg === true || arg === false;
     var isNull = (arg) => arg === null;
@@ -4618,9 +4618,9 @@ var require_types2 = __commonJS({
       return typeof arg === "object";
     };
     var isDefined2 = (arg) => {
-      return isObject12(arg) || isObjectLike3(arg) || isString11(arg) || isNumber(arg) || isFunction4(arg) || isArray6(arg) || isObjectLike3(arg) || isBoolean(arg) || isNull(arg);
+      return isObject12(arg) || isObjectLike3(arg) || isString11(arg) || isNumber2(arg) || isFunction4(arg) || isArray6(arg) || isObjectLike3(arg) || isBoolean(arg) || isNull(arg);
     };
-    var isUndefined4 = (arg) => {
+    var isUndefined5 = (arg) => {
       return arg === void 0;
     };
     var TYPES = {
@@ -4628,7 +4628,7 @@ var require_types2 = __commonJS({
       array: isArray6,
       object: isObject12,
       string: isString11,
-      number: isNumber,
+      number: isNumber2,
       null: isNull,
       function: isFunction4,
       objectLike: isObjectLike3,
@@ -5603,7 +5603,7 @@ var require_methods3 = __commonJS({
       DEFAULT_METHODS: () => DEFAULT_METHODS
     });
     module2.exports = __toCommonJS2(methods_exports);
-    var import_utils25 = require_cjs6();
+    var import_utils26 = require_cjs6();
     var DEFAULT_METHODS = {
       key: {},
       tag: {},
@@ -5624,7 +5624,7 @@ var require_methods3 = __commonJS({
       text: (element, state) => {
         element.ref.text = {
           tag: "text",
-          text: (0, import_utils25.exec)(element.text, element, state)
+          text: (0, import_utils26.exec)(element.text, element, state)
         };
       },
       innerHTML: {},
@@ -5861,19 +5861,19 @@ var require_update2 = __commonJS({
       default: () => update_default
     });
     module2.exports = __toCommonJS2(update_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_event = require_cjs3();
     var import_methods = require_methods2();
     var import_props = require_props();
     var import_state2 = require_cjs5();
-    var import_utils26 = require_utils();
+    var import_utils27 = require_utils();
     var import_create = __toESM2(require_create4(), 1);
     var import_iterate = require_iterate();
     var import_mixins = require_mixins();
     var import_applyParam = require_applyParam();
     var import_options3 = __toESM2(require_options(), 1);
     var snapshot = {
-      snapshotId: import_utils25.createSnapshotId
+      snapshotId: import_utils26.createSnapshotId
     };
     var UPDATE_DEFAULT_OPTIONS = {
       stackChanges: false,
@@ -5881,7 +5881,7 @@ var require_update2 = __commonJS({
       preventRecursive: false,
       currentSnapshot: false,
       calleeElement: false,
-      excludes: import_utils26.METHODS_EXL
+      excludes: import_utils27.METHODS_EXL
     };
     var update = function(params = {}, options = UPDATE_DEFAULT_OPTIONS) {
       const element = this;
@@ -5891,14 +5891,14 @@ var require_update2 = __commonJS({
       if (preventInheritAtCurrentState && preventInheritAtCurrentState.__element === element)
         return;
       if (!excludes)
-        (0, import_utils25.merge)(options, UPDATE_DEFAULT_OPTIONS);
+        (0, import_utils26.merge)(options, UPDATE_DEFAULT_OPTIONS);
       let ref = element.__ref;
       if (!ref)
         ref = element.__ref = {};
       const [snapshotOnCallee, calleeElement, snapshotHasUpdated] = captureSnapshot(element, options);
       if (snapshotHasUpdated)
         return;
-      if ((0, import_utils25.isString)(params) || (0, import_utils25.isNumber)(params)) {
+      if ((0, import_utils26.isString)(params) || (0, import_utils26.isNumber)(params)) {
         params = { text: params };
       }
       const inheritState = inheritStateUpdates(element, options);
@@ -5909,7 +5909,7 @@ var require_update2 = __commonJS({
         return;
       if (ref.__if && !options.preventPropsUpdate) {
         const hasParentProps = parent.props && (parent.props[key] || parent.props.childProps);
-        const hasFunctionInProps = ref.__props.filter((v) => (0, import_utils25.isFunction)(v));
+        const hasFunctionInProps = ref.__props.filter((v) => (0, import_utils26.isFunction)(v));
         const props4 = params.props || hasParentProps || hasFunctionInProps.length;
         if (props4)
           (0, import_props.updateProps)(props4, element, parent);
@@ -5919,14 +5919,14 @@ var require_update2 = __commonJS({
         if (initUpdateReturns === false)
           return element;
       }
-      const overwriteChanges = (0, import_utils25.overwriteDeep)(element, params, import_utils26.METHODS_EXL);
+      const overwriteChanges = (0, import_utils26.overwriteDeep)(element, params, import_utils27.METHODS_EXL);
       const execChanges = (0, import_iterate.throughUpdatedExec)(element, { ignore: UPDATE_DEFAULT_OPTIONS });
       const definedChanges = (0, import_iterate.throughUpdatedDefine)(element);
       if (!options.isForced) {
         (0, import_event.triggerEventOn)("beforeClassAssign", element, options);
       }
       if (options.stackChanges && element.__stackChanges) {
-        const stackChanges = (0, import_utils25.merge)(definedChanges, (0, import_utils25.merge)(execChanges, overwriteChanges));
+        const stackChanges = (0, import_utils26.merge)(definedChanges, (0, import_utils26.merge)(execChanges, overwriteChanges));
         element.__stackChanges.push(stackChanges);
       }
       if (!ref.__if)
@@ -5937,16 +5937,16 @@ var require_update2 = __commonJS({
       for (const param in element) {
         const prop = element[param];
         const hasOnlyUpdateFalsy = options.onlyUpdate && (options.onlyUpdate !== param || !element.lookup(options.onlyUpdate));
-        const isInPreventUpdate = (0, import_utils25.isArray)(options.preventUpdate) && options.preventUpdate.includes(param);
-        const isInPreventDefineUpdate = (0, import_utils25.isArray)(options.preventDefineUpdate) && options.preventDefineUpdate.includes(param);
-        if ((0, import_utils25.isUndefined)(prop) || hasOnlyUpdateFalsy || isInPreventUpdate || isInPreventDefineUpdate || options.preventDefineUpdate === true || options.preventDefineUpdate === param || options.preventContentUpdate && param === "content" || (options.preventStateUpdate && param) === "state" || (0, import_methods.isMethod)(param) || (0, import_utils25.isObject)(import_mixins.registry[param]) || (0, import_utils26.isVariant)(param))
+        const isInPreventUpdate = (0, import_utils26.isArray)(options.preventUpdate) && options.preventUpdate.includes(param);
+        const isInPreventDefineUpdate = (0, import_utils26.isArray)(options.preventDefineUpdate) && options.preventDefineUpdate.includes(param);
+        if ((0, import_utils26.isUndefined)(prop) || hasOnlyUpdateFalsy || isInPreventUpdate || isInPreventDefineUpdate || options.preventDefineUpdate === true || options.preventDefineUpdate === param || options.preventContentUpdate && param === "content" || (options.preventStateUpdate && param) === "state" || (0, import_methods.isMethod)(param) || (0, import_utils26.isObject)(import_mixins.registry[param]) || (0, import_utils27.isVariant)(param))
           continue;
         if (options.preventStateUpdate === "once")
           options.preventStateUpdate = false;
         const isElement = (0, import_applyParam.applyParam)(param, element, options);
         if (isElement) {
           const { hasDefine, hasContextDefine } = isElement;
-          const canUpdate = (0, import_utils25.isObject)(prop) && !hasDefine && !hasContextDefine && !options.preventRecursive;
+          const canUpdate = (0, import_utils26.isObject)(prop) && !hasDefine && !hasContextDefine && !options.preventRecursive;
           if (!canUpdate)
             continue;
           const lazyLoad = element.props.lazyLoad || options.lazyLoad;
@@ -5955,7 +5955,7 @@ var require_update2 = __commonJS({
             currentSnapshot: snapshotOnCallee,
             calleeElement
           });
-          lazyLoad ? import_utils25.window.requestAnimationFrame(() => childUpdateCall()) : childUpdateCall();
+          lazyLoad ? import_utils26.window.requestAnimationFrame(() => childUpdateCall()) : childUpdateCall();
         }
       }
       if (!options.preventUpdateListener)
@@ -5978,7 +5978,7 @@ var require_update2 = __commonJS({
     };
     var checkIfOnUpdate = (element, parent, options) => {
       var _a;
-      if (!(0, import_utils25.isFunction)(element.if) || !parent)
+      if (!(0, import_utils26.isFunction)(element.if) || !parent)
         return;
       const ref = element.__ref;
       const ifPassed = element.if(element, element.state, element.context, options);
@@ -6004,7 +6004,7 @@ var require_update2 = __commonJS({
             node: hasPrevious || hasNext
           };
           const created = (0, import_create.default)(element, parent, element.key, import_options3.default.create, attachOptions);
-          if (options.preventUpdate !== true && element.on && (0, import_utils25.isFunction)(element.on.update)) {
+          if (options.preventUpdate !== true && element.on && (0, import_utils26.isFunction)(element.on.update)) {
             (0, import_event.applyEvent)(element.on.update, created, created.state);
           }
           return created;
@@ -6025,9 +6025,9 @@ var require_update2 = __commonJS({
         element.state = parent && parent.state || {};
         return;
       }
-      const shouldForceFunctionState = (0, import_utils25.isFunction)(stateKey) && !isHoisted && execStateFunction;
+      const shouldForceFunctionState = (0, import_utils26.isFunction)(stateKey) && !isHoisted && execStateFunction;
       if (shouldForceFunctionState) {
-        const execState = (0, import_utils25.exec)(stateKey, element);
+        const execState = (0, import_utils26.exec)(stateKey, element);
         state.set(execState, { ...options, preventUpdate: true, updatedByStateFunction: true });
         return;
       }
@@ -6095,7 +6095,7 @@ var require_set2 = __commonJS({
       addMethods: () => addMethods
     });
     module2.exports = __toCommonJS2(set_exports);
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_set = __toESM2(require_set(), 1);
     var import_update = __toESM2(require_update2(), 1);
     var import__ = require_methods2();
@@ -6116,7 +6116,7 @@ var require_set2 = __commonJS({
         nextElement: import__.nextElement.bind(element),
         previousElement: import__.previousElement.bind(element)
       };
-      if ((0, import_utils25.isDevelopment)())
+      if ((0, import_utils26.isDevelopment)())
         proto.log = import__.log.bind(element);
       Object.setPrototypeOf(element, proto);
     };
@@ -6172,7 +6172,7 @@ var require_create4 = __commonJS({
     var import_set = require_set2();
     var import_classList = require_classList();
     var import_iterate = require_iterate();
-    var import_utils25 = require_cjs();
+    var import_utils26 = require_cjs();
     var import_options3 = __toESM2(require_options(), 1);
     var import_component = require_component();
     var ENV2 = "development";
@@ -6185,7 +6185,7 @@ var require_create4 = __commonJS({
       parent = redefineParent(element, parent, key);
       key = createKey(element, parent, key);
       const ref = addRef(element, parent, key);
-      ref.__initialProps = (0, import_utils25.deepClone)(element.props, []);
+      ref.__initialProps = (0, import_utils26.deepClone)(element.props, []);
       applyContext(element, parent, options);
       (0, import_component.applyComponentFromContext)(element, parent, options);
       if (!ref.__skipCreate) {
@@ -6228,7 +6228,7 @@ var require_create4 = __commonJS({
         }
         return {};
       }
-      if ((0, import_utils25.isString)(key) && key.slice(0, 2 === "__")) {
+      if ((0, import_utils26.isString)(key) && key.slice(0, 2 === "__")) {
         if (ENV2 === "test" || ENV2 === "development") {
           console.warn(key, "seems like to be in __ref");
         }
@@ -6255,7 +6255,7 @@ var require_create4 = __commonJS({
     var redefineParent = (element, parent, key, options) => {
       if (!parent)
         return import_tree.ROOT;
-      if ((0, import_utils25.isNode)(parent)) {
+      if ((0, import_utils26.isNode)(parent)) {
         const parentNodeWrapper = { key: ":root", node: parent };
         import_tree.ROOT[`${key}_parent`] = parentNodeWrapper;
         return parentNodeWrapper;
@@ -6269,7 +6269,7 @@ var require_create4 = __commonJS({
       }
     };
     var createKey = (element, parent, key) => {
-      return ((0, import_utils25.exec)(key, element) || key || element.key || (0, import_utils25.generateKey)()).toString();
+      return ((0, import_utils26.exec)(key, element) || key || element.key || (0, import_utils26.generateKey)()).toString();
     };
     var addRef = (element, parent) => {
       if (element.__ref)
@@ -6301,7 +6301,7 @@ var require_create4 = __commonJS({
       (0, import_event.triggerEventOn)("render", element, options);
     };
     var checkIfPrimitive = (element) => {
-      return (0, import_utils25.is)(element)("string", "number");
+      return (0, import_utils26.is)(element)("string", "number");
     };
     var applyValueAsText = (element, parent, key) => {
       const extendTag = element.extend && element.extend.tag;
@@ -6325,7 +6325,7 @@ var require_create4 = __commonJS({
     };
     var createIfConditionFlag = (element, parent) => {
       const { __ref: ref } = element;
-      if ((0, import_utils25.isFunction)(element.if) && !element.if(element, element.state)) {
+      if ((0, import_utils26.isFunction)(element.if) && !element.if(element, element.state)) {
         delete ref.__if;
       } else
         ref.__if = true;
@@ -6384,7 +6384,7 @@ var require_create4 = __commonJS({
           ref.__children = [];
         (0, import_set.addMethods)(element, parent);
         (0, import_state2.createState)(element, parent);
-        if ((0, import_utils25.isFunction)(element.if)) {
+        if ((0, import_utils26.isFunction)(element.if)) {
           const ifPassed = element.if(element, element.state);
           if (!ifPassed) {
             delete ref.__if;
@@ -6404,7 +6404,7 @@ var require_create4 = __commonJS({
         (0, import_iterate.throughInitialDefine)(element);
         (0, import_iterate.throughInitialExec)(element);
         for (const k in element) {
-          if ((0, import_utils25.isUndefined)(element[k]) || (0, import_methods.isMethod)(k) || (0, import_utils25.isObject)(import_mixins.registry[k]) || (0, import_component.isVariant)(k))
+          if ((0, import_utils26.isUndefined)(element[k]) || (0, import_methods.isMethod)(k) || (0, import_utils26.isObject)(import_mixins.registry[k]) || (0, import_component.isVariant)(k))
             continue;
           const hasDefine = element.define && element.define[k];
           const contextHasDefine = element.context && element.context.define && element.context.define[k];
@@ -6412,7 +6412,7 @@ var require_create4 = __commonJS({
           if (!ref.__skipCreate && import_mixins.registry[k] && !optionsHasDefine) {
             continue;
           } else if (element[k] && !hasDefine && !optionsHasDefine && !contextHasDefine) {
-            create2((0, import_utils25.exec)(element[k], element), element, k, options);
+            create2((0, import_utils26.exec)(element[k], element), element, k, options);
           }
         }
       }
@@ -6645,7 +6645,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_key3 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/key.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/key.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -6682,7 +6682,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_env3 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/env.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/env.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -6718,7 +6718,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_globals3 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/globals.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/globals.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -6752,7 +6752,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_node4 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/node.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/node.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -6787,7 +6787,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_types3 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/types.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/types.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -6817,11 +6817,11 @@ var require_cjs10 = __commonJS({
           isFunction: () => isFunction22,
           isNot: () => isNot2,
           isNull: () => isNull,
-          isNumber: () => isNumber2,
+          isNumber: () => isNumber3,
           isObject: () => isObject82,
           isObjectLike: () => isObjectLike3,
           isString: () => isString102,
-          isUndefined: () => isUndefined4
+          isUndefined: () => isUndefined5
         });
         module22.exports = __toCommonJS22(types_exports);
         var import_node = require_node4();
@@ -6831,7 +6831,7 @@ var require_cjs10 = __commonJS({
           return typeof arg === "object" && arg.constructor === Object;
         };
         var isString102 = (arg) => typeof arg === "string";
-        var isNumber2 = (arg) => typeof arg === "number";
+        var isNumber3 = (arg) => typeof arg === "number";
         var isFunction22 = (arg) => typeof arg === "function";
         var isBoolean = (arg) => arg === true || arg === false;
         var isNull = (arg) => arg === null;
@@ -6843,9 +6843,9 @@ var require_cjs10 = __commonJS({
           return typeof arg === "object";
         };
         var isDefined2 = (arg) => {
-          return isObject82(arg) || isObjectLike3(arg) || isString102(arg) || isNumber2(arg) || isFunction22(arg) || isArray8(arg) || isObjectLike3(arg) || isBoolean(arg) || isDate(arg) || isNull(arg);
+          return isObject82(arg) || isObjectLike3(arg) || isString102(arg) || isNumber3(arg) || isFunction22(arg) || isArray8(arg) || isObjectLike3(arg) || isBoolean(arg) || isDate(arg) || isNull(arg);
         };
-        var isUndefined4 = (arg) => {
+        var isUndefined5 = (arg) => {
           return arg === void 0;
         };
         var TYPES = {
@@ -6854,7 +6854,7 @@ var require_cjs10 = __commonJS({
           object: isObject82,
           string: isString102,
           date: isDate,
-          number: isNumber2,
+          number: isNumber3,
           null: isNull,
           function: isFunction22,
           objectLike: isObjectLike3,
@@ -6875,7 +6875,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_array3 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/array.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/array.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -6986,7 +6986,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_string3 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/string.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/string.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -7049,7 +7049,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_object4 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/object.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/object.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -7557,7 +7557,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_function3 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/function.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/function.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -7630,7 +7630,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_log3 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/log.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/log.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -7669,7 +7669,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_cookie3 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/cookie.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/cookie.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -7723,7 +7723,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_tags4 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/tags.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/tags.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -7886,7 +7886,7 @@ var require_cjs10 = __commonJS({
       }
     });
     var require_cjs22 = __commonJS2({
-      "../../../domql/packages/utils/dist/cjs/index.js"(exports2, module22) {
+      "../../node_modules/@domql/utils/dist/cjs/index.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
         var __getOwnPropDesc22 = Object.getOwnPropertyDescriptor;
@@ -7920,10 +7920,10 @@ var require_cjs10 = __commonJS({
     });
     var src_exports2 = {};
     __export2(src_exports2, {
-      ANIMATION: () => ANIMATION,
+      ANIMATION: () => ANIMATION2,
       BREAKPOINTS: () => BREAKPOINTS,
       CASES: () => CASES,
-      COLOR: () => COLOR2,
+      COLOR: () => COLOR3,
       CONFIG: () => CONFIG3,
       CSS_VARS: () => CSS_VARS,
       DEVICES: () => DEVICES,
@@ -8089,7 +8089,7 @@ var require_cjs10 = __commonJS({
       return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
     };
     var import_globals2 = __toESM2(require_cjs15(), 1);
-    var import_utils25 = __toESM2(require_cjs22(), 1);
+    var import_utils26 = __toESM2(require_cjs22(), 1);
     var ENV2 = "development";
     var colorStringToRgbaArray = (color) => {
       if (color === "")
@@ -8217,11 +8217,11 @@ var require_cjs10 = __commonJS({
       return `rgba(${arr})`;
     };
     var getRgbTone = (rgb, tone) => {
-      if ((0, import_utils25.isString)(rgb) && rgb.includes("rgb"))
+      if ((0, import_utils26.isString)(rgb) && rgb.includes("rgb"))
         rgb = colorStringToRgbaArray(rgb).join(", ");
-      if ((0, import_utils25.isString)(rgb))
+      if ((0, import_utils26.isString)(rgb))
         rgb = rgb.split(",").map((v) => parseFloat(v.trim()));
-      if ((0, import_utils25.isNumber)(tone))
+      if ((0, import_utils26.isNumber)(tone))
         tone += "";
       const toHex = rgbArrayToHex(rgb);
       const abs2 = tone.slice(0, 1);
@@ -8286,7 +8286,7 @@ var require_cjs10 = __commonJS({
     };
     var import_utils52 = __toESM2(require_cjs22(), 1);
     var import_utils32 = __toESM2(require_cjs22());
-    var import_utils26 = __toESM2(require_cjs22());
+    var import_utils27 = __toESM2(require_cjs22());
     var toCamelCase2 = (str) => {
       return str.replace(/(?:^\w|[A-Z]|\b\w)/g, function(word, index) {
         return index === 0 ? word.toLowerCase() : word.toUpperCase();
@@ -8298,16 +8298,18 @@ var require_cjs10 = __commonJS({
         return val.split(" ");
       if ((0, import_utils32.isObject)(val))
         return Object.keys(val).map((v) => val[v]);
+      if ((0, import_utils32.isNumber)(val))
+        return [val];
       if ((0, import_utils32.isArray)(val))
         return val;
     };
     var import_utils42 = __toESM2(require_cjs22(), 1);
     var defaultConfig_exports = {};
     __export2(defaultConfig_exports, {
-      ANIMATION: () => ANIMATION,
+      ANIMATION: () => ANIMATION2,
       BREAKPOINTS: () => BREAKPOINTS,
       CASES: () => CASES,
-      COLOR: () => COLOR2,
+      COLOR: () => COLOR3,
       DEVICES: () => DEVICES,
       DOCUMENT: () => DOCUMENT,
       FONT: () => FONT2,
@@ -8422,7 +8424,7 @@ var require_cjs10 = __commonJS({
       vars: {}
     };
     var SPACING2 = defaultProps2;
-    var COLOR2 = {};
+    var COLOR3 = {};
     var GRADIENT2 = {};
     var THEME2 = {};
     var SHADOW = {};
@@ -8466,7 +8468,7 @@ var require_cjs10 = __commonJS({
       mobileXS: [375, 768]
     };
     var CASES = {};
-    var ANIMATION = {};
+    var ANIMATION2 = {};
     var SVG = {};
     var SVG_DATA = {};
     var TEMPLATES = {};
@@ -9687,7 +9689,7 @@ var require_cjs10 = __commonJS({
         });
       }
     };
-    var import_utils27 = __toESM2(require_cjs22(), 1);
+    var import_utils272 = __toESM2(require_cjs22(), 1);
     var isBorderStyle = (str) => [
       "none",
       "hidden",
@@ -9759,7 +9761,7 @@ var require_cjs10 = __commonJS({
         return v;
       }).join(" ");
     };
-    var transfromGap2 = (gap) => (0, import_utils27.isString)(gap) && gap.split(" ").map((v) => getSpacingByKey3(v, "gap").gap).join(" ");
+    var transfromGap2 = (gap) => (0, import_utils272.isString)(gap) && gap.split(" ").map((v) => getSpacingByKey3(v, "gap").gap).join(" ");
     var transformTransition = (transition) => {
       const arr = transition.split(" ");
       if (!arr.length)
@@ -9777,7 +9779,7 @@ var require_cjs10 = __commonJS({
       }).join(" ");
     };
     var transformDuration2 = (duration, props4, propertyName) => {
-      if (!(0, import_utils27.isString)(duration))
+      if (!(0, import_utils272.isString)(duration))
         return;
       return duration.split(",").map((v) => getTimingByKey2(v).timing || v).join(",");
     };
@@ -10012,8 +10014,8 @@ var require_cjs12 = __commonJS({
       router: () => router2
     });
     module2.exports = __toCommonJS2(router_exports);
-    var import_utils25 = require_cjs();
-    var getActiveRoute = (level = 0, route = import_utils25.window.location.pathname) => {
+    var import_utils26 = require_cjs();
+    var getActiveRoute = (level = 0, route = import_utils26.window.location.pathname) => {
       const routeArray = route.split("/");
       const activeRoute = routeArray[level + 1];
       if (activeRoute)
@@ -10027,7 +10029,7 @@ var require_cjs12 = __commonJS({
       initialRender: false,
       scrollToTop: true,
       scrollToNode: false,
-      scrollNode: import_utils25.document && import_utils25.document.documentElement,
+      scrollNode: import_utils26.document && import_utils26.document.documentElement,
       scrollBody: false,
       useFragment: false,
       updateState: true,
@@ -10042,13 +10044,13 @@ var require_cjs12 = __commonJS({
       const route = getActiveRoute(options.level, pathname);
       const content = element.routes[route || "/"] || element.routes["/*"];
       const scrollNode = options.scrollToNode ? rootNode : options.scrollNode;
-      const hashChanged = hash2 && hash2 !== import_utils25.window.location.hash.slice(1);
+      const hashChanged = hash2 && hash2 !== import_utils26.window.location.hash.slice(1);
       const pathChanged = pathname !== lastPathname;
       lastPathname = pathname;
       if (!content)
         return;
       if (options.pushState) {
-        import_utils25.window.history.pushState(state, null, pathname + (hash2 ? `#${hash2}` : ""));
+        import_utils26.window.history.pushState(state, null, pathname + (hash2 ? `#${hash2}` : ""));
       }
       if (pathChanged || !hashChanged) {
         if (options.updateState) {
@@ -10074,7 +10076,7 @@ var require_cjs12 = __commonJS({
         });
       }
       if (hash2) {
-        const activeNode = import_utils25.document.getElementById(hash2);
+        const activeNode = import_utils26.document.getElementById(hash2);
         if (activeNode) {
           const top = activeNode.getBoundingClientRect().top + rootNode.scrollTop - options.scrollToOffset || 0;
           scrollNode.scrollTo({
@@ -10469,7 +10471,7 @@ __export(src_exports, {
 });
 module.exports = __toCommonJS(src_exports);
 var import_domql = __toESM(require_cjs9(), 1);
-var import_utils24 = __toESM(require_cjs(), 1);
+var import_utils25 = __toESM(require_cjs(), 1);
 
 // src/utilImports.js
 var utilImports_exports = {};
@@ -10480,14 +10482,14 @@ __export(utilImports_exports, {
   findClosestNumberInFactory: () => findClosestNumberInFactory,
   formatDate: () => formatDate,
   init: () => init,
+  reInit: () => reInit,
   scratchSystem: () => import_scratch2.scratchSystem,
   scratchUtils: () => import_scratch2.scratchUtils,
   set: () => import_scratch2.set,
   toCamelCase: () => toCamelCase,
   toDashCase: () => toDashCase,
   toDescriptionCase: () => toDescriptionCase,
-  toTitleCase: () => toTitleCase,
-  updateReset: () => updateReset
+  toTitleCase: () => toTitleCase
 });
 var import_scratch2 = __toESM(require_cjs10(), 1);
 __reExport(utilImports_exports, __toESM(require_cjs(), 1));
@@ -10552,6 +10554,8 @@ var arrayzeValue = (val) => {
     return val.split(" ");
   if ((0, import_utils2.isObject)(val))
     return Object.keys(val).map((v) => val[v]);
+  if ((0, import_utils2.isNumber)(val))
+    return [val];
   if ((0, import_utils2.isArray)(val))
     return val;
 };
@@ -11966,7 +11970,7 @@ var init = (config, options = SET_OPTIONS) => {
 var UPDATE_OPTIONS = {
   emotion
 };
-var updateReset = (config, RC_FILE, options = UPDATE_OPTIONS) => {
+var reInit = (config, RC_FILE, options = UPDATE_OPTIONS) => {
   const emotion2 = options.emotion || emotion;
   const resultConfig = mergeWithLocalFile(config || {}, RC_FILE);
   const conf = (0, import_scratch.set)({
@@ -11989,6 +11993,7 @@ __export(uikit_exports, {
   AvatarBundle: () => AvatarBundle,
   AvatarChooser: () => AvatarChooser,
   AvatarIndicator: () => AvatarIndicator,
+  B: () => B,
   BalanceCard: () => BalanceCard,
   Banner: () => Banner,
   Block: () => Block,
@@ -12055,6 +12060,7 @@ __export(uikit_exports, {
   Headline: () => Headline,
   Hoverable: () => Hoverable,
   Hr: () => Hr,
+  I: () => I,
   Icon: () => Icon,
   IconCommonButton: () => IconCommonButton,
   IconTab: () => IconTab,
@@ -12790,6 +12796,12 @@ var Theme = {
     columnRule: ({ props: props4, deps }) => !(0, import_utils5.isUndefined)(props4.columnRule) && {
       columnRule: deps.transformBorder(props4.columnRule)
     },
+    filter: ({ props: props4, deps }) => !(0, import_utils5.isUndefined)(props4.filter) && {
+      filter: props4.filter
+    },
+    mixBlendMode: ({ props: props4, deps }) => !(0, import_utils5.isUndefined)(props4.mixBlendMode) && {
+      mixBlendMode: props4.mixBlendMode
+    },
     appearance: ({ props: props4 }) => !(0, import_utils5.isUndefined)(props4.appearance) && {
       appearance: props4.appearance
     }
@@ -13104,6 +13116,46 @@ var import_state = __toESM(require_cjs5());
 var import_utils7 = __toESM(require_cjs());
 var Collection = {
   define: {
+    $collection: (param, el, state) => {
+      if (!param)
+        return;
+      if ((0, import_utils7.isString)(param)) {
+        if (param === "state")
+          param = state.parse();
+        else
+          param = (0, import_state.getChildStateInKey)(param, state);
+      }
+      if ((0, import_state.isState)(param))
+        param = param.parse();
+      if ((0, import_utils7.isNot)(param)("array", "object"))
+        return;
+      const { __ref: ref } = el;
+      if (ref.__stateCollectionCache) {
+        const d = (0, import_utils7.deepDiff)(param, ref.__stateCollectionCache);
+        if (Object.keys(d).length) {
+          ref.__stateCollectionCache = (0, import_utils7.deepClone)(param);
+          delete ref.__noCollectionDifference;
+        } else {
+          ref.__noCollectionDifference = true;
+          return;
+        }
+      } else {
+        ref.__stateCollectionCache = (0, import_utils7.deepClone)(param);
+      }
+      const obj = {
+        tag: "fragment",
+        props: {
+          childProps: el.props && el.props.childProps
+        }
+      };
+      for (const key in param) {
+        const value2 = param[key];
+        obj[key] = (0, import_utils7.isObjectLike)(value2) ? value2 : { value: value2 };
+      }
+      el.removeContent();
+      el.content = obj;
+      return obj;
+    },
     $setCollection: (param, el, state) => {
       if (!param)
         return;
@@ -13335,6 +13387,7 @@ var Shape = {
 };
 
 // ../uikit/Atoms/Text.js
+var import_utils9 = __toESM(require_cjs());
 var import_scratch10 = __toESM(require_cjs10());
 var Text = {
   deps: { getFontSizeByKey: import_scratch10.getFontSizeByKey, getFontFamily: import_scratch10.getFontFamily },
@@ -13348,18 +13401,19 @@ var Text = {
       const { props: props4, deps } = el;
       return props4.fontSize ? deps.getFontSizeByKey(props4.fontSize) : null;
     },
-    fontFamily: ({ props: props4, deps }) => props4.fontFamily && {
+    font: ({ props: props4 }) => !(0, import_utils9.isUndefined)(props4.font) && { font: props4.font },
+    fontFamily: ({ props: props4, deps }) => !(0, import_utils9.isUndefined)(props4.fontFamily) && {
       fontFamily: deps.getFontFamily(props4.fontFamily) || props4.fontFamily
     },
-    lineHeight: ({ props: props4 }) => props4.lineHeight && { lineHeight: props4.lineHeight },
-    // lineHeight: ({ props }) => props.lineHeight && getSpacingBasedOnRatio(props, 'lineHeight', null, ''),
-    textDecoration: ({ props: props4 }) => props4.textDecoration && { textDecoration: props4.textDecoration },
-    textTransform: ({ props: props4 }) => props4.textTransform && { textTransform: props4.textTransform },
-    whiteSpace: ({ props: props4 }) => props4.whiteSpace && { whiteSpace: props4.whiteSpace },
-    wordWrap: ({ props: props4 }) => props4.wordWrap && { wordWrap: props4.wordWrap },
-    letterSpacing: ({ props: props4 }) => props4.letterSpacing && { letterSpacing: props4.letterSpacing },
-    textAlign: ({ props: props4 }) => props4.textAlign && { textAlign: props4.textAlign },
-    fontWeight: ({ props: props4 }) => props4.fontWeight && {
+    lineHeight: ({ props: props4 }) => !(0, import_utils9.isUndefined)(props4.lineHeight) && { lineHeight: props4.lineHeight },
+    // lineHeight: ({ props }) => !isUndefined(props.lineHeight) && getSpacingBasedOnRatio(props, 'lineHeight', null, ''),
+    textDecoration: ({ props: props4 }) => !(0, import_utils9.isUndefined)(props4.textDecoration) && { textDecoration: props4.textDecoration },
+    textTransform: ({ props: props4 }) => !(0, import_utils9.isUndefined)(props4.textTransform) && { textTransform: props4.textTransform },
+    whiteSpace: ({ props: props4 }) => !(0, import_utils9.isUndefined)(props4.whiteSpace) && { whiteSpace: props4.whiteSpace },
+    wordWrap: ({ props: props4 }) => !(0, import_utils9.isUndefined)(props4.wordWrap) && { wordWrap: props4.wordWrap },
+    letterSpacing: ({ props: props4 }) => !(0, import_utils9.isUndefined)(props4.letterSpacing) && { letterSpacing: props4.letterSpacing },
+    textAlign: ({ props: props4 }) => !(0, import_utils9.isUndefined)(props4.textAlign) && { textAlign: props4.textAlign },
+    fontWeight: ({ props: props4 }) => !(0, import_utils9.isUndefined)(props4.fontWeight) && {
       fontWeight: props4.fontWeight,
       fontVariationSettings: '"wght" ' + props4.fontWeight
     }
@@ -13392,10 +13446,13 @@ var Footnote = {
   tag: "span",
   props: { fontSize: "Z" }
 };
+var B = { tag: "b" };
+var I = { tag: "i" };
 
 // ../uikit/Atoms/Transform.js
 var Transform = {
   class: {
+    zoom: ({ props: props4 }) => props4.zoom && { zoom: props4.zoom },
     transform: ({ props: props4 }) => props4.transform && { transform: props4.transform },
     transformOrigin: ({ props: props4 }) => props4.transformOrigin && { transformOrigin: props4.transformOrigin }
   }
@@ -13410,18 +13467,18 @@ var XYZ = {
 
 // ../uikit/Atoms/Animation.js
 var import_scratch11 = __toESM(require_cjs10());
-var import_utils9 = __toESM(require_cjs());
+var import_utils10 = __toESM(require_cjs());
 var applyAnimationProps = (animation, element) => {
   const { emotion: ctxEmotion } = element.context;
   const { keyframes } = ctxEmotion || emotion;
-  if ((0, import_utils9.isObject)(animation))
+  if ((0, import_utils10.isObject)(animation))
     return { animationName: keyframes(animation) };
-  const { ANIMATION } = element.context && element.context.designSystem;
-  const record = ANIMATION[animation];
+  const { ANIMATION: ANIMATION2 } = element.context && element.context.designSystem;
+  const record = ANIMATION2[animation];
   return keyframes(record);
 };
 var Animation = {
-  deps: { isObject: import_utils9.isObject, getTimingByKey: import_scratch11.getTimingByKey, getTimingFunction: import_scratch11.getTimingFunction, applyAnimationProps },
+  deps: { isObject: import_utils10.isObject, getTimingByKey: import_scratch11.getTimingByKey, getTimingFunction: import_scratch11.getTimingFunction, applyAnimationProps },
   class: {
     animation: (el) => el.props.animation && {
       animationName: el.deps.applyAnimationProps(el.props.animation, el),
@@ -13460,7 +13517,7 @@ var Animation = {
 };
 
 // ../uikit/Box/index.js
-var import_utils10 = __toESM(require_cjs());
+var import_utils11 = __toESM(require_cjs());
 var PropsCSS = {
   class: {
     style: ({ props: props4 }) => props4 && props4.style
@@ -13482,7 +13539,7 @@ var Box = {
     XYZ,
     Animation
   ],
-  deps: { isString: import_utils10.isString },
+  deps: { isString: import_utils11.isString },
   attr: {
     id: ({ props: props4, deps }) => deps.isString(props4.id) && props4.id,
     title: ({ props: props4, deps }) => deps.isString(props4.title) && props4.title,
@@ -13503,10 +13560,10 @@ var Circle = {
 };
 
 // ../uikit/Icon/index.js
-var import_utils11 = __toESM(require_cjs());
+var import_utils12 = __toESM(require_cjs());
 var Icon = {
   extend: Svg,
-  deps: { isString: import_utils11.isString },
+  deps: { isString: import_utils12.isString },
   props: ({ key, props: props4, parent, context, deps }) => {
     const { ICONS, useIconSprite, verbose } = context && context.designSystem;
     const { toCamelCase: toCamelCase2 } = context && context.utils;
@@ -13699,7 +13756,7 @@ var TitleParagraph = {
     props: {
       margin: "0",
       fontWeight: "400",
-      color: "gray4",
+      color: "caption",
       "> p": { margin: "0" }
     }
   }
@@ -13736,7 +13793,7 @@ var TitleParagraphButton = {
     Button: {
       props: {
         background: "transparent",
-        color: "white",
+        color: "currentColor",
         padding: "0",
         Icon: {
           name: "x",
@@ -13786,7 +13843,7 @@ var List = {
         position: "relative",
         cursor: "pointer",
         fontSize: "A1",
-        color: "gray4",
+        color: "caption",
         ":hover": {
           background: "gray .92 +4"
         },
@@ -14045,7 +14102,7 @@ var CommonField = {
       text: "Label",
       lineHeight: "1em",
       padding: "- - - V2",
-      color: "gray4"
+      color: "caption"
     }
   },
   Field: {
@@ -14054,7 +14111,7 @@ var CommonField = {
   Hint: {
     extend: IconText,
     props: {
-      color: "gray4",
+      color: "caption",
       align: "center flex-start",
       text: "",
       fontSize: "Z1",
@@ -14386,7 +14443,7 @@ var Banner = {
         content: '""',
         position: "absolute",
         boxSize: "V 100%",
-        background: "white .1",
+        theme: "dialog",
         top: "0",
         round: "C"
       }
@@ -14405,8 +14462,7 @@ var Banner = {
       Title: {
         tag: "h6",
         props: {
-          fontSize: "B",
-          color: "white .85"
+          fontSize: "B"
         }
       },
       Paragraph: {
@@ -14421,9 +14477,7 @@ var Banner = {
       letterSpacing: ".1px",
       padding: "B - - Y",
       fontSize: "Z2",
-      color: "white .5",
       lineHeight: "1.6em"
-      // fontWeight: '100'
     }
   }
 };
@@ -14609,11 +14663,11 @@ var DoubleHr = {
 };
 
 // ../uikit/Input/Input.js
-var import_utils12 = __toESM(require_cjs());
+var import_utils13 = __toESM(require_cjs());
 var Input = {
   tag: "input",
   extend: [Focusable],
-  deps: { isString: import_utils12.isString, replaceLiteralsWithObjectFields: import_utils12.replaceLiteralsWithObjectFields },
+  deps: { isString: import_utils13.isString, replaceLiteralsWithObjectFields: import_utils13.replaceLiteralsWithObjectFields },
   props: {
     border: "none",
     type: "input",
@@ -15153,7 +15207,7 @@ var ProgressCircleWithSideUnitValue = {
 };
 
 // ../uikit/Range/index.js
-var import_utils13 = __toESM(require_cjs());
+var import_utils14 = __toESM(require_cjs());
 var import_scratch12 = __toESM(require_cjs10());
 var props = {
   appearance: "none",
@@ -15221,7 +15275,7 @@ var Range = {
 };
 var returnPropertyValue = (el, property, def) => {
   const val = el.props && el.props[property];
-  const r = (0, import_utils13.isFunction)(val) ? val(el, el.state) : val !== void 0 ? val : def !== void 0 ? def : 50;
+  const r = (0, import_utils14.isFunction)(val) ? val(el, el.state) : val !== void 0 ? val : def !== void 0 ? def : 50;
   return r + "";
 };
 var RangeWithButtons = {
@@ -15231,7 +15285,7 @@ var RangeWithButtons = {
     on: {
       click: (ev, el, s) => {
         const parentProps = el.parent.props;
-        if ((0, import_utils13.isFunction)(parentProps.onDecrease)) {
+        if ((0, import_utils14.isFunction)(parentProps.onDecrease)) {
           parentProps.onDecrease(ev, el.parent, s);
         } else {
           const value2 = parseFloat(s.value);
@@ -15263,7 +15317,7 @@ var RangeWithButtons = {
     on: {
       input: (ev, el, s) => {
         const parentProps = el.parent.props;
-        if ((0, import_utils13.isFunction)(parentProps.onInput)) {
+        if ((0, import_utils14.isFunction)(parentProps.onInput)) {
           parentProps.onInput(ev, el, s);
         } else {
           s.update({ value: parseFloat(el.node.value) });
@@ -15271,7 +15325,7 @@ var RangeWithButtons = {
       },
       change: (ev, el, s) => {
         const parentProps = el.parent.props;
-        if ((0, import_utils13.isFunction)(parentProps.onChange)) {
+        if ((0, import_utils14.isFunction)(parentProps.onChange)) {
           parentProps.onChange(ev, el, s);
         } else {
           s.update({ value: parseFloat(el.node.value) });
@@ -15285,7 +15339,7 @@ var RangeWithButtons = {
     on: {
       click: (ev, el, s) => {
         const parentProps = el.parent.props;
-        if ((0, import_utils13.isFunction)(parentProps.onIncrease)) {
+        if ((0, import_utils14.isFunction)(parentProps.onIncrease)) {
           parentProps.onIncrease(ev, el.parent, s);
         } else {
           const value2 = parseFloat(s.value);
@@ -15321,7 +15375,7 @@ var style_default = {
 
 // ../uikit/Slider/index.js
 var import_scratch13 = __toESM(require_cjs10());
-var import_utils14 = __toESM(require_cjs());
+var import_utils15 = __toESM(require_cjs());
 (0, import_scratch13.set)({
   theme: {
     sliderThumb: {
@@ -15353,7 +15407,7 @@ var RangeSlider = {
 };
 var listenProp = (el, prop, def) => {
   const val = el && el.props && el.props[prop];
-  const r = ((0, import_utils14.isFunction)(val) ? val() : val) || (def !== void 0 ? def : 50);
+  const r = ((0, import_utils15.isFunction)(val) ? val() : val) || (def !== void 0 ? def : 50);
   return r;
 };
 var Slider = {
@@ -15364,10 +15418,10 @@ var Slider = {
     },
     on: {
       click: (ev, el, s) => {
-        el.props && (0, import_utils14.isFunction)(el.props.click) && el.props.click(ev, el, s);
+        el.props && (0, import_utils15.isFunction)(el.props.click) && el.props.click(ev, el, s);
         const input = el.parent.input;
         const props4 = input.props;
-        const value2 = (0, import_utils14.isFunction)(props4.value) ? props4.value() : props4.value;
+        const value2 = (0, import_utils15.isFunction)(props4.value) ? props4.value() : props4.value;
         input.node.value = value2;
       }
     }
@@ -15390,8 +15444,8 @@ var Slider = {
       step: (el, s) => listenProp(el, "step", 1)
     },
     on: {
-      input: (ev, el, s) => el.props && (0, import_utils14.isFunction)(el.props.input) && el.props.input(ev, el, s),
-      change: (ev, el, s) => el.props && (0, import_utils14.isFunction)(el.props.change) && el.props.change(ev, el, s)
+      input: (ev, el, s) => el.props && (0, import_utils15.isFunction)(el.props.input) && el.props.input(ev, el, s),
+      change: (ev, el, s) => el.props && (0, import_utils15.isFunction)(el.props.change) && el.props.change(ev, el, s)
     }
   },
   button1: {
@@ -15401,10 +15455,10 @@ var Slider = {
     },
     on: {
       click: (ev, el, s) => {
-        el.props && (0, import_utils14.isFunction)(el.props.click) && el.props.click(ev, el, s);
+        el.props && (0, import_utils15.isFunction)(el.props.click) && el.props.click(ev, el, s);
         const input = el.parent.input;
         const props4 = input.props;
-        const value2 = (0, import_utils14.isFunction)(props4.value) ? props4.value() : props4.value;
+        const value2 = (0, import_utils15.isFunction)(props4.value) ? props4.value() : props4.value;
         input.node.value = value2;
       }
     }
@@ -15418,7 +15472,6 @@ var Label = {
     text: "-2.902x",
     fontSize: "X2",
     boxSize: "fit-content fit-content",
-    background: "#F4454E",
     padding: "W2 Y2",
     round: "Y1",
     fontWeight: "400"
@@ -15621,7 +15674,7 @@ var NotificationIndicator = {
 };
 
 // ../uikit/Tooltip/index.js
-var import_utils15 = __toESM(require_cjs());
+var import_utils16 = __toESM(require_cjs());
 var Tooltip = {
   extend: Flex,
   props: {
@@ -15640,7 +15693,7 @@ var Tooltip = {
   },
   attr: { tooltip: true },
   Title: {
-    if: ({ parent, props: props4 }) => (0, import_utils15.isDefined)(parent.props.title) || props4.text,
+    if: ({ parent, props: props4 }) => (0, import_utils16.isDefined)(parent.props.title) || props4.text,
     props: ({ parent }) => ({
       width: "fit-content",
       fontWeight: 500,
@@ -15649,7 +15702,7 @@ var Tooltip = {
     })
   },
   P: {
-    if: ({ parent, props: props4 }) => (0, import_utils15.isDefined)(parent.props.description) || props4.text,
+    if: ({ parent, props: props4 }) => (0, import_utils16.isDefined)(parent.props.description) || props4.text,
     props: ({ parent }) => ({
       width: "fit-content",
       fontSize: "Z2",
@@ -15939,7 +15992,7 @@ var LineStepsWithTitleParagraph = {
     Paragraph: {
       text: "The easiest way to build your own website.",
       fontSize: "Z1",
-      color: "gray4"
+      color: "caption"
     }
   },
   LineSteps: {
@@ -15961,7 +16014,7 @@ var ParagraphButton = {
   P: {
     props: {
       text: "Didn't get the code?",
-      color: "gray4",
+      color: "caption",
       margin: "0"
     }
   },
@@ -16103,7 +16156,7 @@ var Modal = {
     Paragraph: {
       props: {
         fontSize: "Z",
-        color: "gray4",
+        color: "caption",
         padding: "- Y"
       }
     }
@@ -16839,7 +16892,7 @@ var LogIn = {
       extend: SocialLink,
       props: {
         minWidth: "100%",
-        color: "gray4"
+        color: "caption"
       }
     },
     ...[{}, {}]
@@ -17602,7 +17655,7 @@ var BalanceCard = {
         padding: "0",
         theme: "transparent",
         fontSize: "D",
-        color: "gray4",
+        color: "caption",
         margin: "-X -W2 - -",
         Icon: { name: "arrowUpRight" }
       }
@@ -17620,7 +17673,7 @@ var BalanceCard = {
     },
     UnitValue: {
       flow: "row-reverse",
-      color: "white .75",
+      color: "paragraph",
       fontWeight: "400",
       fontSize: "Z",
       gap: "Y",
@@ -17700,7 +17753,7 @@ var ConvertCard = {
     props: {
       justifyContent: "space-between",
       fontWeight: "400",
-      color: "gray4"
+      color: "caption"
     },
     caption: {
       props: {
@@ -17826,6 +17879,7 @@ var defaultDefine = {
       set5();
     return obj;
   },
+  $collection: Collection.define.$collection,
   $setCollection: Collection.define.$setCollection,
   $setStateCollection: Collection.define.$setStateCollection,
   $setPropsCollection: Collection.define.$setPropsCollection
@@ -17833,7 +17887,7 @@ var defaultDefine = {
 
 // src/router.js
 var import_router2 = __toESM(require_cjs12(), 1);
-var import_utils16 = __toESM(require_cjs(), 1);
+var import_utils17 = __toESM(require_cjs(), 1);
 var DEFAULT_ROUTING_OPTIONS = {
   initRouter: true,
   injectRouterInLinkComponent: true,
@@ -17845,16 +17899,16 @@ var initRouter = (element, options) => {
   else if (options.router === true)
     options.router = DEFAULT_ROUTING_OPTIONS;
   else
-    (0, import_utils16.merge)(options.router || {}, DEFAULT_ROUTING_OPTIONS);
+    (0, import_utils17.merge)(options.router || {}, DEFAULT_ROUTING_OPTIONS);
   const routerOptions = options.router;
   const router2 = options.snippets && options.snippets.router ? options.snippets.router : import_router2.router;
   const onRouterRenderDefault = (el, s) => {
-    const { pathname, hash: hash2 } = import_utils16.window.location;
+    const { pathname, hash: hash2 } = import_utils17.window.location;
     const url2 = pathname + hash2;
     if (el.routes)
       router2(url2, el, {}, { initialRender: true });
   };
-  const hasRenderRouter = element.on && !(0, import_utils16.isUndefined)(element.on.renderRouter);
+  const hasRenderRouter = element.on && !(0, import_utils17.isUndefined)(element.on.renderRouter);
   if (routerOptions && routerOptions.initRouter && !hasRenderRouter) {
     if (element.on) {
       element.on.renderRouter = onRouterRenderDefault;
@@ -17876,20 +17930,20 @@ var popStateRouter = (element, options) => {
   if (!routerOptions.popState)
     return;
   const router2 = options.snippets && options.snippets.router ? options.snippets.router : import_router2.router;
-  import_utils16.window.onpopstate = (e) => {
-    const { pathname, hash: hash2 } = import_utils16.window.location;
+  import_utils17.window.onpopstate = (e) => {
+    const { pathname, hash: hash2 } = import_utils17.window.location;
     const url2 = pathname + hash2;
     router2(url2, element, {}, { pushState: false, scrollToTop: false, level: 0 });
   };
 };
 var injectRouterInLinkComponent = (routerOptions) => {
   if (routerOptions && routerOptions.injectRouterInLinkComponent) {
-    return (0, import_utils16.deepMerge)(Link, RouterLink);
+    return (0, import_utils17.deepMerge)(Link, RouterLink);
   }
 };
 
 // src/ferchOnCreate.js
-var import_utils17 = __toESM(require_cjs(), 1);
+var import_utils18 = __toESM(require_cjs(), 1);
 var import_fetch = __toESM(require_cjs14(), 1);
 var fetchSync = async (key, options) => {
   if (key && options.editor) {
@@ -17905,10 +17959,10 @@ var fetchAsync = (app, key, options, callback) => {
   if (key && options.editor) {
     try {
       const defaultCallback = (data) => {
-        if ((0, import_utils17.isObject)(data.designsystem)) {
+        if ((0, import_utils18.isObject)(data.designsystem)) {
           options.utils.init(data.designsystem);
         }
-        if ((0, import_utils17.isObject)(data.state)) {
+        if ((0, import_utils18.isObject)(data.state)) {
           app.state.set(data.state);
         }
       };
@@ -17921,10 +17975,10 @@ var fetchAsync = (app, key, options, callback) => {
 };
 
 // ../../node_modules/@domql/emotion/index.js
-var import_utils19 = __toESM(require_cjs());
+var import_utils20 = __toESM(require_cjs());
 
 // ../../node_modules/@domql/classlist/index.js
-var import_utils18 = __toESM(require_cjs());
+var import_utils19 = __toESM(require_cjs());
 var classify = (obj, element) => {
   let className = "";
   for (const item in obj) {
@@ -17934,7 +17988,7 @@ var classify = (obj, element) => {
     else if (typeof param === "string")
       className += ` ${param}`;
     else if (typeof param === "function") {
-      className += ` ${(0, import_utils18.exec)(param, element)}`;
+      className += ` ${(0, import_utils19.exec)(param, element)}`;
     }
   }
   return className;
@@ -17945,9 +17999,9 @@ var classList = (params, element) => {
   const { key } = element;
   if (params === true)
     params = element.class = { key };
-  if ((0, import_utils18.isString)(params))
+  if ((0, import_utils19.isString)(params))
     params = element.class = { default: params };
-  if ((0, import_utils18.isObject)(params))
+  if ((0, import_utils19.isObject)(params))
     params = classify(params, element);
   const className = params.replace(/\s+/g, " ").trim();
   if (element.ref)
@@ -17963,9 +18017,9 @@ var applyClassListOnNode = (params, element, node2) => {
 // ../../node_modules/@domql/emotion/index.js
 var transformEmotionStyle = (emotion2) => {
   return (params, element, state) => {
-    const execParams = (0, import_utils19.exec)(params, element);
+    const execParams = (0, import_utils20.exec)(params, element);
     if (params) {
-      if ((0, import_utils19.isObjectLike)(element.class))
+      if ((0, import_utils20.isObjectLike)(element.class))
         element.class.elementStyle = execParams;
       else
         element.class = { elementStyle: execParams };
@@ -17979,18 +18033,18 @@ var transformEmotionClass = (emotion2) => {
       return;
     const { __ref } = element;
     const { __class, __classNames } = __ref;
-    if (!(0, import_utils19.isObjectLike)(params))
+    if (!(0, import_utils20.isObjectLike)(params))
       return;
     for (const key in params) {
-      const prop = (0, import_utils19.exec)(params[key], element);
+      const prop = (0, import_utils20.exec)(params[key], element);
       if (!prop) {
         delete __class[key];
         delete __classNames[key];
         continue;
       }
-      const isEqual = (0, import_utils19.isEqualDeep)(__class[key], prop);
+      const isEqual = (0, import_utils20.isEqualDeep)(__class[key], prop);
       if (!isEqual) {
-        if (!(0, import_utils19.isProduction)() && (0, import_utils19.isObject)(prop))
+        if (!(0, import_utils20.isProduction)() && (0, import_utils20.isObject)(prop))
           prop.label = key || element.key;
         const CSSed = emotion2.css(prop);
         __class[key] = prop;
@@ -18010,7 +18064,7 @@ var transformDOMQLEmotion = (emotion2, options) => {
 };
 
 // src/initEmotion.js
-var import_utils20 = __toESM(require_cjs(), 1);
+var import_utils21 = __toESM(require_cjs(), 1);
 
 // src/options.js
 var DESIGN_SYSTEM_OPTIONS = {
@@ -18100,7 +18154,9 @@ var COLOR = {
   gray2: "#A3A3A8",
   gray3: "#1C1C1F",
   gray4: "#BDBDC1",
-  title: ["--gray2", "--gray4"]
+  title: ["--black", "--white"],
+  caption: ["--gray2", "--gray4"],
+  paragraph: ["--gray2", "--white"]
 };
 var GRADIENT = {
   "gradient-blue-light": `linear-gradient(to right,
@@ -18337,7 +18393,7 @@ var THEME = {
 // ../default-config/src/typography.js
 var TYPOGRAPHY = {
   base: 16,
-  ratio: 1.125,
+  ratio: 1.25,
   subSequence: true,
   templates: {}
 };
@@ -18350,7 +18406,11 @@ var SPACING = {
 };
 
 // ../default-config/src/font.js
-var FONT = {};
+var FONT = {
+  SourceSans: [{
+    url: ""
+  }]
+};
 var FONT_FAMILY = {
   system: {
     value: ['"Helvetica Neue"', "Helvetica", "Arial"],
@@ -18401,8 +18461,8 @@ var initEmotion = (key, options = {}) => {
   if (!initOptions.emotion)
     initOptions.emotion = emotion;
   const registry = options.registry || transformDOMQLEmotion(initOptions.emotion, options);
-  const defaultDesignSystem = (0, import_utils20.deepClone)(src_default);
-  const designSystem = initOptions.useDefaultConfig ? (0, import_utils20.deepMerge)(options.designSystem, defaultDesignSystem) : options.designSystem || defaultDesignSystem;
+  const defaultDesignSystem = (0, import_utils21.deepClone)(src_default);
+  const designSystem = initOptions.useDefaultConfig ? (0, import_utils21.deepMerge)(options.designSystem, defaultDesignSystem) : options.designSystem || defaultDesignSystem;
   const scratchSystem2 = init(designSystem, {
     key,
     emotion: emotion2,
@@ -21822,7 +21882,7 @@ function send(event = "change", changes, options) {
 var import_globals = __toESM(require_cjs13());
 
 // ../socket-ui/devFocus.js
-var import_utils21 = __toESM(require_cjs());
+var import_utils22 = __toESM(require_cjs());
 var DevFocus = {
   props: {
     ".preventSelect": {
@@ -21876,7 +21936,7 @@ var DevFocus = {
     on: {
       init: ({ context }) => {
         const { components } = context;
-        if ((0, import_utils21.isObject)(components)) {
+        if ((0, import_utils22.isObject)(components)) {
           const { Content, ...rest } = components;
           for (const key in rest) {
             if (uikit_exports[key])
@@ -21959,6 +22019,36 @@ var inspectOnKey = (app) => {
 
 // ../socket-ui/byld-socket.js
 var isLocalhost = import_globals.window && import_globals.window.location && import_globals.window.location.host.includes("local");
+var ANIMATION = {
+  fadeInUp: {
+    from: {
+      transform: "translate3d(0, 12.5%, 1px)",
+      opacity: 0
+    },
+    to: {
+      transform: "translate3d(0, 0, 1px)",
+      opacity: 1
+    }
+  },
+  fadeOutDown: {
+    from: {
+      transform: "translate3d(0, 0, 1px)",
+      opacity: 1
+    },
+    to: {
+      transform: "translate3d(0, 12.5%, 1px)",
+      opacity: 0
+    }
+  }
+};
+var COLOR2 = {
+  black: "#000000",
+  blue: "#3686F7"
+};
+(0, import_scratch14.set)({
+  COLOR: COLOR2,
+  ANIMATION
+});
 var connectedToSymbols = (clients, element, state) => {
   if (clients.symbols) {
     if (!state.connected) {
@@ -22068,15 +22158,15 @@ var Sync = {
 };
 
 // src/syncExtend.js
-var import_utils22 = __toESM(require_cjs(), 1);
+var import_utils23 = __toESM(require_cjs(), 1);
 var applySyncDebug = (extend, options) => {
   const { editor } = options;
   if (!editor)
     return extend;
-  const inspect = (0, import_utils22.isUndefined)(editor.inspect) ? (0, import_utils22.isDevelopment)() : editor.inspect;
+  const inspect = (0, import_utils23.isUndefined)(editor.inspect) ? (0, import_utils23.isDevelopment)() : editor.inspect;
   if (inspect)
     extend.push(DevFocus);
-  const liveSync = (0, import_utils22.isUndefined)(editor.liveSync) ? (0, import_utils22.isDevelopment)() : editor.liveSync;
+  const liveSync = (0, import_utils23.isUndefined)(editor.liveSync) ? (0, import_utils23.isDevelopment)() : editor.liveSync;
   if (liveSync)
     extend.push(Sync);
   return extend;
@@ -22085,15 +22175,15 @@ var applyInspectListener = (root, options) => {
   const { editor } = options;
   if (!editor)
     return;
-  const inspect = (0, import_utils22.isUndefined)(editor.inspect) ? (0, import_utils22.isDevelopment)() : editor.inspect;
+  const inspect = (0, import_utils23.isUndefined)(editor.inspect) ? (0, import_utils23.isDevelopment)() : editor.inspect;
   if (inspect)
     inspectOnKey(root);
 };
 
 // src/prepare.js
-var import_utils23 = __toESM(require_cjs(), 1);
+var import_utils24 = __toESM(require_cjs(), 1);
 var checkIfKeyIsComponent = (key) => {
-  const isFirstKeyString = (0, import_utils23.isString)(key);
+  const isFirstKeyString = (0, import_utils24.isString)(key);
   if (!isFirstKeyString)
     return;
   const firstCharKey = key.slice(0, 1);
@@ -22127,8 +22217,8 @@ var prepareState = (options, App) => {
   if (options.state)
     utilImports_exports.deepMerge(state, options.state);
   if (App && App.state)
-    (0, import_utils23.deepMerge)(state, App.state);
-  return (0, import_utils23.deepCloneWithExtnd)(state);
+    (0, import_utils24.deepMerge)(state, App.state);
+  return (0, import_utils24.deepCloneWithExtnd)(state);
 };
 var preparePages = (options) => {
   return options.pages || {};
@@ -22147,11 +22237,11 @@ var prepareDocument = (options) => {
 // src/index.js
 var SYMBOLS_KEY = process.env.SYMBOLS_KEY;
 var mergeWithLocalFile2 = (options, optionsExternalFile) => {
-  const rcfile = (0, import_utils24.isObject)(optionsExternalFile) ? optionsExternalFile : dynamic_default || {};
-  return (0, import_utils24.deepMerge)(options, rcfile);
+  const rcfile = (0, import_utils25.isObject)(optionsExternalFile) ? optionsExternalFile : dynamic_default || {};
+  return (0, import_utils25.deepMerge)(options, rcfile);
 };
 var create = async (App, options = options_default, optionsExternalFile) => {
-  const appIsKey = (0, import_utils24.isString)(App);
+  const appIsKey = (0, import_utils25.isString)(App);
   options = { ...options_default, ...mergeWithLocalFile2(options, optionsExternalFile) };
   const key = options.key || SYMBOLS_KEY || (appIsKey ? App : "");
   if (appIsKey)
@@ -22201,7 +22291,7 @@ var create = async (App, options = options_default, optionsExternalFile) => {
   return domqlApp;
 };
 var createSync = (App, options = options_default, optionsExternalFile) => {
-  const appIsKey = (0, import_utils24.isString)(App);
+  const appIsKey = (0, import_utils25.isString)(App);
   options = mergeWithLocalFile2(options, optionsExternalFile);
   const key = options.key || SYMBOLS_KEY || (appIsKey ? App : "");
   if (appIsKey)