@symbo.ls/create 2.11.452 → 2.11.453

package/dist/cjs/bundle/index.js

@@ -303,6 +303,8 @@ var require_array = __commonJS({
       arraysEqual: () => arraysEqual,
       cutArrayAfterValue: () => cutArrayAfterValue,
       cutArrayBeforeValue: () => cutArrayBeforeValue,
+      filterArrays: () => filterArrays,
+      filterArraysFast: () => filterArraysFast,
       getFrequencyInArray: () => getFrequencyInArray,
       joinArrays: () => joinArrays,
       mergeAndCloneIfArray: () => mergeAndCloneIfArray,
@@ -411,6 +413,13 @@ var require_array = __commonJS({
       }
       return true;
     };
+    var filterArrays = (sourceArr, excludeArr) => {
+      return sourceArr.filter((item) => !excludeArr.includes(item));
+    };
+    var filterArraysFast = (sourceArr, excludeArr) => {
+      const excludeSet = new Set(excludeArr);
+      return sourceArr.filter((item) => !excludeSet.has(item));
+    };
   }
 });
 
@@ -604,6 +613,7 @@ var require_object = __commonJS({
       diff: () => diff,
       diffArrays: () => diffArrays,
       diffObjects: () => diffObjects,
+      excludeKeysFromObject: () => excludeKeysFromObject,
       exec: () => exec7,
       flattenRecursive: () => flattenRecursive,
       hasOwnProperty: () => hasOwnProperty,
@@ -931,7 +941,7 @@ var require_object = __commonJS({
     };
     var stringToObject = (str, opts = { verbose: true }) => {
       try {
-        return import_globals2.window.eval("(" + str + ")");
+        return str ? import_globals2.window.eval("(" + str + ")") : {};
       } catch (e) {
         if (opts.verbose)
           console.warn(e);
@@ -1011,20 +1021,27 @@ var require_object = __commonJS({
         return acc;
       }, deletedValues);
     };
-    var overwrite = (element, params, excludeFrom = []) => {
-      const { ref } = element;
-      const changes = {};
+    var overwrite = (element, params, opts = {}) => {
+      const { __ref: ref } = element;
+      const excl = opts.exclude || [];
+      const allowUnderscore = opts.preventUnderscore;
+      const preventCaching = opts.preventCaching;
       for (const e in params) {
-        if (excludeFrom.includes(e) || e.startsWith("__"))
+        if (excl.includes(e) || !allowUnderscore && e.startsWith("__"))
           continue;
         const elementProp = element[e];
         const paramsProp = params[e];
-        if (paramsProp) {
-          ref.__cache[e] = changes[e] = elementProp;
-          ref[e] = paramsProp;
+        if (paramsProp !== void 0) {
+          element[e] = paramsProp;
+          if (ref && !preventCaching) {
+            ref.__cache[e] = elementProp;
+          }
+          if ((0, import_types.isObject)(opts.diff)) {
+            diff[e] = elementProp;
+          }
         }
       }
-      return changes;
+      return element;
     };
     var overwriteShallow3 = (obj, params, excludeFrom = []) => {
       for (const e in params) {
@@ -1034,23 +1051,26 @@ var require_object = __commonJS({
       }
       return obj;
     };
-    var overwriteDeep2 = (obj, params, excludeFrom = [], visited = /* @__PURE__ */ new WeakMap()) => {
+    var overwriteDeep2 = (obj, params, opts = {}, visited = /* @__PURE__ */ new WeakMap()) => {
+      const excl = opts.exclude || [];
+      const forcedExclude = opts.preventForce ? [] : ["node", "window"];
       if (!(0, import_types.isObjectLike)(obj) || !(0, import_types.isObjectLike)(params) || (0, import_node.isDOMNode)(obj) || (0, import_node.isDOMNode)(params)) {
         return params;
       }
-      if (visited.has(obj)) {
+      if (visited.has(obj))
         return visited.get(obj);
-      }
       visited.set(obj, obj);
       for (const e in params) {
-        if (e === "__ref" || excludeFrom.includes(e) || e.startsWith("__"))
+        if (!Object.hasOwnProperty.call(params, e))
+          continue;
+        if (excl.includes(e) || forcedExclude && e.startsWith("__"))
           continue;
         const objProp = obj[e];
         const paramsProp = params[e];
         if ((0, import_node.isDOMNode)(paramsProp)) {
           obj[e] = paramsProp;
         } else if ((0, import_types.isObjectLike)(objProp) && (0, import_types.isObjectLike)(paramsProp)) {
-          obj[e] = overwriteDeep2(objProp, paramsProp, excludeFrom, visited);
+          obj[e] = overwriteDeep2(objProp, paramsProp, opts, visited);
         } else if (paramsProp !== void 0) {
           obj[e] = paramsProp;
         }
@@ -1232,6 +1252,11 @@ var require_object = __commonJS({
       }
       return detect(obj);
     };
+    var excludeKeysFromObject = (obj, excludedKeys) => {
+      const result = { ...obj };
+      excludedKeys.forEach((key) => delete result[key]);
+      return result;
+    };
   }
 });
 
@@ -1651,6 +1676,8 @@ var require_component = __commonJS({
       return /^[a-z]*$/.test(firstCharKey);
     };
     var addAdditionalExtend2 = (newExtend, element) => {
+      if (!newExtend)
+        return element;
       const { extend: elementExtend } = element;
       const originalArray = (0, import__.isArray)(elementExtend) ? elementExtend : [elementExtend];
       const receivedArray = (0, import__.isArray)(newExtend) ? newExtend : [newExtend];
@@ -1658,8 +1685,23 @@ var require_component = __commonJS({
       return { ...element, extend };
     };
     var checkIfSugar = (element, parent, key) => {
-      const { extend, props: props2, childExtend, extends: extendProps, childrenExtends, childProps, children, on: on2, $collection, $stateCollection, $propsCollection } = element;
+      const {
+        extend,
+        props: props2,
+        childExtend,
+        extends: extendProps,
+        childrenExtends,
+        childProps,
+        children,
+        on: on2,
+        $collection,
+        $stateCollection,
+        $propsCollection
+      } = element;
       const hasComponentAttrs = extend || childExtend || props2 || on2 || $collection || $stateCollection || $propsCollection;
+      if (hasComponentAttrs && (childProps || extendProps || children || childrenExtends)) {
+        element.error("Sugar component includes params for builtin components");
+      }
       return !hasComponentAttrs || childProps || extendProps || children || childrenExtends;
     };
     var extendizeByKey = (element, parent, key) => {
@@ -1671,11 +1713,11 @@ var require_component = __commonJS({
       if (element === isExtendKeyComponent)
         return element;
       else if (isSugar) {
-        const newElem = {
+        const newElem = addAdditionalExtend2(element.extends, {
           extend: extendFromKey,
           tag,
           props: { ...element }
-        };
+        });
         if (childrenExtends)
           newElem.childExtend = childrenExtends;
         return newElem;
@@ -2180,6 +2222,8 @@ var require_cjs2 = __commonJS({
           arraysEqual: () => arraysEqual,
           cutArrayAfterValue: () => cutArrayAfterValue,
           cutArrayBeforeValue: () => cutArrayBeforeValue,
+          filterArrays: () => filterArrays,
+          filterArraysFast: () => filterArraysFast,
           getFrequencyInArray: () => getFrequencyInArray,
           joinArrays: () => joinArrays,
           mergeAndCloneIfArray: () => mergeAndCloneIfArray,
@@ -2288,6 +2332,13 @@ var require_cjs2 = __commonJS({
           }
           return true;
         };
+        var filterArrays = (sourceArr, excludeArr) => {
+          return sourceArr.filter((item) => !excludeArr.includes(item));
+        };
+        var filterArraysFast = (sourceArr, excludeArr) => {
+          const excludeSet = new Set(excludeArr);
+          return sourceArr.filter((item) => !excludeSet.has(item));
+        };
       }
     });
     var require_string3 = __commonJS2({
@@ -2477,6 +2528,7 @@ var require_cjs2 = __commonJS({
           diff: () => diff,
           diffArrays: () => diffArrays,
           diffObjects: () => diffObjects,
+          excludeKeysFromObject: () => excludeKeysFromObject,
           exec: () => exec7,
           flattenRecursive: () => flattenRecursive,
           hasOwnProperty: () => hasOwnProperty,
@@ -2804,7 +2856,7 @@ var require_cjs2 = __commonJS({
         };
         var stringToObject = (str, opts = { verbose: true }) => {
           try {
-            return import_globals3.window.eval("(" + str + ")");
+            return str ? import_globals3.window.eval("(" + str + ")") : {};
           } catch (e) {
             if (opts.verbose)
               console.warn(e);
@@ -2884,20 +2936,27 @@ var require_cjs2 = __commonJS({
             return acc;
           }, deletedValues);
         };
-        var overwrite = (element, params, excludeFrom = []) => {
-          const { ref } = element;
-          const changes = {};
+        var overwrite = (element, params, opts = {}) => {
+          const { __ref: ref } = element;
+          const excl = opts.exclude || [];
+          const allowUnderscore = opts.preventUnderscore;
+          const preventCaching = opts.preventCaching;
           for (const e in params) {
-            if (excludeFrom.includes(e) || e.startsWith("__"))
+            if (excl.includes(e) || !allowUnderscore && e.startsWith("__"))
               continue;
             const elementProp = element[e];
             const paramsProp = params[e];
-            if (paramsProp) {
-              ref.__cache[e] = changes[e] = elementProp;
-              ref[e] = paramsProp;
+            if (paramsProp !== void 0) {
+              element[e] = paramsProp;
+              if (ref && !preventCaching) {
+                ref.__cache[e] = elementProp;
+              }
+              if ((0, import_types.isObject)(opts.diff)) {
+                diff[e] = elementProp;
+              }
             }
           }
-          return changes;
+          return element;
         };
         var overwriteShallow3 = (obj, params, excludeFrom = []) => {
           for (const e in params) {
@@ -2907,23 +2966,26 @@ var require_cjs2 = __commonJS({
           }
           return obj;
         };
-        var overwriteDeep2 = (obj, params, excludeFrom = [], visited = /* @__PURE__ */ new WeakMap()) => {
+        var overwriteDeep2 = (obj, params, opts = {}, visited = /* @__PURE__ */ new WeakMap()) => {
+          const excl = opts.exclude || [];
+          const forcedExclude = opts.preventForce ? [] : ["node", "window"];
           if (!(0, import_types.isObjectLike)(obj) || !(0, import_types.isObjectLike)(params) || (0, import_node.isDOMNode)(obj) || (0, import_node.isDOMNode)(params)) {
             return params;
           }
-          if (visited.has(obj)) {
+          if (visited.has(obj))
             return visited.get(obj);
-          }
           visited.set(obj, obj);
           for (const e in params) {
-            if (e === "__ref" || excludeFrom.includes(e) || e.startsWith("__"))
+            if (!Object.hasOwnProperty.call(params, e))
+              continue;
+            if (excl.includes(e) || forcedExclude && e.startsWith("__"))
               continue;
             const objProp = obj[e];
             const paramsProp = params[e];
             if ((0, import_node.isDOMNode)(paramsProp)) {
               obj[e] = paramsProp;
             } else if ((0, import_types.isObjectLike)(objProp) && (0, import_types.isObjectLike)(paramsProp)) {
-              obj[e] = overwriteDeep2(objProp, paramsProp, excludeFrom, visited);
+              obj[e] = overwriteDeep2(objProp, paramsProp, opts, visited);
             } else if (paramsProp !== void 0) {
               obj[e] = paramsProp;
             }
@@ -3105,6 +3167,11 @@ var require_cjs2 = __commonJS({
           }
           return detect(obj);
         };
+        var excludeKeysFromObject = (obj, excludedKeys) => {
+          const result = { ...obj };
+          excludedKeys.forEach((key) => delete result[key]);
+          return result;
+        };
       }
     });
     var require_function3 = __commonJS2({
@@ -3514,6 +3581,8 @@ var require_cjs2 = __commonJS({
           return /^[a-z]*$/.test(firstCharKey);
         };
         var addAdditionalExtend2 = (newExtend, element) => {
+          if (!newExtend)
+            return element;
           const { extend: elementExtend } = element;
           const originalArray = (0, import__.isArray)(elementExtend) ? elementExtend : [elementExtend];
           const receivedArray = (0, import__.isArray)(newExtend) ? newExtend : [newExtend];
@@ -3521,8 +3590,23 @@ var require_cjs2 = __commonJS({
           return { ...element, extend };
         };
         var checkIfSugar = (element, parent, key) => {
-          const { extend, props: props2, childExtend, extends: extendProps, childrenExtends, childProps, children, on: on2, $collection, $stateCollection, $propsCollection } = element;
+          const {
+            extend,
+            props: props2,
+            childExtend,
+            extends: extendProps,
+            childrenExtends,
+            childProps,
+            children,
+            on: on2,
+            $collection,
+            $stateCollection,
+            $propsCollection
+          } = element;
           const hasComponentAttrs = extend || childExtend || props2 || on2 || $collection || $stateCollection || $propsCollection;
+          if (hasComponentAttrs && (childProps || extendProps || children || childrenExtends)) {
+            element.error("Sugar component includes params for builtin components");
+          }
           return !hasComponentAttrs || childProps || extendProps || children || childrenExtends;
         };
         var extendizeByKey = (element, parent, key) => {
@@ -3534,11 +3618,11 @@ var require_cjs2 = __commonJS({
           if (element === isExtendKeyComponent)
             return element;
           else if (isSugar) {
-            const newElem = {
+            const newElem = addAdditionalExtend2(element.extends, {
               extend: extendFromKey,
               tag,
               props: { ...element }
-            };
+            });
             if (childrenExtends)
               newElem.childExtend = childrenExtends;
             return newElem;
@@ -4005,6 +4089,8 @@ var require_cjs2 = __commonJS({
               arraysEqual: () => arraysEqual,
               cutArrayAfterValue: () => cutArrayAfterValue,
               cutArrayBeforeValue: () => cutArrayBeforeValue,
+              filterArrays: () => filterArrays,
+              filterArraysFast: () => filterArraysFast,
               getFrequencyInArray: () => getFrequencyInArray,
               joinArrays: () => joinArrays,
               mergeAndCloneIfArray: () => mergeAndCloneIfArray,
@@ -4113,6 +4199,13 @@ var require_cjs2 = __commonJS({
               }
               return true;
             };
+            var filterArrays = (sourceArr, excludeArr) => {
+              return sourceArr.filter((item) => !excludeArr.includes(item));
+            };
+            var filterArraysFast = (sourceArr, excludeArr) => {
+              const excludeSet = new Set(excludeArr);
+              return sourceArr.filter((item) => !excludeSet.has(item));
+            };
           }
         });
         var require_string22 = __commonJS22({
@@ -4302,9 +4395,11 @@ var require_cjs2 = __commonJS({
               diff: () => diff,
               diffArrays: () => diffArrays,
               diffObjects: () => diffObjects,
+              excludeKeysFromObject: () => excludeKeysFromObject,
               exec: () => exec7,
               flattenRecursive: () => flattenRecursive,
               hasOwnProperty: () => hasOwnProperty,
+              isCyclic: () => isCyclic,
               isEmpty: () => isEmpty,
               isEmptyObject: () => isEmptyObject,
               isEqualDeep: () => isEqualDeep2,
@@ -4430,20 +4525,28 @@ var require_cjs2 = __commonJS({
               }
               return clone2;
             };
-            var deepCloneWithExtend3 = (obj, excludeFrom = ["node"], options = {}) => {
+            var deepCloneWithExtend3 = (obj, excludeFrom = ["node"], options = {}, visited = /* @__PURE__ */ new WeakSet()) => {
+              if ((0, import_types.isObjectLike)(obj)) {
+                if (visited.has(obj)) {
+                  return obj;
+                }
+                visited.add(obj);
+              }
               const o = options.window ? (0, import_types.isArray)(obj) ? new options.window.Array([]) : new options.window.Object({}) : (0, import_types.isArray)(obj) ? [] : {};
               for (const prop in obj) {
                 if (!Object.prototype.hasOwnProperty.call(obj, prop))
                   continue;
                 const objProp = obj[prop];
-                if (excludeFrom.includes(prop) || prop.startsWith("__") || options.cleanUndefined && (0, import_types.isUndefined)(objProp) || options.cleanNull && (0, import_types.isNull)(objProp))
+                if (excludeFrom.includes(prop) || prop.startsWith("__") || options.cleanUndefined && (0, import_types.isUndefined)(objProp) || options.cleanNull && (0, import_types.isNull)(objProp)) {
                   continue;
+                }
                 if ((0, import_types.isObjectLike)(objProp)) {
-                  o[prop] = deepCloneWithExtend3(objProp, excludeFrom, options);
+                  o[prop] = deepCloneWithExtend3(objProp, excludeFrom, options, visited);
                 } else if ((0, import_types.isFunction)(objProp) && options.window) {
                   o[prop] = (options.window || import_globals3.window).eval("(" + objProp.toString() + ")");
-                } else
+                } else {
                   o[prop] = objProp;
+                }
               }
               return o;
             };
@@ -4620,7 +4723,7 @@ var require_cjs2 = __commonJS({
             };
             var stringToObject = (str, opts = { verbose: true }) => {
               try {
-                return import_globals3.window.eval("(" + str + ")");
+                return str ? import_globals3.window.eval("(" + str + ")") : {};
               } catch (e) {
                 if (opts.verbose)
                   console.warn(e);
@@ -4700,20 +4803,27 @@ var require_cjs2 = __commonJS({
                 return acc;
               }, deletedValues);
             };
-            var overwrite = (element, params, excludeFrom = []) => {
-              const { ref } = element;
-              const changes = {};
+            var overwrite = (element, params, opts = {}) => {
+              const { __ref: ref } = element;
+              const excl = opts.exclude || [];
+              const allowUnderscore = opts.preventUnderscore;
+              const preventCaching = opts.preventCaching;
               for (const e in params) {
-                if (excludeFrom.includes(e) || e.startsWith("__"))
+                if (excl.includes(e) || !allowUnderscore && e.startsWith("__"))
                   continue;
                 const elementProp = element[e];
                 const paramsProp = params[e];
-                if (paramsProp) {
-                  ref.__cache[e] = changes[e] = elementProp;
-                  ref[e] = paramsProp;
+                if (paramsProp !== void 0) {
+                  element[e] = paramsProp;
+                  if (ref && !preventCaching) {
+                    ref.__cache[e] = elementProp;
+                  }
+                  if ((0, import_types.isObject)(opts.diff)) {
+                    diff[e] = elementProp;
+                  }
                 }
               }
-              return changes;
+              return element;
             };
             var overwriteShallow3 = (obj, params, excludeFrom = []) => {
               for (const e in params) {
@@ -4723,23 +4833,26 @@ var require_cjs2 = __commonJS({
               }
               return obj;
             };
-            var overwriteDeep2 = (obj, params, excludeFrom = [], visited = /* @__PURE__ */ new WeakMap()) => {
+            var overwriteDeep2 = (obj, params, opts = {}, visited = /* @__PURE__ */ new WeakMap()) => {
+              const excl = opts.exclude || [];
+              const forcedExclude = opts.preventForce ? [] : ["node", "window"];
               if (!(0, import_types.isObjectLike)(obj) || !(0, import_types.isObjectLike)(params) || (0, import_node.isDOMNode)(obj) || (0, import_node.isDOMNode)(params)) {
                 return params;
               }
-              if (visited.has(obj)) {
+              if (visited.has(obj))
                 return visited.get(obj);
-              }
               visited.set(obj, obj);
               for (const e in params) {
-                if (e === "__ref" || excludeFrom.includes(e) || e.startsWith("__"))
+                if (!Object.hasOwnProperty.call(params, e))
+                  continue;
+                if (excl.includes(e) || forcedExclude && e.startsWith("__"))
                   continue;
                 const objProp = obj[e];
                 const paramsProp = params[e];
                 if ((0, import_node.isDOMNode)(paramsProp)) {
                   obj[e] = paramsProp;
                 } else if ((0, import_types.isObjectLike)(objProp) && (0, import_types.isObjectLike)(paramsProp)) {
-                  obj[e] = overwriteDeep2(objProp, paramsProp, excludeFrom, visited);
+                  obj[e] = overwriteDeep2(objProp, paramsProp, opts, visited);
                 } else if (paramsProp !== void 0) {
                   obj[e] = paramsProp;
                 }
@@ -4902,6 +5015,30 @@ var require_cjs2 = __commonJS({
                 }
               }
             };
+            var isCyclic = (obj) => {
+              const seenObjects = [];
+              function detect(obj2) {
+                if (obj2 && typeof obj2 === "object") {
+                  if (seenObjects.indexOf(obj2) !== -1) {
+                    return true;
+                  }
+                  seenObjects.push(obj2);
+                  for (const key in obj2) {
+                    if (Object.hasOwnProperty.call(obj2, key) && detect(obj2[key])) {
+                      console.log(obj2, "cycle at " + key);
+                      return true;
+                    }
+                  }
+                }
+                return false;
+              }
+              return detect(obj);
+            };
+            var excludeKeysFromObject = (obj, excludedKeys) => {
+              const result = { ...obj };
+              excludedKeys.forEach((key) => delete result[key]);
+              return result;
+            };
           }
         });
         var require_function22 = __commonJS22({
@@ -5311,6 +5448,8 @@ var require_cjs2 = __commonJS({
               return /^[a-z]*$/.test(firstCharKey);
             };
             var addAdditionalExtend2 = (newExtend, element) => {
+              if (!newExtend)
+                return element;
               const { extend: elementExtend } = element;
               const originalArray = (0, import__.isArray)(elementExtend) ? elementExtend : [elementExtend];
               const receivedArray = (0, import__.isArray)(newExtend) ? newExtend : [newExtend];
@@ -5318,8 +5457,23 @@ var require_cjs2 = __commonJS({
               return { ...element, extend };
             };
             var checkIfSugar = (element, parent, key) => {
-              const { extend, props: props2, childExtend, extends: extendProps, childrenExtends, childProps, children, on: on2, $collection, $stateCollection, $propsCollection } = element;
+              const {
+                extend,
+                props: props2,
+                childExtend,
+                extends: extendProps,
+                childrenExtends,
+                childProps,
+                children,
+                on: on2,
+                $collection,
+                $stateCollection,
+                $propsCollection
+              } = element;
               const hasComponentAttrs = extend || childExtend || props2 || on2 || $collection || $stateCollection || $propsCollection;
+              if (hasComponentAttrs && (childProps || extendProps || children || childrenExtends)) {
+                element.error("Sugar component includes params for builtin components");
+              }
               return !hasComponentAttrs || childProps || extendProps || children || childrenExtends;
             };
             var extendizeByKey = (element, parent, key) => {
@@ -5331,11 +5485,11 @@ var require_cjs2 = __commonJS({
               if (element === isExtendKeyComponent)
                 return element;
               else if (isSugar) {
-                const newElem = {
+                const newElem = addAdditionalExtend2(element.extends, {
                   extend: extendFromKey,
                   tag,
                   props: { ...element }
-                };
+                });
                 if (childrenExtends)
                   newElem.childExtend = childrenExtends;
                 return newElem;
@@ -8020,6 +8174,8 @@ var require_cjs3 = __commonJS({
           arraysEqual: () => arraysEqual,
           cutArrayAfterValue: () => cutArrayAfterValue,
           cutArrayBeforeValue: () => cutArrayBeforeValue,
+          filterArrays: () => filterArrays,
+          filterArraysFast: () => filterArraysFast,
           getFrequencyInArray: () => getFrequencyInArray,
           joinArrays: () => joinArrays,
           mergeAndCloneIfArray: () => mergeAndCloneIfArray,
@@ -8128,6 +8284,13 @@ var require_cjs3 = __commonJS({
           }
           return true;
         };
+        var filterArrays = (sourceArr, excludeArr) => {
+          return sourceArr.filter((item) => !excludeArr.includes(item));
+        };
+        var filterArraysFast = (sourceArr, excludeArr) => {
+          const excludeSet = new Set(excludeArr);
+          return sourceArr.filter((item) => !excludeSet.has(item));
+        };
       }
     });
     var require_string3 = __commonJS2({
@@ -8317,9 +8480,11 @@ var require_cjs3 = __commonJS({
           diff: () => diff,
           diffArrays: () => diffArrays,
           diffObjects: () => diffObjects,
+          excludeKeysFromObject: () => excludeKeysFromObject,
           exec: () => exec7,
           flattenRecursive: () => flattenRecursive,
           hasOwnProperty: () => hasOwnProperty,
+          isCyclic: () => isCyclic,
           isEmpty: () => isEmpty,
           isEmptyObject: () => isEmptyObject,
           isEqualDeep: () => isEqualDeep2,
@@ -8445,20 +8610,28 @@ var require_cjs3 = __commonJS({
           }
           return clone2;
         };
-        var deepCloneWithExtend3 = (obj, excludeFrom = ["node"], options = {}) => {
+        var deepCloneWithExtend3 = (obj, excludeFrom = ["node"], options = {}, visited = /* @__PURE__ */ new WeakSet()) => {
+          if ((0, import_types.isObjectLike)(obj)) {
+            if (visited.has(obj)) {
+              return obj;
+            }
+            visited.add(obj);
+          }
           const o = options.window ? (0, import_types.isArray)(obj) ? new options.window.Array([]) : new options.window.Object({}) : (0, import_types.isArray)(obj) ? [] : {};
           for (const prop in obj) {
             if (!Object.prototype.hasOwnProperty.call(obj, prop))
               continue;
             const objProp = obj[prop];
-            if (excludeFrom.includes(prop) || prop.startsWith("__") || options.cleanUndefined && (0, import_types.isUndefined)(objProp) || options.cleanNull && (0, import_types.isNull)(objProp))
+            if (excludeFrom.includes(prop) || prop.startsWith("__") || options.cleanUndefined && (0, import_types.isUndefined)(objProp) || options.cleanNull && (0, import_types.isNull)(objProp)) {
               continue;
+            }
             if ((0, import_types.isObjectLike)(objProp)) {
-              o[prop] = deepCloneWithExtend3(objProp, excludeFrom, options);
+              o[prop] = deepCloneWithExtend3(objProp, excludeFrom, options, visited);
             } else if ((0, import_types.isFunction)(objProp) && options.window) {
               o[prop] = (options.window || import_globals2.window).eval("(" + objProp.toString() + ")");
-            } else
+            } else {
               o[prop] = objProp;
+            }
           }
           return o;
         };
@@ -8635,7 +8808,7 @@ var require_cjs3 = __commonJS({
         };
         var stringToObject = (str, opts = { verbose: true }) => {
           try {
-            return import_globals2.window.eval("(" + str + ")");
+            return str ? import_globals2.window.eval("(" + str + ")") : {};
           } catch (e) {
             if (opts.verbose)
               console.warn(e);
@@ -8715,20 +8888,27 @@ var require_cjs3 = __commonJS({
             return acc;
           }, deletedValues);
         };
-        var overwrite = (element, params, excludeFrom = []) => {
-          const { ref } = element;
-          const changes = {};
+        var overwrite = (element, params, opts = {}) => {
+          const { __ref: ref } = element;
+          const excl = opts.exclude || [];
+          const allowUnderscore = opts.preventUnderscore;
+          const preventCaching = opts.preventCaching;
           for (const e in params) {
-            if (excludeFrom.includes(e) || e.startsWith("__"))
+            if (excl.includes(e) || !allowUnderscore && e.startsWith("__"))
               continue;
             const elementProp = element[e];
             const paramsProp = params[e];
-            if (paramsProp) {
-              ref.__cache[e] = changes[e] = elementProp;
-              ref[e] = paramsProp;
+            if (paramsProp !== void 0) {
+              element[e] = paramsProp;
+              if (ref && !preventCaching) {
+                ref.__cache[e] = elementProp;
+              }
+              if ((0, import_types.isObject)(opts.diff)) {
+                diff[e] = elementProp;
+              }
             }
           }
-          return changes;
+          return element;
         };
         var overwriteShallow3 = (obj, params, excludeFrom = []) => {
           for (const e in params) {
@@ -8738,23 +8918,26 @@ var require_cjs3 = __commonJS({
           }
           return obj;
         };
-        var overwriteDeep2 = (obj, params, excludeFrom = [], visited = /* @__PURE__ */ new WeakMap()) => {
+        var overwriteDeep2 = (obj, params, opts = {}, visited = /* @__PURE__ */ new WeakMap()) => {
+          const excl = opts.exclude || [];
+          const forcedExclude = opts.preventForce ? [] : ["node", "window"];
           if (!(0, import_types.isObjectLike)(obj) || !(0, import_types.isObjectLike)(params) || (0, import_node.isDOMNode)(obj) || (0, import_node.isDOMNode)(params)) {
             return params;
           }
-          if (visited.has(obj)) {
+          if (visited.has(obj))
             return visited.get(obj);
-          }
           visited.set(obj, obj);
           for (const e in params) {
-            if (e === "__ref" || excludeFrom.includes(e) || e.startsWith("__"))
+            if (!Object.hasOwnProperty.call(params, e))
+              continue;
+            if (excl.includes(e) || forcedExclude && e.startsWith("__"))
               continue;
             const objProp = obj[e];
             const paramsProp = params[e];
             if ((0, import_node.isDOMNode)(paramsProp)) {
               obj[e] = paramsProp;
             } else if ((0, import_types.isObjectLike)(objProp) && (0, import_types.isObjectLike)(paramsProp)) {
-              obj[e] = overwriteDeep2(objProp, paramsProp, excludeFrom, visited);
+              obj[e] = overwriteDeep2(objProp, paramsProp, opts, visited);
             } else if (paramsProp !== void 0) {
               obj[e] = paramsProp;
             }
@@ -8917,6 +9100,30 @@ var require_cjs3 = __commonJS({
             }
           }
         };
+        var isCyclic = (obj) => {
+          const seenObjects = [];
+          function detect(obj2) {
+            if (obj2 && typeof obj2 === "object") {
+              if (seenObjects.indexOf(obj2) !== -1) {
+                return true;
+              }
+              seenObjects.push(obj2);
+              for (const key in obj2) {
+                if (Object.hasOwnProperty.call(obj2, key) && detect(obj2[key])) {
+                  console.log(obj2, "cycle at " + key);
+                  return true;
+                }
+              }
+            }
+            return false;
+          }
+          return detect(obj);
+        };
+        var excludeKeysFromObject = (obj, excludedKeys) => {
+          const result = { ...obj };
+          excludedKeys.forEach((key) => delete result[key]);
+          return result;
+        };
       }
     });
     var require_function3 = __commonJS2({
@@ -9326,6 +9533,8 @@ var require_cjs3 = __commonJS({
           return /^[a-z]*$/.test(firstCharKey);
         };
         var addAdditionalExtend2 = (newExtend, element) => {
+          if (!newExtend)
+            return element;
           const { extend: elementExtend } = element;
           const originalArray = (0, import__.isArray)(elementExtend) ? elementExtend : [elementExtend];
           const receivedArray = (0, import__.isArray)(newExtend) ? newExtend : [newExtend];
@@ -9333,8 +9542,23 @@ var require_cjs3 = __commonJS({
           return { ...element, extend };
         };
         var checkIfSugar = (element, parent, key) => {
-          const { extend, props: props2, childExtend, extends: extendProps, childrenExtends, childProps, children, on: on2, $collection, $stateCollection, $propsCollection } = element;
+          const {
+            extend,
+            props: props2,
+            childExtend,
+            extends: extendProps,
+            childrenExtends,
+            childProps,
+            children,
+            on: on2,
+            $collection,
+            $stateCollection,
+            $propsCollection
+          } = element;
           const hasComponentAttrs = extend || childExtend || props2 || on2 || $collection || $stateCollection || $propsCollection;
+          if (hasComponentAttrs && (childProps || extendProps || children || childrenExtends)) {
+            element.error("Sugar component includes params for builtin components");
+          }
           return !hasComponentAttrs || childProps || extendProps || children || childrenExtends;
         };
         var extendizeByKey = (element, parent, key) => {
@@ -9346,11 +9570,11 @@ var require_cjs3 = __commonJS({
           if (element === isExtendKeyComponent)
             return element;
           else if (isSugar) {
-            const newElem = {
+            const newElem = addAdditionalExtend2(element.extends, {
               extend: extendFromKey,
               tag,
               props: { ...element }
-            };
+            });
             if (childrenExtends)
               newElem.childExtend = childrenExtends;
             return newElem;
@@ -11421,13 +11645,18 @@ var require_create3 = __commonJS({
       ref.__props = propsStack;
       return propsStack;
     };
-    var syncProps = (props2, element) => {
+    var syncProps = (props2, element, opts) => {
       element.props = {};
       const mergedProps = {};
       props2.forEach((v) => {
         if (import_ignore.IGNORE_PROPS_PARAMS.includes(v))
           return;
-        const execProps = (0, import_utils32.exec)(v, element);
+        let execProps;
+        try {
+          execProps = (0, import_utils32.exec)(v, element);
+        } catch (e) {
+          element.error(e, opts);
+        }
         element.props = (0, import_utils32.deepMerge)(
           mergedProps,
           (0, import_utils32.deepCloneWithExtend)(execProps, import_ignore.IGNORE_PROPS_PARAMS),
@@ -11439,15 +11668,15 @@ var require_create3 = __commonJS({
       Object.setPrototypeOf(element.props, methods);
       return element.props;
     };
-    var createProps = function(element, parent, cached) {
+    var createProps = function(element, parent, options) {
       const { __ref: ref } = element;
       const applyProps = () => {
-        const propsStack = cached || createPropsStack(element, parent);
+        const propsStack = options.cachedProps || createPropsStack(element, parent);
         if (propsStack.length) {
           ref.__props = propsStack;
           syncProps(propsStack, element);
         } else {
-          ref.__props = cached || [];
+          ref.__props = options.cachedProps || [];
           element.props = {};
         }
       };
@@ -11458,7 +11687,7 @@ var require_create3 = __commonJS({
           applyProps();
         } catch {
           element.props = {};
-          ref.__props = cached || [];
+          ref.__props = options.cachedProps || [];
         }
       }
       const methods = { update: update.bind(element.props), __element: element };
@@ -12488,8 +12717,8 @@ var require_data = __commonJS({
     var import_report = require_cjs5();
     var data_default = (params, element, node3) => {
       if (params) {
-        if (element.props.attr)
-          (0, import_utils32.deepMerge)(params, element.props.attr);
+        if (element.props.data)
+          (0, import_utils32.deepMerge)(params, element.props.data);
         if (params.showOnNode) {
           if (!(0, import_utils32.isObject)(params))
             (0, import_report.report)("HTMLInvalidData", params);
@@ -12922,6 +13151,7 @@ var require_methods2 = __commonJS({
     __export2(methods_exports, {
       METHODS: () => METHODS,
       defineSetter: () => defineSetter,
+      error: () => error,
       get: () => get,
       isMethod: () => isMethod,
       keys: () => keys,
@@ -12937,13 +13167,16 @@ var require_methods2 = __commonJS({
       setNodeStyles: () => setNodeStyles,
       setProps: () => setProps,
       spotByPath: () => spotByPath,
-      variables: () => variables
+      variables: () => variables,
+      verbose: () => verbose,
+      warn: () => warn
     });
     module2.exports = __toCommonJS2(methods_exports);
     var import_utils32 = require_cjs();
     var import_tree = require_tree();
     var import_mixins = require_mixins();
-    var spotByPath = function(path) {
+    var ENV3 = "development";
+    function spotByPath(path) {
       const element = this;
       const arr = [].concat(path);
       let active = import_tree.TREE[arr[0]];
@@ -12958,8 +13191,8 @@ var require_methods2 = __commonJS({
           return;
       }
       return active;
-    };
-    var lookup3 = function(param) {
+    }
+    function lookup3(param) {
       const el = this;
       let { parent } = el;
       if ((0, import_utils32.isFunction)(param)) {
@@ -12980,8 +13213,8 @@ var require_methods2 = __commonJS({
           return;
       }
       return parent;
-    };
-    var lookdown = function(param) {
+    }
+    function lookdown(param) {
       var _a;
       const el = this;
       const { __ref: ref } = el;
@@ -13001,9 +13234,8 @@ var require_methods2 = __commonJS({
         if (lookdown2)
           return lookdown2;
       }
-      return null;
-    };
-    var lookdownAll = function(param, results = []) {
+    }
+    function lookdownAll(param, results = []) {
       var _a;
       const el = this;
       const { __ref: ref } = el;
@@ -13020,9 +13252,9 @@ var require_methods2 = __commonJS({
         }
         (_a = childElem == null ? void 0 : childElem.lookdownAll) == null ? void 0 : _a.call(childElem, param, results);
       }
-      return results.length ? results : null;
-    };
-    var setNodeStyles = function(params = {}) {
+      return results.length ? results : void 0;
+    }
+    function setNodeStyles(params = {}) {
       var _a;
       const el = this;
       if (!((_a = el.node) == null ? void 0 : _a.style))
@@ -13036,8 +13268,8 @@ var require_methods2 = __commonJS({
           el.node.style[param] = value2;
       }
       return el;
-    };
-    var remove = function() {
+    }
+    function remove() {
       const element = this;
       if ((0, import_utils32.isFunction)(element.node.remove))
         element.node.remove();
@@ -13048,36 +13280,35 @@ var require_methods2 = __commonJS({
       delete element.parent[element.key];
       if (element.parent.__ref)
         element.parent.__ref.__children = (0, import_utils32.removeValueFromArray)(element.parent.__ref.__children, element.key);
-    };
-    var get = function(param) {
+    }
+    function get(param) {
       const element = this;
       return element[param];
-    };
-    var setProps = function(param, options) {
+    }
+    function setProps(param, options) {
       const element = this;
       if (!param || !element.props)
         return;
       element.update({ props: param }, options);
       return element;
-    };
+    }
     var defineSetter = (element, key, get2, set3) => Object.defineProperty(element, key, { get: get2, set: set3 });
-    var keys = function() {
+    function keys() {
       const element = this;
       const keys2 = [];
       for (const param in element) {
-        if (import_mixins.registry[param] && !import_mixins.parseFilters.elementKeys.includes(param)) {
+        if (import_mixins.registry[param] && !import_mixins.parseFilters.elementKeys.includes(param) || Object.hasOwnProperty.call(element, param)) {
           continue;
         }
         keys2.push(param);
       }
       return keys2;
-    };
-    var parse4 = function(excl = []) {
+    }
+    function parse4(excl = []) {
       const element = this;
       const obj = {};
       const keyList = keys.call(element);
       keyList.forEach((v) => {
-        var _a;
         if (excl.includes(v))
           return;
         const val = element[v];
@@ -13093,12 +13324,12 @@ var require_methods2 = __commonJS({
         } else if (v === "props") {
           const { __element, update, ...props2 } = element[v];
           obj[v] = props2;
-        } else if ((0, import_utils32.isDefined)(val) && !((_a = element.context) == null ? void 0 : _a.methods[v]))
+        } else if ((0, import_utils32.isDefined)(val) && Object.hasOwnProperty.call(element, v))
           obj[v] = val;
       });
       return obj;
-    };
-    var parseDeep = function(excl = []) {
+    }
+    function parseDeep(excl = []) {
       const element = this;
       const obj = parse4.call(element, excl);
       for (const v in obj) {
@@ -13109,32 +13340,52 @@ var require_methods2 = __commonJS({
         }
       }
       return obj;
-    };
-    var log = function(...args) {
+    }
+    function verbose(...args) {
+      if (ENV3 !== "test" && ENV3 !== "development")
+        return;
       const element = this;
-      const { __ref } = element;
-      console.group(element.key);
+      const { __ref: ref } = element;
+      console.groupCollapsed(element.key);
       if (args.length) {
         args.forEach((v) => console.log(`%c${v}:
 `, "font-weight: bold", element[v]));
       } else {
-        console.log(__ref.path);
+        console.log(ref.path);
         const keys2 = element.keys();
         keys2.forEach((v) => console.log(`%c${v}:
 `, "font-weight: bold", element[v]));
       }
       console.groupEnd(element.key);
       return element;
-    };
-    var nextElement = function() {
+    }
+    function log(...params) {
+      if (ENV3 === "test" || ENV3 === "development") {
+        console.log(...params);
+      }
+    }
+    function warn(...params) {
+      if (ENV3 === "test" || ENV3 === "development") {
+        console.warn(...params);
+      }
+    }
+    function error(...params) {
+      var _a;
+      if (ENV3 === "test" || ENV3 === "development") {
+        if ((_a = params[params.length - 1]) == null ? void 0 : _a.debugger)
+          debugger;
+        console.error(...params);
+      }
+    }
+    function nextElement() {
       const element = this;
       const { key, parent } = element;
       const { __children } = parent.__ref;
       const currentIndex = __children.indexOf(key);
       const nextChild = __children[currentIndex + 1];
       return parent[nextChild];
-    };
-    var previousElement = function(el) {
+    }
+    function previousElement(el) {
       const element = el || this;
       const { key, parent } = element;
       const { __children } = parent.__ref;
@@ -13142,8 +13393,8 @@ var require_methods2 = __commonJS({
         return;
       const currentIndex = __children.indexOf(key);
       return parent[__children[currentIndex - 1]];
-    };
-    var variables = function(obj = {}) {
+    }
+    function variables(obj = {}) {
       const element = this;
       if (!element.data)
         element.data = {};
@@ -13177,7 +13428,7 @@ var require_methods2 = __commonJS({
           }, timeout);
         }
       };
-    };
+    }
     var METHODS = [
       "set",
       "reset",
@@ -13197,13 +13448,16 @@ var require_methods2 = __commonJS({
       "variables",
       "if",
       "log",
+      "verbose",
+      "warn",
+      "error",
       "nextElement",
       "previousElement"
     ];
-    var isMethod = function(param, element) {
+    function isMethod(param, element) {
       var _a, _b;
       return METHODS.includes(param) || ((_b = (_a = element == null ? void 0 : element.context) == null ? void 0 : _a.methods) == null ? void 0 : _b[param]);
-    };
+    }
   }
 });
 
@@ -13633,7 +13887,7 @@ var require_update2 = __commonJS({
         if (beforeUpdateReturns === false)
           return element;
       }
-      (0, import_utils32.overwriteDeep)(element, params, import_utils210.METHODS_EXL);
+      (0, import_utils32.overwriteDeep)(element, params, { exclude: import_utils210.METHODS_EXL });
       (0, import_iterate.throughExecProps)(element);
       (0, import_iterate.throughUpdatedExec)(element, { ignore: UPDATE_DEFAULT_OPTIONS });
       (0, import_iterate.throughUpdatedDefine)(element);
@@ -13852,7 +14106,7 @@ var require_set2 = __commonJS({
     var import_update = __toESM2(require_update2(), 1);
     var import__ = require_methods2();
     var import_content = require_content();
-    var addMethods = (element, parent, options) => {
+    var addMethods = (element, parent, options = {}) => {
       const proto = {
         set: import_set.default,
         reset: import_set.reset,
@@ -13871,12 +14125,14 @@ var require_set2 = __commonJS({
         parseDeep: import__.parseDeep,
         keys: import__.keys,
         nextElement: import__.nextElement,
-        previousElement: import__.previousElement
+        previousElement: import__.previousElement,
+        log: import__.log,
+        verbose: import__.verbose,
+        warn: import__.warn,
+        error: import__.error
       };
       if (element.context.methods)
-        (0, import_utils32.merge)(proto, element.context.methods);
-      if ((0, import_utils32.isDevelopment)())
-        proto.log = import__.log;
+        (options.strict ? import_utils32.merge : import_utils32.overwrite)(proto, element.context.methods);
       Object.setPrototypeOf(element, proto);
     };
   }
@@ -13955,13 +14211,13 @@ var require_create4 = __commonJS({
       }
       switchDefaultOptions(element, parent, options);
       addCaching(element, parent);
-      (0, import_set.addMethods)(element, parent);
+      (0, import_set.addMethods)(element, parent, options);
       createScope(element, parent);
       (0, import_state2.createState)(element, parent);
       if (element.scope === "state")
         element.scope = element.state;
       createIfConditionFlag(element, parent);
-      (0, import_props.createProps)(element, parent);
+      (0, import_props.createProps)(element, parent, options);
       if (element.scope === "props" || element.scope === true)
         element.scope = element.props;
       createIfConditionFlag(element, parent);
@@ -14056,7 +14312,7 @@ var require_create4 = __commonJS({
     };
     var visitedElements = /* @__PURE__ */ new WeakMap();
     var renderElement = (element, parent, options, attachOptions) => {
-      var _a, _b;
+      var _a, _b, _c, _d;
       if (visitedElements.has(element)) {
         if (ENV3 === "test" || ENV3 === "development")
           console.warn("Cyclic rendering detected:", element.__ref.path);
@@ -14077,9 +14333,13 @@ var require_create4 = __commonJS({
           if (path.includes("demoComponent"))
             path.splice(0, path.indexOf("demoComponent") + 1);
           const isDemoComponent = (_b = (_a = element.lookup((el) => el.state.key)) == null ? void 0 : _a.state) == null ? void 0 : _b.key;
-          console.warn("Error happened in:", isDemoComponent ? isDemoComponent + " " : "" + path.join("."));
-          console.warn(element);
-          console.error(e);
+          element.warn("Error happened in:", isDemoComponent ? isDemoComponent + " " : "" + path.join("."));
+          element.verbose();
+          element.error(e, options);
+          if ((_c = element.on) == null ? void 0 : _c.error)
+            element.on.error(e, element, element.state, element.context, options);
+          if ((_d = element.props) == null ? void 0 : _d.onError)
+            element.props.onError(e, element, element.state, element.context, options);
         }
       }
       if (!ref.__if) {
@@ -14160,13 +14420,13 @@ var require_create4 = __commonJS({
       const { __ref: ref } = element;
       if (!ref.__skipCreate) {
         addCaching(element, parent);
-        (0, import_set.addMethods)(element, parent);
+        (0, import_set.addMethods)(element, parent, options);
         createScope(element, parent);
         (0, import_state2.createState)(element, parent);
         if (element.scope === "state")
           element.scope = element.state;
         createIfConditionFlag(element, parent);
-        (0, import_props.createProps)(element, parent);
+        (0, import_props.createProps)(element, parent, options);
         if (element.scope === "props" || element.scope === true)
           element.scope = element.props;
         if (element.node && ref.__if) {
@@ -19010,9 +19270,14 @@ var Circle = {
 
 // ../uikit/Icon/index.js
 var import_utils15 = __toESM(require_cjs());
+var inheritFromIsActive = (el) => {
+  const { props: props2 } = el;
+  const propsActive = props2[".isActive"];
+  return el.call("exec", propsActive.name || propsActive.icon);
+};
 var getIconName = (el, s) => {
   const { key, props: props2, deps } = el;
-  let iconName = (0, import_utils15.exec)(props2.name || props2.icon || key, el);
+  let iconName = el.call("exec", props2.name || props2.icon || key, el);
   if ((0, import_utils15.isString)(iconName) && iconName.includes("{{")) {
     iconName = deps.replaceLiteralsWithObjectFields(iconName, s);
   }
@@ -19021,70 +19286,50 @@ var getIconName = (el, s) => {
 var Icon = {
   extend: "Svg",
   deps: { isString: import_utils15.isString, replaceLiteralsWithObjectFields: import_utils15.replaceLiteralsWithObjectFields },
-  props: (el, s) => {
-    const { props: props2, parent, context, deps, state } = el;
-    const { ICONS, SEMANTIC_ICONS, useIconSprite, verbose } = context && context.designSystem;
-    const { toCamelCase } = context && context.utils;
-    let iconName = getIconName(el, s);
+  props: (el, s, ctx) => {
+    const { props: props2, parent, deps } = el;
+    const { ICONS, useIconSprite, verbose } = ctx && ctx.designSystem;
+    const { toCamelCase } = ctx && ctx.utils;
+    const iconName = getIconName(el, s);
     const camelCase = toCamelCase(iconName);
     const isArray5 = camelCase.split(/([a-z])([A-Z])/g);
-    const semanticIconRootName = isArray5[1] ? isArray5[0] : iconName.split(".")[0].split(" ")[0];
-    const semanticIcon = SEMANTIC_ICONS && SEMANTIC_ICONS[semanticIconRootName];
-    if (semanticIcon) {
-      const iconKey = iconName.includes(".") ? "sfsymbols." + iconName.split(".").slice(1).join(".") : "sfsymbols";
-      iconName = semanticIcon[iconKey] || semanticIcon[iconName.split(".")[0].split(" ")[0]];
-      return {
-        tag: "span",
-        semantic_symbols: true,
-        width: "A",
-        height: "A",
-        lineHeight: "1em",
-        ":after": {
-          fontSize: "Z",
-          fontWeight: "300",
-          content: `"${iconName}"`,
-          textAlign: "center",
-          display: "inline-block",
-          style: {
-            color: "currentColor",
-            fontFamily: "'SF Pro Icons', 'SF Pro', 'SF Symbols', 'Segoe UI'"
-          }
-        }
-      };
-    }
+    const semanticIcon = getSemanticIcon(el, s, ctx);
+    if (semanticIcon)
+      return semanticIcon;
     let activeIconName;
-    if (props2.isActive) {
-      activeIconName = props2[".isActive"].name || props2[".isActive"].icon;
-    }
-    if (parent && parent.props && parent.props.isActive && parent.props[".isActive"] && parent.props[".isActive"].icon) {
+    if (props2.isActive)
+      activeIconName = inheritFromIsActive(el);
+    const parentProps = parent.props;
+    const parentPropsActive = parentProps[".isActive"];
+    if (parent && parentProps && parentProps.isActive && parentPropsActive && parentPropsActive.icon) {
       activeIconName = (0, import_utils15.exec)(
-        parent.props[".isActive"].icon.name || parent.props[".isActive"].icon.icon || parent.props[".isActive"].icon,
+        parentPropsActive.icon || parentPropsActive.Icon.name || parentPropsActive.Icon.icon,
         el
       );
     }
     if ((0, import_utils15.isString)(activeIconName) && activeIconName.includes("{{")) {
-      activeIconName = deps.replaceLiteralsWithObjectFields(activeIconName, state);
+      activeIconName = deps.replaceLiteralsWithObjectFields(activeIconName, s);
     }
-    let validIconName;
+    let iconInContext;
     if (ICONS[activeIconName])
-      validIconName = activeIconName;
+      iconInContext = activeIconName;
     if (ICONS[camelCase])
-      validIconName = camelCase;
+      iconInContext = camelCase;
     else if (ICONS[isArray5[0] + isArray5[1]])
-      validIconName = isArray5[0] + isArray5[1];
+      iconInContext = isArray5[0] + isArray5[1];
     else if (ICONS[isArray5[0]])
-      validIconName = isArray5[0];
+      iconInContext = isArray5[0];
     else {
       if (verbose)
-        console.warn("Can't find icon:", iconName, validIconName);
+        el.warn("Can't find icon:", iconName, iconInContext);
     }
-    const iconFromLibrary = ICONS[validIconName];
+    const iconFromLibrary = ICONS[iconInContext];
     const directSrc = parent && parent.props && parent.props.src || props2.src;
     return {
       width: "A",
       height: "A",
       display: "inline-block",
-      spriteId: useIconSprite && validIconName,
+      spriteId: useIconSprite && iconInContext,
       src: iconFromLibrary || directSrc || ICONS.noIcon,
       style: { fill: "currentColor", "*": { fill: "currentColor" } }
     };
@@ -19098,7 +19343,7 @@ var IconText = {
     lineHeight: 1
   },
   Icon: {
-    props: ({ parent }) => ({ icon: parent.props.icon }),
+    props: (el) => ({ icon: el.call("exec", el.parent.props.icon, el.parent) }),
     if: ({ parent, props: props2 }) => {
       return parent.props.icon || parent.props.Icon || props2.name || props2.icon || props2.sfSymbols || parent.props.sfSymbols;
     }
@@ -19125,6 +19370,37 @@ var FileIcon = {
     icon: "file"
   }
 };
+var getSemanticIcon = (el, s, ctx) => {
+  const { SEMANTIC_ICONS } = ctx && ctx.designSystem;
+  const { toCamelCase } = ctx && ctx.utils;
+  let iconName = getIconName(el, s);
+  const camelCase = toCamelCase(iconName);
+  const isArray5 = camelCase.split(/([a-z])([A-Z])/g);
+  const semanticIconRootName = isArray5[1] ? isArray5[0] : iconName.split(".")[0].split(" ")[0];
+  const semanticIcon = SEMANTIC_ICONS && SEMANTIC_ICONS[semanticIconRootName];
+  if (semanticIcon) {
+    const iconKey = iconName.includes(".") ? "sfsymbols." + iconName.split(".").slice(1).join(".") : "sfsymbols";
+    iconName = semanticIcon[iconKey] || semanticIcon[iconName.split(".")[0].split(" ")[0]];
+    return {
+      tag: "span",
+      semantic_symbols: true,
+      width: "A",
+      height: "A",
+      lineHeight: "1em",
+      ":after": {
+        fontSize: "Z",
+        fontWeight: "300",
+        content: `"${iconName}"`,
+        textAlign: "center",
+        display: "inline-block",
+        style: {
+          color: "currentColor",
+          fontFamily: "'SF Pro Icons', 'SF Pro', 'SF Symbols', 'Segoe UI'"
+        }
+      }
+    };
+  }
+};
 
 // ../uikit/Indicator/StatusIndicator.js
 var StatusIndicator = {

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@symbo.ls/create",
-  "version": "2.11.452",
+  "version": "2.11.453",
   "license": "MIT",
-  "gitHead": "65799b9b9cb6d7e6e5e3f0cfc0b1140ccc506b2b",
+  "gitHead": "8e5458a957b9d2c75944023e2c31bab157034314",
   "files": [
     "src",
     "dist"
@@ -34,12 +34,12 @@
     "@domql/emotion": "^2.5.0",
     "@domql/report": "^2.5.0",
     "@domql/router": "^2.5.0",
-    "@symbo.ls/fetch": "^2.11.450",
-    "@symbo.ls/init": "^2.11.452",
-    "@symbo.ls/scratch": "^2.11.450",
-    "@symbo.ls/sync": "^2.11.452",
-    "@symbo.ls/uikit": "^2.11.451",
-    "@symbo.ls/utils": "^2.11.446",
+    "@symbo.ls/fetch": "^2.11.453",
+    "@symbo.ls/init": "^2.11.453",
+    "@symbo.ls/scratch": "^2.11.453",
+    "@symbo.ls/sync": "^2.11.453",
+    "@symbo.ls/uikit": "^2.11.453",
+    "@symbo.ls/utils": "^2.11.453",
     "domql": "^2.5.0"
   },
   "devDependencies": {