lilact 0.31.6 → 0.31.7

package/docs/variables/components.cloneElement.html

@@ -20,4 +20,4 @@ children.</p>
 </div><div class="tsd-tag-example"><h4 class="tsd-anchor-link" id="example-1">Example<a href="#example-1" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h4><pre><code class="ts"><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-7">panel</span><span class="hl-1"> = &lt;</span><span class="hl-8">Panel</span><span class="hl-1"> </span><span class="hl-8">className</span><span class="hl-1">=</span><span class="hl-2">&quot;compact&quot;</span><span class="hl-1">&gt;</span><span class="hl-5">Old</span><span class="hl-1"> </span><span class="hl-5">content</span><span class="hl-1">&lt;/</span><span class="hl-5">Panel</span><span class="hl-1">&gt;;</span><br/><br/><span class="hl-6">// Existing children are replaced when children are provided.</span><br/><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-7">updatedPanel</span><span class="hl-1"> = </span><span class="hl-0">cloneComponent</span><span class="hl-1">(</span><br/><span class="hl-1">  </span><span class="hl-5">panel</span><span class="hl-1">,</span><br/><span class="hl-1">  { </span><span class="hl-5">className:</span><span class="hl-1"> </span><span class="hl-2">&#39;expanded&#39;</span><span class="hl-1"> },</span><br/><span class="hl-1">  &lt;</span><span class="hl-8">Heading</span><span class="hl-1">&gt;</span><span class="hl-5">New</span><span class="hl-1"> </span><span class="hl-5">content</span><span class="hl-1">&lt;/</span><span class="hl-5">Heading</span><span class="hl-1">&gt;</span><br/><span class="hl-1">);</span>
 </code><button type="button">Copy</button></pre>
 
-</div></div></li></ul></li></ul></div><aside class="tsd-sources"><ul><li>Defined in components.jsx:1520</li></ul></aside></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg><h3>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html">Lilact</a><ul class="tsd-small-nested-navigation" id="tsd-nav-container"><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
+</div></div></li></ul></li></ul></div><aside class="tsd-sources"><ul><li>Defined in components.jsx:1572</li></ul></aside></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg><h3>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html">Lilact</a><ul class="tsd-small-nested-navigation" id="tsd-nav-container"><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>

package/examples/demos/error-callback.jsx

@@ -5,7 +5,7 @@ export default function() {
             Press to get Error! (With Curly Brackets)
           </button>
           <br/><br/>
-          <button onClick={()=>doUnknown()}>
+          <button onClick={  ()   =>     doUnknown    ()    }>
             Press to get Error! (Without Curly Brackets)
           </button>
 
@@ -16,14 +16,12 @@ export default function() {
             JS runtimes currently lack a consistent reporting mechanism for errors produced in eval,
             and as Lilact runs the transpiled JSX in eval, tracing errors has its own difficulties.
             <br/><br/>
-            At the moment things work pretty nice and errors are tracked to the JSX scripts in
-            {" "}<b>Firefox</b>{" "}and{" "}<b>Chrome</b>{" "}, but{" "}<b>Safari</b>{" "}
-            has problems sometimes, as it drops the eval frame data on async or deferred calls.
-            <br/><br/>
-            Lilact has a tracking mechanism to overcome this, but for the sake of efficiency, 
-            it is block-based and only locates the code that is in  {" {} "} blocks. As a result, the callbacks
-            should be wrapped in a {" {} "} to be tracable in Safari. If not, it works, 
-            but it is not possible to display the exact location of some errors in Safari.</p>
+            Lilact has a tracing mechanism to overcome this, but for the sake of efficiency, 
+            it is block-based and only locates the code that is in  {" {} "} blocks. As a result, the 
+            arrow callbacks should be wrapped in a {" {} "} (and return result if any) or be defined 
+            somewhere else in the code (like useCallback) and only referenced from XML to be traceable 
+            in all situations. If not, it works, but it is not possible to display the exact location 
+            of some errors.</p>
           </center>
 
 }

package/examples/lilact.development.js

@@ -2379,6 +2379,21 @@ function getComponentEntity(entity) {
   return entity?.[MEMOIZED] ? entity.component : entity;
 }
 var hotEntityAliases = /* @__PURE__ */ new Map();
+var hotEntityCacheTokens = /* @__PURE__ */ new WeakMap();
+function getHotEntityCacheToken(entity) {
+  entity = getComponentEntity(entity);
+  if (typeof entity !== "function") {
+    return entity;
+  }
+  let token2 = hotEntityCacheTokens.get(entity);
+  if (!token2) {
+    const resolved = resolveHotEntity(entity);
+    token2 = hotEntityCacheTokens.get(resolved) || {};
+    hotEntityCacheTokens.set(entity, token2);
+    hotEntityCacheTokens.set(resolved, token2);
+  }
+  return token2;
+}
 function resolveHotEntity(entity) {
   entity = getComponentEntity(entity);
   const visited = /* @__PURE__ */ new Set();
@@ -2434,6 +2449,9 @@ function replaceComponentEntity(componentCore, nextEntity) {
   }
   const oldEntity = getComponentEntity(componentCore.entity);
   const newEntity = resolveHotEntity(nextEntity);
+  const cacheToken = hotEntityCacheTokens.get(oldEntity) || hotEntityCacheTokens.get(newEntity) || {};
+  hotEntityCacheTokens.set(oldEntity, cacheToken);
+  hotEntityCacheTokens.set(newEntity, cacheToken);
   if (oldEntity === newEntity) {
     return true;
   }
@@ -2463,6 +2481,9 @@ function replaceAllComponentInstances(oldEntity, newEntity) {
   if (oldEntity === newEntity) {
     return 0;
   }
+  const cacheToken = hotEntityCacheTokens.get(oldEntity) || hotEntityCacheTokens.get(newEntity) || {};
+  hotEntityCacheTokens.set(oldEntity, cacheToken);
+  hotEntityCacheTokens.set(newEntity, cacheToken);
   hotEntityAliases.set(oldEntity, newEntity);
   const instances = componentInstances.get(oldEntity);
   if (!instances) {
@@ -2576,14 +2597,18 @@ var ComponentCore = class {
       if (do_rerender) {
         if (true) {
           if (this.entity?.propTypes) {
-            PropTypes.checkPropTypes(this.entity.propTypes, this.props, "prop", this.entity.name);
+            PropTypes.checkPropTypes(this.entity.propTypes, next_props, "prop", this.entity.name);
           } else if (this.component?.propTypes) {
-            PropTypes.checkPropTypes(this.component.propTypes, this.props, "prop", this.component.name);
+            PropTypes.checkPropTypes(this.component.propTypes, next_props, "prop", this.component.name);
           }
         }
         if (typeof next_state === "function") next_state = next_state(this.state);
-        if (this.component.constructor.defaultProps) {
-          next_props = { ...this.component.constructor.defaultProps, ...next_props };
+        const defaultProps = this.entity?.defaultProps || this.component?.constructor?.defaultProps;
+        if (defaultProps) {
+          next_props = {
+            ...defaultProps,
+            ...next_props || {}
+          };
         }
         if (this?.parent?.component?.context || this?.parent?.component?.getChildContext) {
           this.context = { ...this.parent.component.context, ...this.parent.component.getChildContext?.() };
@@ -2997,11 +3022,22 @@ function prepareCore(parent, core) {
   try {
     parent.cache ?? (parent.cache = new ComponentCache(parent));
     const isText = core[TEXT2] !== void 0;
-    const key = isText ? ":text:" : core.props?.key;
-    const entity = isText || core instanceof ComponentCore ? void 0 : core.entity;
+    const isExistingCore = core instanceof ComponentCore;
+    const entity = isText || isExistingCore ? void 0 : resolveHotEntity(core.entity);
+    const hasExplicitKey = !isText && core.props && core.props.key !== void 0 && core.props.key !== null;
+    let key;
+    if (isText) {
+      key = ":text:";
+    } else if (hasExplicitKey) {
+      key = core.props.key;
+    } else if (typeof entity === "function") {
+      key = getHotEntityCacheToken(entity);
+    } else {
+      key = entity;
+    }
     return parent.cache.pick(
       key,
-      () => isText || core instanceof ComponentCore ? core : constructFunc(core, parent)[CORE],
+      () => isText || isExistingCore ? core : constructFunc(core, parent)[CORE],
       entity
     );
   } catch (e) {
@@ -3509,7 +3545,7 @@ function useState(initialValue) {
   }
   return [hk.value, hk.set_func];
 }
-function useCallback(callback, deps = void 0) {
+function useCallback(callback, deps) {
   if (deps !== void 0 && !Array.isArray(deps) && deps !== null && typeof deps !== "object") {
     throw new Error("Callback dependencies must be an array, object  or omitted.");
   }
@@ -3601,7 +3637,7 @@ function useRef(initialValue = null) {
   }
   return hk;
 }
-async function useLayoutEffect(effect, deps = void 0) {
+async function useLayoutEffect(effect, deps) {
   if (deps !== void 0 && !Array.isArray(deps) && deps !== null && typeof deps !== "object") {
     throw new Error("Layout effect dependencies must be an array, object or omitted.");
   }
@@ -3620,7 +3656,7 @@ async function useLayoutEffect(effect, deps = void 0) {
   NATIVE_TIMERS.clearTimeout(lilact_default.effect_timeout);
   lilact_default.effect_timeout = NATIVE_TIMERS.setTimeout(lilact_default.processEffects, 0);
 }
-async function useEffect(effect, deps = void 0) {
+async function useEffect(effect, deps) {
   if (deps !== void 0 && !Array.isArray(deps) && deps !== null && typeof deps !== "object") {
     throw new Error("Effect dependencies must be an array, object or omitted.");
   }
@@ -3639,7 +3675,7 @@ async function useEffect(effect, deps = void 0) {
   NATIVE_TIMERS.clearTimeout(lilact_default.effect_timeout);
   lilact_default.effect_timeout = NATIVE_TIMERS.setTimeout(lilact_default.processEffects, 0);
 }
-async function useInsertionEffect(effect, deps = void 0) {
+async function useInsertionEffect(effect, deps) {
   if (deps !== void 0 && !Array.isArray(deps) && deps !== null && typeof deps !== "object") {
     throw new Error("Insertion effect dependencies must be an array, object, or omitted.");
   }
@@ -3658,7 +3694,7 @@ async function useInsertionEffect(effect, deps = void 0) {
   NATIVE_TIMERS.clearTimeout(lilact_default.effect_timeout);
   lilact_default.effect_timeout = NATIVE_TIMERS.setTimeout(lilact_default.processEffects, 0);
 }
-function useMemo(factory, deps = void 0) {
+function useMemo(factory, deps) {
   if (deps !== void 0 && !Array.isArray(deps) && deps !== null && typeof deps !== "object") {
     throw new Error("Memo dependencies must be an array or omitted.");
   }
@@ -3736,7 +3772,7 @@ function useDeferredValue(value, initialValue) {
   }, [value]);
   return deferred;
 }
-function useImperativeHandle(ref, factory, deps = void 0) {
+function useImperativeHandle(ref, factory, deps) {
   if (deps !== void 0 && ref?.deps !== void 0 && shallowEqual(deps, ref.deps)) return;
   ref.deps = deps;
   if (typeof ref?.current !== "object") {
@@ -3823,10 +3859,7 @@ function createModule(path2, {
     mappings: [],
     meta: {},
     exports: {},
-    // True only after the module has been successfully evaluated.
     loaded: false,
-    // The promise for the request currently loading this resource.
-    // This is deliberately stored on the module to deduplicate requests.
     request: void 0,
     error: void 0
   };