npm - @symbo.ls/create - Versions diffs - 2.11.236 → 2.11.237 - Mend

@symbo.ls/create 2.11.236 → 2.11.237

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (8) hide show

package/dist/cjs/bundle/index.js +366 -274
package/dist/cjs/index.js +10 -20
package/dist/cjs/initEmotion.js +2 -2
package/dist/cjs/prepare.js +94 -0
package/package.json +2 -2
package/src/index.js +12 -33
package/src/initEmotion.js +2 -2
package/src/prepare.js +61 -0

package/dist/cjs/bundle/index.js CHANGED Viewed

@@ -216,7 +216,7 @@ var require_types = __commonJS({
       isNumber: () => isNumber,
       isObject: () => isObject12,
       isObjectLike: () => isObjectLike3,
-      isString: () => isString10,
+      isString: () => isString11,
       isUndefined: () => isUndefined4
     });
     module2.exports = __toCommonJS2(types_exports);
@@ -226,7 +226,7 @@ var require_types = __commonJS({
         return false;
       return typeof arg === "object" && arg.constructor === Object;
     };
-    var isString10 = (arg) => typeof arg === "string";
+    var isString11 = (arg) => typeof arg === "string";
     var isNumber = (arg) => typeof arg === "number";
     var isFunction4 = (arg) => typeof arg === "function";
     var isBoolean = (arg) => arg === true || arg === false;
@@ -239,7 +239,7 @@ var require_types = __commonJS({
       return typeof arg === "object";
     };
     var isDefined2 = (arg) => {
-      return isObject12(arg) || isObjectLike3(arg) || isString10(arg) || isNumber(arg) || isFunction4(arg) || isArray6(arg) || isObjectLike3(arg) || isBoolean(arg) || isDate(arg) || isNull(arg);
+      return isObject12(arg) || isObjectLike3(arg) || isString11(arg) || isNumber(arg) || isFunction4(arg) || isArray6(arg) || isObjectLike3(arg) || isBoolean(arg) || isDate(arg) || isNull(arg);
     };
     var isUndefined4 = (arg) => {
       return arg === void 0;
@@ -248,7 +248,7 @@ var require_types = __commonJS({
       boolean: isBoolean,
       array: isArray6,
       object: isObject12,
-      string: isString10,
+      string: isString11,
       date: isDate,
       number: isNumber,
       null: isNull,
@@ -473,7 +473,7 @@ var require_object = __commonJS({
       deepContains: () => deepContains,
       deepDestringify: () => deepDestringify,
       deepDiff: () => deepDiff2,
-      deepMerge: () => deepMerge5,
+      deepMerge: () => deepMerge7,
       deepStringify: () => deepStringify,
       detachFunctionsFromObject: () => detachFunctionsFromObject,
       diff: () => diff,
@@ -530,7 +530,7 @@ var require_object = __commonJS({
       }
       return element;
     };
-    var deepMerge5 = (element, extend, excludeFrom = []) => {
+    var deepMerge7 = (element, extend, excludeFrom = []) => {
       for (const e in extend) {
         const hasOwnProperty2 = Object.prototype.hasOwnProperty.call(extend, e);
         if (!hasOwnProperty2 || excludeFrom.includes(e) || e.startsWith("__"))
@@ -538,7 +538,7 @@ var require_object = __commonJS({
         const elementProp = element[e];
         const extendProp = extend[e];
         if ((0, import_types.isObjectLike)(elementProp) && (0, import_types.isObjectLike)(extendProp)) {
-          deepMerge5(elementProp, extendProp, excludeFrom);
+          deepMerge7(elementProp, extendProp, excludeFrom);
         } else if (elementProp === void 0) {
           element[e] = extendProp;
         }
@@ -578,7 +578,7 @@ var require_object = __commonJS({
       return o;
     };
     var mergeArrayExclude = (arr, excl = []) => {
-      return arr.reduce((acc, curr) => deepMerge5(acc, deepCloneExclude(curr, excl)), {});
+      return arr.reduce((acc, curr) => deepMerge7(acc, deepCloneExclude(curr, excl)), {});
     };
     var deepClone4 = (obj, excludeFrom = [], cleanUndefined = false) => {
       const o = (0, import_types.isArray)(obj) ? [] : {};
@@ -856,7 +856,7 @@ var require_object = __commonJS({
     };
     var mergeIfExisted = (a, b) => {
       if ((0, import_types.isObjectLike)(a) && (0, import_types.isObjectLike)(b))
-        return deepMerge5(a, b);
+        return deepMerge7(a, b);
       return a || b;
     };
     var flattenRecursive = (param, prop, stack = []) => {
@@ -1432,11 +1432,11 @@ var require_tree = __commonJS({
       TREE: () => TREE
     });
     module2.exports = __toCommonJS2(tree_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_report = require_cjs2();
     var ROOT = {
       key: ":root",
-      node: import_utils24.document ? import_utils24.document.body : (0, import_report.report)("DocumentNotDefined", import_utils24.document)
+      node: import_utils25.document ? import_utils25.document.body : (0, import_report.report)("DocumentNotDefined", import_utils25.document)
     };
     var TREE = ROOT;
   }
@@ -1472,12 +1472,12 @@ var require_on = __commonJS({
       triggerEventOnUpdate: () => triggerEventOnUpdate
     });
     module2.exports = __toCommonJS2(on_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = 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_utils24.isFunction)(element.on[param])) {
+      if (element.on && (0, import_utils25.isFunction)(element.on[param])) {
         const { state, context } = element;
         return applyEvent(element.on[param], element, state, context, options);
       }
@@ -1486,7 +1486,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_utils24.isFunction)(element.on[param])) {
+      if (element.on && (0, import_utils25.isFunction)(element.on[param])) {
         const { state, context } = element;
         return applyEventUpdate(element.on[param], updatedObj, element, state, context, options);
       }
@@ -1497,7 +1497,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_utils24.isFunction)(appliedFunction)) {
+        if ((0, import_utils25.isFunction)(appliedFunction)) {
           node2.addEventListener(param, (event) => {
             const { state, context } = element;
             appliedFunction(event, element, state, context);
@@ -1535,10 +1535,10 @@ var require_can = __commonJS({
     });
     module2.exports = __toCommonJS2(can_exports);
     var import_report = require_cjs2();
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var canRender = (element) => {
       const tag = element.tag || "div";
-      return (0, import_utils24.isValidHtmlTag)(tag) || (0, import_report.report)("HTMLInvalidTag");
+      return (0, import_utils25.isValidHtmlTag)(tag) || (0, import_report.report)("HTMLInvalidTag");
     };
   }
 });
@@ -1629,7 +1629,7 @@ var require_cache = __commonJS({
     module2.exports = __toCommonJS2(cache_exports);
     var import_report = require_cjs2();
     var import_event = require_cjs3();
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var cache2 = {};
     var createHTMLNode = (element) => {
       const { tag } = element;
@@ -1648,20 +1648,20 @@ var require_cache = __commonJS({
     };
     var detectTag = (element) => {
       let { tag, key, props: props4 } = element;
-      tag = (0, import_utils24.exec)(tag, element);
+      tag = (0, import_utils25.exec)(tag, element);
       if (tag === true)
         tag = key;
-      if ((0, import_utils24.isObject)(props4) && (0, import_utils24.isString)(props4.tag)) {
-        const tagExists = (0, import_utils24.isValidHtmlTag)(props4.tag);
+      if ((0, import_utils25.isObject)(props4) && (0, import_utils25.isString)(props4.tag)) {
+        const tagExists = (0, import_utils25.isValidHtmlTag)(props4.tag);
         if (tagExists)
           return props4.tag;
       }
-      if ((0, import_utils24.isString)(tag)) {
-        const tagExists = (0, import_utils24.isValidHtmlTag)(tag);
+      if ((0, import_utils25.isString)(tag)) {
+        const tagExists = (0, import_utils25.isValidHtmlTag)(tag);
         if (tagExists)
           return tag;
       } else {
-        const isKeyATag = (0, import_utils24.isValidHtmlTag)(key);
+        const isKeyATag = (0, import_utils25.isValidHtmlTag)(key);
         if (isKeyATag)
           return key;
       }
@@ -1794,16 +1794,16 @@ var require_attr = __commonJS({
       default: () => attr_default
     });
     module2.exports = __toCommonJS2(attr_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_report = require_cjs2();
     var attr_default = (params, element, node2) => {
       const { __ref } = element;
       const { __attr } = __ref;
-      if ((0, import_utils24.isNot)("object"))
+      if ((0, import_utils25.isNot)("object"))
         (0, import_report.report)("HTMLInvalidAttr", params);
       if (params) {
         for (const attr in params) {
-          const val = (0, import_utils24.exec)(params[attr], element);
+          const val = (0, import_utils25.exec)(params[attr], element);
           if (val && node2.setAttribute)
             node2.setAttribute(attr, val);
           else if (node2.removeAttribute)
@@ -1846,7 +1846,7 @@ var require_classList = __commonJS({
       default: () => classList_default
     });
     module2.exports = __toCommonJS2(classList_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var assignKeyAsClassname = (element) => {
       const { key } = element;
       if (element.class === true)
@@ -1864,7 +1864,7 @@ var require_classList = __commonJS({
         else if (typeof param === "string")
           className += ` ${param}`;
         else if (typeof param === "function") {
-          className += ` ${(0, import_utils24.exec)(param, element)}`;
+          className += ` ${(0, import_utils25.exec)(param, element)}`;
         }
       }
       return className;
@@ -1875,9 +1875,9 @@ var require_classList = __commonJS({
       const { key } = element;
       if (params === true)
         params = element.class = { key };
-      if ((0, import_utils24.isString)(params))
+      if ((0, import_utils25.isString)(params))
         params = element.class = { default: params };
-      if ((0, import_utils24.isObject)(params))
+      if ((0, import_utils25.isObject)(params))
         params = classify2(params, element);
       const className = params.replace(/\s+/g, " ").trim();
       if (element.ref)
@@ -1961,7 +1961,7 @@ var require_set = __commonJS({
       default: () => set_default
     });
     module2.exports = __toCommonJS2(set_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_create = __toESM2(require_create4(), 1);
     var import_options3 = __toESM2(require_options(), 1);
     var import_mixins = require_mixins();
@@ -1971,7 +1971,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_utils24.deepContains)(params, content)) {
+      if (ref.__noCollectionDifference || __contentRef && __contentRef.__cached && (0, import_utils25.deepContains)(params, content)) {
         return content.update();
       }
       if (options.preventContentUpdate === true)
@@ -2039,7 +2039,7 @@ var require_content = __commonJS({
       updateContent: () => updateContent
     });
     module2.exports = __toCommonJS2(content_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_set = __toESM2(require_set(), 1);
     var updateContent = function(params, options) {
       const element = this;
@@ -2062,7 +2062,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_utils24.isFunction)(__cached.content.remove))
+          else if (__cached.content && (0, import_utils25.isFunction)(__cached.content.remove))
             __cached.content.remove();
         }
         delete element.content;
@@ -2107,15 +2107,15 @@ var require_data = __commonJS({
       default: () => data_default
     });
     module2.exports = __toCommonJS2(data_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_report = require_cjs2();
     var data_default = (params, element, node2) => {
       if (params && params.showOnNode) {
-        if (!(0, import_utils24.isObject)(params))
+        if (!(0, import_utils25.isObject)(params))
           (0, import_report.report)("HTMLInvalidData", params);
         for (const dataset in params) {
           if (dataset !== "showOnNode") {
-            node2.dataset[dataset] = (0, import_utils24.exec)(params[dataset], element);
+            node2.dataset[dataset] = (0, import_utils25.exec)(params[dataset], element);
           }
         }
       }
@@ -2149,9 +2149,9 @@ var require_html = __commonJS({
       default: () => html_default
     });
     module2.exports = __toCommonJS2(html_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var html_default = (param, element, node2) => {
-      const prop = (0, import_utils24.exec)(param, element);
+      const prop = (0, import_utils25.exec)(param, element);
       const { __ref } = element;
       if (prop !== __ref.__html) {
         if (node2.nodeName === "SVG")
@@ -2190,12 +2190,12 @@ var require_style = __commonJS({
       default: () => style_default2
     });
     module2.exports = __toCommonJS2(style_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_report = require_cjs2();
     var style_default2 = (params, element, node2) => {
       if (params) {
-        if ((0, import_utils24.isObject)(params))
-          (0, import_utils24.map)(node2.style, params, element);
+        if ((0, import_utils25.isObject)(params))
+          (0, import_utils25.map)(node2.style, params, element);
         else
           (0, import_report.report)("HTMLInvalidStyles", params);
       }
@@ -2230,11 +2230,11 @@ var require_text = __commonJS({
     });
     module2.exports = __toCommonJS2(text_exports);
     var import__ = require_cjs8();
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var text_default = (param, element, node2) => {
-      let prop = (0, import_utils24.exec)(param, element);
-      if ((0, import_utils24.isString)(prop) && prop.includes("{{")) {
-        prop = (0, import_utils24.replaceLiteralsWithObjectFields)(prop, element.state);
+      let prop = (0, import_utils25.exec)(param, element);
+      if ((0, import_utils25.isString)(prop) && prop.includes("{{")) {
+        prop = (0, import_utils25.replaceLiteralsWithObjectFields)(prop, element.state);
       }
       if (element.tag === "string") {
         node2.nodeValue = prop;
@@ -2338,11 +2338,11 @@ var require_methods = __commonJS({
       toggle: () => toggle
     });
     module2.exports = __toCommonJS2(methods_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_ignore = require_ignore();
     var parse3 = function() {
       const state = this;
-      if ((0, import_utils24.isObject)(state)) {
+      if ((0, import_utils25.isObject)(state)) {
         const obj = {};
         for (const param in state) {
           if (!import_ignore.IGNORE_STATE_PARAMS.includes(param)) {
@@ -2350,7 +2350,7 @@ var require_methods = __commonJS({
           }
         }
         return obj;
-      } else if ((0, import_utils24.isArray)(state)) {
+      } else if ((0, import_utils25.isArray)(state)) {
         return state.filter((item) => !import_ignore.IGNORE_STATE_PARAMS.includes(item));
       }
     };
@@ -2370,7 +2370,7 @@ var require_methods = __commonJS({
       const state = this;
       const element = state.__element;
       const stateKey = element.__ref.__state;
-      if ((0, import_utils24.isString)(stateKey)) {
+      if ((0, import_utils25.isString)(stateKey)) {
         element.parent.state.remove(stateKey, { isHoisted: true, ...options });
         return element.state;
       }
@@ -2383,7 +2383,7 @@ var require_methods = __commonJS({
         for (const key in state.__children) {
           const child = state.__children[key];
           if (child.state) {
-            if ((0, import_utils24.isArray)(child.state)) {
+            if ((0, import_utils25.isArray)(child.state)) {
               Object.defineProperty(child.state, "parent", {
                 value: state.parent,
                 enumerable: false,
@@ -2417,10 +2417,10 @@ var require_methods = __commonJS({
     };
     var add = function(value2, options = {}) {
       const state = this;
-      if ((0, import_utils24.isArray)(state)) {
+      if ((0, import_utils25.isArray)(state)) {
         state.push(value2);
         state.update(state.parse(), { overwrite: "replace", ...options });
-      } else if ((0, import_utils24.isObject)(state)) {
+      } else if ((0, import_utils25.isObject)(state)) {
         const key = Object.keys(state).length;
         state.update({ [key]: value2 }, options);
       }
@@ -2431,25 +2431,25 @@ var require_methods = __commonJS({
     };
     var remove = function(key, options = {}) {
       const state = this;
-      if ((0, import_utils24.isArray)(state))
-        (0, import_utils24.removeFromArray)(state, key);
-      if ((0, import_utils24.isObject)(state))
-        (0, import_utils24.removeFromObject)(state, key);
+      if ((0, import_utils25.isArray)(state))
+        (0, import_utils25.removeFromArray)(state, key);
+      if ((0, import_utils25.isObject)(state))
+        (0, import_utils25.removeFromObject)(state, key);
       return state.update(state.parse(), { replace: true, ...options });
     };
     var set5 = function(val, options = {}) {
       const state = this;
-      const value2 = (0, import_utils24.deepClone)(val);
+      const value2 = (0, import_utils25.deepClone)(val);
       return state.clean({ preventStateUpdate: true, ...options }).update(value2, { replace: true, ...options });
     };
     var reset = function(options = {}) {
       const state = this;
-      const value2 = (0, import_utils24.deepClone)(state.parse());
+      const value2 = (0, import_utils25.deepClone)(state.parse());
       return state.set(value2, { replace: true, ...options });
     };
     var apply = function(func, options = {}) {
       const state = this;
-      if ((0, import_utils24.isFunction)(func)) {
+      if ((0, import_utils25.isFunction)(func)) {
         func(state);
         return state.update(state.parse(), { replace: true, ...options });
       }
@@ -2489,7 +2489,7 @@ var require_inherit = __commonJS({
       isState: () => isState2
     });
     module2.exports = __toCommonJS2(inherit_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_ignore = require_ignore();
     var getParentStateInKey = (stateKey, parentState) => {
       if (!stateKey.includes("../"))
@@ -2541,11 +2541,11 @@ var require_inherit = __commonJS({
     var createInheritedState = (element, parent) => {
       const ref = element.__ref;
       const inheritedState = findInheritedState(element, parent);
-      if ((0, import_utils24.isUndefined)(inheritedState))
+      if ((0, import_utils25.isUndefined)(inheritedState))
         return element.state;
-      if ((0, import_utils24.is)(inheritedState)("object", "array")) {
-        return (0, import_utils24.deepClone)(inheritedState, import_ignore.IGNORE_STATE_PARAMS);
-      } else if ((0, import_utils24.is)(inheritedState)("string", "number", "boolean")) {
+      if ((0, import_utils25.is)(inheritedState)("object", "array")) {
+        return (0, import_utils25.deepClone)(inheritedState, import_ignore.IGNORE_STATE_PARAMS);
+      } else if ((0, import_utils25.is)(inheritedState)("string", "number", "boolean")) {
         ref.__stateType = typeof inheritedState;
         return { value: inheritedState };
       }
@@ -2554,12 +2554,12 @@ var require_inherit = __commonJS({
     var checkIfInherits = (element) => {
       const ref = element.__ref;
       const stateKey = ref.__state;
-      if (stateKey && (0, import_utils24.is)(stateKey)("number", "string", "boolean"))
+      if (stateKey && (0, import_utils25.is)(stateKey)("number", "string", "boolean"))
         return true;
       return false;
     };
     var isState2 = function(state) {
-      if (!(0, import_utils24.isObjectLike)(state))
+      if (!(0, import_utils25.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;
     };
@@ -2608,7 +2608,7 @@ var require_updateState = __commonJS({
     var import_report = require_cjs2();
     var import_event = require_cjs3();
     var import_ignore = require_ignore();
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_inherit = require_inherit();
     var STATE_UPDATE_OPTIONS = {
       overwrite: true,
@@ -2621,7 +2621,7 @@ var require_updateState = __commonJS({
       const state = this;
       const element = state.__element;
       if (!options.updateByState)
-        (0, import_utils24.merge)(options, STATE_UPDATE_OPTIONS);
+        (0, import_utils25.merge)(options, STATE_UPDATE_OPTIONS);
       if (!state.__element)
         (0, import_report.report)("ElementOnStateIsNotDefined");
       if (options.preventInheritAtCurrentState === true) {
@@ -2651,10 +2651,10 @@ var require_updateState = __commonJS({
       const shallow = overwrite === "shallow";
       const merge22 = overwrite === "merge";
       if (merge22) {
-        (0, import_utils24.deepMerge)(state, obj, import_ignore.IGNORE_STATE_PARAMS);
+        (0, import_utils25.deepMerge)(state, obj, import_ignore.IGNORE_STATE_PARAMS);
         return;
       }
-      const overwriteFunc = shallow ? import_utils24.overwriteShallow : import_utils24.overwriteDeep;
+      const overwriteFunc = shallow ? import_utils25.overwriteShallow : import_utils25.overwriteDeep;
       overwriteFunc(state, obj, import_ignore.IGNORE_STATE_PARAMS);
     };
     var hoistStateUpdate = (state, obj, options) => {
@@ -2676,7 +2676,7 @@ var require_updateState = __commonJS({
       const changesValue = (0, import_inherit.createChangesByKey)(stateKey, passedValue);
       const targetParent = findGrandParentState || parent.state;
       if (options.replace)
-        (0, import_utils24.overwriteDeep)(targetParent, changesValue || value2);
+        (0, import_utils25.overwriteDeep)(targetParent, changesValue || value2);
       targetParent.update(changesValue, {
         execStateFunction: false,
         isHoisted: true,
@@ -2745,7 +2745,7 @@ var require_create2 = __commonJS({
     });
     module2.exports = __toCommonJS2(create_exports);
     var import_event = require_cjs3();
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_ignore = require_ignore();
     var import_methods = require_methods();
     var import_updateState = require_updateState();
@@ -2759,13 +2759,13 @@ var require_create2 = __commonJS({
       if (objectizeState === false)
         return parent.state || {};
       else
-        element.state = (0, import_utils24.deepClone)(objectizeState, import_ignore.IGNORE_STATE_PARAMS);
+        element.state = (0, import_utils25.deepClone)(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_utils24.isUndefined)(inheritedState) ? {} : inheritedState;
+        element.state = (0, import_utils25.isUndefined)(inheritedState) ? {} : inheritedState;
       }
       const dependentState = applyDependentState(element, element.state);
       if (dependentState)
@@ -2778,17 +2778,17 @@ var require_create2 = __commonJS({
       const { __ref: ref } = state;
       if (!ref)
         return;
-      const dependentState = (0, import_utils24.deepClone)(ref, import_ignore.IGNORE_STATE_PARAMS);
+      const dependentState = (0, import_utils25.deepClone)(ref, import_ignore.IGNORE_STATE_PARAMS);
       const newDepends = { [element.key]: dependentState };
-      ref.__depends = (0, import_utils24.isObject)(ref.__depends) ? { ...ref.__depends, ...newDepends } : newDepends;
+      ref.__depends = (0, import_utils25.isObject)(ref.__depends) ? { ...ref.__depends, ...newDepends } : newDepends;
       return dependentState;
     };
     var checkForTypes = (element) => {
       const { state, __ref: ref } = element;
-      if ((0, import_utils24.isFunction)(state)) {
+      if ((0, import_utils25.isFunction)(state)) {
         ref.__state = state;
-        return (0, import_utils24.exec)(state, element);
-      } else if ((0, import_utils24.is)(state)("string", "number")) {
+        return (0, import_utils25.exec)(state, element);
+      } else if ((0, import_utils25.is)(state)("string", "number")) {
         ref.__state = state;
         return {};
       } else if (state === true) {
@@ -2836,7 +2836,7 @@ var require_create2 = __commonJS({
         __children: {},
         __root: ref.__root ? ref.__root.state : state
       };
-      if ((0, import_utils24.isArray)(state)) {
+      if ((0, import_utils25.isArray)(state)) {
         addProtoToArray(state, proto);
       } else {
         Object.setPrototypeOf(state, proto);
@@ -2904,16 +2904,16 @@ var require_state = __commonJS({
     });
     module2.exports = __toCommonJS2(state_exports);
     var import_state2 = require_cjs5();
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var state = (params, element, node2) => {
-      const state2 = (0, import_utils24.exec)(params, element);
-      if ((0, import_utils24.isObject)(state2)) {
+      const state2 = (0, import_utils25.exec)(params, element);
+      if ((0, import_utils25.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_utils24.exec)(state2[param], element);
+          element.state[param] = (0, import_utils25.exec)(state2[param], element);
         }
       }
       return element;
@@ -2948,13 +2948,13 @@ var require_scope = __commonJS({
       default: () => scope_default
     });
     module2.exports = __toCommonJS2(scope_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var scope_default = (params, element, node2) => {
-      if (!(0, import_utils24.isObject)(params))
+      if (!(0, import_utils25.isObject)(params))
         return;
       for (const scopeItem in params) {
         const value2 = params[scopeItem];
-        if ((0, import_utils24.isFunction)(value2)) {
+        if ((0, import_utils25.isFunction)(value2)) {
           element.scope[scopeItem] = value2.bind(element);
         } else {
           element.scope[scopeItem] = value2;
@@ -3161,7 +3161,7 @@ var require_methods2 = __commonJS({
       spotByPath: () => spotByPath
     });
     module2.exports = __toCommonJS2(methods_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_tree = require_tree();
     var import_mixins = require_mixins();
     var spotByPath = function(path) {
@@ -3194,9 +3194,9 @@ var require_methods2 = __commonJS({
     };
     var remove = function(params) {
       const element = this;
-      if ((0, import_utils24.isFunction)(element.node.remove))
+      if ((0, import_utils25.isFunction)(element.node.remove))
         element.node.remove();
-      else if (!(0, import_utils24.isProduction)()) {
+      else if (!(0, import_utils25.isProduction)()) {
         console.warn("This item cant be removed");
         element.log();
       }
@@ -3236,12 +3236,12 @@ var require_methods2 = __commonJS({
         if (v === "state") {
           if (element.__ref && element.__ref.__hasRootState)
             return;
-          if ((0, import_utils24.isFunction)(val && val.parse))
+          if ((0, import_utils25.isFunction)(val && val.parse))
             val = val.parse();
         } else if (v === "props") {
           const { __element, update, ...props4 } = element[v];
           obj[v] = props4;
-        } else if ((0, import_utils24.isDefined)(val))
+        } else if ((0, import_utils25.isDefined)(val))
           obj[v] = val;
       });
       return obj;
@@ -3252,7 +3252,7 @@ var require_methods2 = __commonJS({
       for (const v in obj) {
         if (excl.includes(v))
           return;
-        if ((0, import_utils24.isObjectLike)(obj[v])) {
+        if ((0, import_utils25.isObjectLike)(obj[v])) {
           obj[v] = parseDeep.call(obj[v], excl);
         }
       }
@@ -3370,18 +3370,18 @@ var require_inherit2 = __commonJS({
       inheritParentProps: () => inheritParentProps
     });
     module2.exports = __toCommonJS2(inherit_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var objectizeStringProperty = (propValue) => {
-      if ((0, import_utils24.is)(propValue)("string", "number")) {
+      if ((0, import_utils25.is)(propValue)("string", "number")) {
         return { inheritedString: propValue };
       }
       return propValue;
     };
     var inheritParentProps = (element, parent) => {
       let propsStack = [];
-      const parentProps = (0, import_utils24.exec)(parent, parent.state).props;
+      const parentProps = (0, import_utils25.exec)(parent, parent.state).props;
       const matchParent = parent.props && parentProps[element.key];
-      const matchParentIsString = (0, import_utils24.isString)(matchParent);
+      const matchParentIsString = (0, import_utils25.isString)(matchParent);
       const matchParentChildProps = parentProps && parentProps.childProps;
       if (matchParent) {
         if (matchParentIsString) {
@@ -3429,19 +3429,19 @@ var require_create3 = __commonJS({
       syncProps: () => syncProps
     });
     module2.exports = __toCommonJS2(create_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = 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_utils24.isObject)(props4))
+      if ((0, import_utils25.isObject)(props4))
         propsStack.push(props4);
       else if (props4 === "inherit" && parent.props)
         propsStack.push(parent.props);
       else if (props4)
         propsStack.push(props4);
-      if ((0, import_utils24.isArray)(__ref.__extend)) {
+      if ((0, import_utils25.isArray)(__ref.__extend)) {
         __ref.__extend.forEach((extend) => {
           if (extend.props && extend.props !== props4)
             propsStack.push(extend.props);
@@ -3456,10 +3456,10 @@ var require_create3 = __commonJS({
       props4.forEach((v) => {
         if (import_ignore.IGNORE_PROPS_PARAMS.includes(v))
           return;
-        const execProps = (0, import_utils24.exec)(v, element);
-        element.props = (0, import_utils24.deepMerge)(
+        const execProps = (0, import_utils25.exec)(v, element);
+        element.props = (0, import_utils25.deepMerge)(
           mergedProps,
-          (0, import_utils24.deepClone)(execProps, import_ignore.IGNORE_PROPS_PARAMS),
+          (0, import_utils25.deepClone)(execProps, import_ignore.IGNORE_PROPS_PARAMS),
           import_ignore.IGNORE_PROPS_PARAMS
         );
       });
@@ -3597,7 +3597,7 @@ var require_object2 = __commonJS({
       METHODS_EXL: () => METHODS_EXL,
       clone: () => clone,
       deepClone: () => deepClone4,
-      deepMerge: () => deepMerge5,
+      deepMerge: () => deepMerge7,
       flattenRecursive: () => flattenRecursive,
       mergeAndCloneIfArray: () => mergeAndCloneIfArray,
       mergeArray: () => mergeArray,
@@ -3607,17 +3607,17 @@ var require_object2 = __commonJS({
       overwriteShallow: () => overwriteShallow2
     });
     module2.exports = __toCommonJS2(object_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_state2 = require_cjs5();
     var import_props = require_props();
     var import_methods = require_methods2();
-    var METHODS_EXL = (0, import_utils24.joinArrays)(
+    var METHODS_EXL = (0, import_utils25.joinArrays)(
       ["node", "state", "context", "extend"],
       import_methods.METHODS,
       import_state2.IGNORE_STATE_PARAMS,
       import_props.IGNORE_PROPS_PARAMS
     );
-    var deepMerge5 = (element, extend, exclude = METHODS_EXL) => {
+    var deepMerge7 = (element, extend, exclude = METHODS_EXL) => {
       for (const e in extend) {
         if (exclude.includes(e))
           continue;
@@ -3625,8 +3625,8 @@ var require_object2 = __commonJS({
         const extendProp = extend[e];
         if (elementProp === void 0) {
           element[e] = extendProp;
-        } else if ((0, import_utils24.isObjectLike)(elementProp) && (0, import_utils24.isObject)(extendProp)) {
-          deepMerge5(elementProp, extendProp);
+        } else if ((0, import_utils25.isObjectLike)(elementProp) && (0, import_utils25.isObject)(extendProp)) {
+          deepMerge7(elementProp, extendProp);
         }
       }
       return element;
@@ -3641,15 +3641,15 @@ var require_object2 = __commonJS({
       return o;
     };
     var deepClone4 = (obj, exclude = METHODS_EXL) => {
-      const o = (0, import_utils24.isArray)(obj) ? [] : {};
+      const o = (0, import_utils25.isArray)(obj) ? [] : {};
       for (const e in obj) {
         if (exclude.includes(e))
           continue;
         let objProp = obj[e];
-        if (e === "extend" && (0, import_utils24.isArray)(objProp)) {
+        if (e === "extend" && (0, import_utils25.isArray)(objProp)) {
           objProp = mergeArray(objProp, exclude);
         }
-        if ((0, import_utils24.isObjectLike)(objProp)) {
+        if ((0, import_utils25.isObjectLike)(objProp)) {
           o[e] = deepClone4(objProp, exclude);
         } else
           o[e] = objProp;
@@ -3688,7 +3688,7 @@ var require_object2 = __commonJS({
           continue;
         const objProp = obj[e];
         const paramsProp = params[e];
-        if ((0, import_utils24.isObjectLike)(objProp) && (0, import_utils24.isObjectLike)(paramsProp)) {
+        if ((0, import_utils25.isObjectLike)(objProp) && (0, import_utils25.isObjectLike)(paramsProp)) {
           overwriteDeep(objProp, paramsProp);
         } else if (paramsProp !== void 0) {
           obj[e] = paramsProp;
@@ -3697,15 +3697,15 @@ var require_object2 = __commonJS({
       return obj;
     };
     var mergeIfExisted = (a, b) => {
-      if ((0, import_utils24.isObjectLike)(a) && (0, import_utils24.isObjectLike)(b))
-        return deepMerge5(a, b);
+      if ((0, import_utils25.isObjectLike)(a) && (0, import_utils25.isObjectLike)(b))
+        return deepMerge7(a, b);
       return a || b;
     };
     var mergeArray = (arr, exclude = ["parent", "node", "__element", "state", "context", "__ref"]) => {
-      return arr.reduce((a, c) => deepMerge5(a, deepClone4(c, exclude)), {});
+      return arr.reduce((a, c) => deepMerge7(a, deepClone4(c, exclude)), {});
     };
     var mergeAndCloneIfArray = (obj) => {
-      return (0, import_utils24.isArray)(obj) ? mergeArray(obj) : deepClone4(obj);
+      return (0, import_utils25.isArray)(obj) ? mergeArray(obj) : deepClone4(obj);
     };
     var flattenRecursive = (param, prop, stack = []) => {
       const objectized = mergeAndCloneIfArray(param);
@@ -3760,7 +3760,7 @@ var require_extendUtils = __commonJS({
       setHashedExtend: () => setHashedExtend
     });
     module2.exports = __toCommonJS2(extendUtils_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var ENV2 = "development";
     var generateHash = () => Math.random().toString(36).substring(2);
     var extendStackRegistry = {};
@@ -3770,7 +3770,7 @@ var require_extendUtils = __commonJS({
     };
     var setHashedExtend = (extend, stack) => {
       const hash2 = generateHash();
-      if (!(0, import_utils24.isString)(extend)) {
+      if (!(0, import_utils25.isString)(extend)) {
         extend.__hash = hash2;
       }
       extendStackRegistry[hash2] = stack;
@@ -3796,9 +3796,9 @@ var require_extendUtils = __commonJS({
     var flattenExtend = (extend, stack, context) => {
       if (!extend)
         return stack;
-      if ((0, import_utils24.isArray)(extend))
+      if ((0, import_utils25.isArray)(extend))
         return extractArrayExtend(extend, stack, context);
-      if ((0, import_utils24.isString)(extend))
+      if ((0, import_utils25.isString)(extend))
         extend = fallbackStringExtend(extend, context);
       stack.push(extend);
       if (extend.extend)
@@ -3811,9 +3811,9 @@ var require_extendUtils = __commonJS({
         if (["parent", "node", "__element"].indexOf(prop) > -1)
           continue;
         const objProp = obj[prop];
-        if ((0, import_utils24.isObject)(objProp)) {
+        if ((0, import_utils25.isObject)(objProp)) {
           o[prop] = deepCloneExtend(objProp);
-        } else if ((0, import_utils24.isArray)(objProp)) {
+        } else if ((0, import_utils25.isArray)(objProp)) {
           o[prop] = objProp.map((x) => x);
         } else
           o[prop] = objProp;
@@ -3828,14 +3828,14 @@ var require_extendUtils = __commonJS({
         const extendProp = extend[e];
         if (elementProp === void 0) {
           element[e] = extendProp;
-        } else if ((0, import_utils24.isObject)(elementProp) && (0, import_utils24.isObject)(extendProp)) {
+        } else if ((0, import_utils25.isObject)(elementProp) && (0, import_utils25.isObject)(extendProp)) {
           deepMergeExtend(elementProp, extendProp);
-        } else if ((0, import_utils24.isArray)(elementProp) && (0, import_utils24.isArray)(extendProp)) {
+        } else if ((0, import_utils25.isArray)(elementProp) && (0, import_utils25.isArray)(extendProp)) {
           element[e] = elementProp.concat(extendProp);
-        } else if ((0, import_utils24.isArray)(elementProp) && (0, import_utils24.isObject)(extendProp)) {
+        } else if ((0, import_utils25.isArray)(elementProp) && (0, import_utils25.isObject)(extendProp)) {
           const obj = deepMergeExtend({}, elementProp);
           element[e] = deepMergeExtend(obj, extendProp);
-        } else if (elementProp === void 0 && (0, import_utils24.isFunction)(extendProp)) {
+        } else if (elementProp === void 0 && (0, import_utils25.isFunction)(extendProp)) {
           element[e] = extendProp;
         }
       }
@@ -3848,7 +3848,7 @@ var require_extendUtils = __commonJS({
     };
     var fallbackStringExtend = (extend, context, options = {}) => {
       const COMPONENTS = context && context.components || options.components;
-      if ((0, import_utils24.isString)(extend)) {
+      if ((0, import_utils25.isString)(extend)) {
         const componentExists = COMPONENTS[extend] || COMPONENTS["smbls." + extend];
         console.log(extend, componentExists);
         if (COMPONENTS && componentExists) {
@@ -3906,27 +3906,27 @@ var require_extend = __commonJS({
       applyExtend: () => applyExtend
     });
     module2.exports = __toCommonJS2(extend_exports);
-    var import_utils24 = require_cjs();
-    var import_utils25 = require_utils();
+    var import_utils25 = require_cjs();
+    var import_utils26 = require_utils();
     var ENV2 = "development";
     var applyExtend = (element, parent, options = {}) => {
-      if ((0, import_utils24.isFunction)(element))
-        element = (0, import_utils24.exec)(element, parent);
+      if ((0, import_utils25.isFunction)(element))
+        element = (0, import_utils25.exec)(element, parent);
       let { extend, props: props4, context, __ref } = element;
-      extend = (0, import_utils25.fallbackStringExtend)(extend, context, options);
-      const extendStack = (0, import_utils25.getExtendStack)(extend, context);
+      extend = (0, import_utils26.fallbackStringExtend)(extend, context, options);
+      const extendStack = (0, import_utils26.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_utils25.getExtendStack)(parent.childExtend, context);
+          childExtendStack = (0, import_utils26.getExtendStack)(parent.childExtend, context);
           const ignoreChildExtendRecursive = props4 && props4.ignoreChildExtendRecursive;
           if (parent.childExtendRecursive && !ignoreChildExtendRecursive) {
             const canExtendRecursive = element.key !== "__text";
             if (canExtendRecursive) {
-              const childExtendRecursiveStack = (0, import_utils25.getExtendStack)(parent.childExtendRecursive, context);
+              const childExtendRecursiveStack = (0, import_utils26.getExtendStack)(parent.childExtendRecursive, context);
               childExtendStack = childExtendStack.concat(childExtendRecursiveStack);
               element.childExtendRecursive = parent.childExtendRecursive;
             }
@@ -3937,7 +3937,7 @@ var require_extend = __commonJS({
       const childExtendLength = childExtendStack.length;
       let stack = [];
       if (extendLength && childExtendLength) {
-        stack = (0, import_utils25.jointStacks)(extendStack, childExtendStack);
+        stack = (0, import_utils26.jointStacks)(extendStack, childExtendStack);
       } else if (extendLength) {
         stack = extendStack;
       } else if (childExtendLength) {
@@ -3945,19 +3945,19 @@ var require_extend = __commonJS({
       } else if (!options.extend)
         return element;
       if (options.extend) {
-        const defaultOptionsExtend = (0, import_utils25.getExtendStack)(options.extend, context);
+        const defaultOptionsExtend = (0, import_utils26.getExtendStack)(options.extend, context);
         stack = [].concat(stack, defaultOptionsExtend);
       }
       if (__ref)
         __ref.__extend = stack;
-      let mergedExtend = (0, import_utils25.cloneAndMergeArrayExtend)(stack);
+      let mergedExtend = (0, import_utils26.cloneAndMergeArrayExtend)(stack);
       const COMPONENTS = context && context.components || options.components;
-      const component = (0, import_utils24.exec)(element.component || mergedExtend.component, element);
+      const component = (0, import_utils25.exec)(element.component || mergedExtend.component, element);
       if (component && COMPONENTS && COMPONENTS[component]) {
-        const componentExtend = (0, import_utils25.cloneAndMergeArrayExtend)((0, import_utils25.getExtendStack)(COMPONENTS[component]));
-        mergedExtend = (0, import_utils25.deepMergeExtend)(componentExtend, mergedExtend);
+        const componentExtend = (0, import_utils26.cloneAndMergeArrayExtend)((0, import_utils26.getExtendStack)(COMPONENTS[component]));
+        mergedExtend = (0, import_utils26.deepMergeExtend)(componentExtend, mergedExtend);
       }
-      return (0, import_utils25.deepMergeExtend)(element, mergedExtend);
+      return (0, import_utils26.deepMergeExtend)(element, mergedExtend);
     };
   }
 });
@@ -3989,18 +3989,18 @@ var require_component = __commonJS({
       applyComponentFromContext: () => applyComponentFromContext,
       applyKeyComponentAsExtend: () => applyKeyComponentAsExtend,
       applyVariant: () => applyVariant,
-      checkIfKeyIsComponent: () => checkIfKeyIsComponent,
+      checkIfKeyIsComponent: () => checkIfKeyIsComponent2,
       extendizeByKey: () => extendizeByKey,
       hasVariantProp: () => hasVariantProp,
       isVariant: () => isVariant,
       overwriteVariant: () => overwriteVariant
     });
     module2.exports = __toCommonJS2(component_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_extend = require_extend();
     var ENV2 = "development";
-    var checkIfKeyIsComponent = (key) => {
-      const isFirstKeyString = (0, import_utils24.isString)(key);
+    var checkIfKeyIsComponent2 = (key) => {
+      const isFirstKeyString = (0, import_utils25.isString)(key);
       if (!isFirstKeyString)
         return;
       const firstCharKey = key.slice(0, 1);
@@ -4008,7 +4008,7 @@ var require_component = __commonJS({
     };
     var addAdditionalExtend = (newExtend, element) => {
       const { extend } = element;
-      const preserveExtend = (0, import_utils24.isArray)(extend) ? extend : [extend];
+      const preserveExtend = (0, import_utils25.isArray)(extend) ? extend : [extend];
       return {
         ...element,
         extend: [newExtend].concat(preserveExtend)
@@ -4033,12 +4033,12 @@ var require_component = __commonJS({
         };
       } else if (extend) {
         addAdditionalExtend(extendKey, element);
-      } else if ((0, import_utils24.isFunction)(element)) {
+      } else if ((0, import_utils25.isFunction)(element)) {
         console.log(element);
         return {
           extend: extendKey,
           tag,
-          props: { ...(0, import_utils24.exec)(element, parent) }
+          props: { ...(0, import_utils25.exec)(element, parent) }
         };
       }
     };
@@ -4051,8 +4051,8 @@ var require_component = __commonJS({
         return;
       const { components } = context;
       const { extend } = element;
-      const execExtend = (0, import_utils24.exec)(extend, element);
-      if ((0, import_utils24.isString)(execExtend)) {
+      const execExtend = (0, import_utils25.exec)(extend, element);
+      if ((0, import_utils25.isString)(execExtend)) {
         if (components[execExtend])
           element.extend = components[execExtend];
         else {
@@ -4065,29 +4065,29 @@ var require_component = __commonJS({
       }
     };
     var isVariant = (param) => {
-      if (!(0, import_utils24.isString)(param))
+      if (!(0, import_utils25.isString)(param))
         return;
       const firstCharKey = param.slice(0, 1);
       return firstCharKey === ".";
     };
     var hasVariantProp = (element) => {
       const { props: props4 } = element;
-      if ((0, import_utils24.isObject)(props4) && (0, import_utils24.isString)(props4.variant))
+      if ((0, import_utils25.isObject)(props4) && (0, import_utils25.isString)(props4.variant))
         return true;
     };
     var overwriteVariant = (element, variant, variantProps) => {
       let variantElement = element[variant];
       if (!variantElement)
         return;
-      const props4 = (0, import_utils24.isObject)(variantProps) ? variantProps : {};
-      if ((0, import_utils24.isString)(variantElement)) {
+      const props4 = (0, import_utils25.isObject)(variantProps) ? variantProps : {};
+      if ((0, import_utils25.isString)(variantElement)) {
         variantElement = {
           extend: [{ props: props4 }, variantElement]
         };
       } else if (variantElement.extend) {
         variantElement = addAdditionalExtend({ props: props4 }, variantElement);
       }
-      return (0, import_utils24.overwriteDeep)(element, (0, import_extend.applyExtend)(variantElement));
+      return (0, import_utils25.overwriteDeep)(element, (0, import_extend.applyExtend)(variantElement));
     };
     var applyVariant = (element) => {
       const { props: props4 } = element;
@@ -4162,8 +4162,8 @@ var require_iterate = __commonJS({
       throughUpdatedExec: () => throughUpdatedExec
     });
     module2.exports = __toCommonJS2(iterate_exports);
-    var import_utils24 = require_cjs();
-    var import_utils25 = require_utils();
+    var import_utils25 = require_cjs();
+    var import_utils26 = require_utils();
     var import_methods = require_methods2();
     var throughInitialExec = (element, exclude = {}) => {
       const { __ref: ref } = element;
@@ -4171,13 +4171,13 @@ var require_iterate = __commonJS({
         if (exclude[param])
           continue;
         const prop = element[param];
-        if ((0, import_utils24.isFunction)(prop) && !(0, import_methods.isMethod)(param) && !(0, import_utils25.isVariant)(param)) {
+        if ((0, import_utils25.isFunction)(prop) && !(0, import_methods.isMethod)(param) && !(0, import_utils26.isVariant)(param)) {
           ref.__exec[param] = prop;
           element[param] = prop(element, element.state);
         }
       }
     };
-    var throughUpdatedExec = (element, options = { excludes: import_utils25.METHODS_EXL }) => {
+    var throughUpdatedExec = (element, options = { excludes: import_utils26.METHODS_EXL }) => {
       const { __ref: ref } = element;
       const changes = {};
       for (const param in ref.__exec) {
@@ -4186,13 +4186,13 @@ var require_iterate = __commonJS({
         if (isDefinedParam)
           continue;
         const newExec = ref.__exec[param](element, element.state, element.context);
-        const execReturnsString = (0, import_utils24.isString)(newExec) || (0, import_utils24.isNumber)(newExec);
+        const execReturnsString = (0, import_utils25.isString)(newExec) || (0, import_utils25.isNumber)(newExec);
         if (prop && prop.node && execReturnsString) {
-          (0, import_utils25.overwrite)(prop, { text: newExec }, options);
+          (0, import_utils26.overwrite)(prop, { text: newExec }, options);
         } else if (newExec !== prop) {
-          if ((0, import_utils25.checkIfKeyIsComponent)(param)) {
-            const { extend, ...newElem } = (0, import_utils25.extendizeByKey)(newExec, element, param);
-            (0, import_utils25.overwrite)(prop, newElem, options);
+          if ((0, import_utils26.checkIfKeyIsComponent)(param)) {
+            const { extend, ...newElem } = (0, import_utils26.extendizeByKey)(newExec, element, param);
+            (0, import_utils26.overwrite)(prop, newElem, options);
           } else {
             ref.__cached[param] = changes[param] = prop;
             element[param] = newExec;
@@ -4204,16 +4204,16 @@ var require_iterate = __commonJS({
     var throughInitialDefine = (element) => {
       const { define, context, __ref: ref } = element;
       let defineObj = {};
-      const hasGlobalDefine = context && (0, import_utils24.isObject)(context.define);
-      if ((0, import_utils24.isObject)(define))
+      const hasGlobalDefine = context && (0, import_utils25.isObject)(context.define);
+      if ((0, import_utils25.isObject)(define))
         defineObj = { ...define };
       if (hasGlobalDefine)
         defineObj = { ...defineObj, ...context.define };
       for (const param in defineObj) {
         let elementProp = element[param];
-        if ((0, import_utils24.isFunction)(elementProp) && !(0, import_methods.isMethod)(param) && !(0, import_utils25.isVariant)(param)) {
+        if ((0, import_utils25.isFunction)(elementProp) && !(0, import_methods.isMethod)(param) && !(0, import_utils26.isVariant)(param)) {
           ref.__exec[param] = elementProp;
-          const execParam2 = elementProp = (0, import_utils24.exec)(elementProp, element);
+          const execParam2 = elementProp = (0, import_utils25.exec)(elementProp, element);
           if (execParam2) {
             elementProp = element[param] = execParam2.parse ? execParam2.parse() : execParam2;
             ref.__defineCache[param] = elementProp;
@@ -4229,15 +4229,15 @@ var require_iterate = __commonJS({
       const { context, define, __ref: ref } = element;
       const changes = {};
       let obj = {};
-      if ((0, import_utils24.isObject)(define))
+      if ((0, import_utils25.isObject)(define))
         obj = { ...define };
-      if ((0, import_utils24.isObject)(context && context.define))
+      if ((0, import_utils25.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_utils24.exec)(ref.__defineCache[param], element);
+        const cached = (0, import_utils25.exec)(ref.__defineCache[param], element);
         const newExecParam = obj[param](cached, element, element.state, element.context);
         if (newExecParam)
           element[param] = newExecParam;
@@ -4273,7 +4273,7 @@ var require_applyParam = __commonJS({
       applyParam: () => applyParam
     });
     module2.exports = __toCommonJS2(applyParam_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_mixins = require_mixins();
     var applyParam = (param, element, options) => {
       const { node: node2, context, __ref: ref } = element;
@@ -4286,7 +4286,7 @@ var require_applyParam = __commonJS({
       if (!ref.__if)
         return;
       if (isGlobalTransformer && !hasContextDefine) {
-        if ((0, import_utils24.isFunction)(isGlobalTransformer)) {
+        if ((0, import_utils25.isFunction)(isGlobalTransformer)) {
           isGlobalTransformer(prop, element, node2, options);
           return;
         }
@@ -4333,7 +4333,7 @@ var require_node2 = __commonJS({
       default: () => node_default
     });
     module2.exports = __toCommonJS2(node_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_event = require_cjs3();
     var import_render = require_cjs4();
     var import_methods = require_methods2();
@@ -4341,7 +4341,7 @@ var require_node2 = __commonJS({
     var import_iterate = require_iterate();
     var import_mixins = require_mixins();
     var import_applyParam = require_applyParam();
-    var import_utils25 = require_utils();
+    var import_utils26 = require_utils();
     var ENV2 = "development";
     var createNode = (element, options) => {
       let { node: node2, tag, __ref: ref } = element;
@@ -4358,24 +4358,24 @@ var require_node2 = __commonJS({
       }
       if (ENV2 === "test" || ENV2 === "development" || options.alowRefReference) {
         node2.ref = element;
-        if ((0, import_utils24.isFunction)(node2.setAttribute))
+        if ((0, import_utils25.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_utils24.isObject)(element.on))
+        if (isNewNode && (0, import_utils25.isObject)(element.on))
           (0, import_event.applyEventsOnNode)(element);
       }
       for (const param in element) {
         const value2 = element[param];
-        if ((0, import_utils24.isUndefined)(value2) || (0, import_methods.isMethod)(param) || (0, import_utils25.isVariant)(param) || (0, import_utils24.isObject)(import_mixins.registry[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]))
           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_utils24.exec)(value2, element), element, param, options);
+            const createAsync = () => (0, import_create.default)((0, import_utils25.exec)(value2, element), element, param, options);
             if (element.props && element.props.lazyLoad || options.lazyLoad) {
               window.requestAnimationFrame(() => createAsync());
             } else
@@ -4573,7 +4573,7 @@ var require_types2 = __commonJS({
       isNumber: () => isNumber,
       isObject: () => isObject12,
       isObjectLike: () => isObjectLike3,
-      isString: () => isString10,
+      isString: () => isString11,
       isUndefined: () => isUndefined4
     });
     module2.exports = __toCommonJS2(types_exports);
@@ -4583,7 +4583,7 @@ var require_types2 = __commonJS({
         return false;
       return typeof arg === "object" && arg.constructor === Object;
     };
-    var isString10 = (arg) => typeof arg === "string";
+    var isString11 = (arg) => typeof arg === "string";
     var isNumber = (arg) => typeof arg === "number";
     var isFunction4 = (arg) => typeof arg === "function";
     var isBoolean = (arg) => arg === true || arg === false;
@@ -4595,7 +4595,7 @@ var require_types2 = __commonJS({
       return typeof arg === "object";
     };
     var isDefined2 = (arg) => {
-      return isObject12(arg) || isObjectLike3(arg) || isString10(arg) || isNumber(arg) || isFunction4(arg) || isArray6(arg) || isObjectLike3(arg) || isBoolean(arg) || isNull(arg);
+      return isObject12(arg) || isObjectLike3(arg) || isString11(arg) || isNumber(arg) || isFunction4(arg) || isArray6(arg) || isObjectLike3(arg) || isBoolean(arg) || isNull(arg);
     };
     var isUndefined4 = (arg) => {
       return arg === void 0;
@@ -4604,7 +4604,7 @@ var require_types2 = __commonJS({
       boolean: isBoolean,
       array: isArray6,
       object: isObject12,
-      string: isString10,
+      string: isString11,
       number: isNumber,
       null: isNull,
       function: isFunction4,
@@ -4812,7 +4812,7 @@ var require_object3 = __commonJS({
       deepClone: () => deepClone4,
       deepCloneExclude: () => deepCloneExclude,
       deepDestringify: () => deepDestringify,
-      deepMerge: () => deepMerge5,
+      deepMerge: () => deepMerge7,
       deepStringify: () => deepStringify,
       detachFunctionsFromObject: () => detachFunctionsFromObject,
       diff: () => diff,
@@ -4865,7 +4865,7 @@ var require_object3 = __commonJS({
       }
       return element;
     };
-    var deepMerge5 = (element, extend, excludeFrom = []) => {
+    var deepMerge7 = (element, extend, excludeFrom = []) => {
       for (const e in extend) {
         const hasOwnProperty = Object.prototype.hasOwnProperty.call(extend, e);
         if (!hasOwnProperty || excludeFrom.includes(e) || e.startsWith("__"))
@@ -4873,7 +4873,7 @@ var require_object3 = __commonJS({
         const elementProp = element[e];
         const extendProp = extend[e];
         if ((0, import_types.isObjectLike)(elementProp) && (0, import_types.isObjectLike)(extendProp)) {
-          deepMerge5(elementProp, extendProp);
+          deepMerge7(elementProp, extendProp);
         } else if (elementProp === void 0) {
           element[e] = extendProp;
         }
@@ -4913,7 +4913,7 @@ var require_object3 = __commonJS({
       return o;
     };
     var mergeArrayExclude = (arr, excl = []) => {
-      return arr.reduce((acc, curr) => deepMerge5(acc, deepCloneExclude(curr, excl)), {});
+      return arr.reduce((acc, curr) => deepMerge7(acc, deepCloneExclude(curr, excl)), {});
     };
     var deepClone4 = (obj, excludeFrom = []) => {
       const o = (0, import_types.isArray)(obj) ? [] : {};
@@ -5158,7 +5158,7 @@ var require_object3 = __commonJS({
     };
     var mergeIfExisted = (a, b) => {
       if ((0, import_types.isObjectLike)(a) && (0, import_types.isObjectLike)(b))
-        return deepMerge5(a, b);
+        return deepMerge7(a, b);
       return a || b;
     };
     var flattenRecursive = (param, prop, stack = []) => {
@@ -5580,7 +5580,7 @@ var require_methods3 = __commonJS({
       DEFAULT_METHODS: () => DEFAULT_METHODS
     });
     module2.exports = __toCommonJS2(methods_exports);
-    var import_utils24 = require_cjs6();
+    var import_utils25 = require_cjs6();
     var DEFAULT_METHODS = {
       key: {},
       tag: {},
@@ -5601,7 +5601,7 @@ var require_methods3 = __commonJS({
       text: (element, state) => {
         element.ref.text = {
           tag: "text",
-          text: (0, import_utils24.exec)(element.text, element, state)
+          text: (0, import_utils25.exec)(element.text, element, state)
         };
       },
       innerHTML: {},
@@ -5838,19 +5838,19 @@ var require_update2 = __commonJS({
       default: () => update_default
     });
     module2.exports = __toCommonJS2(update_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_event = require_cjs3();
     var import_methods = require_methods2();
     var import_props = require_props();
     var import_state2 = require_cjs5();
-    var import_utils25 = require_utils();
+    var import_utils26 = 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_utils24.createSnapshotId
+      snapshotId: import_utils25.createSnapshotId
     };
     var UPDATE_DEFAULT_OPTIONS = {
       stackChanges: false,
@@ -5858,7 +5858,7 @@ var require_update2 = __commonJS({
       preventRecursive: false,
       currentSnapshot: false,
       calleeElement: false,
-      excludes: import_utils25.METHODS_EXL
+      excludes: import_utils26.METHODS_EXL
     };
     var update = function(params = {}, options = UPDATE_DEFAULT_OPTIONS) {
       const element = this;
@@ -5868,14 +5868,14 @@ var require_update2 = __commonJS({
       if (preventInheritAtCurrentState && preventInheritAtCurrentState.__element === element)
         return;
       if (!excludes)
-        (0, import_utils24.merge)(options, UPDATE_DEFAULT_OPTIONS);
+        (0, import_utils25.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_utils24.isString)(params) || (0, import_utils24.isNumber)(params)) {
+      if ((0, import_utils25.isString)(params) || (0, import_utils25.isNumber)(params)) {
         params = { text: params };
       }
       const inheritState = inheritStateUpdates(element, options);
@@ -5886,7 +5886,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_utils24.isFunction)(v));
+        const hasFunctionInProps = ref.__props.filter((v) => (0, import_utils25.isFunction)(v));
         const props4 = params.props || hasParentProps || hasFunctionInProps.length;
         if (props4)
           (0, import_props.updateProps)(props4, element, parent);
@@ -5896,14 +5896,14 @@ var require_update2 = __commonJS({
         if (initUpdateReturns === false)
           return element;
       }
-      const overwriteChanges = (0, import_utils24.overwriteDeep)(element, params, import_utils25.METHODS_EXL);
+      const overwriteChanges = (0, import_utils25.overwriteDeep)(element, params, import_utils26.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_utils24.merge)(definedChanges, (0, import_utils24.merge)(execChanges, overwriteChanges));
+        const stackChanges = (0, import_utils25.merge)(definedChanges, (0, import_utils25.merge)(execChanges, overwriteChanges));
         element.__stackChanges.push(stackChanges);
       }
       if (!ref.__if)
@@ -5914,16 +5914,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_utils24.isArray)(options.preventUpdate) && options.preventUpdate.includes(param);
-        const isInPreventDefineUpdate = (0, import_utils24.isArray)(options.preventDefineUpdate) && options.preventDefineUpdate.includes(param);
-        if ((0, import_utils24.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_utils24.isObject)(import_mixins.registry[param]) || (0, import_utils25.isVariant)(param))
+        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))
           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_utils24.isObject)(prop) && !hasDefine && !hasContextDefine && !options.preventRecursive;
+          const canUpdate = (0, import_utils25.isObject)(prop) && !hasDefine && !hasContextDefine && !options.preventRecursive;
           if (!canUpdate)
             continue;
           const lazyLoad = element.props.lazyLoad || options.lazyLoad;
@@ -5932,7 +5932,7 @@ var require_update2 = __commonJS({
             currentSnapshot: snapshotOnCallee,
             calleeElement
           });
-          lazyLoad ? import_utils24.window.requestAnimationFrame(() => childUpdateCall()) : childUpdateCall();
+          lazyLoad ? import_utils25.window.requestAnimationFrame(() => childUpdateCall()) : childUpdateCall();
         }
       }
       if (!options.preventUpdateListener)
@@ -5955,7 +5955,7 @@ var require_update2 = __commonJS({
     };
     var checkIfOnUpdate = (element, parent, options) => {
       var _a;
-      if (!(0, import_utils24.isFunction)(element.if) || !parent)
+      if (!(0, import_utils25.isFunction)(element.if) || !parent)
         return;
       const ref = element.__ref;
       const ifPassed = element.if(element, element.state, element.context, options);
@@ -5981,7 +5981,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_utils24.isFunction)(element.on.update)) {
+          if (options.preventUpdate !== true && element.on && (0, import_utils25.isFunction)(element.on.update)) {
             (0, import_event.applyEvent)(element.on.update, created, created.state);
           }
           return created;
@@ -6002,9 +6002,9 @@ var require_update2 = __commonJS({
         element.state = parent && parent.state || {};
         return;
       }
-      const shouldForceFunctionState = (0, import_utils24.isFunction)(stateKey) && !isHoisted && execStateFunction;
+      const shouldForceFunctionState = (0, import_utils25.isFunction)(stateKey) && !isHoisted && execStateFunction;
       if (shouldForceFunctionState) {
-        const execState = (0, import_utils24.exec)(stateKey, element);
+        const execState = (0, import_utils25.exec)(stateKey, element);
         state.set(execState, { ...options, preventUpdate: true, updatedByStateFunction: true });
         return;
       }
@@ -6072,7 +6072,7 @@ var require_set2 = __commonJS({
       addMethods: () => addMethods
     });
     module2.exports = __toCommonJS2(set_exports);
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_set = __toESM2(require_set(), 1);
     var import_update = __toESM2(require_update2(), 1);
     var import__ = require_methods2();
@@ -6093,7 +6093,7 @@ var require_set2 = __commonJS({
         nextElement: import__.nextElement.bind(element),
         previousElement: import__.previousElement.bind(element)
       };
-      if ((0, import_utils24.isDevelopment)())
+      if ((0, import_utils25.isDevelopment)())
         proto.log = import__.log.bind(element);
       Object.setPrototypeOf(element, proto);
     };
@@ -6149,7 +6149,7 @@ var require_create4 = __commonJS({
     var import_set = require_set2();
     var import_classList = require_classList();
     var import_iterate = require_iterate();
-    var import_utils24 = require_cjs();
+    var import_utils25 = require_cjs();
     var import_options3 = __toESM2(require_options(), 1);
     var import_component = require_component();
     var ENV2 = "development";
@@ -6162,7 +6162,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_utils24.deepClone)(element.props, []);
+      ref.__initialProps = (0, import_utils25.deepClone)(element.props, []);
       applyContext(element, parent, options);
       (0, import_component.applyComponentFromContext)(element, parent, options);
       if (!ref.__skipCreate) {
@@ -6205,7 +6205,7 @@ var require_create4 = __commonJS({
         }
         return {};
       }
-      if ((0, import_utils24.isString)(key) && key.slice(0, 2 === "__")) {
+      if ((0, import_utils25.isString)(key) && key.slice(0, 2 === "__")) {
         if (ENV2 === "test" || ENV2 === "development") {
           console.warn(key, "seems like to be in __ref");
         }
@@ -6232,7 +6232,7 @@ var require_create4 = __commonJS({
     var redefineParent = (element, parent, key, options) => {
       if (!parent)
         return import_tree.ROOT;
-      if ((0, import_utils24.isNode)(parent)) {
+      if ((0, import_utils25.isNode)(parent)) {
         const parentNodeWrapper = { key: ":root", node: parent };
         import_tree.ROOT[`${key}_parent`] = parentNodeWrapper;
         return parentNodeWrapper;
@@ -6246,7 +6246,7 @@ var require_create4 = __commonJS({
       }
     };
     var createKey = (element, parent, key) => {
-      return ((0, import_utils24.exec)(key, element) || key || element.key || (0, import_utils24.generateKey)()).toString();
+      return ((0, import_utils25.exec)(key, element) || key || element.key || (0, import_utils25.generateKey)()).toString();
     };
     var addRef = (element, parent) => {
       if (element.__ref)
@@ -6278,7 +6278,7 @@ var require_create4 = __commonJS({
       (0, import_event.triggerEventOn)("render", element, options);
     };
     var checkIfPrimitive = (element) => {
-      return (0, import_utils24.is)(element)("string", "number");
+      return (0, import_utils25.is)(element)("string", "number");
     };
     var applyValueAsText = (element, parent, key) => {
       const extendTag = element.extend && element.extend.tag;
@@ -6302,7 +6302,7 @@ var require_create4 = __commonJS({
     };
     var createIfConditionFlag = (element, parent) => {
       const { __ref: ref } = element;
-      if ((0, import_utils24.isFunction)(element.if) && !element.if(element, element.state)) {
+      if ((0, import_utils25.isFunction)(element.if) && !element.if(element, element.state)) {
         delete ref.__if;
       } else
         ref.__if = true;
@@ -6361,7 +6361,7 @@ var require_create4 = __commonJS({
           ref.__children = [];
         (0, import_set.addMethods)(element, parent);
         (0, import_state2.createState)(element, parent);
-        if ((0, import_utils24.isFunction)(element.if)) {
+        if ((0, import_utils25.isFunction)(element.if)) {
           const ifPassed = element.if(element, element.state);
           if (!ifPassed) {
             delete ref.__if;
@@ -6381,7 +6381,7 @@ var require_create4 = __commonJS({
         (0, import_iterate.throughInitialDefine)(element);
         (0, import_iterate.throughInitialExec)(element);
         for (const k in element) {
-          if ((0, import_utils24.isUndefined)(element[k]) || (0, import_methods.isMethod)(k) || (0, import_utils24.isObject)(import_mixins.registry[k]) || (0, import_component.isVariant)(k))
+          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))
             continue;
           const hasDefine = element.define && element.define[k];
           const contextHasDefine = element.context && element.context.define && element.context.define[k];
@@ -6389,7 +6389,7 @@ var require_create4 = __commonJS({
           if (!ref.__skipCreate && import_mixins.registry[k] && !optionsHasDefine) {
             continue;
           } else if (element[k] && !hasDefine && !optionsHasDefine && !contextHasDefine) {
-            create2((0, import_utils24.exec)(element[k], element), element, k, options);
+            create2((0, import_utils25.exec)(element[k], element), element, k, options);
           }
         }
       }
@@ -6797,7 +6797,7 @@ var require_cjs10 = __commonJS({
           isNumber: () => isNumber2,
           isObject: () => isObject82,
           isObjectLike: () => isObjectLike3,
-          isString: () => isString10,
+          isString: () => isString102,
           isUndefined: () => isUndefined4
         });
         module22.exports = __toCommonJS22(types_exports);
@@ -6807,7 +6807,7 @@ var require_cjs10 = __commonJS({
             return false;
           return typeof arg === "object" && arg.constructor === Object;
         };
-        var isString10 = (arg) => typeof arg === "string";
+        var isString102 = (arg) => typeof arg === "string";
         var isNumber2 = (arg) => typeof arg === "number";
         var isFunction22 = (arg) => typeof arg === "function";
         var isBoolean = (arg) => arg === true || arg === false;
@@ -6820,7 +6820,7 @@ var require_cjs10 = __commonJS({
           return typeof arg === "object";
         };
         var isDefined2 = (arg) => {
-          return isObject82(arg) || isObjectLike3(arg) || isString10(arg) || isNumber2(arg) || isFunction22(arg) || isArray8(arg) || isObjectLike3(arg) || isBoolean(arg) || isDate(arg) || isNull(arg);
+          return isObject82(arg) || isObjectLike3(arg) || isString102(arg) || isNumber2(arg) || isFunction22(arg) || isArray8(arg) || isObjectLike3(arg) || isBoolean(arg) || isDate(arg) || isNull(arg);
         };
         var isUndefined4 = (arg) => {
           return arg === void 0;
@@ -6829,7 +6829,7 @@ var require_cjs10 = __commonJS({
           boolean: isBoolean,
           array: isArray8,
           object: isObject82,
-          string: isString10,
+          string: isString102,
           date: isDate,
           number: isNumber2,
           null: isNull,
@@ -8043,7 +8043,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_utils24 = __toESM2(require_cjs22(), 1);
+    var import_utils25 = __toESM2(require_cjs22(), 1);
     var ENV2 = "development";
     var colorStringToRgbaArray = (color) => {
       if (color === "")
@@ -8171,11 +8171,11 @@ var require_cjs10 = __commonJS({
       return `rgba(${arr})`;
     };
     var getRgbTone = (rgb, tone) => {
-      if ((0, import_utils24.isString)(rgb) && rgb.includes("rgb"))
+      if ((0, import_utils25.isString)(rgb) && rgb.includes("rgb"))
         rgb = colorStringToRgbaArray(rgb).join(", ");
-      if ((0, import_utils24.isString)(rgb))
+      if ((0, import_utils25.isString)(rgb))
         rgb = rgb.split(",").map((v) => parseFloat(v.trim()));
-      if ((0, import_utils24.isNumber)(tone))
+      if ((0, import_utils25.isNumber)(tone))
         tone += "";
       const toHex = rgbArrayToHex(rgb);
       const abs2 = tone.slice(0, 1);
@@ -8240,7 +8240,7 @@ var require_cjs10 = __commonJS({
     };
     var import_utils52 = __toESM2(require_cjs22(), 1);
     var import_utils32 = __toESM2(require_cjs22());
-    var import_utils25 = __toESM2(require_cjs22());
+    var import_utils26 = __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();
@@ -9581,7 +9581,7 @@ var require_cjs10 = __commonJS({
         }
       }
     };
-    var import_utils26 = __toESM2(require_cjs22(), 1);
+    var import_utils262 = __toESM2(require_cjs22(), 1);
     var applyReset = (reset = {}) => {
       const CONFIG22 = getActiveConfig3();
       const { RESET: RESET2, TYPOGRAPHY: TYPOGRAPHY22, DOCUMENT: DOCUMENT2 } = CONFIG22;
@@ -9603,8 +9603,8 @@ var require_cjs10 = __commonJS({
         const { body, ...templates } = TYPOGRAPHY22.templates;
         const globalTheme = CONFIG22.useDocumentTheme ? getMediaTheme2("document", `@${CONFIG22.globalTheme}`) : {};
         if (RESET2.html)
-          (0, import_utils26.overwriteDeep)(RESET2.html, globalTheme);
-        return (0, import_utils26.deepMerge)((0, import_utils26.merge)(RESET2, reset), {
+          (0, import_utils262.overwriteDeep)(RESET2.html, globalTheme);
+        return (0, import_utils262.deepMerge)((0, import_utils262.merge)(RESET2, reset), {
           html: {
             position: "absolute",
             // overflow: 'hidden',
@@ -9799,6 +9799,7 @@ var require_cjs10 = __commonJS({
         useIconSprite,
         globalTheme,
         useDocumentTheme,
+        useDefaultConfig,
         ...config
       } = recivedConfig;
       if (options.newConfig) {
@@ -9963,8 +9964,8 @@ var require_cjs12 = __commonJS({
       router: () => router2
     });
     module2.exports = __toCommonJS2(router_exports);
-    var import_utils24 = require_cjs();
-    var getActiveRoute = (level = 0, route = import_utils24.window.location.pathname) => {
+    var import_utils25 = require_cjs();
+    var getActiveRoute = (level = 0, route = import_utils25.window.location.pathname) => {
       const routeArray = route.split("/");
       const activeRoute = routeArray[level + 1];
       if (activeRoute)
@@ -9978,7 +9979,7 @@ var require_cjs12 = __commonJS({
       initialRender: false,
       scrollToTop: true,
       scrollToNode: false,
-      scrollNode: import_utils24.document && import_utils24.document.documentElement,
+      scrollNode: import_utils25.document && import_utils25.document.documentElement,
       scrollBody: false,
       useFragment: false,
       updateState: true,
@@ -9993,13 +9994,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_utils24.window.location.hash.slice(1);
+      const hashChanged = hash2 && hash2 !== import_utils25.window.location.hash.slice(1);
       const pathChanged = pathname !== lastPathname;
       lastPathname = pathname;
       if (!content)
         return;
       if (options.pushState) {
-        import_utils24.window.history.pushState(state, null, pathname + (hash2 ? `#${hash2}` : ""));
+        import_utils25.window.history.pushState(state, null, pathname + (hash2 ? `#${hash2}` : ""));
       }
       if (pathChanged || !hashChanged) {
         if (options.updateState) {
@@ -10025,7 +10026,7 @@ var require_cjs12 = __commonJS({
         });
       }
       if (hash2) {
-        const activeNode = import_utils24.document.getElementById(hash2);
+        const activeNode = import_utils25.document.getElementById(hash2);
         if (activeNode) {
           const top = activeNode.getBoundingClientRect().top + rootNode.scrollTop - options.scrollToOffset || 0;
           scrollNode.scrollTo({
@@ -10420,7 +10421,7 @@ __export(src_exports, {
 });
 module.exports = __toCommonJS(src_exports);
 var import_domql = __toESM(require_cjs9(), 1);
-var import_utils23 = __toESM(require_cjs(), 1);
+var import_utils24 = __toESM(require_cjs(), 1);
 // src/utilImports.js
 var utilImports_exports = {};
@@ -11887,6 +11888,7 @@ var init = (config, options = SET_OPTIONS) => {
     useSvgSprite: options.useSvgSprite,
     useDocumentTheme: options.useDocumentTheme,
     useIconSprite: options.useIconSprite,
+    useDefaultConfig: options.useDefaultConfig,
     ...resultConfig
   }, { newConfig: options.newConfig });
   const FontFace = (0, import_scratch.getFontFaceString)(conf.FONT);
@@ -11961,6 +11963,8 @@ __export(uikit_exports, {
   Clickable: () => Clickable,
   Collection: () => Collection,
   CommonButton: () => CommonButton,
+  CommonField: () => CommonField,
+  CommonFieldTemplate: () => CommonFieldTemplate,
   CommonForm: () => CommonForm,
   CompleteProcess: () => CompleteProcess,
   ContactForm: () => ContactForm,
@@ -13895,8 +13899,8 @@ var Input = {
     autocomplete: ({ props: props4 }) => props4.autocomplete,
     placeholder: ({ props: props4 }) => props4.placeholder,
     value: ({ props: props4, state, deps }) => {
-      const { isString: isString10, replaceLiteralsWithObjectFields: replaceLiteralsWithObjectFields2 } = deps;
-      if (isString10(props4.value) && props4.value.includes("{{")) {
+      const { isString: isString11, replaceLiteralsWithObjectFields: replaceLiteralsWithObjectFields2 } = deps;
+      if (isString11(props4.value) && props4.value.includes("{{")) {
         return replaceLiteralsWithObjectFields2(props4.value, state);
       }
       return props4.value;
@@ -13913,7 +13917,6 @@ var NumberInput = {
   extend: [Input, Flex],
   props: {
     type: "number",
-    fontSize: "E",
     boxSize: "C+X",
     align: "center center",
     textAlign: "center",
@@ -14144,6 +14147,52 @@ var Select = {
   }
 };
+// ../uikit/Field/CommonField.js
+var CommonField = {
+  extend: Flex,
+  tag: "label",
+  props: {
+    flow: "column",
+    boxSize: "fit-content fit-content",
+    gap: "Z"
+  },
+  Title: {
+    props: {
+      text: "Label",
+      lineHeight: "1em",
+      padding: "- - - V2",
+      color: "gray4"
+    }
+  },
+  Field: {
+    tag: "div"
+  },
+  Hint: {
+    extend: IconText,
+    props: {
+      color: "gray4",
+      align: "center flex-start",
+      text: "",
+      fontSize: "Z1",
+      gap: "Y",
+      padding: "W - - W"
+    }
+  }
+};
+var CommonFieldTemplate = {
+  extend: CommonField,
+  Title: {},
+  Field: {
+    Icon: { props: { name: "info" } },
+    Input: {},
+    Button: { icon: "eye" }
+  },
+  Hint: {
+    Icon: { props: { name: "info" } },
+    text: "Description"
+  }
+};
 // ../uikit/Field/Field.js
 var Field = {
   tag: "label",
@@ -15042,6 +15091,7 @@ var Notification = {
     Title: {
       tag: "h6",
       props: {
+        margin: "0",
         fontWeight: "600",
         lineHeight: "1em",
         text: "Notification"
@@ -16316,7 +16366,7 @@ var VerificationCode = {
       props: {
         display: "flex",
         columnGap: "A",
-        childProps: { flex: "1" }
+        childProps: { flex: "1", fontSize: "E" }
       },
       childExtend: NumberInput,
       ...[{}, {}, {}, {}]
@@ -18158,7 +18208,6 @@ var SPACING = {
 var FONT = {};
 var FONT_FAMILY = {
   system: {
-    isDefault: true,
     value: ['"Helvetica Neue"', "Helvetica", "Arial"],
     type: "sans-serif"
   }
@@ -18200,7 +18249,7 @@ var DEFAULT_CONFIG = {
 var src_default = DEFAULT_CONFIG;
 // src/initEmotion.js
-var initEmotion = (key, options = DESIGN_SYSTEM_OPTIONS) => {
+var initEmotion = (key, options = {}) => {
   const doc = options.parent || options.document || document;
   const initOptions = options.initOptions || {};
   const emotion2 = initOptions.emotion;
@@ -18208,7 +18257,7 @@ var initEmotion = (key, options = DESIGN_SYSTEM_OPTIONS) => {
     initOptions.emotion = emotion;
   const registry = options.registry || transformDOMQLEmotion(initOptions.emotion, options);
   const defaultDesignSystem = (0, import_utils20.deepClone)(src_default);
-  const designSystem = options.useDefaultConfig ? (0, import_utils20.deepMerge)(options.designSystem, defaultDesignSystem) : options.designSystem;
+  const designSystem = initOptions.useDefaultConfig ? (0, import_utils20.deepMerge)(options.designSystem, defaultDesignSystem) : options.designSystem || defaultDesignSystem;
   const scratchSystem2 = init(designSystem, {
     key,
     emotion: emotion2,
@@ -21893,37 +21942,80 @@ var applyInspectListener = (root, options) => {
     inspectOnKey(root);
 };
+// src/prepare.js
+var import_utils23 = __toESM(require_cjs(), 1);
+var checkIfKeyIsComponent = (key) => {
+  const isFirstKeyString = (0, import_utils23.isString)(key);
+  if (!isFirstKeyString)
+    return;
+  const firstCharKey = key.slice(0, 1);
+  return /^[A-Z]*$/.test(firstCharKey);
+};
+var UIkitWithPrefix = () => {
+  const newObj = {};
+  for (const key in uikit_exports) {
+    if (Object.prototype.hasOwnProperty.call(uikit_exports, key)) {
+      if (checkIfKeyIsComponent(key)) {
+        newObj[`smbls.${key}`] = uikit_exports[key];
+      } else {
+        newObj[key] = uikit_exports[key];
+      }
+    }
+  }
+  return newObj;
+};
+var prepareComponents = (options) => {
+  return options.components ? { ...UIkitWithPrefix(), ...options.components } : UIkitWithPrefix();
+};
+var prepareUtils = (options) => {
+  return { ...utilImports_exports, ...import_scratch2.scratchUtils, ...options.snippets || options.utils || {} };
+};
+var prepareDesignSystem = (options, key) => {
+  const [scratcDesignhSystem, emotion2, registry] = initEmotion(key, options);
+  return [scratcDesignhSystem, emotion2, registry];
+};
+var prepareState = (options, App) => {
+  const state = {};
+  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);
+};
+var preparePages = (options) => {
+  return options.pages || {};
+};
+var prepareDocument = (options) => {
+  if (typeof document === "undefined") {
+    if (typeof window === "undefined")
+      window = {};
+    if (!window.document)
+      window.document = { body: {} };
+    document = window.document;
+  }
+  return options.parent || options.document || document;
+};
 // src/index.js
 var SYMBOLS_KEY = process.env.SYMBOLS_KEY;
 var mergeWithLocalFile2 = (options, optionsExternalFile) => {
-  const rcfile = (0, import_utils23.isObject)(optionsExternalFile) ? optionsExternalFile : dynamic_default || {};
-  return (0, import_utils23.deepMerge)(options, rcfile);
+  const rcfile = (0, import_utils24.isObject)(optionsExternalFile) ? optionsExternalFile : dynamic_default || {};
+  return (0, import_utils24.deepMerge)(options, rcfile);
 };
 var create = async (App, options = options_default, optionsExternalFile) => {
-  const appIsKey = (0, import_utils23.isString)(App);
+  const appIsKey = (0, import_utils24.isString)(App);
   options = { ...options_default, ...mergeWithLocalFile2(options, optionsExternalFile) };
   const key = options.key || SYMBOLS_KEY || (appIsKey ? App : "");
   if (appIsKey)
     App = {};
   await fetchSync(key, options);
-  if (typeof document === "undefined") {
-    if (typeof window === "undefined")
-      window = {};
-    if (!window.document)
-      window.document = { body: {} };
-    document = window.document;
-  }
-  const doc = options.parent || options.document || document;
-  const [scratcDesignhSystem, emotion2, registry] = initEmotion(key, options);
-  const state = {};
-  if (options.state)
-    (0, import_utils23.deepMerge)(state, options.state);
-  if (App && App.state)
-    (0, import_utils23.deepMerge)(state, App.state);
-  const pages = options.pages || {};
-  const components = options.components ? { ...uikit_exports, ...options.components } : uikit_exports;
-  const designSystem = scratcDesignhSystem || {};
-  const snippets = { ...utilImports_exports, ...import_scratch2.scratchUtils, ...options.snippets || {} };
+  const doc = prepareDocument(options);
+  const [scratcDesignSystem, emotion2, registry] = prepareDesignSystem(options, key);
+  const state = prepareState(options, App);
+  const pages = preparePages(options);
+  const components = prepareComponents(options);
+  const designSystem = scratcDesignSystem;
+  const snippets = prepareUtils(options);
   const define = options.define || defaultDefine;
   const routerOptions = initRouter(App, options);
   const extend = applySyncDebug([App], options);
@@ -21961,7 +22053,7 @@ var create = async (App, options = options_default, optionsExternalFile) => {
   return domqlApp;
 };
 var createSync = (App, options = options_default, optionsExternalFile) => {
-  const appIsKey = (0, import_utils23.isString)(App);
+  const appIsKey = (0, import_utils24.isString)(App);
   options = mergeWithLocalFile2(options, optionsExternalFile);
   const key = options.key || SYMBOLS_KEY || (appIsKey ? App : "");
   if (appIsKey)
@@ -21980,7 +22072,7 @@ var createSync = (App, options = options_default, optionsExternalFile) => {
     parent = options.document;
   else
     parent = document.body;
-  const [scratcDesignhSystem, emotion2, registry] = initEmotion(key, options);
+  const [scratcDesignSystem, emotion2, registry] = initEmotion(key, options);
   let state;
   if (options.state)
     state = options.state;
@@ -21990,7 +22082,7 @@ var createSync = (App, options = options_default, optionsExternalFile) => {
     state = {};
   const pages = options.pages || {};
   const components = options.components ? { ...uikit_exports, ...options.components } : uikit_exports;
-  const designSystem = scratcDesignhSystem || {};
+  const designSystem = scratcDesignSystem || {};
   const snippets = { ...utilImports_exports, ...import_scratch2.scratchUtils, ...options.snippets || {} };
   const define = options.define || defaultDefine;
   const extend = applySyncDebug([App], options);