@symbo.ls/create 2.11.353 → 2.11.354

package/dist/cjs/bundle/index.js

@@ -209,7 +209,7 @@ var require_types = __commonJS({
     __export12(types_exports, {
       TYPES: () => TYPES,
       is: () => is,
-      isArray: () => isArray6,
+      isArray: () => isArray7,
       isBoolean: () => isBoolean,
       isDate: () => isDate,
       isDefined: () => isDefined3,
@@ -219,7 +219,7 @@ var require_types = __commonJS({
       isNumber: () => isNumber2,
       isObject: () => isObject12,
       isObjectLike: () => isObjectLike3,
-      isString: () => isString13,
+      isString: () => isString14,
       isUndefined: () => isUndefined9
     });
     module2.exports = __toCommonJS12(types_exports);
@@ -229,12 +229,12 @@ var require_types = __commonJS({
         return false;
       return typeof arg === "object" && arg.constructor === Object;
     };
-    var isString13 = (arg) => typeof arg === "string";
+    var isString14 = (arg) => typeof arg === "string";
     var isNumber2 = (arg) => typeof arg === "number";
     var isFunction4 = (arg) => typeof arg === "function";
     var isBoolean = (arg) => arg === true || arg === false;
     var isNull = (arg) => arg === null;
-    var isArray6 = (arg) => Array.isArray(arg);
+    var isArray7 = (arg) => Array.isArray(arg);
     var isDate = (d) => d instanceof Date;
     var isObjectLike3 = (arg) => {
       if (arg === null)
@@ -242,16 +242,16 @@ var require_types = __commonJS({
       return typeof arg === "object";
     };
     var isDefined3 = (arg) => {
-      return isObject12(arg) || isObjectLike3(arg) || isString13(arg) || isNumber2(arg) || isFunction4(arg) || isArray6(arg) || isObjectLike3(arg) || isBoolean(arg) || isDate(arg) || isNull(arg);
+      return isObject12(arg) || isObjectLike3(arg) || isString14(arg) || isNumber2(arg) || isFunction4(arg) || isArray7(arg) || isObjectLike3(arg) || isBoolean(arg) || isDate(arg) || isNull(arg);
     };
     var isUndefined9 = (arg) => {
       return arg === void 0;
     };
     var TYPES = {
       boolean: isBoolean,
-      array: isArray6,
+      array: isArray7,
       object: isObject12,
-      string: isString13,
+      string: isString14,
       date: isDate,
       number: isNumber2,
       null: isNull,
@@ -11791,14 +11791,16 @@ function findComponent(el) {
   if (!el || !el.__ref)
     return;
   const components = el.context.components;
+  const extendStr = returnStringExtend(el.extend);
+  const parentChildExtendStr = returnStringExtend(el.parent.childExtend);
   const __componentKey = el.__ref.__componentKey || "";
-  const componentKey = __componentKey.split("_")[0].split(".")[0].split("+")[0];
+  const componentKey = (__componentKey || extendStr || parentChildExtendStr).split("_")[0].split(".")[0].split("+")[0];
   if (componentKey && components[componentKey]) {
     return el;
   }
   return findComponent(el.parent);
 }
-var import_utils9, DevFocus, inspectOnKey;
+var import_utils9, DevFocus, returnStringExtend, inspectOnKey;
 var init_devFocus = __esm({
   "../socket-ui/devFocus.js"() {
     "use strict";
@@ -11814,6 +11816,7 @@ var init_devFocus = __esm({
       focus: {
         state: {},
         props: (el, s) => ({
+          transition: "all, defaultBezier, X",
           position: "fixed",
           hide: !s.area || !s.parent.debugging
         }),
@@ -11845,6 +11848,7 @@ var init_devFocus = __esm({
             color: "text",
             // color: 'blue',
             zIndex: "99999999",
+            transition: "all, defaultBezier, X",
             textDecoration: "underline",
             fontWeight: "500",
             top: "100%"
@@ -11905,15 +11909,23 @@ var init_devFocus = __esm({
           const component = findComponent(el);
           if (!component || !component.__ref.__componentKey || !state.debugging)
             return;
-          send.call(el.__ref.root.data.socket, "route", JSON.stringify({
+          const editor = el.context.editor;
+          if (editor && editor.onInspect) {
+            return editor.onInspect(component.__ref.__componentKey, el, el.state, { allowRouterWhileInspect: true });
+          }
+          send.call(el.context.socket, "route", JSON.stringify({
             componentKey: `${component.__ref.__componentKey}`
           }));
           return false;
         }
       }
     };
-    inspectOnKey = (app) => {
-      window.onkeydown = (ev) => {
+    returnStringExtend = (extend) => {
+      return (0, import_utils9.isString)(extend) ? extend : (0, import_utils9.isArray)(extend) ? extend.find((extItem) => (0, import_utils9.isString)(extItem)) : "";
+    };
+    inspectOnKey = (app, opts) => {
+      const windowOpts = opts.window || window;
+      windowOpts.onkeydown = (ev) => {
         if (ev.altKey && ev.shiftKey) {
           app.state.update({ debugging: true, preventSelect: true }, {
             preventContentUpdate: true,
@@ -11921,7 +11933,7 @@ var init_devFocus = __esm({
           });
         }
       };
-      window.onkeyup = (ev) => {
+      windowOpts.onkeyup = (ev) => {
         if ((!ev.altKey || !ev.shiftKey) && app.state.debugging) {
           app.focus.state.update({ area: false });
           app.state.update({ debugging: false, preventSelect: false }, {
@@ -12066,7 +12078,7 @@ var init_byld_socket = __esm({
       },
       on: {
         render: (el, s, ctx) => {
-          el.data.socket = connect(ctx.key, {
+          ctx.socket = connect(ctx.key, {
             source: isLocalhost ? "localhost" : "client",
             socketUrl: isLocalhost ? "localhost:13336" : "socket.symbols.app",
             location: import_globals.window.location.host,
@@ -12129,7 +12141,7 @@ var init_syncExtend = __esm({
         return;
       const inspect = (0, import_utils11.isUndefined)(editor.inspect) ? (0, import_utils11.isDevelopment)() : editor.inspect;
       if (inspect)
-        (0, import_socket_ui.inspectOnKey)(root);
+        (0, import_socket_ui.inspectOnKey)(root, options);
     };
   }
 });
@@ -16512,12 +16524,13 @@ var init_prepare = __esm({
     prepareUtils = (options) => {
       return { ...utils2, ...utils2.scratchUtils, ...options.snippets || options.utils || {} };
     };
-    preparePackages = (packages, options) => {
-      if (window.packages) {
-        window.packages = (0, import_utils15.merge)(window.packages, packages);
+    preparePackages = (packages, opts) => {
+      const windowOpts = opts.window || window;
+      if (windowOpts.packages) {
+        windowOpts.packages = (0, import_utils15.merge)(windowOpts.packages, packages);
       } else {
-        window.packages = packages;
-        window.require = (key) => window.packages[key];
+        windowOpts.packages = packages;
+        windowOpts.require = (key) => windowOpts.packages[key];
       }
     };
     prepareDesignSystem = (options, key) => {
@@ -16552,6 +16565,10 @@ var init_prepare = __esm({
           window.document = { body: {} };
         document = window.document;
       }
+      if (!options.window)
+        options.window = window;
+      if (!options.document)
+        options.document = document;
       return options.parent || options.document || document;
     };
   }
@@ -16637,6 +16654,7 @@ var init_createDomql = __esm({
           registry,
           emotion: emotion2,
           routerOptions,
+          socket: options.socket,
           editor: options.editor,
           document: doc
         }
@@ -18387,7 +18405,7 @@ var init_Icon = __esm({
         const { toCamelCase: toCamelCase2 } = context && context.utils;
         const iconName = props4.name || props4.icon || key;
         const camelCase = toCamelCase2(deps.isString(iconName) ? iconName : key);
-        const isArray6 = camelCase.split(/([a-z])([A-Z])/g);
+        const isArray7 = camelCase.split(/([a-z])([A-Z])/g);
         let activeIconName;
         if (props4.active) {
           activeIconName = props4[".active"].name || props4[".active"].icon;
@@ -18400,10 +18418,10 @@ var init_Icon = __esm({
           validIconName = activeIconName;
         if (ICONS[camelCase])
           validIconName = camelCase;
-        else if (ICONS[isArray6[0] + isArray6[1]])
-          validIconName = isArray6[0] + isArray6[1];
-        else if (ICONS[isArray6[0]])
-          validIconName = isArray6[0];
+        else if (ICONS[isArray7[0] + isArray7[1]])
+          validIconName = isArray7[0] + isArray7[1];
+        else if (ICONS[isArray7[0]])
+          validIconName = isArray7[0];
         else {
           if (verbose)
             console.warn("Can't find icon:", iconName, validIconName);
@@ -18926,8 +18944,8 @@ var init_Input = __esm({
         autocomplete: ({ props: props4 }) => props4.autocomplete,
         placeholder: ({ props: props4 }) => props4.placeholder,
         value: ({ props: props4, state, deps }) => {
-          const { isString: isString13, replaceLiteralsWithObjectFields: replaceLiteralsWithObjectFields2 } = deps;
-          if (isString13(props4.value) && props4.value.includes("{{")) {
+          const { isString: isString14, replaceLiteralsWithObjectFields: replaceLiteralsWithObjectFields2 } = deps;
+          if (isString14(props4.value) && props4.value.includes("{{")) {
             return replaceLiteralsWithObjectFields2(props4.value, state);
           }
           return props4.value;
@@ -23729,7 +23747,7 @@ var applyInspectListener2 = (root, options) => {
     return;
   const inspect = (0, import_utils33.isUndefined)(editor.inspect) ? (0, import_utils33.isDevelopment)() : editor.inspect;
   if (inspect)
-    inspectOnKey(root);
+    inspectOnKey(root, options);
 };
 
 // src/define.js
@@ -23844,12 +23862,13 @@ var prepareComponents2 = (options) => {
 var prepareUtils2 = (options) => {
   return { ...utilImports_exports, ...import_scratch2.scratchUtils, ...options.snippets || options.utils || {} };
 };
-var preparePackages2 = (packages, options) => {
-  if (window.packages) {
-    window.packages = (0, import_utils35.merge)(window.packages, packages);
+var preparePackages2 = (packages, opts) => {
+  const windowOpts = opts.window || window;
+  if (windowOpts.packages) {
+    windowOpts.packages = (0, import_utils35.merge)(windowOpts.packages, packages);
   } else {
-    window.packages = packages;
-    window.require = (key) => window.packages[key];
+    windowOpts.packages = packages;
+    windowOpts.require = (key) => windowOpts.packages[key];
   }
 };
 var prepareDesignSystem2 = (options, key) => {
@@ -23884,6 +23903,10 @@ var prepareDocument2 = (options) => {
       window.document = { body: {} };
     document = window.document;
   }
+  if (!options.window)
+    options.window = window;
+  if (!options.document)
+    options.document = document;
   return options.parent || options.document || document;
 };
 
@@ -23923,6 +23946,7 @@ var createDomqlElement2 = (App, options) => {
       registry,
       emotion: emotion2,
       routerOptions,
+      socket: options.socket,
       editor: options.editor,
       document: doc
     }

package/dist/cjs/createDomql.js

@@ -73,6 +73,7 @@ const createDomqlElement = (App, options) => {
       registry,
       emotion,
       routerOptions,
+      socket: options.socket,
       editor: options.editor,
       document: doc
     }

package/dist/cjs/prepare.js

@@ -68,12 +68,13 @@ const prepareComponents = (options) => {
 const prepareUtils = (options) => {
   return { ...utils, ...utils.scratchUtils, ...options.snippets || options.utils || {} };
 };
-const preparePackages = (packages, options) => {
-  if (window.packages) {
-    window.packages = (0, import_utils.merge)(window.packages, packages);
+const preparePackages = (packages, opts) => {
+  const windowOpts = opts.window || window;
+  if (windowOpts.packages) {
+    windowOpts.packages = (0, import_utils.merge)(windowOpts.packages, packages);
   } else {
-    window.packages = packages;
-    window.require = (key) => window.packages[key];
+    windowOpts.packages = packages;
+    windowOpts.require = (key) => windowOpts.packages[key];
   }
 };
 const prepareDesignSystem = (options, key) => {
@@ -108,5 +109,9 @@ const prepareDocument = (options) => {
       window.document = { body: {} };
     document = window.document;
   }
+  if (!options.window)
+    options.window = window;
+  if (!options.document)
+    options.document = document;
   return options.parent || options.document || document;
 };

package/dist/cjs/syncExtend.js

@@ -42,5 +42,5 @@ const applyInspectListener = (root, options) => {
     return;
   const inspect = (0, import_utils.isUndefined)(editor.inspect) ? (0, import_utils.isDevelopment)() : editor.inspect;
   if (inspect)
-    (0, import_socket_ui.inspectOnKey)(root);
+    (0, import_socket_ui.inspectOnKey)(root, options);
 };

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@symbo.ls/create",
-  "version": "2.11.353",
+  "version": "2.11.354",
   "license": "MIT",
-  "gitHead": "c5d01a30797fc044b539a5309a879f6b249e3888",
+  "gitHead": "353f21d352f69ac5a9b5bad4d72f379d272005ff",
   "files": [
     "src",
     "dist"

package/src/createDomql.js

@@ -49,6 +49,7 @@ export const createDomqlElement = (App, options) => {
       registry,
       emotion,
       routerOptions,
+      socket: options.socket,
       editor: options.editor,
       document: doc
     }

package/src/prepare.js

@@ -35,12 +35,13 @@ export const prepareUtils = options => {
   return { ...utils, ...utils.scratchUtils, ...(options.snippets || options.utils || {}) }
 }
 
-export const preparePackages = (packages, options) => {
-  if (window.packages) {
-    window.packages = merge(window.packages, packages)
+export const preparePackages = (packages, opts) => {
+  const windowOpts = opts.window || window
+  if (windowOpts.packages) {
+    windowOpts.packages = merge(windowOpts.packages, packages)
   } else {
-    window.packages = packages
-    window.require = (key) => window.packages[key]
+    windowOpts.packages = packages
+    windowOpts.require = (key) => windowOpts.packages[key]
   }
 }
 
@@ -76,5 +77,7 @@ export const prepareDocument = options => {
     if (!window.document) window.document = { body: {} }
     document = window.document // eslint-disable-line
   }
+  if (!options.window) options.window = window
+  if (!options.document) options.document = document
   return options.parent || options.document || document
 }

package/src/syncExtend.js

@@ -17,5 +17,5 @@ export const applyInspectListener = (root, options) => {
   const { editor } = options
   if (!editor) return
   const inspect = isUndefined(editor.inspect) ? isDevelopment() : editor.inspect
-  if (inspect) inspectOnKey(root)
+  if (inspect) inspectOnKey(root, options)
 }