lilact 0.29.3 → 0.30.1

package/docs/static/lilact.development.js

@@ -2350,6 +2350,7 @@ __export(components_exports, {
   current_component: () => current_component,
   effect_timeout: () => effect_timeout,
   events_set: () => events_set,
+  hotReloadRoot: () => hotReloadRoot,
   insertion_effects: () => insertion_effects,
   layout_effects: () => layout_effects,
   length_css_attributes_set: () => length_css_attributes_set,
@@ -2357,6 +2358,8 @@ __export(components_exports, {
   passive_effects: () => passive_effects,
   processEffects: () => processEffects,
   render: () => render,
+  replaceAllComponentInstances: () => replaceAllComponentInstances,
+  replaceComponentEntity: () => replaceComponentEntity,
   roots: () => roots,
   special_attributes: () => special_attributes,
   update_cbs: () => update_cbs,
@@ -2368,29 +2371,91 @@ var SVG_NS = "http://www.w3.org/2000/svg";
 function getComponentEntity(entity) {
   return entity?.[MEMOIZED] ? entity.component : entity;
 }
-function replaceComponentEntity(comp, nextEntity) {
-  const core = comp?.[CORE];
-  if (!core || typeof nextEntity !== "function") {
-    return;
+var componentInstances = /* @__PURE__ */ new Map();
+function registerComponentCore(core) {
+  const entity = getComponentEntity(core.entity);
+  if (typeof entity !== "function") return;
+  let instances = componentInstances.get(entity);
+  if (!instances) {
+    instances = /* @__PURE__ */ new Set();
+    componentInstances.set(entity, instances);
+  }
+  instances.add(core);
+  core.registered_entity = entity;
+}
+function unregisterComponentCore(core) {
+  const entity = core.registered_entity;
+  if (!entity) return;
+  const instances = componentInstances.get(entity);
+  if (instances) {
+    instances.delete(core);
+    if (instances.size === 0) {
+      componentInstances.delete(entity);
+    }
+  }
+  delete core.registered_entity;
+}
+function moveComponentCore(core, oldEntity, newEntity) {
+  const oldInstances = componentInstances.get(oldEntity);
+  if (oldInstances) {
+    oldInstances.delete(core);
+    if (oldInstances.size === 0) {
+      componentInstances.delete(oldEntity);
+    }
+  }
+  let newInstances = componentInstances.get(newEntity);
+  if (!newInstances) {
+    newInstances = /* @__PURE__ */ new Set();
+    componentInstances.set(newEntity, newInstances);
+  }
+  newInstances.add(core);
+  core.registered_entity = newEntity;
+}
+function replaceComponentEntity(componentCore, nextEntity) {
+  if (!componentCore || typeof nextEntity !== "function") {
+    return false;
   }
-  const oldEntity = getComponentEntity(core.entity);
+  const oldEntity = getComponentEntity(componentCore.entity);
   const newEntity = getComponentEntity(nextEntity);
   if (oldEntity === newEntity) {
-    return;
+    return true;
+  }
+  const component = componentCore.component;
+  if (!component) {
+    return false;
   }
-  const oldIsClass = isClass(oldEntity);
-  const newIsClass = isClass(newEntity);
-  if (oldIsClass !== newIsClass) {
+  if (typeof oldEntity !== "function" || typeof newEntity !== "function" || isClass(oldEntity) !== isClass(newEntity)) {
     return false;
   }
-  if (newIsClass) {
-    Object.setPrototypeOf(comp, newEntity.prototype);
+  if (isClass(newEntity)) {
+    Object.setPrototypeOf(component, newEntity.prototype);
   } else {
-    comp.render = newEntity.bind(comp);
+    component.render = newEntity.bind(component);
   }
-  core.entity = newEntity;
+  componentCore.entity = newEntity;
+  moveComponentCore(componentCore, oldEntity, newEntity);
   return true;
 }
+function replaceAllComponentInstances(oldEntity, newEntity) {
+  oldEntity = getComponentEntity(oldEntity);
+  newEntity = getComponentEntity(newEntity);
+  if (typeof oldEntity !== "function" || typeof newEntity !== "function") {
+    return 0;
+  }
+  const instances = componentInstances.get(oldEntity);
+  if (!instances) {
+    return 0;
+  }
+  let count = 0;
+  for (const core of [...instances]) {
+    if (!replaceComponentEntity(core, newEntity)) {
+      continue;
+    }
+    core.apply(core.props, core.state);
+    count++;
+  }
+  return count;
+}
 var ComponentCache = class {
   constructor(owner) {
     __publicField(this, "owner");
@@ -2400,36 +2465,34 @@ var ComponentCache = class {
     this.owner = owner;
   }
   pick(key, construct_func, nextEntity) {
-    var _a;
-    let comp;
+    let componentCore;
     let bucket = this.current_map.get(key);
-    const reusable = bucket && bucket.length > bucket[IDX];
-    if (reusable) {
-      comp = bucket[bucket[IDX]];
+    if (bucket && bucket.length > bucket[IDX]) {
+      componentCore = bucket[bucket[IDX]];
       bucket[IDX]++;
-      const oldEntity = getComponentEntity(comp?.[CORE]?.entity);
+      const oldEntity = getComponentEntity(componentCore.entity);
       const newEntity = getComponentEntity(nextEntity);
-      const incompatible = typeof oldEntity === "function" && typeof newEntity === "function" && isClass(oldEntity) !== isClass(newEntity);
+      const incompatible = typeof oldEntity !== typeof newEntity || typeof oldEntity === "function" && isClass(oldEntity) !== isClass(newEntity);
       if (incompatible) {
-        comp = construct_func();
-      } else {
-        replaceComponentEntity(comp, nextEntity);
+        componentCore = construct_func();
+      } else if (newEntity) {
+        replaceComponentEntity(componentCore, newEntity);
       }
     } else {
-      comp = construct_func();
+      componentCore = construct_func();
     }
     bucket = this.new_map.get(key);
-    if (bucket !== void 0) {
-      bucket.push(comp);
+    if (bucket) {
+      bucket.push(componentCore);
     } else {
-      bucket = [comp];
+      bucket = [componentCore];
       this.new_map.set(key, bucket);
       bucket[IDX] = 0;
     }
-    if (comp[CORE]) {
-      (_a = comp[CORE]).parent ?? (_a.parent = this.owner);
+    if (componentCore) {
+      componentCore.parent ?? (componentCore.parent = this.owner);
     }
-    return comp;
+    return componentCore;
   }
   commit() {
     this.current_map.forEach((arr) => {
@@ -2600,6 +2663,7 @@ var ComponentCore = class {
     }
   }
   async cleanup() {
+    unregisterComponentCore(this);
     try {
       const promises = [];
       if (this.props?.ref) {
@@ -2884,6 +2948,7 @@ function constructFunc(core, parent) {
         throw new Error("Error in constructing component.");
       }
       comp[CORE].entity = entity;
+      registerComponentCore(comp[CORE]);
       if (core.container) {
         comp[CORE].container = core.container;
       }
@@ -3170,9 +3235,26 @@ function createRoot(element) {
         root.cleanup();
         element.innerHTML = "";
       }
+    },
+    getCore() {
+      console.log(root, root[CORE]);
+      return root[CORE];
     }
   };
 }
+function hotReloadRoot(rootCore, nextEntity, props) {
+  if (!rootCore || !rootCore.component) {
+    throw new Error("Invalid root component.");
+  }
+  const replaced = replaceComponentEntity(rootCore, nextEntity);
+  if (!replaced) {
+    throw new Error(
+      "Cannot hot-reload the root from a class component to a function component, or vice versa."
+    );
+  }
+  rootCore.apply(props === void 0 ? rootCore.props : { ...rootCore.props, ...props });
+  return rootCore;
+}
 function createPortal(children, element) {
   return createComponent2(lilact_default.Portal, { "view": element }, children);
 }
@@ -3812,7 +3894,10 @@ function require2(path2) {
   return loadModule(path2, options2);
 }
 function makeImportsObject(mod, options2 = {}) {
-  mod.importsObject = {};
+  mod.importsObject ?? (mod.importsObject = {});
+  for (const key of Object.keys(mod.importsObject)) {
+    delete mod.importsObject[key];
+  }
   for (const path2 in mod.meta.imports) {
     const imps = mod.meta.imports[path2];
     const exps = loadModule(path2, {
@@ -3832,7 +3917,7 @@ function makeImportsObject(mod, options2 = {}) {
     for (const i2 of imps.import_defaults) {
       if (!Object.prototype.hasOwnProperty.call(exps, "default")) {
         throw new Error(
-          `Imported module does not export a default.`
+          "Imported module does not export a default."
         );
       }
       mod.importsObject[i2] = exps.default;
@@ -3841,9 +3926,26 @@ function makeImportsObject(mod, options2 = {}) {
       mod.importsObject[i2] = { ...exps };
     }
   }
+  return mod.importsObject;
+}
+function exportEntries(value) {
+  return value && typeof value === "object" ? value : { default: value };
+}
+function replaceReloadedExports(previousExports2, nextExports2) {
+  if (!previousExports2) return;
+  const oldExports = exportEntries(previousExports2);
+  const newExports = exportEntries(nextExports2);
+  for (const name of Object.keys(oldExports)) {
+    const oldExport = oldExports[name];
+    const newExport = newExports[name];
+    if (typeof oldExport === "function" && typeof newExport === "function") {
+      lilact_default.replaceAllComponentInstances(oldExport, newExport);
+    }
+  }
 }
 function run(jsx, path = `InlineJSX-${++lilact_default.eval_num}`, options = {}) {
   let module = required_scripts[path];
+  const previousExports = module?.loaded ? module.exports : void 0;
   if (!module) {
     module = createModule(path, {
       code: jsx
@@ -3855,7 +3957,6 @@ function run(jsx, path = `InlineJSX-${++lilact_default.eval_num}`, options = {})
     module.exports = {};
     module.loaded = false;
     module.error = void 0;
-    module.importsObject = void 0;
     module.meta = {};
   }
   let processed;
@@ -3867,8 +3968,7 @@ function run(jsx, path = `InlineJSX-${++lilact_default.eval_num}`, options = {})
       factory: "createComponent",
       appendSourcemap: true,
       injectTraceLabels: true,
-      produceCJS: false,
-      referentiateImports: true,
+      produceCJS: true,
       blocksInfo: lilact_default.blocksInfo
     });
   } catch (value) {
@@ -3887,11 +3987,11 @@ function run(jsx, path = `InlineJSX-${++lilact_default.eval_num}`, options = {})
     globalThis.Lilact = lilact_default;
     globalThis.createComponent = lilact_default.createComponent;
     globalThis.Fragment = lilact_default.Fragment;
-    makeImportsObject(module, options);
-    lilact_default.scriptImportsObject = module.importsObject;
     const result = eval(processed);
     module.loaded = true;
-    return isEmpty(module.exports) ? result : module.exports;
+    const nextExports = isEmpty(module.exports) ? result : module.exports;
+    replaceReloadedExports(previousExports, nextExports);
+    return nextExports;
   } catch (value) {
     const error2 = report(value, path);
     error2.sourcePhase ?? (error2.sourcePhase = "runtime");
@@ -6829,11 +6929,6 @@ function transpileJSX(jsx2, {
   injectTraceLabels = false,
   discardComments = false,
   produceCJS = false,
-  referentiateImports = false,
-  importsObject = "Lilact.scriptImportsObject",
-  // first letter must be capital so components work as expected
-  importsObjectVar = "LilactImports",
-  // first letter must be capital so components work as expected
   logErrors = false,
   // lilact internal
   mappings = [],
@@ -6912,22 +7007,11 @@ function transpileJSX(jsx2, {
   const flattened_nodes = [];
   const codify = (outlen, node3, is_attr = false, is_xml = false) => {
     flattened_nodes.push(node3);
-    if (typeof node3 !== "object") {
-      if (referentiateImports && typeof node3 === "string") {
-        if (meta?.imported_names.has(node3)) {
-          let j = flattened_nodes.length - 2;
-          while (typeof flattened_nodes[j] === "string" && flattened_nodes[j].trim() === "" || typeof flattened_nodes[j] === "object" && flattened_nodes[j].type === "comment") j--;
-          if (typeof flattened_nodes[j] !== "string" || flattened_nodes[j] !== ".") {
-            return importsObjectVar + "." + node3;
-          }
-        }
-      }
-      return node3;
-    }
-    if (node3 === null) return "";
+    if (typeof node3 !== "object") return node3;
+    if (!node3) return "";
     node3.out_index = outlen;
     if (node3.type === "string") return jsx2.substring(node3.begin, node3.end);
-    if (node3.type === "import") return referentiateImports ? "" : node3.cjs;
+    if (node3.type === "import") return node3.cjs;
     if (node3.type === "export") return node3.cjs;
     if (node3.type === "regex") return jsx2.substring(node3.begin, node3.end);
     if (node3.type === "comment") return discardComments || is_attr ? "" : jsx2.substring(node3.begin, node3.end);
@@ -6935,7 +7019,7 @@ function transpileJSX(jsx2, {
     if (node3.type === "parenthesis") {
       let out2 = "(";
       if (node3.out) {
-        if (produceCJS || referentiateImports) processImportExports(node3, jsx2, meta);
+        if (produceCJS) processImportExports(node3, jsx2, meta);
         for (const ch2 of node3.out) {
           out2 += codify(outlen + out2.length - 1, ch2);
         }
@@ -6945,7 +7029,7 @@ function transpileJSX(jsx2, {
     if (node3.type === "js") {
       let out2 = "";
       if (node3.out) {
-        if (produceCJS || referentiateImports) processImportExports(node3, jsx2, meta);
+        if (produceCJS) processImportExports(node3, jsx2, meta);
         for (const ch2 of node3.out) {
           if (is_xml && ch2.type === "comment") continue;
           out2 += codify(outlen + out2.length - (is_attr ? 1 : 0), ch2);
@@ -6960,9 +7044,6 @@ function transpileJSX(jsx2, {
       return out2;
     }
     if (node3.type === "xml") {
-      if (referentiateImports && meta?.imported_names?.has(node3.tag) && node3.tag[0] === node3.tag[0].toUpperCase()) {
-        node3.tag = importsObjectVar + "." + node3.tag;
-      }
       if (node3.tag.length === 0) {
         node3.tag = fragment;
       } else if (node3.tag[0] !== node3.tag[0].toUpperCase()) {
@@ -7000,9 +7081,6 @@ function transpileJSX(jsx2, {
   if (injectTraceLabels) {
     out = `/*LILACTBLOCK${++blocksInfo2.counter}:0,0:<EXEC>*/try{`;
   }
-  if (referentiateImports) {
-    out += `const ${importsObjectVar} = ${importsObject};`;
-  }
   out += codify(out.length, json);
   if (injectTraceLabels) {
     if (transpilerConfig.enableLabelStack) {
@@ -7020,7 +7098,7 @@ function transpileJSX(jsx2, {
 
 // .tmp/src/lilact.jsx
 var Lilact2 = {
-  VERSION: "RC.5",
+  VERSION: "RC.6",
   // Configuration
   defaultTransitionTimeout: 300,
   defaultIsEqual: Object.is,
@@ -7147,6 +7225,7 @@ export {
   getComponentByPointer,
   globalErrorHandler,
   grabTimers,
+  hotReloadRoot,
   id_num,
   insertion_effects,
   isAsync,
@@ -7167,6 +7246,8 @@ export {
   releaseSyntheticEvent,
   releaseTimers,
   render,
+  replaceAllComponentInstances,
+  replaceComponentEntity,
   require2 as require,
   required_scripts,
   resetTimers,