lilact 0.31.7 → 0.31.9

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: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>
+</div></div></li></ul></li></ul></div><aside class="tsd-sources"><ul><li>Defined in components.jsx:1576</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/lilact.development.js

@@ -1709,6 +1709,7 @@ __export(symbols_exports, {
   CALLBACK: () => CALLBACK,
   CHILD_CLASS_ADDENDUM: () => CHILD_CLASS_ADDENDUM,
   CLEARED: () => CLEARED,
+  CLONED_STYLE: () => CLONED_STYLE,
   COMPONENT: () => COMPONENT,
   CORE: () => CORE,
   DUE: () => DUE,
@@ -1731,6 +1732,7 @@ var [
   CHILD_CLASS_ADDENDUM,
   MEMOIZED,
   LAZY,
+  CLONED_STYLE,
   DUE,
   REPEAT,
   CLEARED,
@@ -1747,6 +1749,7 @@ var [
   /* @__PURE__ */ Symbol.for("LILACT:CHILD_CLASS_ADDENDUM"),
   /* @__PURE__ */ Symbol.for("LILACT:MEMOIZED"),
   /* @__PURE__ */ Symbol.for("LILACT:LAZY"),
+  /* @__PURE__ */ Symbol.for("LILACT:CLONED_STYLE"),
   /* @__PURE__ */ Symbol.for("LILACT:TIMERS:DUE"),
   /* @__PURE__ */ Symbol.for("LILACT:TIMERS:REPEAT"),
   /* @__PURE__ */ Symbol.for("LILACT:TIMERS:CLEARED"),
@@ -1936,7 +1939,6 @@ function getComponentUnderPointer() {
   });
   const overlay = document.createElement("div");
   overlay.style.cssText = "position:fixed;inset:0;z-index:2147483647;cursor:crosshair;background:transparent;";
-  document.body.appendChild(overlay);
   function click_handler(event) {
     event.stopImmediatePropagation();
     window.removeEventListener("click", click_handler, true);
@@ -1949,7 +1951,10 @@ function getComponentUnderPointer() {
     resolve_func(t[COMPONENT]);
     return false;
   }
-  window.addEventListener("click", click_handler, true);
+  setTimeout(() => {
+    document.body.appendChild(overlay);
+    window.addEventListener("click", click_handler, true);
+  }, 50);
   return pr;
 }
 function isEmpty(value) {
@@ -2543,7 +2548,7 @@ var ComponentCache = class {
         if (ex.cleanup) {
           ex.cleanup();
         } else if (ex.element && !ex.portal) {
-          ex.element.parentElement.removeChild(ex.element);
+          ex.element.parentElement?.removeChild?.(ex.element);
         }
       });
     });
@@ -2610,6 +2615,9 @@ var ComponentCore = class {
             ...next_props || {}
           };
         }
+        if (next_props?.style && typeof next_props.style === "object" && !next_props.style[CLONED_STYLE]) {
+          next_props.style = { ...next_props.style, [CLONED_STYLE]: true };
+        }
         if (this?.parent?.component?.context || this?.parent?.component?.getChildContext) {
           this.context = { ...this.parent.component.context, ...this.parent.component.getChildContext?.() };
           if (this.component.constructor.contextTypes) {
@@ -2717,7 +2725,7 @@ var ComponentCore = class {
         if (typeof this.props.ref === "function") {
           this.props.ref(null);
         } else {
-          this.props.current = null;
+          this.props.ref.current = null;
         }
       }
       if (this.component.componentWillUnmount) {
@@ -2811,7 +2819,7 @@ var ComponentCore = class {
                 this.element.style = "";
               } else {
                 for (let p in this.props.style) {
-                  if (!patch.style.hasOwnProperty(p)) {
+                  if (p !== CLONED_STYLE && !patch?.style?.hasOwnProperty?.(p)) {
                     this.element.style[p] = "";
                   }
                 }
@@ -2833,7 +2841,7 @@ var ComponentCore = class {
           }
         } else if (a === "autoFocus") {
           this.element["autofocus"] = toBool(patch[a]);
-        } else if (a === "htmlFor") {
+        } else if (a === "htmlFor" || a === "for") {
           this.element.setAttribute("for", patch[a]);
         } else if (al !== "value" || ["input", "textarea", "select"].indexOf(this.entity) === -1) {
           this.element.setAttribute(al, patch[a]);
@@ -3719,8 +3727,7 @@ function useActionState(action, initialState) {
         async () => {
           const form_data = new FormData(event.target, event.submitter);
           hk.state = await action(hk.state, form_data);
-        },
-        []
+        }
       );
       return false;
     };
@@ -7213,14 +7220,15 @@ if (true) {
   });
 }
 if (true) {
-  console.log(`Lilact (Version: ${Lilact2.VERSION}) - Debug Mode`);
-  console.log(`Copyright(C) 2024-2026 Arash Kazemi <contact.arash.kazemi@gmail.com>`);
+  console.info(`Lilact (Version: ${Lilact2.VERSION}) - Debug Mode`);
+  console.info(`Copyright(C) 2024-2026 Arash Kazemi <contact.arash.kazemi@gmail.com>`);
 }
 export {
   ARGS,
   CALLBACK,
   CHILD_CLASS_ADDENDUM,
   CLEARED,
+  CLONED_STYLE,
   COMPONENT,
   CORE,
   CSSTransition,