@symbo.ls/create 2.11.461 → 2.11.464

package/dist/cjs/bundle/index.js

@@ -1959,7 +1959,7 @@ var require_cjs2 = __commonJS({
       mod
     ));
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
-    var require_cjs19 = __commonJS2({
+    var require_cjs20 = __commonJS2({
       "../../node_modules/@domql/globals/dist/cjs/index.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
@@ -5979,7 +5979,7 @@ var require_cjs2 = __commonJS({
       FONT_FAMILY_TYPES: () => FONT_FAMILY_TYPES,
       GRADIENT: () => GRADIENT2,
       GRID: () => GRID,
-      ICONS: () => ICONS,
+      ICONS: () => ICONS2,
       MEDIA: () => MEDIA2,
       RESET: () => RESET,
       SEMANTIC_ICONS: () => SEMANTIC_ICONS,
@@ -6137,7 +6137,7 @@ var require_cjs2 = __commonJS({
     var isScalingUnit = (unit) => {
       return unit === "em" || unit === "rem" || unit === "vw" || unit === "vh" || unit === "vmax" || unit === "vmin";
     };
-    var import_globals = __toESM2(require_cjs19(), 1);
+    var import_globals = __toESM2(require_cjs20(), 1);
     var import_utils30 = __toESM2(require_cjs22(), 1);
     var ENV3 = "development";
     var colorStringToRgbaArray = (color) => {
@@ -6354,7 +6354,7 @@ var require_cjs2 = __commonJS({
       FONT_FAMILY_TYPES: () => FONT_FAMILY_TYPES,
       GRADIENT: () => GRADIENT2,
       GRID: () => GRID,
-      ICONS: () => ICONS,
+      ICONS: () => ICONS2,
       MEDIA: () => MEDIA2,
       RESET: () => RESET,
       SEMANTIC_ICONS: () => SEMANTIC_ICONS,
@@ -6446,7 +6446,7 @@ var require_cjs2 = __commonJS({
     var GRADIENT2 = {};
     var THEME2 = {};
     var SHADOW = {};
-    var ICONS = {};
+    var ICONS2 = {};
     var SEMANTIC_ICONS = {};
     var defaultProps3 = {
       default: 150,
@@ -6822,10 +6822,11 @@ var require_cjs2 = __commonJS({
       return sprite;
     };
     var parseRootAttributes = (htmlString) => {
-      if (!(0, import_utils62.isString)(htmlString)) {
-        return console.warn(`parseRootAttributes: ${htmlString} is not a string`);
+      const val = htmlString.default || htmlString;
+      if (!(0, import_utils62.isString)(val)) {
+        return console.warn(`parseRootAttributes: ${val} is not a string`);
       }
-      const match3 = htmlString.match(/<svg\s+(.*?)>/);
+      const match3 = val.match(/<svg\s+(.*?)>/);
       if (!match3 || !match3[1]) {
         return {};
       }
@@ -7594,7 +7595,7 @@ var require_cjs2 = __commonJS({
         lineHeight: TYPOGRAPHY22.lineHeight
       });
     };
-    var import_globals2 = __toESM2(require_cjs19(), 1);
+    var import_globals2 = __toESM2(require_cjs20(), 1);
     var DEF_OPTIONS = {
       document: import_globals2.document
     };
@@ -9371,7 +9372,7 @@ var require_cjs3 = __commonJS({
         });
         module22.exports = __toCommonJS22(cookie_exports);
         var import_types = require_types4();
-        var import_utils32 = require_cjs19();
+        var import_utils32 = require_cjs20();
         var isMobile = (() => typeof navigator === "undefined" ? false : /Mobi/.test(navigator.userAgent))();
         var setCookie = (cname, cvalue, exdays = 365) => {
           if ((0, import_types.isUndefined)(import_utils32.document) || (0, import_types.isUndefined)(import_utils32.document.cookie))
@@ -9631,7 +9632,7 @@ var require_cjs3 = __commonJS({
           setContentKey: () => setContentKey
         });
         module22.exports = __toCommonJS22(component_exports);
-        var import__ = require_cjs19();
+        var import__ = require_cjs20();
         var ENV3 = "development";
         var checkIfKeyIsComponent2 = (key) => {
           const isFirstKeyString = (0, import__.isString)(key);
@@ -9832,7 +9833,7 @@ var require_cjs3 = __commonJS({
         };
       }
     });
-    var require_cjs19 = __commonJS2({
+    var require_cjs20 = __commonJS2({
       "../../../domql/packages/utils/dist/cjs/index.js"(exports2, module22) {
         "use strict";
         var __defProp22 = Object.defineProperty;
@@ -9890,7 +9891,7 @@ var require_cjs3 = __commonJS({
       toggleFullscreen: () => toggleFullscreen
     });
     module2.exports = __toCommonJS2(src_exports2);
-    var import_utils210 = __toESM2(require_cjs19(), 1);
+    var import_utils210 = __toESM2(require_cjs20(), 1);
     var toggleFullscreen = async (el) => {
       if (!document.fullscreenElement) {
         try {
@@ -9902,7 +9903,7 @@ var require_cjs3 = __commonJS({
         await document.exitFullscreen();
       }
     };
-    var import_utils30 = __toESM2(require_cjs19(), 1);
+    var import_utils30 = __toESM2(require_cjs20(), 1);
     var findClosestNumber = (number, arr) => {
       return ((0, import_utils30.isArray)(arr) ? arr : Object.values(arr)).reduce((prev3, curr) => {
         return Math.abs(curr - number) < Math.abs(prev3 - number) ? curr : prev3;
@@ -14466,7 +14467,7 @@ var init_Icon = __esm({
       deps: { isString: import_utils15.isString, replaceLiteralsWithObjectFields: import_utils15.replaceLiteralsWithObjectFields },
       props: (el, s, ctx) => {
         const { props: props5, parent, deps } = el;
-        const { ICONS, useIconSprite, verbose } = ctx && ctx.designSystem;
+        const { ICONS: ICONS2, useIconSprite, verbose } = ctx && ctx.designSystem;
         const { toCamelCase } = ctx && ctx.utils;
         const iconName = getIconName(el, s);
         const camelCase = toCamelCase(iconName);
@@ -14489,26 +14490,26 @@ var init_Icon = __esm({
           activeIconName = deps.replaceLiteralsWithObjectFields(activeIconName, s);
         }
         let iconInContext;
-        if (ICONS[activeIconName])
+        if (ICONS2[activeIconName])
           iconInContext = activeIconName;
-        if (ICONS[camelCase])
+        if (ICONS2[camelCase])
           iconInContext = camelCase;
-        else if (ICONS[isArray4[0] + isArray4[1]])
+        else if (ICONS2[isArray4[0] + isArray4[1]])
           iconInContext = isArray4[0] + isArray4[1];
-        else if (ICONS[isArray4[0]])
+        else if (ICONS2[isArray4[0]])
           iconInContext = isArray4[0];
         else {
           if (verbose)
             el.warn("Can't find icon:", iconName, iconInContext);
         }
-        const iconFromLibrary = ICONS[iconInContext];
+        const iconFromLibrary = ICONS2[iconInContext];
         const directSrc = parent && parent.props && parent.props.src || props5.src;
         return {
           width: "A",
           height: "A",
           display: "inline-block",
           spriteId: useIconSprite && iconInContext,
-          src: iconFromLibrary || directSrc || ICONS.noIcon,
+          src: iconFromLibrary || directSrc || ICONS2.noIcon,
           style: { fill: "currentColor", "*": { fill: "currentColor" } }
         };
       },
@@ -21392,7 +21393,7 @@ var require_component3 = __commonJS({
           newElem.define[k] = prop;
         }
         const isComponent = (0, import_utils30.checkIfKeyIsComponent)(k);
-        const isRegistry = import_mixins.registry[k];
+        const isRegistry = import_mixins.REGISTRY[k];
         if (isComponent || isRegistry) {
           newElem[k] = prop;
         } else {
@@ -21484,13 +21485,14 @@ var require_attr = __commonJS({
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var attr_exports = {};
     __export2(attr_exports, {
+      attr: () => attr,
       default: () => attr_default
     });
     module2.exports = __toCommonJS2(attr_exports);
     var import_utils30 = require_cjs11();
     var import_report = require_cjs5();
     var import_utils210 = require_utils();
-    var attr_default = (params, element, node3) => {
+    var attr = (params, element, node3) => {
       const { __ref } = element;
       const { __attr } = __ref;
       if ((0, import_utils30.isNot)("object"))
@@ -21498,16 +21500,17 @@ var require_attr = __commonJS({
       if (params) {
         if (element.props.attr)
           (0, import_utils210.deepMerge)(params, element.props.attr);
-        for (const attr in params) {
-          const val = (0, import_utils30.exec)(params[attr], element);
+        for (const attr2 in params) {
+          const val = (0, import_utils30.exec)(params[attr2], element);
           if (val !== false && !(0, import_utils30.isUndefined)(val) && !(0, import_utils30.isNull)(val) && node3.setAttribute)
-            node3.setAttribute(attr, val);
+            node3.setAttribute(attr2, val);
           else if (node3.removeAttribute)
-            node3.removeAttribute(attr);
-          __attr[attr] = val;
+            node3.removeAttribute(attr2);
+          __attr[attr2] = val;
         }
       }
     };
+    var attr_default = attr;
   }
 });
 
@@ -21535,6 +21538,7 @@ var require_classList = __commonJS({
     var classList_exports = {};
     __export2(classList_exports, {
       applyClassListOnNode: () => applyClassListOnNode2,
+      applyClasslist: () => applyClasslist,
       assignKeyAsClassname: () => assignKeyAsClassname,
       classList: () => classList2,
       classify: () => classify2,
@@ -21584,9 +21588,10 @@ var require_classList = __commonJS({
       node3.classList = className;
       return className;
     };
-    var classList_default = (params, element, node3) => {
+    var applyClasslist = (params, element, node3) => {
       applyClassListOnNode2(params, element, node3);
     };
+    var classList_default = applyClasslist;
   }
 });
 
@@ -21613,10 +21618,12 @@ var require_options = __commonJS({
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var options_exports = {};
     __export2(options_exports, {
+      OPTIONS: () => OPTIONS,
       default: () => options_default2
     });
     module2.exports = __toCommonJS2(options_exports);
-    var options_default2 = {};
+    var OPTIONS = {};
+    var options_default2 = OPTIONS;
   }
 });
 
@@ -21624,11 +21631,9 @@ var require_options = __commonJS({
 var require_set = __commonJS({
   "../../../domql/packages/element/dist/cjs/set.js"(exports, module2) {
     "use strict";
-    var __create2 = Object.create;
     var __defProp2 = Object.defineProperty;
     var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
     var __getOwnPropNames2 = Object.getOwnPropertyNames;
-    var __getProtoOf2 = Object.getPrototypeOf;
     var __hasOwnProp2 = Object.prototype.hasOwnProperty;
     var __export2 = (target, all) => {
       for (var name in all)
@@ -21642,25 +21647,18 @@ var require_set = __commonJS({
       }
       return to;
     };
-    var __toESM2 = (mod, isNodeMode, target) => (target = mod != null ? __create2(__getProtoOf2(mod)) : {}, __copyProps2(
-      // If the importer is in node compatibility mode or this is not an ESM
-      // file that has been converted to a CommonJS file using a Babel-
-      // compatible transform (i.e. "__esModule" has not been set), then set
-      // "default" to the CommonJS "module.exports" for node compatibility.
-      isNodeMode || !mod || !mod.__esModule ? __defProp2(target, "default", { value: mod, enumerable: true }) : target,
-      mod
-    ));
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var set_exports = {};
     __export2(set_exports, {
       default: () => set_default,
       reset: () => reset,
-      resetElement: () => resetElement
+      resetElement: () => resetElement,
+      set: () => set3
     });
     module2.exports = __toCommonJS2(set_exports);
     var import_utils30 = require_cjs11();
-    var import_create = __toESM2(require_create5(), 1);
-    var import_options3 = __toESM2(require_options(), 1);
+    var import_options3 = require_options();
+    var import_create = require_create5();
     var import_mixins = require_mixins();
     var import_content = require_content();
     var import_event = require_cjs12();
@@ -21668,19 +21666,19 @@ var require_set = __commonJS({
       if (!options.preventRemove)
         (0, import_content.removeContent)(element, options);
       const { __ref: ref } = element;
-      (0, import_create.default)(params, element, ref.contentElementKey || "content", {
+      (0, import_create.create)(params, element, ref.contentElementKey || "content", {
         ignoreChildExtend: true,
         ...import_mixins.registry.defaultOptions,
-        ...import_options3.default.create,
+        ...import_options3.OPTIONS.create,
         ...options
       });
     };
     var reset = (options) => {
       const element = void 0;
-      (0, import_create.default)(element, element.parent, void 0, {
+      (0, import_create.create)(element, element.parent, void 0, {
         ignoreChildExtend: true,
         ...import_mixins.registry.defaultOptions,
-        ...import_options3.default.create,
+        ...import_options3.OPTIONS.create,
         ...options
       });
     };
@@ -21730,11 +21728,9 @@ var require_set = __commonJS({
 var require_content = __commonJS({
   "../../../domql/packages/element/dist/cjs/mixins/content.js"(exports, module2) {
     "use strict";
-    var __create2 = Object.create;
     var __defProp2 = Object.defineProperty;
     var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
     var __getOwnPropNames2 = Object.getOwnPropertyNames;
-    var __getProtoOf2 = Object.getPrototypeOf;
     var __hasOwnProp2 = Object.prototype.hasOwnProperty;
     var __export2 = (target, all) => {
       for (var name in all)
@@ -21748,14 +21744,6 @@ var require_content = __commonJS({
       }
       return to;
     };
-    var __toESM2 = (mod, isNodeMode, target) => (target = mod != null ? __create2(__getProtoOf2(mod)) : {}, __copyProps2(
-      // If the importer is in node compatibility mode or this is not an ESM
-      // file that has been converted to a CommonJS file using a Babel-
-      // compatible transform (i.e. "__esModule" has not been set), then set
-      // "default" to the CommonJS "module.exports" for node compatibility.
-      isNodeMode || !mod || !mod.__esModule ? __defProp2(target, "default", { value: mod, enumerable: true }) : target,
-      mod
-    ));
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var content_exports = {};
     __export2(content_exports, {
@@ -21766,7 +21754,7 @@ var require_content = __commonJS({
     });
     module2.exports = __toCommonJS2(content_exports);
     var import_utils30 = require_cjs11();
-    var import_set = __toESM2(require_set(), 1);
+    var import_set = require_set();
     var updateContent = function(params, options) {
       const element = this;
       const ref = element.__ref;
@@ -21808,7 +21796,7 @@ var require_content = __commonJS({
         if (element[contentElementKey].update) {
           element[contentElementKey].update({}, opts);
         } else {
-          import_set.default.call(element, param, opts);
+          import_set.set.call(element, param, opts);
         }
       }
     };
@@ -21839,12 +21827,13 @@ var require_data = __commonJS({
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var data_exports = {};
     __export2(data_exports, {
+      data: () => data,
       default: () => data_default
     });
     module2.exports = __toCommonJS2(data_exports);
     var import_utils30 = require_cjs11();
     var import_report = require_cjs5();
-    var data_default = (params, element, node3) => {
+    var data = (params, element, node3) => {
       if (params) {
         if (element.props.data)
           (0, import_utils30.deepMerge)(params, element.props.data);
@@ -21859,6 +21848,7 @@ var require_data = __commonJS({
         }
       }
     };
+    var data_default = data;
   }
 });
 
@@ -21885,11 +21875,12 @@ var require_html = __commonJS({
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var html_exports = {};
     __export2(html_exports, {
-      default: () => html_default
+      default: () => html_default,
+      html: () => html
     });
     module2.exports = __toCommonJS2(html_exports);
     var import_utils30 = require_cjs11();
-    var html_default = (param, element, node3) => {
+    var html = (param, element, node3) => {
       var _a;
       const prop = (0, import_utils30.exec)(param, element) || (0, import_utils30.exec)((_a = element == null ? void 0 : element.props) == null ? void 0 : _a.html, element);
       const { __ref } = element;
@@ -21901,6 +21892,7 @@ var require_html = __commonJS({
         __ref.__html = prop;
       }
     };
+    var html_default = html;
   }
 });
 
@@ -21927,12 +21919,13 @@ var require_style = __commonJS({
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var style_exports = {};
     __export2(style_exports, {
-      default: () => style_default
+      default: () => style_default,
+      style: () => style2
     });
     module2.exports = __toCommonJS2(style_exports);
     var import_utils30 = require_cjs11();
     var import_report = require_cjs5();
-    var style_default = (params, element, node3) => {
+    var style2 = (params, element, node3) => {
       if (params) {
         if ((0, import_utils30.isObject)(params))
           (0, import_utils30.map)(node3.style, params, element);
@@ -21940,6 +21933,7 @@ var require_style = __commonJS({
           (0, import_report.report)("HTMLInvalidStyles", params);
       }
     };
+    var style_default = style2;
   }
 });
 
@@ -21966,12 +21960,13 @@ var require_text = __commonJS({
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var text_exports = {};
     __export2(text_exports, {
-      default: () => text_default
+      default: () => text_default,
+      text: () => text
     });
     module2.exports = __toCommonJS2(text_exports);
     var import__ = require_cjs15();
     var import_utils30 = require_cjs11();
-    var text_default = (param, element, node3) => {
+    var text = (param, element, node3) => {
       let prop = (0, import_utils30.exec)(param, element);
       if ((0, import_utils30.isString)(prop) && prop.includes("{{")) {
         prop = (0, import_utils30.replaceLiteralsWithObjectFields)(prop, element.state);
@@ -21989,6 +21984,7 @@ var require_text = __commonJS({
           (0, import__.create)({ tag: "string", text: prop }, element, "__text");
       }
     };
+    var text_default = text;
   }
 });
 
@@ -22766,11 +22762,12 @@ var require_scope = __commonJS({
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var scope_exports = {};
     __export2(scope_exports, {
-      default: () => scope_default
+      default: () => scope_default,
+      scope: () => scope
     });
     module2.exports = __toCommonJS2(scope_exports);
     var import_utils30 = require_cjs11();
-    var scope_default = (params, element, node3) => {
+    var scope = (params, element, node3) => {
       if (!(0, import_utils30.isObject)(params))
         return;
       for (const scopeItem in params) {
@@ -22782,6 +22779,7 @@ var require_scope = __commonJS({
         }
       }
     };
+    var scope_default = scope;
   }
 });
 
@@ -22808,13 +22806,14 @@ var require_registry = __commonJS({
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var registry_exports = {};
     __export2(registry_exports, {
+      REGISTRY: () => REGISTRY,
       collectionFilters: () => collectionFilters,
       default: () => registry_default,
       parseFilters: () => parseFilters
     });
     module2.exports = __toCommonJS2(registry_exports);
     var import__ = require_mixins();
-    var registry_default = {
+    var REGISTRY = {
       attr: import__.attr,
       style: import__.style,
       text: import__.text,
@@ -22873,6 +22872,7 @@ var require_registry = __commonJS({
       $setStateCollection: {},
       $setPropsCollection: {}
     };
+    var registry_default = REGISTRY;
     var parseFilters = {
       elementKeys: [
         "tag",
@@ -22907,11 +22907,9 @@ var require_registry = __commonJS({
 var require_mixins = __commonJS({
   "../../../domql/packages/element/dist/cjs/mixins/index.js"(exports, module2) {
     "use strict";
-    var __create2 = Object.create;
     var __defProp2 = Object.defineProperty;
     var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
     var __getOwnPropNames2 = Object.getOwnPropertyNames;
-    var __getProtoOf2 = Object.getPrototypeOf;
     var __hasOwnProp2 = Object.prototype.hasOwnProperty;
     var __export2 = (target, all) => {
       for (var name in all)
@@ -22926,39 +22924,31 @@ var require_mixins = __commonJS({
       return to;
     };
     var __reExport2 = (target, mod, secondTarget) => (__copyProps2(target, mod, "default"), secondTarget && __copyProps2(secondTarget, mod, "default"));
-    var __toESM2 = (mod, isNodeMode, target) => (target = mod != null ? __create2(__getProtoOf2(mod)) : {}, __copyProps2(
-      // If the importer is in node compatibility mode or this is not an ESM
-      // file that has been converted to a CommonJS file using a Babel-
-      // compatible transform (i.e. "__esModule" has not been set), then set
-      // "default" to the CommonJS "module.exports" for node compatibility.
-      isNodeMode || !mod || !mod.__esModule ? __defProp2(target, "default", { value: mod, enumerable: true }) : target,
-      mod
-    ));
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var mixins_exports = {};
     __export2(mixins_exports, {
-      attr: () => import_attr.default,
-      classList: () => import_classList.default,
-      content: () => import_content.default,
-      data: () => import_data.default,
-      html: () => import_html.default,
-      registry: () => import_registry.default,
-      scope: () => import_scope.default,
-      state: () => import_state2.default,
-      style: () => import_style3.default,
-      text: () => import_text.default
+      attr: () => import_attr.attr,
+      classList: () => import_classList.applyClasslist,
+      content: () => import_content.setContent,
+      data: () => import_data.data,
+      html: () => import_html.html,
+      registry: () => import_registry.REGISTRY,
+      scope: () => import_scope.scope,
+      state: () => import_state2.state,
+      style: () => import_style3.style,
+      text: () => import_text.text
     });
     module2.exports = __toCommonJS2(mixins_exports);
-    var import_attr = __toESM2(require_attr(), 1);
-    var import_classList = __toESM2(require_classList(), 1);
-    var import_content = __toESM2(require_content(), 1);
-    var import_data = __toESM2(require_data(), 1);
-    var import_html = __toESM2(require_html(), 1);
-    var import_style3 = __toESM2(require_style(), 1);
-    var import_text = __toESM2(require_text(), 1);
-    var import_state2 = __toESM2(require_state(), 1);
-    var import_scope = __toESM2(require_scope(), 1);
-    var import_registry = __toESM2(require_registry(), 1);
+    var import_attr = require_attr();
+    var import_classList = require_classList();
+    var import_content = require_content();
+    var import_data = require_data();
+    var import_html = require_html();
+    var import_style3 = require_style();
+    var import_text = require_text();
+    var import_state2 = require_state();
+    var import_scope = require_scope();
+    var import_registry = require_registry();
     __reExport2(mixins_exports, require_registry(), module2.exports);
   }
 });
@@ -23142,7 +23132,7 @@ var require_methods3 = __commonJS({
       const element = this;
       const keys2 = [];
       for (const param in element) {
-        if (import_mixins.registry[param] && !import_mixins.parseFilters.elementKeys.includes(param) || !Object.hasOwnProperty.call(element, param)) {
+        if (import_mixins.REGISTRY[param] && !import_mixins.parseFilters.elementKeys.includes(param) || !Object.hasOwnProperty.call(element, param)) {
           continue;
         }
         keys2.push(param);
@@ -23471,7 +23461,7 @@ var require_applyParam = __commonJS({
       const { node: node3, context, __ref: ref } = element;
       const prop = element[param];
       const { onlyUpdate } = options;
-      const DOMQLProperty = import_mixins.registry[param];
+      const DOMQLProperty = import_mixins.REGISTRY[param];
       const DOMQLPropertyFromContext = context && context.registry && context.registry[param];
       const isGlobalTransformer = DOMQLPropertyFromContext || DOMQLProperty;
       const hasDefine = element.define && element.define[param];
@@ -23616,7 +23606,7 @@ var require_node3 = __commonJS({
         const value2 = element[param];
         if (!Object.hasOwnProperty.call(element, param))
           continue;
-        if ((0, import_utils30.isUndefined)(value2) || (0, import_methods.isMethod)(param, element) || (0, import_utils30.isVariant)(param) || (0, import_utils30.isObject)(import_mixins.registry[param]))
+        if ((0, import_utils30.isUndefined)(value2) || (0, import_methods.isMethod)(param, element) || (0, import_utils30.isVariant)(param) || (0, import_utils30.isObject)(import_mixins.REGISTRY[param]))
           continue;
         const isElement = (0, import_applyParam.applyParam)(param, element, options);
         if (isElement) {
@@ -23642,11 +23632,9 @@ var require_node3 = __commonJS({
 var require_update2 = __commonJS({
   "../../../domql/packages/element/dist/cjs/update.js"(exports, module2) {
     "use strict";
-    var __create2 = Object.create;
     var __defProp2 = Object.defineProperty;
     var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
     var __getOwnPropNames2 = Object.getOwnPropertyNames;
-    var __getProtoOf2 = Object.getPrototypeOf;
     var __hasOwnProp2 = Object.prototype.hasOwnProperty;
     var __export2 = (target, all) => {
       for (var name in all)
@@ -23660,18 +23648,11 @@ var require_update2 = __commonJS({
       }
       return to;
     };
-    var __toESM2 = (mod, isNodeMode, target) => (target = mod != null ? __create2(__getProtoOf2(mod)) : {}, __copyProps2(
-      // If the importer is in node compatibility mode or this is not an ESM
-      // file that has been converted to a CommonJS file using a Babel-
-      // compatible transform (i.e. "__esModule" has not been set), then set
-      // "default" to the CommonJS "module.exports" for node compatibility.
-      isNodeMode || !mod || !mod.__esModule ? __defProp2(target, "default", { value: mod, enumerable: true }) : target,
-      mod
-    ));
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var update_exports = {};
     __export2(update_exports, {
-      default: () => update_default
+      default: () => update_default,
+      update: () => update
     });
     module2.exports = __toCommonJS2(update_exports);
     var import_utils30 = require_cjs11();
@@ -23679,11 +23660,11 @@ var require_update2 = __commonJS({
     var import_methods = require_methods3();
     var import_props = require_props();
     var import_state2 = require_cjs14();
-    var import_create = __toESM2(require_create5(), 1);
+    var import_create = require_create5();
     var import_iterate = require_iterate();
     var import_mixins = require_mixins();
     var import_applyParam = require_applyParam();
-    var import_options3 = __toESM2(require_options(), 1);
+    var import_options3 = require_options();
     var import_utils210 = require_utils();
     var snapshot = {
       snapshotId: import_utils30.createSnapshotId
@@ -23776,7 +23757,7 @@ var require_update2 = __commonJS({
         const isInPreventUpdate = (0, import_utils30.isArray)(preventUpdate) && preventUpdate.includes(param);
         const isInPreventDefineUpdate = (0, import_utils30.isArray)(preventDefineUpdate) && preventDefineUpdate.includes(param);
         const hasCollection = element.$collection || element.$stateCollection || element.$propsCollection;
-        if ((0, import_utils30.isUndefined)(prop) || isInPreventUpdate || isInPreventDefineUpdate || preventDefineUpdate === true || preventDefineUpdate === param || preventContentUpdate && param === "content" && !hasCollection || (preventStateUpdate && param) === "state" || (0, import_methods.isMethod)(param, element) || (0, import_utils30.isObject)(import_mixins.registry[param]) || (0, import_utils30.isVariant)(param))
+        if ((0, import_utils30.isUndefined)(prop) || isInPreventUpdate || isInPreventDefineUpdate || preventDefineUpdate === true || preventDefineUpdate === param || preventContentUpdate && param === "content" && !hasCollection || (preventStateUpdate && param) === "state" || (0, import_methods.isMethod)(param, element) || (0, import_utils30.isObject)(import_mixins.REGISTRY[param]) || (0, import_utils30.isVariant)(param))
           continue;
         if (preventStateUpdate === "once")
           options.preventStateUpdate = false;
@@ -23858,7 +23839,7 @@ var require_update2 = __commonJS({
           };
           delete element.__ref;
           delete element.parent;
-          const createdElement = (0, import_create.default)(element, parent, element.key, import_options3.default.create, attachOptions);
+          const createdElement = (0, import_create.create)(element, parent, element.key, import_options3.OPTIONS.create, attachOptions);
           if (options.preventUpdate !== true && element.on && (0, import_utils30.isFunction)(element.on.update)) {
             (0, import_event.applyEvent)(element.on.update, createdElement, createdElement.state);
           }
@@ -23918,11 +23899,9 @@ var require_update2 = __commonJS({
 var require_set2 = __commonJS({
   "../../../domql/packages/element/dist/cjs/methods/set.js"(exports, module2) {
     "use strict";
-    var __create2 = Object.create;
     var __defProp2 = Object.defineProperty;
     var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
     var __getOwnPropNames2 = Object.getOwnPropertyNames;
-    var __getProtoOf2 = Object.getPrototypeOf;
     var __hasOwnProp2 = Object.prototype.hasOwnProperty;
     var __export2 = (target, all) => {
       for (var name in all)
@@ -23936,14 +23915,6 @@ var require_set2 = __commonJS({
       }
       return to;
     };
-    var __toESM2 = (mod, isNodeMode, target) => (target = mod != null ? __create2(__getProtoOf2(mod)) : {}, __copyProps2(
-      // If the importer is in node compatibility mode or this is not an ESM
-      // file that has been converted to a CommonJS file using a Babel-
-      // compatible transform (i.e. "__esModule" has not been set), then set
-      // "default" to the CommonJS "module.exports" for node compatibility.
-      isNodeMode || !mod || !mod.__esModule ? __defProp2(target, "default", { value: mod, enumerable: true }) : target,
-      mod
-    ));
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var set_exports = {};
     __export2(set_exports, {
@@ -23951,15 +23922,15 @@ var require_set2 = __commonJS({
     });
     module2.exports = __toCommonJS2(set_exports);
     var import_utils30 = require_cjs11();
-    var import_set = __toESM2(require_set(), 1);
-    var import_update = __toESM2(require_update2(), 1);
+    var import_set = require_set();
+    var import_update = require_update2();
     var import__ = require_methods3();
     var import_content = require_content();
     var addMethods = (element, parent, options = {}) => {
       const proto = {
-        set: import_set.default,
+        set: import_set.set,
         reset: import_set.reset,
-        update: import_update.default,
+        update: import_update.update,
         variables: import__.variables,
         remove: import__.remove,
         updateContent: import_content.updateContent,
@@ -24022,6 +23993,7 @@ var require_create5 = __commonJS({
     var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
     var create_exports = {};
     __export2(create_exports, {
+      create: () => create2,
       default: () => create_default
     });
     module2.exports = __toCommonJS2(create_exports);
@@ -24038,10 +24010,10 @@ var require_create5 = __commonJS({
     var import_set = require_set2();
     var import_classList = require_classList();
     var import_iterate = require_iterate();
-    var import_options3 = __toESM2(require_options(), 1);
+    var import_options3 = require_options();
     var import_component = require_component3();
     var ENV3 = "development";
-    var create2 = (element, parent, key, options = import_options3.default.create || {}, attachOptions) => {
+    var create2 = (element, parent, key, options = import_options3.OPTIONS.create || {}, attachOptions) => {
       cacheOptions(element, options);
       if (checkIfPrimitive(element)) {
         element = applyValueAsText(element, parent, key);
@@ -24135,9 +24107,9 @@ var require_create5 = __commonJS({
       return parent;
     };
     var cacheOptions = (element, options) => {
-      if (options && !import_options3.default.create) {
-        import_options3.default.create = options;
-        import_options3.default.create.context = element.context || options.context;
+      if (options && !import_options3.OPTIONS.create) {
+        import_options3.OPTIONS.create = options;
+        import_options3.OPTIONS.create.context = element.context || options.context;
       }
     };
     var createKey = (element, parent, key) => {
@@ -24292,12 +24264,12 @@ var require_create5 = __commonJS({
         (0, import_iterate.throughInitialDefine)(element);
         (0, import_iterate.throughInitialExec)(element);
         for (const k in element) {
-          if ((0, import_utils30.isUndefined)(element[k]) || (0, import_methods.isMethod)(k, element) || (0, import_utils30.isObject)(import_mixins.registry[k]) || (0, import_utils30.isVariant)(k))
+          if ((0, import_utils30.isUndefined)(element[k]) || (0, import_methods.isMethod)(k, element) || (0, import_utils30.isObject)((import_mixins.registry.default || import_mixins.registry)[k]) || (0, import_utils30.isVariant)(k))
             continue;
           const hasDefine = element.define && element.define[k];
           const contextHasDefine = element.context && element.context.define && element.context.define[k];
           const optionsHasDefine = options.define && options.define[k];
-          if (!ref.__skipCreate && import_mixins.registry[k] && !optionsHasDefine) {
+          if (!ref.__skipCreate && import_mixins.REGISTRY[k] && !optionsHasDefine) {
             continue;
           } else if (element[k] && !hasDefine && !optionsHasDefine && !contextHasDefine) {
             create2((0, import_utils30.exec)(element[k], element), element, k, options);
@@ -24368,10 +24340,10 @@ var require_define = __commonJS({
     var define_default = (params, options = {}) => {
       const { overwrite } = options;
       for (const param in params) {
-        if (import_mixins.registry[param] && !overwrite) {
+        if (import_mixins.REGISTRY[param] && !overwrite) {
           (0, import_report.report)("OverwriteToBuiltin", param);
         } else
-          import_mixins.registry[param] = params[param];
+          import_mixins.REGISTRY[param] = params[param];
       }
     };
   }
@@ -29910,225 +29882,260 @@ var require_cjs18 = __commonJS({
   }
 });
 
-// ../icons/default/src/logo.svg
-var require_logo = __commonJS({
-  "../icons/default/src/logo.svg"() {
-  }
-});
-
-// ../icons/default/src/arrow-down-circle.svg
-var require_arrow_down_circle = __commonJS({
-  "../icons/default/src/arrow-down-circle.svg"() {
-  }
-});
-
-// ../icons/default/src/arrow-down-left.svg
-var require_arrow_down_left = __commonJS({
-  "../icons/default/src/arrow-down-left.svg"() {
-  }
-});
-
-// ../icons/default/src/arrow-down-right.svg
-var require_arrow_down_right = __commonJS({
-  "../icons/default/src/arrow-down-right.svg"() {
-  }
-});
-
-// ../icons/default/src/arrow-down.svg
-var require_arrow_down = __commonJS({
-  "../icons/default/src/arrow-down.svg"() {
-  }
-});
-
-// ../icons/default/src/arrow-left-circle.svg
-var require_arrow_left_circle = __commonJS({
-  "../icons/default/src/arrow-left-circle.svg"() {
-  }
-});
-
-// ../icons/default/src/arrow-left.svg
-var require_arrow_left = __commonJS({
-  "../icons/default/src/arrow-left.svg"() {
-  }
-});
-
-// ../icons/default/src/arrow-right.svg
-var require_arrow_right = __commonJS({
-  "../icons/default/src/arrow-right.svg"() {
-  }
-});
-
-// ../icons/default/src/arrow-right-circle.svg
-var require_arrow_right_circle = __commonJS({
-  "../icons/default/src/arrow-right-circle.svg"() {
-  }
-});
-
-// ../icons/default/src/arrow-up-circle.svg
-var require_arrow_up_circle = __commonJS({
-  "../icons/default/src/arrow-up-circle.svg"() {
-  }
-});
-
-// ../icons/default/src/arrow-up-left.svg
-var require_arrow_up_left = __commonJS({
-  "../icons/default/src/arrow-up-left.svg"() {
-  }
-});
-
-// ../icons/default/src/arrow-up-right.svg
-var require_arrow_up_right = __commonJS({
-  "../icons/default/src/arrow-up-right.svg"() {
-  }
-});
-
-// ../icons/default/src/arrow-up.svg
-var require_arrow_up = __commonJS({
-  "../icons/default/src/arrow-up.svg"() {
-  }
-});
-
-// ../icons/default/src/check-circle.svg
-var require_check_circle = __commonJS({
-  "../icons/default/src/check-circle.svg"() {
-  }
-});
-
-// ../icons/default/src/check.svg
-var require_check = __commonJS({
-  "../icons/default/src/check.svg"() {
-  }
-});
-
-// ../icons/default/src/chevron-down.svg
-var require_chevron_down = __commonJS({
-  "../icons/default/src/chevron-down.svg"() {
-  }
-});
-
-// ../icons/default/src/chevron-left.svg
-var require_chevron_left = __commonJS({
-  "../icons/default/src/chevron-left.svg"() {
-  }
-});
-
-// ../icons/default/src/chevron-right.svg
-var require_chevron_right = __commonJS({
-  "../icons/default/src/chevron-right.svg"() {
-  }
-});
-
-// ../icons/default/src/chevron-up.svg
-var require_chevron_up = __commonJS({
-  "../icons/default/src/chevron-up.svg"() {
-  }
-});
-
-// ../icons/default/src/copy.svg
-var require_copy = __commonJS({
-  "../icons/default/src/copy.svg"() {
-  }
-});
-
-// ../icons/default/src/eye-off.svg
-var require_eye_off = __commonJS({
-  "../icons/default/src/eye-off.svg"() {
-  }
-});
-
-// ../icons/default/src/eye.svg
-var require_eye = __commonJS({
-  "../icons/default/src/eye.svg"() {
-  }
-});
-
-// ../icons/default/src/info.svg
-var require_info = __commonJS({
-  "../icons/default/src/info.svg"() {
-  }
-});
-
-// ../icons/default/src/lock.svg
-var require_lock = __commonJS({
-  "../icons/default/src/lock.svg"() {
-  }
-});
-
-// ../icons/default/src/minus.svg
-var require_minus = __commonJS({
-  "../icons/default/src/minus.svg"() {
-  }
-});
-
-// ../icons/default/src/sun.svg
-var require_sun = __commonJS({
-  "../icons/default/src/sun.svg"() {
-  }
-});
-
-// ../icons/default/src/moon.svg
-var require_moon = __commonJS({
-  "../icons/default/src/moon.svg"() {
-  }
-});
-
-// ../icons/default/src/more-horizontal.svg
-var require_more_horizontal = __commonJS({
-  "../icons/default/src/more-horizontal.svg"() {
-  }
-});
-
-// ../icons/default/src/more-vertical.svg
-var require_more_vertical = __commonJS({
-  "../icons/default/src/more-vertical.svg"() {
-  }
-});
-
-// ../icons/default/src/send.svg
-var require_send = __commonJS({
-  "../icons/default/src/send.svg"() {
-  }
-});
-
-// ../icons/default/src/smile.svg
-var require_smile = __commonJS({
-  "../icons/default/src/smile.svg"() {
-  }
-});
-
-// ../icons/default/src/star.svg
-var require_star = __commonJS({
-  "../icons/default/src/star.svg"() {
-  }
-});
-
-// ../icons/default/src/search.svg
-var require_search = __commonJS({
-  "../icons/default/src/search.svg"() {
-  }
-});
-
-// ../icons/default/src/upload.svg
-var require_upload = __commonJS({
-  "../icons/default/src/upload.svg"() {
-  }
-});
-
-// ../icons/default/src/video.svg
-var require_video = __commonJS({
-  "../icons/default/src/video.svg"() {
-  }
-});
-
-// ../icons/default/src/x.svg
-var require_x = __commonJS({
-  "../icons/default/src/x.svg"() {
-  }
-});
-
-// ../icons/default/src/plus.svg
-var require_plus = __commonJS({
-  "../icons/default/src/plus.svg"() {
+// ../icons/default/dist/cjs/index.js
+var require_cjs19 = __commonJS({
+  "../icons/default/dist/cjs/index.js"(exports, module2) {
+    "use strict";
+    var __defProp2 = Object.defineProperty;
+    var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
+    var __getOwnPropNames2 = Object.getOwnPropertyNames;
+    var __hasOwnProp2 = Object.prototype.hasOwnProperty;
+    var __commonJS2 = (cb, mod) => function __require() {
+      return mod || (0, cb[__getOwnPropNames2(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+    };
+    var __export2 = (target, all) => {
+      for (var name in all)
+        __defProp2(target, name, { get: all[name], enumerable: true });
+    };
+    var __copyProps2 = (to, from3, except, desc) => {
+      if (from3 && typeof from3 === "object" || typeof from3 === "function") {
+        for (let key of __getOwnPropNames2(from3))
+          if (!__hasOwnProp2.call(to, key) && key !== except)
+            __defProp2(to, key, { get: () => from3[key], enumerable: !(desc = __getOwnPropDesc2(from3, key)) || desc.enumerable });
+      }
+      return to;
+    };
+    var __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: true }), mod);
+    var require_logo = __commonJS2({
+      "src/logo.svg"(exports2, module22) {
+        module22.exports = '<svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="m13.8427634 2.7c5.2204416 0 9.1572366 3.66627273 9.1572366 8.5276136 0 3.7539026-2.862459 6.5845166-6.6584602 6.5845166-3.2869292 0-5.0067442-2.3185931-5.0067442-4.6090346 0-2.3950047 1.9232766-4.34360501 4.2871083-4.34360501.5660997 0 1.0233662.12043815 1.3087138.22246133.0964389.03439578.1509541.13140952.1377968.22869274l-.0162211.05790349-.5142943 1.18025155c-.0417785.0960965-.1426738.1488014-.2444046.1308098-.1382871-.0243417-.3160549-.046355-.506983-.046355-1.2447926 0-2.2577141 1.0263701-2.2577141 2.2874782 0 1.3311697 1.1647866 2.3734147 2.6514771 2.3734147 2.1944196 0 3.9131901-1.7771506 3.9131901-4.0460021 0-3.02365374-2.2946881-5.13544885-5.580364-5.13544885-4.0765443 0-7.3933453 3.3608382-7.3933453 7.49150685 0 2.4065323 1.12557141 4.5516755 2.87121445 5.9233019l-4.96035245 3.1812742c-1.88344607-2.1256033-3.0306173-4.9339804-3.0306173-8.0087794 0-6.61668989 5.31256341-12 11.8427634-12z" fill-rule="evenodd"/></svg>';
+      }
+    });
+    var require_arrow_down_circle = __commonJS2({
+      "src/arrow-down-circle.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-down-circle"><circle cx="12" cy="12" r="10"></circle><polyline points="8 12 12 16 16 12"></polyline><line x1="12" y1="8" x2="12" y2="16"></line></svg>';
+      }
+    });
+    var require_arrow_down_left = __commonJS2({
+      "src/arrow-down-left.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-down-left"><line x1="17" y1="7" x2="7" y2="17"></line><polyline points="17 17 7 17 7 7"></polyline></svg>';
+      }
+    });
+    var require_arrow_down_right = __commonJS2({
+      "src/arrow-down-right.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-down-right"><line x1="7" y1="7" x2="17" y2="17"></line><polyline points="17 7 17 17 7 17"></polyline></svg>';
+      }
+    });
+    var require_arrow_down = __commonJS2({
+      "src/arrow-down.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-down"><line x1="12" y1="5" x2="12" y2="19"></line><polyline points="19 12 12 19 5 12"></polyline></svg>';
+      }
+    });
+    var require_arrow_left_circle = __commonJS2({
+      "src/arrow-left-circle.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left-circle"><circle cx="12" cy="12" r="10"></circle><polyline points="12 8 8 12 12 16"></polyline><line x1="16" y1="12" x2="8" y2="12"></line></svg>';
+      }
+    });
+    var require_arrow_left = __commonJS2({
+      "src/arrow-left.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>';
+      }
+    });
+    var require_arrow_right = __commonJS2({
+      "src/arrow-right.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>';
+      }
+    });
+    var require_arrow_right_circle = __commonJS2({
+      "src/arrow-right-circle.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right-circle"><circle cx="12" cy="12" r="10"></circle><polyline points="12 16 16 12 12 8"></polyline><line x1="8" y1="12" x2="16" y2="12"></line></svg>';
+      }
+    });
+    var require_arrow_up_circle = __commonJS2({
+      "src/arrow-up-circle.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-up-circle"><circle cx="12" cy="12" r="10"></circle><polyline points="16 12 12 8 8 12"></polyline><line x1="12" y1="16" x2="12" y2="8"></line></svg>';
+      }
+    });
+    var require_arrow_up_left = __commonJS2({
+      "src/arrow-up-left.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-up-left"><line x1="17" y1="17" x2="7" y2="7"></line><polyline points="7 17 7 7 17 7"></polyline></svg>';
+      }
+    });
+    var require_arrow_up_right = __commonJS2({
+      "src/arrow-up-right.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-up-right"><line x1="7" y1="17" x2="17" y2="7"></line><polyline points="7 7 17 7 17 17"></polyline></svg>';
+      }
+    });
+    var require_arrow_up = __commonJS2({
+      "src/arrow-up.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-up"><line x1="12" y1="19" x2="12" y2="5"></line><polyline points="5 12 12 5 19 12"></polyline></svg>';
+      }
+    });
+    var require_check_circle = __commonJS2({
+      "src/check-circle.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-check-circle"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path><polyline points="22 4 12 14.01 9 11.01"></polyline></svg>';
+      }
+    });
+    var require_check = __commonJS2({
+      "src/check.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-check"><polyline points="20 6 9 17 4 12"></polyline></svg>';
+      }
+    });
+    var require_chevron_down = __commonJS2({
+      "src/chevron-down.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-down"><polyline points="6 9 12 15 18 9"></polyline></svg>';
+      }
+    });
+    var require_chevron_left = __commonJS2({
+      "src/chevron-left.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-left"><polyline points="15 18 9 12 15 6"></polyline></svg>';
+      }
+    });
+    var require_chevron_right = __commonJS2({
+      "src/chevron-right.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-right"><polyline points="9 18 15 12 9 6"></polyline></svg>';
+      }
+    });
+    var require_chevron_up = __commonJS2({
+      "src/chevron-up.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-up"><polyline points="18 15 12 9 6 15"></polyline></svg>';
+      }
+    });
+    var require_copy = __commonJS2({
+      "src/copy.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-copy"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>';
+      }
+    });
+    var require_eye_off = __commonJS2({
+      "src/eye-off.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-eye-off"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path><line x1="1" y1="1" x2="23" y2="23"></line></svg>';
+      }
+    });
+    var require_eye = __commonJS2({
+      "src/eye.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-eye"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg>';
+      }
+    });
+    var require_info = __commonJS2({
+      "src/info.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-info"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="16" x2="12" y2="12"></line><line x1="12" y1="8" x2="12.01" y2="8"></line></svg>';
+      }
+    });
+    var require_lock = __commonJS2({
+      "src/lock.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-lock"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg>';
+      }
+    });
+    var require_minus = __commonJS2({
+      "src/minus.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-minus"><line x1="5" y1="12" x2="19" y2="12"></line></svg>';
+      }
+    });
+    var require_sun = __commonJS2({
+      "src/sun.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-sun"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg>';
+      }
+    });
+    var require_moon = __commonJS2({
+      "src/moon.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-moon"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg>';
+      }
+    });
+    var require_more_horizontal = __commonJS2({
+      "src/more-horizontal.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-more-horizontal"><circle cx="12" cy="12" r="1"></circle><circle cx="19" cy="12" r="1"></circle><circle cx="5" cy="12" r="1"></circle></svg>';
+      }
+    });
+    var require_more_vertical = __commonJS2({
+      "src/more-vertical.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-more-vertical"><circle cx="12" cy="12" r="1"></circle><circle cx="12" cy="5" r="1"></circle><circle cx="12" cy="19" r="1"></circle></svg>';
+      }
+    });
+    var require_send = __commonJS2({
+      "src/send.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-send"><line x1="22" y1="2" x2="11" y2="13"></line><polygon points="22 2 15 22 11 13 2 9 22 2"></polygon></svg>';
+      }
+    });
+    var require_smile = __commonJS2({
+      "src/smile.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-smile"><circle cx="12" cy="12" r="10"></circle><path d="M8 14s1.5 2 4 2 4-2 4-2"></path><line x1="9" y1="9" x2="9.01" y2="9"></line><line x1="15" y1="9" x2="15.01" y2="9"></line></svg>';
+      }
+    });
+    var require_star = __commonJS2({
+      "src/star.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-star"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg>';
+      }
+    });
+    var require_search = __commonJS2({
+      "src/search.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>';
+      }
+    });
+    var require_upload = __commonJS2({
+      "src/upload.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-upload"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="17 8 12 3 7 8"></polyline><line x1="12" y1="3" x2="12" y2="15"></line></svg>';
+      }
+    });
+    var require_video = __commonJS2({
+      "src/video.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-video"><polygon points="23 7 16 12 23 17 23 7"></polygon><rect x="1" y="5" width="15" height="14" rx="2" ry="2"></rect></svg>';
+      }
+    });
+    var require_x = __commonJS2({
+      "src/x.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-x"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>';
+      }
+    });
+    var require_plus = __commonJS2({
+      "src/plus.svg"(exports2, module22) {
+        module22.exports = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-plus"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg>';
+      }
+    });
+    var default_exports = {};
+    __export2(default_exports, {
+      default: () => default_default
+    });
+    module2.exports = __toCommonJS2(default_exports);
+    var default_default = {
+      symbols: require_logo(),
+      logo: require_logo(),
+      arrowDownCircle: require_arrow_down_circle(),
+      arrowDownLeft: require_arrow_down_left(),
+      arrowDownRight: require_arrow_down_right(),
+      arrowDown: require_arrow_down(),
+      arrowLeftCircle: require_arrow_left_circle(),
+      arrowLeft: require_arrow_left(),
+      arrowRight: require_arrow_right(),
+      arrowRightCircle: require_arrow_right_circle(),
+      arrowUpCircle: require_arrow_up_circle(),
+      arrowUpLeft: require_arrow_up_left(),
+      arrowUpRight: require_arrow_up_right(),
+      arrowUp: require_arrow_up(),
+      checkCircle: require_check_circle(),
+      check: require_check(),
+      chevronDown: require_chevron_down(),
+      chevronLeft: require_chevron_left(),
+      chevronRight: require_chevron_right(),
+      chevronUp: require_chevron_up(),
+      copy: require_copy(),
+      eyeOff: require_eye_off(),
+      eye: require_eye(),
+      info: require_info(),
+      lock: require_lock(),
+      minus: require_minus(),
+      sun: require_sun(),
+      moon: require_moon(),
+      moreHorizontal: require_more_horizontal(),
+      moreVertical: require_more_vertical(),
+      send: require_send(),
+      smile: require_smile(),
+      star: require_star(),
+      search: require_search(),
+      upload: require_upload(),
+      video: require_video(),
+      x: require_x(),
+      plus: require_plus()
+    };
   }
 });
 
@@ -30139,7 +30146,7 @@ __export(src_exports, {
   createAsync: () => createAsync,
   createSkeleton: () => createSkeleton,
   createSync: () => createSync,
-  default: () => src_default2
+  default: () => src_default
 });
 module.exports = __toCommonJS(src_exports);
 var import_utils29 = __toESM(require_cjs(), 1);
@@ -31786,47 +31793,8 @@ init_emotion();
 init_init();
 var import_utils26 = __toESM(require_cjs(), 1);
 
-// ../icons/default/index.js
-var default_default = {
-  symbols: require_logo(),
-  logo: require_logo(),
-  arrowDownCircle: require_arrow_down_circle(),
-  arrowDownLeft: require_arrow_down_left(),
-  arrowDownRight: require_arrow_down_right(),
-  arrowDown: require_arrow_down(),
-  arrowLeftCircle: require_arrow_left_circle(),
-  arrowLeft: require_arrow_left(),
-  arrowRight: require_arrow_right(),
-  arrowRightCircle: require_arrow_right_circle(),
-  arrowUpCircle: require_arrow_up_circle(),
-  arrowUpLeft: require_arrow_up_left(),
-  arrowUpRight: require_arrow_up_right(),
-  arrowUp: require_arrow_up(),
-  checkCircle: require_check_circle(),
-  check: require_check(),
-  chevronDown: require_chevron_down(),
-  chevronLeft: require_chevron_left(),
-  chevronRight: require_chevron_right(),
-  chevronUp: require_chevron_up(),
-  copy: require_copy(),
-  eyeOff: require_eye_off(),
-  eye: require_eye(),
-  info: require_info(),
-  lock: require_lock(),
-  minus: require_minus(),
-  sun: require_sun(),
-  moon: require_moon(),
-  moreHorizontal: require_more_horizontal(),
-  moreVertical: require_more_vertical(),
-  send: require_send(),
-  smile: require_smile(),
-  star: require_star(),
-  search: require_search(),
-  upload: require_upload(),
-  video: require_video(),
-  x: require_x(),
-  plus: require_plus()
-};
+// ../default-config/src/index.js
+var import_default_icons = __toESM(require_cjs19());
 
 // ../default-config/src/color.js
 var COLOR = {
@@ -32186,7 +32154,7 @@ var DEFAULT_CONFIG = {
   FONT,
   FONT_FAMILY,
   TIMING,
-  ICONS: default_default,
+  ICONS: import_default_icons.default,
   MEDIA,
   RESET: {
     html: {},
@@ -32207,7 +32175,6 @@ var DEFAULT_CONFIG = {
   SVG: {}
   // TODO: Check with @nikoloza on this
 };
-var src_default = DEFAULT_CONFIG;
 
 // src/initEmotion.js
 var initEmotion = (key, options = {}) => {
@@ -32218,7 +32185,7 @@ var initEmotion = (key, options = {}) => {
   if (!initOptions.emotion)
     initOptions.emotion = emotion;
   const registry = options.registry || transformDOMQLEmotion(initOptions.emotion, options);
-  const designSystem = initOptions.useDefaultConfig || ((_a = options.designSystem) == null ? void 0 : _a.useDefaultConfig) ? (0, import_utils26.deepMerge)(options.designSystem, (0, import_utils26.deepClone)(src_default)) : options.designSystem || (0, import_utils26.deepClone)(src_default);
+  const designSystem = initOptions.useDefaultConfig || ((_a = options.designSystem) == null ? void 0 : _a.useDefaultConfig) ? (0, import_utils26.deepMerge)(options.designSystem, (0, import_utils26.deepClone)(DEFAULT_CONFIG)) : options.designSystem || (0, import_utils26.deepClone)(DEFAULT_CONFIG);
   const scratchSystem2 = init(designSystem, {
     key,
     emotion: emotion2,
@@ -32496,4 +32463,4 @@ var createSkeleton = (App = {}, options = options_default, optionsExternalFile)
     optionsExternalFile
   );
 };
-var src_default2 = create;
+var src_default = create;