@symbo.ls/create 2.27.0 → 2.27.10

package/dist/cjs/createDomql.js

@@ -36,15 +36,18 @@ var import_domql = __toESM(require("domql"), 1);
 var uikit = __toESM(require("@symbo.ls/uikit"), 1);
 var import_utils = require("@domql/utils");
 var import_event = require("@domql/event");
-var import_define = require("./define");
-var import_router = require("./router");
-var import_syncExtend = require("./syncExtend");
-var import_prepare = require("./prepare");
+var import_define = require("./define.js");
+var import_router = require("./router.js");
+var import_syncExtend = require("./syncExtend.js");
+var import_prepare = require("./prepare.js");
 const prepareContext = (app, context = {}) => {
   const key = context.key = context.key || ((0, import_utils.isString)(app) ? app : "smblsapp");
   context.define = context.define || import_define.defaultDefine;
   context.window = (0, import_prepare.prepareWindow)(context);
-  const [scratcDesignSystem, emotion, registry] = (0, import_prepare.prepareDesignSystem)(key, context);
+  const [scratcDesignSystem, emotion, registry] = (0, import_prepare.prepareDesignSystem)(
+    key,
+    context
+  );
   context.designSystem = scratcDesignSystem;
   context.registry = registry;
   context.emotion = emotion;
@@ -60,8 +63,7 @@ const prepareContext = (app, context = {}) => {
   return context;
 };
 const createDomqlElement = async (app, ctx) => {
-  if (!(0, import_utils.isObject)(ctx))
-    ctx = {};
+  if (!(0, import_utils.isObject)(ctx)) ctx = {};
   if ((0, import_utils.isNode)(app)) {
     app = {};
     ctx.parent = app;
@@ -80,12 +82,15 @@ const createDomqlElement = async (app, ctx) => {
   app.context = ctx;
   app.data = app.data || {};
   app.data.frameListeners = (0, import_event.initAnimationFrame)(ctx);
-  (0, import_prepare.prepareRequire)({
-    functions: ctx.functions,
-    utils: ctx.utils,
-    snippets: ctx.snippets,
-    ...ctx.files
-  }, ctx);
+  (0, import_prepare.prepareRequire)(
+    {
+      functions: ctx.functions,
+      utils: ctx.utils,
+      snippets: ctx.snippets,
+      ...ctx.files
+    },
+    ctx
+  );
   (0, import_syncExtend.initializeSync)(app, ctx);
   (0, import_syncExtend.initializeInspect)(app, ctx);
   (0, import_syncExtend.initializeNotifications)(app, ctx);

package/dist/cjs/define.js

@@ -26,16 +26,14 @@ const defaultDefine = {
   routes: (param) => param,
   // deps: (param, el) => param || el.parent.deps,
   $router: (param, el) => {
-    if (!param)
-      return;
+    if (!param) return;
     const obj = { tag: "fragment", ...param };
     const set = () => {
       el.set(obj, { preventDefineUpdate: "$router" });
     };
     if (el.props && el.props.lazyLoad) {
       window.requestAnimationFrame(set);
-    } else
-      set();
+    } else set();
     return obj;
   },
   $collection: import_atoms.Collection.define.$collection,

package/dist/cjs/ferchOnCreate.js

@@ -27,8 +27,7 @@ var import_fetch = require("@symbo.ls/fetch");
 const fetchSync = async (key, options) => {
   if (key && options.editor) {
     try {
-      if (!options.editor.async)
-        await (0, import_fetch.fetchProject)(key, options);
+      if (!options.editor.async) await (0, import_fetch.fetchProject)(key, options);
     } catch (e) {
       console.error(e);
     }

package/dist/cjs/index.js

@@ -26,48 +26,67 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var src_exports = {};
-__export(src_exports, {
+var index_exports = {};
+__export(index_exports, {
   create: () => create,
   createAsync: () => createAsync,
   createSkeleton: () => createSkeleton,
   createSync: () => createSync,
-  default: () => src_default
+  default: () => index_default
 });
-module.exports = __toCommonJS(src_exports);
+module.exports = __toCommonJS(index_exports);
 var import_utils = require("@domql/utils");
-var utils = __toESM(require("./utilImports"), 1);
-var import_router = require("./router");
-var import_ferchOnCreate = require("./ferchOnCreate");
-var import_options = __toESM(require("./options"), 1);
+var utils = __toESM(require("./utilImports.js"), 1);
+var import_router = require("./router.js");
+var import_ferchOnCreate = require("./ferchOnCreate.js");
+var import_options = __toESM(require("./options.js"), 1);
 var import_dynamic = __toESM(require("@symbo.ls/init/dynamic.json"), 1);
-var import_createDomql = require("./createDomql");
+var import_createDomql = require("./createDomql.js");
 const mergeWithLocalFile = (options, optionsExternalFile) => (0, import_utils.deepMerge)(
   options,
   (0, import_utils.isObject)(optionsExternalFile) ? optionsExternalFile : import_dynamic.default || {}
 );
 const create = (App, options = import_options.default, optionsExternalFile) => {
-  const redefinedOptions = { ...import_options.default, ...mergeWithLocalFile(options, optionsExternalFile) };
+  const redefinedOptions = {
+    ...import_options.default,
+    ...mergeWithLocalFile(options, optionsExternalFile)
+  };
   const domqlApp = (0, import_createDomql.createDomqlElement)(App, redefinedOptions);
   (0, import_router.popStateRouter)(domqlApp, redefinedOptions);
   if (redefinedOptions.on && redefinedOptions.on.create)
-    redefinedOptions.on.create(domqlApp, domqlApp.state, domqlApp.context, redefinedOptions);
+    redefinedOptions.on.create(
+      domqlApp,
+      domqlApp.state,
+      domqlApp.context,
+      redefinedOptions
+    );
   return domqlApp;
 };
 const createAsync = (App, options = import_options.default, optionsExternalFile) => {
   const domqlApp = create(App, options, optionsExternalFile);
-  const redefinedOptions = { ...import_options.default, ...mergeWithLocalFile(options, optionsExternalFile) };
+  const redefinedOptions = {
+    ...import_options.default,
+    ...mergeWithLocalFile(options, optionsExternalFile)
+  };
   const key = redefinedOptions.key;
   (0, import_ferchOnCreate.fetchAsync)(domqlApp, key, { utils, ...redefinedOptions });
   return domqlApp;
 };
 const createSync = async (App, options = import_options.default, optionsExternalFile) => {
-  const redefinedOptions = { ...import_options.default, ...mergeWithLocalFile(options, optionsExternalFile) };
+  const redefinedOptions = {
+    ...import_options.default,
+    ...mergeWithLocalFile(options, optionsExternalFile)
+  };
   const key = options.key;
   await (0, import_ferchOnCreate.fetchSync)(key, redefinedOptions);
   const domqlApp = await (0, import_createDomql.createDomqlElement)(App, redefinedOptions);
   if (redefinedOptions.on && redefinedOptions.on.create)
-    await redefinedOptions.on.create(domqlApp, domqlApp.state, domqlApp.context, redefinedOptions);
+    await redefinedOptions.on.create(
+      domqlApp,
+      domqlApp.state,
+      domqlApp.context,
+      redefinedOptions
+    );
   return domqlApp;
 };
 const createSkeleton = (App = {}, options = import_options.default, optionsExternalFile) => {
@@ -80,4 +99,4 @@ const createSkeleton = (App = {}, options = import_options.default, optionsExter
     optionsExternalFile
   );
 };
-var src_default = create;
+var index_default = create;

package/dist/cjs/initEmotion.js

@@ -25,15 +25,14 @@ var import_emotion = require("@domql/emotion");
 var import_emotion2 = require("@symbo.ls/emotion");
 var import_init = require("@symbo.ls/init");
 var import_utils = require("@domql/utils");
-var import_options = require("./options");
+var import_options = require("./options.js");
 var import_default_config = require("@symbo.ls/default-config");
 const initEmotion = (key, options = {}) => {
   var _a;
   const doc = options.parent || options.document || document;
   const initOptions = options.initOptions || {};
   const emotion = initOptions.emotion;
-  if (!initOptions.emotion)
-    initOptions.emotion = import_emotion2.emotion;
+  if (!initOptions.emotion) initOptions.emotion = import_emotion2.emotion;
   const registry = options.registry || (0, import_emotion.transformDOMQLEmotion)(initOptions.emotion, options);
   const designSystem = initOptions.useDefaultConfig || ((_a = options.designSystem) == null ? void 0 : _a.useDefaultConfig) ? (0, import_utils.deepMerge)(options.designSystem, (0, import_utils.deepClone)(import_default_config.DEFAULT_CONFIG)) : options.designSystem || (0, import_utils.deepClone)(import_default_config.DEFAULT_CONFIG);
   const scratchSystem = (0, import_init.init)(designSystem, {

package/dist/cjs/options.js

@@ -23,7 +23,7 @@ __export(options_exports, {
   default: () => options_default
 });
 module.exports = __toCommonJS(options_exports);
-var import_define = require("./define");
+var import_define = require("./define.js");
 const DESIGN_SYSTEM_OPTIONS = {
   useReset: true,
   useVariable: true,

package/dist/cjs/prepare.js

@@ -41,17 +41,15 @@ __export(prepare_exports, {
 });
 module.exports = __toCommonJS(prepare_exports);
 var import_utils = require("@domql/utils");
-var import_initEmotion = require("./initEmotion");
+var import_initEmotion = require("./initEmotion.js");
 var uikit = __toESM(require("@symbo.ls/uikit"), 1);
-var utils = __toESM(require("./utilImports"), 1);
+var utils = __toESM(require("./utilImports.js"), 1);
 var routerUtils = __toESM(require("@domql/router"), 1);
-const ENV = "development";
+// @preserve-env
 const prepareWindow = (context) => {
-  if (typeof window === "undefined")
-    window = globalThis || {};
+  if (typeof window === "undefined") window = globalThis || {};
   if (typeof document === "undefined") {
-    if (!window.document)
-      window.document = globalThis.document || { body: {} };
+    if (!window.document) window.document = globalThis.document || { body: {} };
     document = window.document;
   }
   context.document = context.document || document;
@@ -77,7 +75,14 @@ const prepareComponents = (context) => {
   return context.components ? { ...UIkitWithPrefix(), ...context.components } : UIkitWithPrefix();
 };
 const prepareUtils = (context) => {
-  return { ...utils, ...routerUtils, ...utils.scratchUtils, ...context.utils, ...context.snippets, ...context.functions };
+  return {
+    ...utils,
+    ...routerUtils,
+    ...utils.scratchUtils,
+    ...context.utils,
+    ...context.snippets,
+    ...context.functions
+  };
 };
 const prepareMethods = (context) => {
   return {
@@ -103,16 +108,14 @@ const prepareDependencies = ({
     if (version === "loading" || version === "error") {
       continue;
     }
-    const random = ENV === "development" ? `?${Math.random()}` : "";
+    const random = (0, import_utils.isDevelopment)() ? `?${Math.random()}` : "";
     let url = `https://pkg.symbo.ls/${dependency}/${version}.js${random}`;
     if (dependency.split("/").length > 2 || !onlyDotsAndNumbers(version)) {
       url = `https://pkg.symbo.ls/${dependency}${random}`;
     }
-    if (dependenciesOnDemand && dependenciesOnDemand[dependency])
-      continue;
+    if (dependenciesOnDemand && dependenciesOnDemand[dependency]) continue;
     try {
-      if (cachedDeps[dependency])
-        return;
+      if (cachedDeps[dependency]) return;
       cachedDeps[dependency] = true;
       utils.loadJavascriptFileEmbedSync(url, document2);
     } catch (e) {
@@ -126,8 +129,7 @@ const prepareRequire = (packages, ctx) => {
   const initRequire = (ctx2) => (key) => {
     const windowOpts2 = ctx2.window || window;
     const pkg = windowOpts2.packages[key];
-    if (typeof pkg === "function")
-      return pkg();
+    if (typeof pkg === "function") return pkg();
     return pkg;
   };
   const initRequireOnDemand = (ctx2) => (key) => {
@@ -135,7 +137,7 @@ const prepareRequire = (packages, ctx) => {
     const documentOpts = ctx2.document || document;
     const windowOpts2 = ctx2.window || window;
     if (!windowOpts2.packages[key]) {
-      const random = ENV === "development" ? `?${Math.random()}` : "";
+      const random = (0, import_utils.isDevelopment)() ? `?${Math.random()}` : "";
       if (dependenciesOnDemand && dependenciesOnDemand[key]) {
         const version = dependenciesOnDemand[key];
         const url = `https://pkg.symbo.ls/${key}/${version}.js${random}`;
@@ -169,10 +171,8 @@ const prepareDesignSystem = (key, context) => {
 };
 const prepareState = (app, context) => {
   const state = {};
-  if (context.state)
-    utils.deepMerge(state, context.state);
-  if (app && app.state)
-    (0, import_utils.deepMerge)(state, app.state);
+  if (context.state) utils.deepMerge(state, context.state);
+  if (app && app.state) (0, import_utils.deepMerge)(state, app.state);
   return (0, import_utils.deepClone)(state);
 };
 const preparePages = (app, context) => {

package/dist/cjs/router.js

@@ -32,19 +32,15 @@ const DEFAULT_ROUTING_OPTIONS = {
   popState: true
 };
 const initRouter = (element, context) => {
-  if (context.router === false)
-    return;
-  else if (context.router === true)
-    context.router = DEFAULT_ROUTING_OPTIONS;
-  else
-    (0, import_utils.merge)(context.router || {}, DEFAULT_ROUTING_OPTIONS);
+  if (context.router === false) return;
+  else if (context.router === true) context.router = DEFAULT_ROUTING_OPTIONS;
+  else (0, import_utils.merge)(context.router || {}, DEFAULT_ROUTING_OPTIONS);
   const routerOptions = context.router;
   const router = context.utils && context.utils.router ? context.utils.router : import_router.router;
   const onRouterRenderDefault = (el, s) => {
     const { pathname, search, hash } = import_utils.window.location;
     const url = pathname + search + hash;
-    if (el.routes)
-      router(url, el, {}, { initialRender: true });
+    if (el.routes) router(url, el, {}, { initialRender: true });
   };
   const hasRenderRouter = element.on && !(0, import_utils.isUndefined)(element.on.renderRouter);
   if (routerOptions && routerOptions.initRouter && !hasRenderRouter) {
@@ -61,12 +57,10 @@ const initRouter = (element, context) => {
 };
 let popStateFired;
 const popStateRouter = (element, context) => {
-  if (popStateFired)
-    return;
+  if (popStateFired) return;
   popStateFired = true;
   const routerOptions = context.router || DEFAULT_ROUTING_OPTIONS;
-  if (!routerOptions.popState)
-    return;
+  if (!routerOptions.popState) return;
   const router = context.utils && context.utils.router ? context.utils.router : import_router.router;
   import_utils.window.onpopstate = (e) => {
     const { pathname, search, hash } = import_utils.window.location;

package/dist/cjs/syncExtend.js

@@ -31,12 +31,10 @@ const initializeExtend = (app, ctx) => {
 };
 const initializeSync = (app, ctx) => {
   const { editor } = ctx;
-  if (!editor)
-    return;
+  if (!editor) return;
   const liveSync = (0, import_utils.isUndefined)(editor.liveSync) ? (0, import_utils.isDevelopment)() : editor.liveSync;
   if (liveSync) {
-    if ((0, import_utils.isArray)(app.extend))
-      app.extend.push(import_sync.SyncComponent);
+    if ((0, import_utils.isArray)(app.extend)) app.extend.push(import_sync.SyncComponent);
     else if (app.extend) {
       app.extend = [app.extend, import_sync.SyncComponent];
     } else {
@@ -46,12 +44,10 @@ const initializeSync = (app, ctx) => {
 };
 const initializeInspect = (app, ctx) => {
   const { editor } = ctx;
-  if (!editor)
-    return;
+  if (!editor) return;
   const inspect = (0, import_utils.isUndefined)(editor.inspect) ? (0, import_utils.isDevelopment)() : editor.inspect;
   if (inspect) {
-    if ((0, import_utils.isArray)(app.extend))
-      app.extend.push(import_sync.Inspect);
+    if ((0, import_utils.isArray)(app.extend)) app.extend.push(import_sync.Inspect);
     else if (app.extend) {
       app.extend = [app.extend, import_sync.Inspect];
     } else {
@@ -61,12 +57,10 @@ const initializeInspect = (app, ctx) => {
 };
 const initializeNotifications = (app, ctx) => {
   const { editor } = ctx;
-  if (!editor)
-    return;
+  if (!editor) return;
   const verbose = (0, import_utils.isUndefined)(editor.verbose) ? (0, import_utils.isDevelopment)() || ctx.verbose : editor.verbose;
   if (verbose) {
-    if ((0, import_utils.isArray)(app.extend))
-      app.extend.push(import_sync.Notifications);
+    if ((0, import_utils.isArray)(app.extend)) app.extend.push(import_sync.Notifications);
     else if (app.extend) {
       app.extend = [app.extend, import_sync.Notifications];
     } else {

package/dist/esm/createDomql.js

@@ -18,9 +18,14 @@ import DOM from "domql";
 import * as uikit from "@symbo.ls/uikit";
 import { isString, isNode, isObject } from "@domql/utils";
 import { initAnimationFrame } from "@domql/event";
-import { defaultDefine } from "./define";
-import { initRouter } from "./router";
-import { initializeExtend, initializeInspect, initializeNotifications, initializeSync } from "./syncExtend";
+import { defaultDefine } from "./define.js";
+import { initRouter } from "./router.js";
+import {
+  initializeExtend,
+  initializeInspect,
+  initializeNotifications,
+  initializeSync
+} from "./syncExtend.js";
 import {
   prepareComponents,
   prepareDependencies,
@@ -31,12 +36,15 @@ import {
   prepareState,
   prepareUtils,
   prepareMethods
-} from "./prepare";
+} from "./prepare.js";
 const prepareContext = (app, context = {}) => {
   const key = context.key = context.key || (isString(app) ? app : "smblsapp");
   context.define = context.define || defaultDefine;
   context.window = prepareWindow(context);
-  const [scratcDesignSystem, emotion, registry] = prepareDesignSystem(key, context);
+  const [scratcDesignSystem, emotion, registry] = prepareDesignSystem(
+    key,
+    context
+  );
   context.designSystem = scratcDesignSystem;
   context.registry = registry;
   context.emotion = emotion;
@@ -52,8 +60,7 @@ const prepareContext = (app, context = {}) => {
   return context;
 };
 const createDomqlElement = async (app, ctx) => {
-  if (!isObject(ctx))
-    ctx = {};
+  if (!isObject(ctx)) ctx = {};
   if (isNode(app)) {
     app = {};
     ctx.parent = app;
@@ -72,11 +79,14 @@ const createDomqlElement = async (app, ctx) => {
   app.context = ctx;
   app.data = app.data || {};
   app.data.frameListeners = initAnimationFrame(ctx);
-  prepareRequire(__spreadValues({
-    functions: ctx.functions,
-    utils: ctx.utils,
-    snippets: ctx.snippets
-  }, ctx.files), ctx);
+  prepareRequire(
+    __spreadValues({
+      functions: ctx.functions,
+      utils: ctx.utils,
+      snippets: ctx.snippets
+    }, ctx.files),
+    ctx
+  );
   initializeSync(app, ctx);
   initializeInspect(app, ctx);
   initializeNotifications(app, ctx);

package/dist/esm/define.js

@@ -19,16 +19,14 @@ const defaultDefine = {
   routes: (param) => param,
   // deps: (param, el) => param || el.parent.deps,
   $router: (param, el) => {
-    if (!param)
-      return;
+    if (!param) return;
     const obj = __spreadValues({ tag: "fragment" }, param);
     const set = () => {
       el.set(obj, { preventDefineUpdate: "$router" });
     };
     if (el.props && el.props.lazyLoad) {
       window.requestAnimationFrame(set);
-    } else
-      set();
+    } else set();
     return obj;
   },
   $collection: Collection.define.$collection,

package/dist/esm/ferchOnCreate.js

@@ -3,8 +3,7 @@ import { fetchProject, fetchProjectAsync } from "@symbo.ls/fetch";
 const fetchSync = async (key, options) => {
   if (key && options.editor) {
     try {
-      if (!options.editor.async)
-        await fetchProject(key, options);
+      if (!options.editor.async) await fetchProject(key, options);
     } catch (e) {
       console.error(e);
     }

package/dist/esm/index.js

@@ -15,12 +15,12 @@ var __spreadValues = (a, b) => {
   return a;
 };
 import { deepMerge, isObject, isUndefined } from "@domql/utils";
-import * as utils from "./utilImports";
-import { popStateRouter } from "./router";
-import { fetchAsync, fetchSync } from "./ferchOnCreate";
-import DEFAULT_CREATE_OPTIONS from "./options";
+import * as utils from "./utilImports.js";
+import { popStateRouter } from "./router.js";
+import { fetchAsync, fetchSync } from "./ferchOnCreate.js";
+import DEFAULT_CREATE_OPTIONS from "./options.js";
 import DYNAMIC_JSON from "@symbo.ls/init/dynamic.json";
-import { createDomqlElement } from "./createDomql";
+import { createDomqlElement } from "./createDomql.js";
 const mergeWithLocalFile = (options, optionsExternalFile) => deepMerge(
   options,
   isObject(optionsExternalFile) ? optionsExternalFile : DYNAMIC_JSON || {}
@@ -30,7 +30,12 @@ const create = (App, options = DEFAULT_CREATE_OPTIONS, optionsExternalFile) => {
   const domqlApp = createDomqlElement(App, redefinedOptions);
   popStateRouter(domqlApp, redefinedOptions);
   if (redefinedOptions.on && redefinedOptions.on.create)
-    redefinedOptions.on.create(domqlApp, domqlApp.state, domqlApp.context, redefinedOptions);
+    redefinedOptions.on.create(
+      domqlApp,
+      domqlApp.state,
+      domqlApp.context,
+      redefinedOptions
+    );
   return domqlApp;
 };
 const createAsync = (App, options = DEFAULT_CREATE_OPTIONS, optionsExternalFile) => {
@@ -46,7 +51,12 @@ const createSync = async (App, options = DEFAULT_CREATE_OPTIONS, optionsExternal
   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);
+    await redefinedOptions.on.create(
+      domqlApp,
+      domqlApp.state,
+      domqlApp.context,
+      redefinedOptions
+    );
   return domqlApp;
 };
 const createSkeleton = (App = {}, options = DEFAULT_CREATE_OPTIONS, optionsExternalFile) => {
@@ -58,11 +68,11 @@ const createSkeleton = (App = {}, options = DEFAULT_CREATE_OPTIONS, optionsExter
     optionsExternalFile
   );
 };
-var src_default = create;
+var index_default = create;
 export {
   create,
   createAsync,
   createSkeleton,
   createSync,
-  src_default as default
+  index_default as default
 };

package/dist/esm/initEmotion.js

@@ -18,15 +18,14 @@ import { transformDOMQLEmotion } from "@domql/emotion";
 import { emotion as defaultEmotion } from "@symbo.ls/emotion";
 import { init } from "@symbo.ls/init";
 import { deepClone, deepMerge } from "@domql/utils";
-import { DESIGN_SYSTEM_OPTIONS } from "./options";
+import { DESIGN_SYSTEM_OPTIONS } from "./options.js";
 import { DEFAULT_CONFIG } from "@symbo.ls/default-config";
 const initEmotion = (key, options = {}) => {
   var _a;
   const doc = options.parent || options.document || document;
   const initOptions = options.initOptions || {};
   const emotion = initOptions.emotion;
-  if (!initOptions.emotion)
-    initOptions.emotion = defaultEmotion;
+  if (!initOptions.emotion) initOptions.emotion = defaultEmotion;
   const registry = options.registry || transformDOMQLEmotion(initOptions.emotion, options);
   const designSystem = initOptions.useDefaultConfig || ((_a = options.designSystem) == null ? void 0 : _a.useDefaultConfig) ? deepMerge(options.designSystem, deepClone(DEFAULT_CONFIG)) : options.designSystem || deepClone(DEFAULT_CONFIG);
   const scratchSystem = init(designSystem, __spreadValues(__spreadValues({

package/dist/esm/options.js

@@ -1,4 +1,4 @@
-import { defaultDefine } from "./define";
+import { defaultDefine } from "./define.js";
 const DESIGN_SYSTEM_OPTIONS = {
   useReset: true,
   useVariable: true,

package/dist/esm/prepare.js

@@ -22,19 +22,18 @@ import {
   deepMerge,
   deepClone,
   merge,
-  checkIfKeyIsComponent
+  checkIfKeyIsComponent,
+  isDevelopment
 } from "@domql/utils";
-import { initEmotion } from "./initEmotion";
+import { initEmotion } from "./initEmotion.js";
 import * as uikit from "@symbo.ls/uikit";
-import * as utils from "./utilImports";
+import * as utils from "./utilImports.js";
 import * as routerUtils from "@domql/router";
-const ENV = "development";
+// @preserve-env
 const prepareWindow = (context) => {
-  if (typeof window === "undefined")
-    window = globalThis || {};
+  if (typeof window === "undefined") window = globalThis || {};
   if (typeof document === "undefined") {
-    if (!window.document)
-      window.document = globalThis.document || { body: {} };
+    if (!window.document) window.document = globalThis.document || { body: {} };
     document = window.document;
   }
   context.document = context.document || document;
@@ -85,16 +84,14 @@ const prepareDependencies = ({
     if (version === "loading" || version === "error") {
       continue;
     }
-    const random = ENV === "development" ? `?${Math.random()}` : "";
+    const random = isDevelopment() ? `?${Math.random()}` : "";
     let url = `https://pkg.symbo.ls/${dependency}/${version}.js${random}`;
     if (dependency.split("/").length > 2 || !onlyDotsAndNumbers(version)) {
       url = `https://pkg.symbo.ls/${dependency}${random}`;
     }
-    if (dependenciesOnDemand && dependenciesOnDemand[dependency])
-      continue;
+    if (dependenciesOnDemand && dependenciesOnDemand[dependency]) continue;
     try {
-      if (cachedDeps[dependency])
-        return;
+      if (cachedDeps[dependency]) return;
       cachedDeps[dependency] = true;
       utils.loadJavascriptFileEmbedSync(url, document2);
     } catch (e) {
@@ -108,8 +105,7 @@ const prepareRequire = (packages, ctx) => {
   const initRequire = (ctx2) => (key) => {
     const windowOpts2 = ctx2.window || window;
     const pkg = windowOpts2.packages[key];
-    if (typeof pkg === "function")
-      return pkg();
+    if (typeof pkg === "function") return pkg();
     return pkg;
   };
   const initRequireOnDemand = (ctx2) => (key) => {
@@ -117,7 +113,7 @@ const prepareRequire = (packages, ctx) => {
     const documentOpts = ctx2.document || document;
     const windowOpts2 = ctx2.window || window;
     if (!windowOpts2.packages[key]) {
-      const random = ENV === "development" ? `?${Math.random()}` : "";
+      const random = isDevelopment() ? `?${Math.random()}` : "";
       if (dependenciesOnDemand && dependenciesOnDemand[key]) {
         const version = dependenciesOnDemand[key];
         const url = `https://pkg.symbo.ls/${key}/${version}.js${random}`;
@@ -151,10 +147,8 @@ const prepareDesignSystem = (key, context) => {
 };
 const prepareState = (app, context) => {
   const state = {};
-  if (context.state)
-    utils.deepMerge(state, context.state);
-  if (app && app.state)
-    deepMerge(state, app.state);
+  if (context.state) utils.deepMerge(state, context.state);
+  if (app && app.state) deepMerge(state, app.state);
   return deepClone(state);
 };
 const preparePages = (app, context) => {

package/dist/esm/router.js

@@ -7,19 +7,15 @@ const DEFAULT_ROUTING_OPTIONS = {
   popState: true
 };
 const initRouter = (element, context) => {
-  if (context.router === false)
-    return;
-  else if (context.router === true)
-    context.router = DEFAULT_ROUTING_OPTIONS;
-  else
-    merge(context.router || {}, DEFAULT_ROUTING_OPTIONS);
+  if (context.router === false) return;
+  else if (context.router === true) context.router = DEFAULT_ROUTING_OPTIONS;
+  else merge(context.router || {}, DEFAULT_ROUTING_OPTIONS);
   const routerOptions = context.router;
   const router = context.utils && context.utils.router ? context.utils.router : defaultRouter;
   const onRouterRenderDefault = (el, s) => {
     const { pathname, search, hash } = window.location;
     const url = pathname + search + hash;
-    if (el.routes)
-      router(url, el, {}, { initialRender: true });
+    if (el.routes) router(url, el, {}, { initialRender: true });
   };
   const hasRenderRouter = element.on && !isUndefined(element.on.renderRouter);
   if (routerOptions && routerOptions.initRouter && !hasRenderRouter) {
@@ -36,12 +32,10 @@ const initRouter = (element, context) => {
 };
 let popStateFired;
 const popStateRouter = (element, context) => {
-  if (popStateFired)
-    return;
+  if (popStateFired) return;
   popStateFired = true;
   const routerOptions = context.router || DEFAULT_ROUTING_OPTIONS;
-  if (!routerOptions.popState)
-    return;
+  if (!routerOptions.popState) return;
   const router = context.utils && context.utils.router ? context.utils.router : defaultRouter;
   window.onpopstate = (e) => {
     const { pathname, search, hash } = window.location;

package/dist/esm/syncExtend.js

@@ -5,12 +5,10 @@ const initializeExtend = (app, ctx) => {
 };
 const initializeSync = (app, ctx) => {
   const { editor } = ctx;
-  if (!editor)
-    return;
+  if (!editor) return;
   const liveSync = isUndefined(editor.liveSync) ? isDevelopment() : editor.liveSync;
   if (liveSync) {
-    if (isArray(app.extend))
-      app.extend.push(SyncComponent);
+    if (isArray(app.extend)) app.extend.push(SyncComponent);
     else if (app.extend) {
       app.extend = [app.extend, SyncComponent];
     } else {
@@ -20,12 +18,10 @@ const initializeSync = (app, ctx) => {
 };
 const initializeInspect = (app, ctx) => {
   const { editor } = ctx;
-  if (!editor)
-    return;
+  if (!editor) return;
   const inspect = isUndefined(editor.inspect) ? isDevelopment() : editor.inspect;
   if (inspect) {
-    if (isArray(app.extend))
-      app.extend.push(Inspect);
+    if (isArray(app.extend)) app.extend.push(Inspect);
     else if (app.extend) {
       app.extend = [app.extend, Inspect];
     } else {
@@ -35,12 +31,10 @@ const initializeInspect = (app, ctx) => {
 };
 const initializeNotifications = (app, ctx) => {
   const { editor } = ctx;
-  if (!editor)
-    return;
+  if (!editor) return;
   const verbose = isUndefined(editor.verbose) ? isDevelopment() || ctx.verbose : editor.verbose;
   if (verbose) {
-    if (isArray(app.extend))
-      app.extend.push(Notifications);
+    if (isArray(app.extend)) app.extend.push(Notifications);
     else if (app.extend) {
       app.extend = [app.extend, Notifications];
     } else {

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@symbo.ls/create",
-  "version": "2.27.0",
+  "version": "2.27.10",
   "license": "MIT",
-  "gitHead": "40a924693178a7d7b9e94aac0282b9d31602eca7",
+  "gitHead": "668d24f518bdb163357897504c5912c085638d3e",
   "type": "module",
   "module": "src/index.js",
   "main": "src/index.js",
@@ -10,9 +10,9 @@
   "jsdelivr": "dist/iife/index.js",
   "exports": {
     ".": {
-      "default": "./dist/esm/index.js",
       "import": "./dist/esm/index.js",
-      "require": "./dist/cjs/index.js"
+      "require": "./dist/cjs/index.js",
+      "default": "./dist/esm/index.js"
     }
   },
   "source": "src/index.js",
@@ -22,24 +22,24 @@
   ],
   "scripts": {
     "copy:package:cjs": "cp ../../build/package-cjs.json dist/cjs/package.json",
-    "build:esm": "npx esbuild src/*.js --target=es2017 --format=esm --outdir=dist/esm",
-    "build:cjs": "npx esbuild src/*.js --target=node16 --format=cjs --outdir=dist/cjs",
-    "build:iife": "npx esbuild src/*.js --target=node16 --format=iife --outdir=dist/iife",
+    "build:esm": "npx cross-env NODE_ENV=$NODE_ENV npx esbuild src/*.js --target=es2017 --format=esm --outdir=dist/esm",
+    "build:cjs": "npx cross-env NODE_ENV=$NODE_ENV npx esbuild src/*.js --target=node16 --format=cjs --outdir=dist/cjs",
+    "build:iife": "npx cross-env NODE_ENV=$NODE_ENV npx esbuild src/*.js --target=node16 --format=iife --outdir=dist/iife",
     "build": "rimraf -I dist; npm run build:cjs; npm run build:esm",
     "prepublish": "npm run build; npm run copy:package:cjs"
   },
   "dependencies": {
-    "@domql/emotion": "^2.27.0",
-    "@domql/event": "^2.27.0",
-    "@domql/report": "^2.27.0",
-    "@domql/router": "^2.27.0",
-    "@symbo.ls/fetch": "^2.27.0",
-    "@symbo.ls/init": "^2.27.0",
-    "@symbo.ls/scratch": "^2.27.0",
-    "@symbo.ls/sync": "^2.27.0",
-    "@symbo.ls/uikit": "^2.27.0",
-    "@symbo.ls/utils": "^2.27.0",
-    "domql": "^2.27.0"
+    "@domql/emotion": "^2.27.10",
+    "@domql/event": "^2.27.10",
+    "@domql/report": "^2.27.10",
+    "@domql/router": "^2.27.10",
+    "@symbo.ls/fetch": "^2.27.10",
+    "@symbo.ls/init": "^2.27.10",
+    "@symbo.ls/scratch": "^2.27.10",
+    "@symbo.ls/sync": "^2.27.10",
+    "@symbo.ls/uikit": "^2.27.10",
+    "@symbo.ls/utils": "^2.27.10",
+    "domql": "^2.27.10"
   },
   "devDependencies": {
     "@babel/core": "^7.26.0"

package/src/createDomql.js

@@ -5,9 +5,14 @@ import * as uikit from '@symbo.ls/uikit'
 
 import { isString, isNode, isObject } from '@domql/utils'
 import { initAnimationFrame } from '@domql/event'
-import { defaultDefine } from './define'
-import { initRouter } from './router'
-import { initializeExtend, initializeInspect, initializeNotifications, initializeSync } from './syncExtend'
+import { defaultDefine } from './define.js'
+import { initRouter } from './router.js'
+import {
+  initializeExtend,
+  initializeInspect,
+  initializeNotifications,
+  initializeSync
+} from './syncExtend.js'
 
 import {
   prepareComponents,
@@ -19,14 +24,17 @@ import {
   prepareState,
   prepareUtils,
   prepareMethods
-} from './prepare'
+} from './prepare.js'
 
 export const prepareContext = (app, context = {}) => {
   // const rcFileKey = process?.env?.SYMBOLS_KEY
-  const key = context.key = context.key || (isString(app) ? app : 'smblsapp')
+  const key = (context.key = context.key || (isString(app) ? app : 'smblsapp'))
   context.define = context.define || defaultDefine
   context.window = prepareWindow(context)
-  const [scratcDesignSystem, emotion, registry] = prepareDesignSystem(key, context)
+  const [scratcDesignSystem, emotion, registry] = prepareDesignSystem(
+    key,
+    context
+  )
   context.designSystem = scratcDesignSystem
   context.registry = registry
   context.emotion = emotion
@@ -65,12 +73,15 @@ export const createDomqlElement = async (app, ctx) => {
   app.data = app.data || {}
   app.data.frameListeners = initAnimationFrame(ctx)
 
-  prepareRequire({
-    functions: ctx.functions,
-    utils: ctx.utils,
-    snippets: ctx.snippets,
-    ...ctx.files
-  }, ctx)
+  prepareRequire(
+    {
+      functions: ctx.functions,
+      utils: ctx.utils,
+      snippets: ctx.snippets,
+      ...ctx.files
+    },
+    ctx
+  )
 
   initializeSync(app, ctx)
   initializeInspect(app, ctx)

package/src/index.js

@@ -2,36 +2,57 @@
 
 import { deepMerge, isObject, isUndefined } from '@domql/utils'
 
-import * as utils from './utilImports'
+import * as utils from './utilImports.js'
 
-import { popStateRouter } from './router'
-import { fetchAsync, fetchSync } from './ferchOnCreate'
+import { popStateRouter } from './router.js'
+import { fetchAsync, fetchSync } from './ferchOnCreate.js'
 
-import DEFAULT_CREATE_OPTIONS from './options'
-import DYNAMIC_JSON from '@symbo.ls/init/dynamic.json'
-import { createDomqlElement } from './createDomql'
+import DEFAULT_CREATE_OPTIONS from './options.js'
+import DYNAMIC_JSON from '@symbo.ls/init/dynamic.json' with { type: 'json' }
+import { createDomqlElement } from './createDomql.js'
 
-const mergeWithLocalFile = (options, optionsExternalFile) => deepMerge(
-  options,
-  isObject(optionsExternalFile) ? optionsExternalFile : DYNAMIC_JSON || {}
-)
+const mergeWithLocalFile = (options, optionsExternalFile) =>
+  deepMerge(
+    options,
+    isObject(optionsExternalFile) ? optionsExternalFile : DYNAMIC_JSON || {}
+  )
 
-export const create = (App, options = DEFAULT_CREATE_OPTIONS, optionsExternalFile) => {
-  const redefinedOptions = { ...DEFAULT_CREATE_OPTIONS, ...mergeWithLocalFile(options, optionsExternalFile) }
+export const create = (
+  App,
+  options = DEFAULT_CREATE_OPTIONS,
+  optionsExternalFile
+) => {
+  const redefinedOptions = {
+    ...DEFAULT_CREATE_OPTIONS,
+    ...mergeWithLocalFile(options, optionsExternalFile)
+  }
 
   const domqlApp = createDomqlElement(App, redefinedOptions)
 
   popStateRouter(domqlApp, redefinedOptions)
 
-  if (redefinedOptions.on && redefinedOptions.on.create) redefinedOptions.on.create(domqlApp, domqlApp.state, domqlApp.context, redefinedOptions)
+  if (redefinedOptions.on && redefinedOptions.on.create)
+    redefinedOptions.on.create(
+      domqlApp,
+      domqlApp.state,
+      domqlApp.context,
+      redefinedOptions
+    )
 
   return domqlApp
 }
 
-export const createAsync = (App, options = DEFAULT_CREATE_OPTIONS, optionsExternalFile) => {
+export const createAsync = (
+  App,
+  options = DEFAULT_CREATE_OPTIONS,
+  optionsExternalFile
+) => {
   const domqlApp = create(App, options, optionsExternalFile)
 
-  const redefinedOptions = { ...DEFAULT_CREATE_OPTIONS, ...mergeWithLocalFile(options, optionsExternalFile) }
+  const redefinedOptions = {
+    ...DEFAULT_CREATE_OPTIONS,
+    ...mergeWithLocalFile(options, optionsExternalFile)
+  }
   // const SYMBOLS_KEY = process.env.SYMBOLS_KEY
   const key = redefinedOptions.key
   fetchAsync(domqlApp, key, { utils, ...redefinedOptions })
@@ -39,20 +60,37 @@ export const createAsync = (App, options = DEFAULT_CREATE_OPTIONS, optionsExtern
   return domqlApp
 }
 
-export const createSync = async (App, options = DEFAULT_CREATE_OPTIONS, optionsExternalFile) => {
-  const redefinedOptions = { ...DEFAULT_CREATE_OPTIONS, ...mergeWithLocalFile(options, optionsExternalFile) }
+export const createSync = async (
+  App,
+  options = DEFAULT_CREATE_OPTIONS,
+  optionsExternalFile
+) => {
+  const redefinedOptions = {
+    ...DEFAULT_CREATE_OPTIONS,
+    ...mergeWithLocalFile(options, optionsExternalFile)
+  }
 
   // const SYMBOLS_KEY = process.env.SYMBOLS_KEY
   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))
+  if (redefinedOptions.on && redefinedOptions.on.create)
+    await redefinedOptions.on.create(
+      domqlApp,
+      domqlApp.state,
+      domqlApp.context,
+      redefinedOptions
+    )
 
   return domqlApp
 }
 
-export const createSkeleton = (App = {}, options = DEFAULT_CREATE_OPTIONS, optionsExternalFile) => {
+export const createSkeleton = (
+  App = {},
+  options = DEFAULT_CREATE_OPTIONS,
+  optionsExternalFile
+) => {
   return create(
     {
       deps: { isUndefined },

package/src/initEmotion.js

@@ -5,7 +5,7 @@ import { emotion as defaultEmotion } from '@symbo.ls/emotion'
 import { init } from '@symbo.ls/init'
 import { deepClone, deepMerge } from '@domql/utils'
 
-import { DESIGN_SYSTEM_OPTIONS } from './options'
+import { DESIGN_SYSTEM_OPTIONS } from './options.js'
 import { DEFAULT_CONFIG } from '@symbo.ls/default-config'
 
 export const initEmotion = (key, options = {}) => {
@@ -15,10 +15,12 @@ export const initEmotion = (key, options = {}) => {
 
   if (!initOptions.emotion) initOptions.emotion = defaultEmotion
 
-  const registry = options.registry || transformDOMQLEmotion(initOptions.emotion, options)
-  const designSystem = (initOptions.useDefaultConfig || options.designSystem?.useDefaultConfig)
-    ? deepMerge(options.designSystem, deepClone(DEFAULT_CONFIG))
-    : options.designSystem || deepClone(DEFAULT_CONFIG)
+  const registry =
+    options.registry || transformDOMQLEmotion(initOptions.emotion, options)
+  const designSystem =
+    initOptions.useDefaultConfig || options.designSystem?.useDefaultConfig
+      ? deepMerge(options.designSystem, deepClone(DEFAULT_CONFIG))
+      : options.designSystem || deepClone(DEFAULT_CONFIG)
 
   const scratchSystem = init(designSystem, {
     key,

package/src/options.js

@@ -1,6 +1,6 @@
 'use strict'
 
-import { defaultDefine } from './define'
+import { defaultDefine } from './define.js'
 
 export const DESIGN_SYSTEM_OPTIONS = {
   useReset: true,

package/src/prepare.js

@@ -5,19 +5,20 @@ import {
   deepMerge,
   deepClone,
   merge,
-  checkIfKeyIsComponent
+  checkIfKeyIsComponent,
+  isDevelopment
 } from '@domql/utils'
-import { initEmotion } from './initEmotion'
+import { initEmotion } from './initEmotion.js'
 
 import * as uikit from '@symbo.ls/uikit'
-import * as utils from './utilImports'
+import * as utils from './utilImports.js'
 import * as routerUtils from '@domql/router'
 
-const ENV = process.env.NODE_ENV
+// @preserve-env
 
-export const prepareWindow = (context) => {
-  if (typeof (window) === 'undefined') window = globalThis || {} // eslint-disable-line
-  if (typeof (document) === 'undefined') {
+export const prepareWindow = context => {
+  if (typeof window === 'undefined') window = globalThis || {} // eslint-disable-line
+  if (typeof document === 'undefined') {
     if (!window.document) window.document = globalThis.document || { body: {} }
     document = window.document // eslint-disable-line
   }
@@ -44,20 +45,34 @@ export const UIkitWithPrefix = () => {
 }
 
 export const prepareComponents = context => {
-  return context.components ? { ...UIkitWithPrefix(), ...context.components } : UIkitWithPrefix()
+  return context.components
+    ? { ...UIkitWithPrefix(), ...context.components }
+    : UIkitWithPrefix()
 }
 
 export const prepareUtils = context => {
-  return { ...utils, ...routerUtils, ...utils.scratchUtils, ...context.utils, ...context.snippets, ...context.functions }
+  return {
+    ...utils,
+    ...routerUtils,
+    ...utils.scratchUtils,
+    ...context.utils,
+    ...context.snippets,
+    ...context.functions
+  }
 }
 
-export const prepareMethods = (context) => {
+export const prepareMethods = context => {
   return {
     ...(context.methods || {}),
     require: context.utils.require,
     requireOnDemand: context.utils.requireOnDemand,
     call: function (fnKey, ...args) {
-      return (context.utils[fnKey] || context.functions[fnKey] || context.methods[fnKey] || context.snippets[fnKey])?.call(this, ...args)
+      return (
+        context.utils[fnKey] ||
+        context.functions[fnKey] ||
+        context.methods[fnKey] ||
+        context.snippets[fnKey]
+      )?.call(this, ...args)
     }
   }
 }
@@ -77,7 +92,7 @@ export const prepareDependencies = ({
       continue
     }
 
-    const random = ENV === 'development' ? `?${Math.random()}` : ''
+    const random = isDevelopment() ? `?${Math.random()}` : ''
     let url = `https://pkg.symbo.ls/${dependency}/${version}.js${random}`
 
     if (dependency.split('/').length > 2 || !onlyDotsAndNumbers(version)) {
@@ -113,7 +128,7 @@ export const prepareRequire = (packages, ctx) => {
     const documentOpts = ctx.document || document
     const windowOpts = ctx.window || window
     if (!windowOpts.packages[key]) {
-      const random = ENV === 'development' ? `?${Math.random()}` : ''
+      const random = isDevelopment() ? `?${Math.random()}` : ''
       if (dependenciesOnDemand && dependenciesOnDemand[key]) {
         const version = dependenciesOnDemand[key]
         const url = `https://pkg.symbo.ls/${key}/${version}.js${random}`