smbls 3.1.2 → 3.2.7

package/dist/iife/index.js

@@ -0,0 +1,740 @@
+"use strict";
+var Smbls = (() => {
+  var __create = Object.create;
+  var __defProp = Object.defineProperty;
+  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+  var __getOwnPropNames = Object.getOwnPropertyNames;
+  var __getProtoOf = Object.getPrototypeOf;
+  var __hasOwnProp = Object.prototype.hasOwnProperty;
+  var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+    get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+  }) : x)(function(x) {
+    if (typeof require !== "undefined") return require.apply(this, arguments);
+    throw Error('Dynamic require of "' + x + '" is not supported');
+  });
+  var __export = (target, all) => {
+    for (var name in all)
+      __defProp(target, name, { get: all[name], enumerable: true });
+  };
+  var __copyProps = (to, from, except, desc) => {
+    if (from && typeof from === "object" || typeof from === "function") {
+      for (let key of __getOwnPropNames(from))
+        if (!__hasOwnProp.call(to, key) && key !== except)
+          __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+    }
+    return to;
+  };
+  var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+  var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+    // 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 ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+    mod
+  ));
+  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+  // index.js
+  var index_exports = {};
+  __export(index_exports, {
+    DEFAULT_CONTEXT: () => DEFAULT_CONTEXT,
+    DESIGN_SYSTEM_OPTIONS: () => DESIGN_SYSTEM_OPTIONS,
+    DYNAMIC_JSON: () => import_dynamic.default,
+    ROUTER_OPTIONS: () => ROUTER_OPTIONS,
+    applyCSS: () => applyCSS,
+    create: () => create,
+    createAsync: () => createAsync,
+    createSkeleton: () => createSkeleton,
+    createSync: () => createSync,
+    init: () => init,
+    reinit: () => reinit,
+    setClass: () => setClass,
+    updateVars: () => updateVars
+  });
+  __reExport(index_exports, __require("@domql/utils"));
+  __reExport(index_exports, __require("attrs-in-props"));
+  __reExport(index_exports, __require("css-in-props"));
+  __reExport(index_exports, __require("@symbo.ls/default-config"));
+  __reExport(index_exports, __require("@symbo.ls/emotion"));
+  __reExport(index_exports, __require("@symbo.ls/scratch"));
+  __reExport(index_exports, __require("@symbo.ls/uikit"));
+  __reExport(index_exports, __require("@symbo.ls/smbls-utils"));
+
+  // src/index.js
+  var import_utils7 = __require("@domql/utils");
+
+  // src/utilImports.js
+  var utilImports_exports = {};
+  __export(utilImports_exports, {
+    applyCSS: () => applyCSS,
+    init: () => init,
+    reinit: () => reinit,
+    scratchSystem: () => import_scratch2.scratchSystem,
+    scratchUtils: () => import_scratch2.scratchUtils,
+    set: () => import_scratch2.set
+  });
+  var import_scratch2 = __require("@symbo.ls/scratch");
+  __reExport(utilImports_exports, __require("@domql/utils"));
+  __reExport(utilImports_exports, __require("@symbo.ls/smbls-utils"));
+
+  // src/init.js
+  var import_scratch = __require("@symbo.ls/scratch");
+  var import_utils = __require("@domql/utils");
+  var import_emotion = __require("@symbo.ls/emotion");
+  var import_dynamic = __toESM(__require("../dynamic.json"), 1);
+  var CONFIG = (0, import_scratch.getActiveConfig)();
+  var mergeWithLocalFile = (config = CONFIG, options) => {
+    const rcfile = (0, import_utils.isObject)(options.localFile) ? options.localFile : import_dynamic.default || {};
+    const clonedFile = (0, import_utils.deepClone)(rcfile.designSystem || {});
+    return (0, import_utils.deepMerge)(config, clonedFile);
+  };
+  var SET_OPTIONS = {
+    emotion: import_emotion.emotion,
+    useVariable: true,
+    useReset: true,
+    useFontImport: true,
+    useIconSprite: true,
+    useDocumentTheme: true,
+    useSvgSprite: true
+  };
+  var init = (config, options = SET_OPTIONS) => {
+    const emotion = options.emotion || import_emotion.emotion;
+    const resultConfig = mergeWithLocalFile(config || {}, options);
+    const conf = (0, import_scratch.set)(
+      {
+        verbose: options.verbose,
+        useReset: options.useReset,
+        useFontImport: options.useFontImport,
+        useVariable: options.useVariable,
+        useSvgSprite: options.useSvgSprite,
+        useDocumentTheme: options.useDocumentTheme,
+        useIconSprite: options.useIconSprite,
+        useDefaultConfig: options.useDefaultConfig,
+        globalTheme: options.globalTheme,
+        ...resultConfig
+      },
+      { newConfig: options.newConfig }
+    );
+    const FontFace = (0, import_scratch.getFontFaceString)(conf.FONT);
+    const useReset = conf.useReset;
+    const useVariable = conf.useVariable;
+    const useFontImport = conf.useFontImport;
+    const useSvgSprite = conf.useSvgSprite;
+    const hasSvgs = config.svg || config.SVG;
+    const useIconSprite = conf.useIconSprite;
+    const hasIcons = config.icons || config.ICONS;
+    if (useFontImport) emotion.injectGlobal(FontFace);
+    if (useVariable) emotion.injectGlobal({ ":root": conf.CSS_VARS });
+    if (useReset) emotion.injectGlobal(conf.RESET);
+    if (conf.ANIMATION) {
+      const keyframesCSS = {};
+      for (const name in conf.ANIMATION) {
+        keyframesCSS[`@keyframes ${name}`] = conf.ANIMATION[name];
+      }
+      emotion.injectGlobal(keyframesCSS);
+    }
+    if (hasSvgs) (0, import_scratch.appendSVGSprite)(hasSvgs, { document: options.document });
+    else if (useSvgSprite)
+      (0, import_scratch.appendSVGSprite)(conf.SVG, { document: options.document });
+    if (hasIcons) (0, import_scratch.appendSvgIconsSprite)(hasIcons, { document: options.document });
+    else if (useIconSprite)
+      (0, import_scratch.appendSvgIconsSprite)(conf.ICONS, { document: options.document });
+    return conf;
+  };
+  var UPDATE_OPTIONS = {
+    emotion: import_emotion.emotion
+  };
+  var reinit = (config, options = UPDATE_OPTIONS) => {
+    const emotion = options.emotion || import_emotion.emotion;
+    const resultConfig = mergeWithLocalFile(config || {}, options);
+    const conf = (0, import_scratch.set)({
+      verbose: false,
+      ...resultConfig
+    });
+    if (!options.preventInject) {
+      emotion.injectGlobal({ ":root": conf.CSS_VARS });
+      emotion.injectGlobal(conf.RESET);
+    }
+    return conf;
+  };
+  var applyCSS = (styles, options = UPDATE_OPTIONS) => {
+    const emotion = options.emotion || import_emotion.emotion;
+    emotion.injectGlobal(styles);
+  };
+  var updateVars = (config, options = UPDATE_OPTIONS) => {
+    const emotion = options.emotion || import_emotion.emotion;
+    emotion.injectGlobal({ ":root": config.CSS_VARS });
+  };
+  var setClass = (props, options = UPDATE_OPTIONS) => {
+  };
+
+  // src/utilImports.js
+  __reExport(utilImports_exports, __require("@domql/report"));
+  __reExport(utilImports_exports, __require("@domql/router"));
+
+  // src/router.js
+  var import_utils2 = __require("@domql/utils");
+  var import_router = __require("@domql/router");
+  var DEFAULT_ROUTING_OPTIONS = {
+    initRouter: true,
+    injectRouterInLinkComponent: true,
+    popState: true
+  };
+  var initRouter = (element, context) => {
+    if (context.router === false) return;
+    else if (context.router === true) context.router = DEFAULT_ROUTING_OPTIONS;
+    else context.router = (0, import_utils2.merge)(context.router || {}, DEFAULT_ROUTING_OPTIONS);
+    const routerOptions = context.router;
+    const onRouterRenderDefault = async (el, s) => {
+      const { pathname, search, hash } = import_utils2.window.location;
+      const url = pathname + search + hash;
+      if (el.routes) await (0, import_router.router)(url, el, {}, { initialRender: true });
+    };
+    const hasRenderRouter = element.on && !(0, import_utils2.isUndefined)(element.on.renderRouter) || !(0, import_utils2.isUndefined)(element.onRenderRouter);
+    if (routerOptions && routerOptions.initRouter && !hasRenderRouter) {
+      if (element.on) {
+        element.on.renderRouter = onRouterRenderDefault;
+      } else {
+        element.on = {
+          renderRouter: onRouterRenderDefault
+        };
+      }
+    }
+    injectRouterInLinkComponent(context, routerOptions);
+    return routerOptions;
+  };
+  var popStateFired;
+  var onpopstateRouter = (element, context) => {
+    if (popStateFired) return;
+    popStateFired = true;
+    const routerOptions = context.router || DEFAULT_ROUTING_OPTIONS;
+    if (!routerOptions.popState) return;
+    const router = context.utils && context.utils.router ? context.utils.router : import_router.router;
+    import_utils2.window.onpopstate = async (e) => {
+      const { pathname, search, hash } = import_utils2.window.location;
+      const url = pathname + search + hash;
+      await element.call(
+        "router",
+        url,
+        element,
+        {},
+        { pushState: false, scrollToTop: false, level: 0, event: e }
+      );
+    };
+  };
+  var injectRouterInLinkComponent = (context, routerOptions) => {
+    const { components } = context;
+    if (routerOptions && routerOptions.injectRouterInLinkComponent) {
+      return (0, import_utils2.deepMerge)(
+        components["Link"] || components["smbls.Link"],
+        components["RouterLink"] || components["smbls.RouterLink"]
+      );
+    }
+  };
+
+  // src/fetchOnCreate.js
+  var import_utils3 = __require("@domql/utils");
+  var import_fetch = __require("@symbo.ls/fetch");
+  var fetchSync = async (key, options) => {
+    if (key && options.editor) {
+      try {
+        if (!options.editor.async) await (0, import_fetch.fetchProject)(key, options);
+      } catch (e) {
+        console.error(e);
+      }
+    }
+  };
+  var fetchAsync = (app, key, options, callback) => {
+    if (key && options.editor) {
+      try {
+        if (options.editor.async) {
+          (0, import_fetch.fetchProjectAsync)(key, options, callback || ((data) => {
+            const designSystem = data.designSystem;
+            if ((0, import_utils3.isObject)(designSystem)) {
+              options.utils.init(designSystem);
+            }
+            if ((0, import_utils3.isObject)(data.state)) {
+              app.state.set(data.state);
+            }
+          }));
+        }
+      } catch (e) {
+        console.error(e);
+      }
+    }
+  };
+
+  // src/define.js
+  var defaultDefine = {
+    routes: (param) => param,
+    // deps: (param, el) => param || el.parent.deps,
+    $router: async (param, el) => {
+      if (!param) return;
+      const obj = { tag: "fragment", ...param };
+      const set3 = async () => {
+        await el.set(obj, { preventDefineUpdate: "$router" });
+      };
+      if (el.props && el.props.lazyLoad) {
+        window.requestAnimationFrame(set3);
+      } else await set3();
+      return obj;
+    }
+  };
+
+  // src/options.js
+  var import_package = __require("../package.json");
+  var DESIGN_SYSTEM_OPTIONS = {
+    useReset: true,
+    useVariable: true,
+    useIconSprite: true,
+    useSvgSprite: true,
+    useDocumentTheme: true,
+    useDefaultIcons: true,
+    useFontImport: true,
+    useDefaultConfig: true
+  };
+  var ROUTER_OPTIONS = {
+    initRouter: true,
+    popState: true,
+    injectRouterInLinkComponent: true
+  };
+  var DEFAULT_CONTEXT = {
+    ...DESIGN_SYSTEM_OPTIONS,
+    router: ROUTER_OPTIONS,
+    version: import_package.version
+  };
+  var CREATE_OPTIONS = {
+    state: {},
+    pages: {},
+    components: {},
+    router: ROUTER_OPTIONS,
+    define: defaultDefine
+  };
+  var options_default = CREATE_OPTIONS;
+
+  // src/index.js
+  var import_dynamic2 = __toESM(__require("../dynamic.json"), 1);
+
+  // src/createDomql.js
+  var import_domql = __toESM(__require("domql"), 1);
+  var uikit2 = __toESM(__require("@symbo.ls/uikit"), 1);
+  var import_css_in_props = __require("css-in-props");
+  var import_utils6 = __require("@domql/utils");
+  var import_element = __require("@domql/element");
+
+  // src/syncExtend.js
+  var import_utils4 = __require("@domql/utils");
+  var import_sync = __require("@symbo.ls/sync");
+  var initializeExtend = (app, ctx) => {
+    return (0, import_utils4.isObjectLike)(app.extends) ? app.extends : [];
+  };
+  var initializeSync = (app, ctx) => {
+    const { editor } = ctx;
+    if (!editor) return;
+    const liveSync = (0, import_utils4.isUndefined)(editor.liveSync) ? (0, import_utils4.isDevelopment)() : editor.liveSync;
+    if (liveSync) {
+      if ((0, import_utils4.isArray)(app.extends)) app.extends.push(import_sync.SyncComponent);
+      else if (app.extends) {
+        app.extends = [app.extends, import_sync.SyncComponent];
+      } else {
+        app.extends = [import_sync.SyncComponent];
+      }
+    }
+  };
+  var initializeNotifications = (app, ctx) => {
+    const { editor } = ctx;
+    if (!editor) return;
+    const verbose = (0, import_utils4.isUndefined)(editor.verbose) ? (0, import_utils4.isDevelopment)() || ctx.verbose : editor.verbose;
+    if (verbose) {
+      if ((0, import_utils4.isArray)(app.extends)) app.extends.push(import_sync.Notifications);
+      else if (app.extends) {
+        app.extends = [app.extends, import_sync.Notifications];
+      } else {
+        app.extends = [import_sync.Notifications];
+      }
+    }
+  };
+
+  // src/prepare.js
+  var import_utils5 = __require("@domql/utils");
+  var import_emotion2 = __require("@symbo.ls/emotion");
+  var uikit = __toESM(__require("@symbo.ls/uikit"), 1);
+  var routerUtils = __toESM(__require("@domql/router"), 1);
+  var prepareWindow = (context) => {
+    if (typeof window === "undefined") window = globalThis || {};
+    if (typeof document === "undefined") {
+      if (!window.document) window.document = globalThis.document || { body: {} };
+      document = window.document;
+    }
+    context.document = context.document || document;
+    context.window = context.window || window;
+    return context.window;
+  };
+  function onlyDotsAndNumbers(str) {
+    return /^[0-9.]+$/.test(str) && str !== "";
+  }
+  var CDN_PROVIDERS = {
+    skypack: {
+      url: "https://cdn.skypack.dev",
+      formatUrl: (pkg, version2) => `${CDN_PROVIDERS.skypack.url}/${pkg}${version2 !== "latest" ? `@${version2}` : ""}`
+    },
+    esmsh: {
+      url: "https://esm.sh",
+      formatUrl: (pkg, version2) => `${CDN_PROVIDERS.esmsh.url}/${pkg}${version2 !== "latest" ? `@${version2}` : ""}`
+    },
+    unpkg: {
+      url: "https://unpkg.com",
+      formatUrl: (pkg, version2) => `${CDN_PROVIDERS.unpkg.url}/${pkg}${version2 !== "latest" ? `@${version2}` : ""}?module`
+    },
+    jsdelivr: {
+      url: "https://cdn.jsdelivr.net/npm",
+      formatUrl: (pkg, version2) => `${CDN_PROVIDERS.jsdelivr.url}/${pkg}${version2 !== "latest" ? `@${version2}` : ""}/+esm`
+    },
+    symbols: {
+      url: "https://pkg.symbo.ls",
+      formatUrl: (pkg, version2) => {
+        if (pkg.split("/").length > 2 || !onlyDotsAndNumbers(version2)) {
+          return `${CDN_PROVIDERS.symbols.url}/${pkg}`;
+        }
+        return `${CDN_PROVIDERS.symbols.url}/${pkg}/${version2}.js`;
+      }
+    }
+  };
+  var PACKAGE_MANAGER_TO_CDN = {
+    "esm.sh": "esmsh",
+    "unpkg": "unpkg",
+    "skypack": "skypack",
+    "jsdelivr": "jsdelivr",
+    "pkg.symbo.ls": "symbols"
+  };
+  var getCdnProviderFromConfig = (symbolsConfig = {}) => {
+    const { packageManager } = symbolsConfig;
+    return PACKAGE_MANAGER_TO_CDN[packageManager] || null;
+  };
+  var getCDNUrl = (packageName, version2 = "latest", provider = "esmsh") => {
+    const cdnConfig = CDN_PROVIDERS[provider] || CDN_PROVIDERS.esmsh;
+    return cdnConfig.formatUrl(packageName, version2);
+  };
+  var UIkitWithPrefix = (prefix = "smbls") => {
+    const newObj = {};
+    for (const key in uikit) {
+      if (Object.prototype.hasOwnProperty.call(uikit, key)) {
+        if ((0, import_utils5.matchesComponentNaming)(key)) {
+          newObj[`smbls.${key}`] = uikit[key];
+        } else {
+          newObj[key] = uikit[key];
+        }
+      }
+    }
+    return newObj;
+  };
+  var prepareComponents = (context) => {
+    return context.components ? { ...UIkitWithPrefix(), ...context.components } : UIkitWithPrefix();
+  };
+  var prepareUtils = (context) => {
+    return {
+      ...utilImports_exports,
+      ...routerUtils,
+      ...import_scratch2.scratchUtils,
+      ...context.utils,
+      ...context.snippets,
+      ...context.functions
+    };
+  };
+  var prepareMethods = (context) => {
+    return {
+      ...context.methods || {},
+      require: context.utils.require,
+      requireOnDemand: context.utils.requireOnDemand,
+      router: context.utils.router
+    };
+  };
+  var cachedDeps = {};
+  var prepareDependencies = async ({
+    dependencies,
+    dependenciesOnDemand,
+    document: document2,
+    preventCaching = false,
+    cdnProvider,
+    packageManager,
+    symbolsConfig
+  }) => {
+    if (!cdnProvider) {
+      cdnProvider = PACKAGE_MANAGER_TO_CDN[packageManager] || getCdnProviderFromConfig(symbolsConfig) || "esmsh";
+    }
+    if (!dependencies) return null;
+    let hasAny = false;
+    for (const _k in dependencies) {
+      hasAny = true;
+      break;
+    }
+    if (!hasAny) return null;
+    for (const dependency in dependencies) {
+      const version2 = dependencies[dependency];
+      if (dependenciesOnDemand && dependenciesOnDemand[dependency]) {
+        continue;
+      }
+      const random = (0, import_utils5.isDevelopment)() && preventCaching ? `?${Math.random()}` : "";
+      const url = getCDNUrl(dependency, version2, cdnProvider) + random;
+      try {
+        if (cachedDeps[dependency]) return;
+        cachedDeps[dependency] = true;
+        await utilImports_exports.loadRemoteScript(url, { document: document2, type: "module" });
+      } catch (e) {
+        console.error(`Failed to load ${dependency} from ${cdnProvider}:`, e);
+        if (cdnProvider !== "symbols") {
+          try {
+            const fallbackUrl = getCDNUrl(dependency, version2, "symbols") + random;
+            await utilImports_exports.loadRemoteScript(fallbackUrl, { document: document2 });
+            console.log(
+              `Successfully loaded ${dependency} from fallback (symbols.ls)`
+            );
+          } catch (fallbackError) {
+            console.error(
+              `Failed to load ${dependency} from fallback:`,
+              fallbackError
+            );
+          }
+        }
+      }
+    }
+    return dependencies;
+  };
+  var prepareRequire = async (packages, ctx) => {
+    const windowOpts = ctx.window || window;
+    const defaultProvider = ctx.cdnProvider || getCdnProviderFromConfig(ctx.symbolsConfig) || "esmsh";
+    const initRequire = async (ctx2) => async (key, provider) => {
+      const windowOpts2 = ctx2.window || window;
+      const pkg = windowOpts2.packages[key];
+      if (typeof pkg === "function") return pkg();
+      return pkg;
+    };
+    const initRequireOnDemand = async (ctx2) => async (key, provider = defaultProvider) => {
+      const { dependenciesOnDemand } = ctx2;
+      const documentOpts = ctx2.document || document;
+      const windowOpts2 = ctx2.window || window;
+      if (!windowOpts2.packages[key]) {
+        const random = (0, import_utils5.isDevelopment)() ? `?${Math.random()}` : "";
+        if (dependenciesOnDemand && dependenciesOnDemand[key]) {
+          const version2 = dependenciesOnDemand[key];
+          const url = getCDNUrl(key, version2, provider) + random;
+          try {
+            await ctx2.utils.loadRemoteScript(url, {
+              window: windowOpts2,
+              document: documentOpts
+            });
+          } catch (e) {
+            console.error(`Failed to load ${key} from ${provider}:`, e);
+            if (provider !== "symbols") {
+              const fallbackUrl = getCDNUrl(key, version2, "symbols") + random;
+              await ctx2.utils.loadRemoteScript(fallbackUrl, {
+                window: windowOpts2,
+                document: documentOpts
+              });
+            }
+          }
+        } else {
+          const url = getCDNUrl(key, "latest", provider) + random;
+          try {
+            await ctx2.utils.loadRemoteScript(url, {
+              window: windowOpts2,
+              document: documentOpts
+            });
+          } catch (e) {
+            console.error(`Failed to load ${key} from ${provider}:`, e);
+            if (provider !== "symbols") {
+              const fallbackUrl = getCDNUrl(key, "latest", "symbols") + random;
+              await ctx2.utils.loadRemoteScript(fallbackUrl, {
+                window: windowOpts2,
+                document: documentOpts
+              });
+            }
+          }
+          windowOpts2.packages[key] = "loadedOnDeman";
+        }
+      }
+      return await windowOpts2.require(key, provider);
+    };
+    if (windowOpts.packages) {
+      windowOpts.packages = (0, import_utils5.merge)(windowOpts.packages, packages);
+    } else {
+      windowOpts.packages = packages;
+    }
+    if (!windowOpts.require) {
+      ctx.utils.require = await initRequire(ctx);
+      windowOpts.require = ctx.utils.require;
+    }
+    if (!windowOpts.requireOnDemand) {
+      ctx.utils.requireOnDemand = await initRequireOnDemand(ctx);
+      windowOpts.requireOnDemand = ctx.utils.requireOnDemand;
+    }
+  };
+  var prepareDesignSystem = (key, context) => {
+    const [scratcDesignhSystem, emotion, registry] = (0, import_emotion2.initEmotion)(key, context);
+    return [scratcDesignhSystem, emotion, registry];
+  };
+  var prepareState = (app, context) => {
+    const state = {};
+    if (context.state) utilImports_exports.deepMerge(state, context.state);
+    if (app && app.state) (0, import_utils5.deepMerge)(state, app.state);
+    state.isRootState = true;
+    return (0, import_utils5.deepClone)(state);
+  };
+  var preparePages = (app, context) => {
+    if ((0, import_utils5.isObject)(app.routes) && (0, import_utils5.isObject)(context.pages)) {
+      (0, import_utils5.merge)(app.routes, context.pages);
+    }
+    const pages = app.routes || context.pages || {};
+    for (const v in pages) {
+      if (v.charCodeAt(0) === 47) continue;
+      const index = v === "index" ? "" : v;
+      pages["/" + index] = pages[v];
+      delete pages[v];
+    }
+    return pages;
+  };
+  var prepareSharedLibs = (context) => {
+    const sharedLibraries = context.sharedLibraries;
+    for (let i = 0; i < sharedLibraries.length; i++) {
+      const sharedLib = sharedLibraries[i];
+      if (context.type === "template") {
+        overwriteShallow(context.designSystem, sharedLib.designSystem);
+        (0, import_utils5.deepMerge)(context, sharedLib, ["designSystem"], 1);
+      } else {
+        (0, import_utils5.deepMerge)(context, sharedLib, [], 1);
+      }
+    }
+  };
+
+  // src/createDomql.js
+  var prepareContext = async (app, context = {}) => {
+    const key = context.key = context.key || ((0, import_utils6.isString)(app) ? app : "smblsapp");
+    context.define = context.define || defaultDefine;
+    context.cssPropsRegistry = import_css_in_props.CSS_PROPS_REGISTRY;
+    context.window = prepareWindow(context);
+    if (context.sharedLibraries && context.sharedLibraries.length) {
+      prepareSharedLibs(context);
+    }
+    const [scratcDesignSystem, emotion, registry] = prepareDesignSystem(
+      key,
+      context
+    );
+    context.designSystem = scratcDesignSystem;
+    context.registry = registry;
+    context.emotion = emotion;
+    const state = prepareState(app, context);
+    context.state = state;
+    context.pages = preparePages(app, context);
+    context.components = prepareComponents(context);
+    context.utils = prepareUtils(context);
+    if (PACKAGE_MANAGER_TO_CDN[context.packageManager]) {
+      context.dependencies = await prepareDependencies(context);
+    }
+    context.methods = prepareMethods(context);
+    context.routerOptions = initRouter(app, context);
+    context.defaultExtends = [uikit2.Box];
+    context.snippets = context.snippets || {};
+    context.functions = context.functions || {};
+    return context;
+  };
+  var createDomqlElement = async (app, ctx) => {
+    if (!(0, import_utils6.isObject)(ctx)) ctx = {};
+    if ((0, import_utils6.isNode)(app)) {
+      app = {};
+      ctx.parent = app;
+    } else if ((0, import_utils6.isString)(app)) {
+      app = {};
+      ctx.key = app;
+    } else if (!(0, import_utils6.isObject)(app)) {
+      app = {};
+    }
+    await prepareContext(app, ctx);
+    app.extends = initializeExtend(app, ctx);
+    app.routes = ctx.pages;
+    app.state = ctx.state;
+    app.context = ctx;
+    app.data = app.data || {};
+    app.data.frameListeners = (0, import_element.initAnimationFrame)(ctx);
+    await prepareRequire(
+      {
+        functions: ctx.functions,
+        utils: ctx.utils,
+        snippets: ctx.snippets,
+        ...ctx.files
+      },
+      ctx
+    );
+    initializeSync(app, ctx);
+    initializeNotifications(app, ctx);
+    const parentNode = ctx.parent || ctx.document.body;
+    const domqlCreate = import_domql.default.default && import_domql.default.default.create || import_domql.default.create;
+    const smblsApp = await domqlCreate(app, parentNode, ctx.key, {
+      verbose: ctx.verbose,
+      ...ctx.domqlOptions
+    });
+    return smblsApp;
+  };
+
+  // src/index.js
+  var mergeWithLocalFile2 = (options, optionsExternalFile) => (0, import_utils7.deepMerge)(
+    options,
+    (0, import_utils7.isObject)(optionsExternalFile) ? optionsExternalFile : import_dynamic2.default || {}
+  );
+  var create = (App, options = options_default, optionsExternalFile) => {
+    const redefinedOptions = {
+      ...options_default,
+      ...mergeWithLocalFile2(options, optionsExternalFile)
+    };
+    const domqlApp = createDomqlElement(App, redefinedOptions).then((App2) => {
+      onpopstateRouter(App2, redefinedOptions);
+      if (redefinedOptions.on && redefinedOptions.on.create)
+        redefinedOptions.on.create(
+          domqlApp,
+          domqlApp.state,
+          domqlApp.context,
+          redefinedOptions
+        );
+    });
+    return domqlApp;
+  };
+  var createAsync = (App, options = options_default, optionsExternalFile) => {
+    const domqlApp = create(App, options, optionsExternalFile);
+    const redefinedOptions = {
+      ...options_default,
+      ...mergeWithLocalFile2(options, optionsExternalFile)
+    };
+    const key = redefinedOptions.key;
+    fetchAsync(domqlApp, key, { utils: utilImports_exports, ...redefinedOptions });
+    return domqlApp;
+  };
+  var createSync = async (App, options = options_default, optionsExternalFile) => {
+    const redefinedOptions = {
+      ...options_default,
+      ...mergeWithLocalFile2(options, optionsExternalFile)
+    };
+    const key = options.key;
+    await fetchSync(key, redefinedOptions);
+    const domqlApp = await createDomqlElement(App, redefinedOptions);
+    if (redefinedOptions.on && redefinedOptions.on.create)
+      await redefinedOptions.on.create(
+        domqlApp,
+        domqlApp.state,
+        domqlApp.context,
+        redefinedOptions
+      );
+    return domqlApp;
+  };
+  var createSkeleton = (App = {}, options = options_default, optionsExternalFile) => {
+    return create(
+      {
+        deps: { isUndefined: import_utils7.isUndefined },
+        ...App
+      },
+      (0, import_utils7.deepMerge)({ domqlOptions: { onlyResolveExtends: true } }, options),
+      optionsExternalFile
+    );
+  };
+  return __toCommonJS(index_exports);
+})();
+// @preserve-env