lilact 0.16.3 → 0.18.0

package/dist/lilact.development.js

@@ -1977,14 +1977,21 @@ __export(components_exports, {
   createElement: () => createElement,
   createRoot: () => createRoot,
   current_component: () => current_component,
+  effect_timeout: () => effect_timeout,
   events_set: () => events_set,
+  insertion_effects: () => insertion_effects,
   layout_effects: () => layout_effects,
   length_css_attributes_set: () => length_css_attributes_set,
+  memo: () => memo,
+  passive_effects: () => passive_effects,
+  processEffects: () => processEffects,
   render: () => render,
   roots: () => roots,
   special_attributes: () => special_attributes,
   update_cbs: () => update_cbs,
-  update_set: () => update_set
+  update_interval_margin: () => update_interval_margin,
+  update_set: () => update_set,
+  update_timeout: () => update_timeout
 });
 
 // .tmp/src/symbols.jsx
@@ -2036,11 +2043,10 @@ __export(misc_exports, {
   isEmpty: () => isEmpty,
   isError: () => isError2,
   isThenable: () => isThenable,
+  isValidComponent: () => isValidComponent,
   isValidElement: () => isValidElement,
   shallowEqual: () => shallowEqual,
-  toBool: () => toBool,
-  update_interval_margin: () => update_interval_margin,
-  update_timeout: () => update_timeout
+  toBool: () => toBool
 });
 var typeOf = (input) => {
   const rawObject = Object.prototype.toString.call(input).toLowerCase();
@@ -2048,9 +2054,10 @@ var typeOf = (input) => {
   const type = typeOfRegex.exec(rawObject)[1];
   return type;
 };
-var isValidElement = (value) => {
+var isValidComponent = (value) => {
   return value[CORE] !== void 0 || value[TEXT] !== void 0;
 };
+var isValidElement = isValidComponent;
 var findDOMNode = (component) => {
   var _a, _b;
   if (!((_b = (_a = component[CORE]) == null ? void 0 : _a.element) == null ? void 0 : _b.parentNode)) throw new Error("findDOMNode only works on mounted components.");
@@ -2130,7 +2137,7 @@ function isEmpty(value) {
   for (let i2 in value) return false;
   return true;
 }
-var shallowEqual = (source, target) => {
+var shallowEqual = (source, target, ignore) => {
   if (typeOf(source) !== typeOf(target)) {
     return false;
   }
@@ -2138,9 +2145,9 @@ var shallowEqual = (source, target) => {
     if (source.length !== target.length) {
       return false;
     }
-    return source.every((el, index2) => el === target[index2]);
+    return source.every((el, index2) => el === target[index2] || index2 === ignore);
   } else if (typeOf(source) === "object") {
-    return Object.keys(source).every((key) => source[key] === target[key]);
+    return Object.keys(source).every((key) => source[key] === target[key] || key === ignore);
   } else if (typeOf(source) === "date") {
     return source.getTime() === target.getTime();
   }
@@ -2193,8 +2200,6 @@ function toBool(value) {
   }
   return Boolean(value);
 }
-var update_timeout = void 0;
-var update_interval_margin = 0;
 var id_num = Math.floor(Math.random() * 1e4);
 var eval_num = 0;
 
@@ -2239,7 +2244,11 @@ var ComponentCache = class {
   commit() {
     this.current_map.forEach((arr) => {
       arr.slice(arr[IDX]).forEach((ex) => {
-        if (ex.cleanup) ex.cleanup();
+        if (ex.cleanup) {
+          ex.cleanup();
+        } else if (ex.element) {
+          ex.element.parentElement.removeChild(ex.element);
+        }
       });
     });
     this.current_map = this.new_map;
@@ -2277,116 +2286,116 @@ var ComponentCore = class {
     this.props = props || {};
   }
   /*
-  		//let do_rerender = true;
-  
-  		// if(this.outlet && this.entity[MEMOIZED]) {
-  		// 	if(shallowEqual(this.props, next_props)) do_rerender=false;
-  		// 	delete this.entity[MEMOIZED];
-  		// }
-  
-  		if(do_rerender) {
-  	*/
+  */
   // TODO: should componentDidUpdate be called after arranging/appending the outlet or before?
   apply(next_props = this.props, next_state = this.next_state || this.state) {
-    var _a, _b, _c, _d;
-    if (true) {
-      if ((_a = this.entity) == null ? void 0 : _a.propTypes) {
-        PropTypes.checkPropTypes(this.entity.propTypes, this.props, "prop", this.entity.name);
-      } else if ((_b = this.component) == null ? void 0 : _b.propTypes) {
-        PropTypes.checkPropTypes(this.component.propTypes, this.props, "prop", this.component.name);
+    var _a, _b, _c, _d, _e;
+    let do_rerender = true;
+    if (this.outlet && (this == null ? void 0 : this[MEMOIZED])) {
+      if (shallowEqual(this.props, next_props, "children") && shallowEqual((_a = this.props) == null ? void 0 : _a.children, next_props == null ? void 0 : next_props.children)) {
+        do_rerender = false;
       }
     }
-    if (typeof next_state === "function") next_state = next_state(this.state);
-    if (this.component.constructor.defaultProps) {
-      next_props = { ...this.component.constructor.defaultProps, ...next_props };
-    }
-    if (this.component.shouldComponentUpdate && !this.component.shouldComponentUpdate(next_state, next_props, this.context)) return;
-    if (typeof this.entity === "string") {
-      if (!(this.element instanceof Element)) {
-        this.element = document.createElement(this.entity);
-        if (next_props == null ? void 0 : next_props.defaultValue) this.element.value = String(next_props.defaultValue).slice(0, next_props == null ? void 0 : next_props.maxLength);
-        if (next_props == null ? void 0 : next_props.defaultChecked) this.element.checked = next_props.defaultChecked;
+    if (do_rerender) {
+      if (true) {
+        if ((_b = this.entity) == null ? void 0 : _b.propTypes) {
+          PropTypes.checkPropTypes(this.entity.propTypes, this.props, "prop", this.entity.name);
+        } else if ((_c = this.component) == null ? void 0 : _c.propTypes) {
+          PropTypes.checkPropTypes(this.component.propTypes, this.props, "prop", this.component.name);
+        }
       }
-      this.element[COMPONENT] = this.component;
-    }
-    if (next_props.ref) {
-      if (typeof next_props.ref === "function") {
-        next_props.ref(this.element || this.component);
-      } else {
-        next_props.ref.current = this.element || this.component;
+      if (typeof next_state === "function") next_state = next_state(this.state);
+      if (this.component.constructor.defaultProps) {
+        next_props = { ...this.component.constructor.defaultProps, ...next_props };
       }
-    }
-    if (next_props !== void 0 && this.component.componentWillReceiveProps) {
-      this.component.componentWillReceiveProps(next_props);
-    }
-    if (this.component.componentWillUpdate) {
-      this.component.componentWillUpdate(next_props, next_state);
-    }
-    const prev_state = this.state, prev_props = this.props;
-    if (this.element) {
-      this.updateElementProps(next_props);
-    }
-    this.props = next_props;
-    if (typeof this.next_state === "object") {
-      if (!this.state) this.state = { ...next_state };
-      else Object.assign(this.state, next_state);
-    } else if (this.next_state !== void 0) throw new Error("Component.setState only accepts objects or functions is new state.");
-    if (this.next_state) delete this.next_state;
-    if (this.hooks !== void 0) {
-      this.hook_index = 0;
-      lilact_default.current_component = [this, lilact_default.current_component];
-      try {
-        this.outlet = this.component.render(next_props, { current: this.element || this.component });
-      } catch (e) {
-        renderErrorHandler(this, e);
+      if (this.component.shouldComponentUpdate && !this.component.shouldComponentUpdate(next_state, next_props, this.context)) return;
+      if (typeof this.entity === "string") {
+        if (!(this.element instanceof Element)) {
+          this.element = document.createElement(this.entity);
+          if (next_props == null ? void 0 : next_props.defaultValue) this.element.value = String(next_props.defaultValue).slice(0, next_props == null ? void 0 : next_props.maxLength);
+          if (next_props == null ? void 0 : next_props.defaultChecked) this.element.checked = next_props.defaultChecked;
+        }
+        this.element[COMPONENT] = this.component;
       }
-      lilact_default.current_component = lilact_default.current_component[1];
-    } else {
-      try {
-        this.outlet = this.component.render({ current: this.element || this.component });
-      } catch (e) {
-        renderErrorHandler(this, e);
+      if (next_props.ref) {
+        if (typeof next_props.ref === "function") {
+          next_props.ref(this.element || this.component);
+        } else {
+          next_props.ref.current = this.element || this.component;
+        }
       }
-    }
-    if (((_d = (_c = this.outlet) == null ? void 0 : _c.constructor) == null ? void 0 : _d.name) !== "Array") {
-      this.outlet = [this.outlet];
-    }
-    this.outlet = [...this.outlet];
-    for (let i2 = 0; i2 < this.outlet.length; i2++) {
-      let item = this.outlet[i2];
-      if (item === void 0 || item === null || typeof item === "boolean") {
-        this.outlet.splice(i2, 1);
-        i2--;
-      } else if (typeof item === "function") {
-        const res2 = this.childFunctionHandler(item);
-        this.outlet.splice(i2, 1, res2);
-        i2--;
-      } else if (item.constructor.name === "Array") {
-        this.outlet.splice(i2, 1, ...item);
-        i2--;
+      if (next_props !== void 0 && this.component.componentWillReceiveProps) {
+        this.component.componentWillReceiveProps(next_props);
+      }
+      if (this.component.componentWillUpdate) {
+        this.component.componentWillUpdate(next_props, next_state);
+      }
+      const prev_state = this.state, prev_props = this.props;
+      if (this.element) {
+        this.updateElementProps(next_props);
+      }
+      this.props = next_props;
+      if (typeof this.next_state === "object") {
+        if (!this.state) this.state = { ...next_state };
+        else Object.assign(this.state, next_state);
+      } else if (this.next_state !== void 0) throw new Error("Component.setState only accepts objects or functions is new state.");
+      if (this.next_state) delete this.next_state;
+      if (this.hooks !== void 0) {
+        this.hook_index = 0;
+        lilact_default.current_component = [this, lilact_default.current_component];
+        try {
+          this.outlet = this.component.render(next_props, { current: this.element || this.component });
+        } catch (e) {
+          renderErrorHandler(this, e);
+        }
+        lilact_default.current_component = lilact_default.current_component[1];
       } else {
-        const core = prepareCore(this, item);
-        this.outlet[i2] = core;
-        if (core[TEXT2] === void 0) {
-          core.container = this.element ? this : this.container;
-          core.apply(item.props);
+        try {
+          this.outlet = this.component.render({ current: this.element || this.component });
+        } catch (e) {
+          renderErrorHandler(this, e);
+        }
+      }
+      if (((_e = (_d = this.outlet) == null ? void 0 : _d.constructor) == null ? void 0 : _e.name) !== "Array") {
+        this.outlet = [this.outlet];
+      }
+      this.outlet = [...this.outlet];
+      for (let i2 = 0; i2 < this.outlet.length; i2++) {
+        let item = this.outlet[i2];
+        if (item === void 0 || item === null || typeof item === "boolean") {
+          this.outlet.splice(i2, 1);
+          i2--;
+        } else if (typeof item === "function") {
+          const res2 = this.childFunctionHandler(item);
+          this.outlet.splice(i2, 1, res2);
+          i2--;
+        } else if (item.constructor.name === "Array") {
+          this.outlet.splice(i2, 1, ...item);
+          i2--;
         } else {
-          if (!core.element) {
-            core.element = document.createTextNode(item[TEXT2]);
-            core[TEXT2] = item[TEXT2];
-          } else if (core[TEXT2] !== item[TEXT2]) {
-            core.element.textContent = item[TEXT2];
-            core[TEXT2] = item[TEXT2];
+          const core = prepareCore(this, item);
+          this.outlet[i2] = core;
+          if (core[TEXT2] === void 0) {
+            core.container = this.element ? this : this.container;
+            core.apply(item.props);
+          } else {
+            if (!core.element) {
+              core.element = document.createTextNode(item[TEXT2]);
+              core[TEXT2] = item[TEXT2];
+            } else if (core[TEXT2] !== item[TEXT2]) {
+              core.element.textContent = item[TEXT2];
+              core[TEXT2] = item[TEXT2];
+            }
           }
         }
       }
+      if (this.cache) this.cache.commit();
+      if (this.element) this.arrangeOutlet();
+      if (this.component.componentDidUpdate) {
+        this.component.componentDidUpdate(prev_props, prev_state, this.last_snapshot);
+      }
+      if (this.last_snapshot) delete this.last_snapshot;
     }
-    if (this.cache) this.cache.commit();
-    if (this.element) this.arrangeOutlet();
-    if (this.component.componentDidUpdate) {
-      this.component.componentDidUpdate(prev_props, prev_state, this.last_snapshot);
-    }
-    if (this.last_snapshot) delete this.last_snapshot;
   }
   async cleanup() {
     var _a, _b, _c;
@@ -2614,18 +2623,23 @@ var renderErrorHandler = (c, e) => {
   } else throw e;
 };
 function constructFunc(core, parent) {
-  var _a, _b;
   let comp = core;
   if (core[TEXT2] !== void 0) {
   } else {
-    if (typeof core.entity === "string") {
-      comp = new HTMLComponent(core.entity, core.props);
+    let entity = core.entity;
+    let memoized = false;
+    if (typeof entity === "object" && entity[MEMOIZED]) {
+      memoized = true;
+      entity = entity[MEMOIZED];
+    }
+    if (typeof entity === "string") {
+      comp = new HTMLComponent(entity, core.props);
     } else {
-      if (isClass(core.entity)) {
-        if ((_a = core.entity) == null ? void 0 : _a.defaultProps) {
-          core.props = { ...core.entity.defaultProps, ...core.props };
+      if (isClass(entity)) {
+        if (entity == null ? void 0 : entity.defaultProps) {
+          core.props = { ...entity.defaultProps, ...core.props };
         }
-        comp = new core.entity(core.props);
+        comp = new entity(core.props);
         const desc = Object.getOwnPropertyDescriptor(comp, "state");
         if (desc) {
           if (typeof desc.get !== "function" && typeof desc.set !== "function") {
@@ -2644,22 +2658,23 @@ function constructFunc(core, parent) {
             });
           }
         }
-      } else if (typeof core.entity === "function") {
-        if ((_b = core.entity) == null ? void 0 : _b.defaultProps) {
-          core.props = { ...core.entity.defaultProps, ...core.props };
+      } else if (typeof entity === "function") {
+        if (entity == null ? void 0 : entity.defaultProps) {
+          core.props = { ...entity.defaultProps, ...core.props };
         }
         comp = new Component(core.props);
-        comp.render = core.entity.bind(comp);
+        comp.render = entity.bind(comp);
         comp[CORE].hooks = [];
         comp[CORE].hook_index = 0;
       } else {
-        throw new Error("Invalid entity for createComponent.");
+        throw new Error("Error in constructing component.");
       }
-      comp[CORE].entity = core.entity;
+      comp[CORE].entity = entity;
       if (core.container) {
         comp[CORE].container = core.container;
       }
     }
+    if (memoized) comp[CORE][MEMOIZED] = true;
   }
   if (parent instanceof ComponentCore) comp[CORE].parent = parent;
   return comp;
@@ -2680,16 +2695,26 @@ function prepareCore(parent, core) {
   }
 }
 function doUpdates() {
+  clearTimeout(lilact_default.effect_timeout);
+  const _update_set = lilact_default.update_set;
+  const _update_cbs = lilact_default.update_cbs;
+  lilact_default.update_set = /* @__PURE__ */ new Set();
+  lilact_default.update_cbs = /* @__PURE__ */ new Set();
+  for (const u of _update_set) u.apply();
+  for (const cb of _update_cbs) cb();
+  processEffects();
+}
+function processEffects() {
+  const _insertion_effects = lilact_default.insertion_effects;
+  const _layout_effects = lilact_default.layout_effects;
+  const _passive_effects = lilact_default.passive_effects;
+  lilact_default.insertion_effects = /* @__PURE__ */ new Set();
+  lilact_default.layout_effects = /* @__PURE__ */ new Set();
+  lilact_default.passive_effects = /* @__PURE__ */ new Set();
+  for (const ie of _insertion_effects) ie();
+  for (const le of _layout_effects) le();
   requestAnimationFrame(() => {
-    let _layout_effects = lilact_default.layout_effects;
-    let _update_cbs = lilact_default.update_cbs;
-    let _update_set = lilact_default.update_set;
-    lilact_default.layout_effects = /* @__PURE__ */ new Set();
-    lilact_default.update_cbs = /* @__PURE__ */ new Set();
-    lilact_default.update_set = /* @__PURE__ */ new Set();
-    for (const le of _layout_effects) le();
-    for (const u of _update_set) u.apply();
-    for (const cb of _update_cbs) cb();
+    for (const pe of _passive_effects) pe();
   });
 }
 var generateComponentKey = (entity, props) => {
@@ -2885,8 +2910,10 @@ var RootComponent = class extends HTMLComponent {
   }
 };
 function createComponent2(entity, props = {}, ...children) {
-  if (entity !== void 0 && typeof entity !== "string" && typeof entity !== "function") {
-    throw new Error("Invalid entity for createComponent.");
+  if (typeof entity !== "string" && typeof entity !== "function") {
+    if (typeof entity !== "object" || !entity[MEMOIZED]) {
+      throw new Error("Invalid entity for createComponent.");
+    }
   }
   for (let i2 = 0; i2 < children.length; i2++) {
     let ch2 = children[i2];
@@ -2935,12 +2962,20 @@ function render(component, element) {
   }
   return createRoot(element).render(component);
 }
+function memo(component) {
+  return { [MEMOIZED]: component };
+}
 var createElement = createComponent2;
 var current_component = [];
 var update_set = /* @__PURE__ */ new Set();
 var update_cbs = /* @__PURE__ */ new Set();
 var roots = /* @__PURE__ */ new Set();
 var layout_effects = /* @__PURE__ */ new Set();
+var insertion_effects = /* @__PURE__ */ new Set();
+var passive_effects = /* @__PURE__ */ new Set();
+var update_timeout = void 0;
+var effect_timeout = void 0;
+var update_interval_margin = 0;
 var special_attributes = /* @__PURE__ */ new Set([
   "classname",
   "ref",
@@ -3097,14 +3132,17 @@ var boolean_html_attributes_set = /* @__PURE__ */ new Set([
 var hooks_exports = {};
 __export(hooks_exports, {
   createContext: () => createContext,
+  startTransition: () => startTransition,
   useActionState: () => useActionState,
   useCallback: () => useCallback,
   useContext: () => useContext,
+  useDebugValue: () => useDebugValue,
   useDeferredValue: () => useDeferredValue,
   useEffect: () => useEffect,
   useHook: () => useHook,
   useId: () => useId,
   useImperativeHandle: () => useImperativeHandle,
+  useInsertionEffect: () => useInsertionEffect,
   useLayoutEffect: () => useLayoutEffect,
   useLocalStorage: () => useLocalStorage,
   useMemo: () => useMemo,
@@ -3183,10 +3221,10 @@ function useTransition() {
   if (isEmpty(hk)) {
     hk.count = 0;
     hk.func = (async function(core, hk2, fn) {
-      hk2.count++;
-      if (hk2.count === 1) {
+      if (hk2.count === 0) {
         core.component.forceUpdate();
       }
+      hk2.count++;
       await fn();
       hk2.count--;
       if (hk2.count === 0) {
@@ -3229,7 +3267,7 @@ function useRef(initialValue = null) {
 }
 function useLayoutEffect(effect, deps = void 0) {
   if (deps !== void 0 && (typeof deps !== "object" || deps.constructor.name !== "Array")) {
-    throw new Error("Layout effect dependencies must be an array or omitted.");
+    throw new Error("Layout effect dependencies must be an array, object or omitted.");
   }
   const hk = useHook();
   if (!isEmpty(hk)) {
@@ -3242,11 +3280,12 @@ function useLayoutEffect(effect, deps = void 0) {
   lilact_default.layout_effects.add(() => {
     hk.cleanup = effect();
   });
-  lilact_default.current_component[0].component.forceUpdate();
+  lilact_default.clearTimeout(lilact_default.effect_timeout);
+  lilact_default.setTimeout(lilact_default.processEffects, 0);
 }
 function useEffect(effect, deps = void 0) {
   if (deps !== void 0 && (typeof deps !== "object" || deps.constructor.name !== "Array")) {
-    throw new Error("Effect dependencies must be an array or omitted.");
+    throw new Error("Effect dependencies must be an array, object or omitted.");
   }
   const hk = useHook();
   if (!isEmpty(hk)) {
@@ -3256,9 +3295,29 @@ function useEffect(effect, deps = void 0) {
     hk.cleanup();
   }
   hk.deps = deps;
-  lilact_default.setTimeout(() => {
+  lilact_default.passive_effects.add(() => {
     hk.cleanup = effect();
-  }, 0);
+  });
+  lilact_default.clearTimeout(lilact_default.effect_timeout);
+  lilact_default.setTimeout(lilact_default.processEffects, 0);
+}
+function useInsertionEffect(effect, deps = void 0) {
+  if (deps !== void 0 && (typeof deps !== "object" || deps.constructor.name !== "Array")) {
+    throw new Error("Insertion effect dependencies must be an array, object, or omitted.");
+  }
+  const hk = useHook();
+  if (!isEmpty(hk)) {
+    if (deps !== void 0 && (hk == null ? void 0 : hk.deps) !== void 0 && shallowEqual(deps, hk.deps)) return;
+  }
+  if (hk == null ? void 0 : hk.cleanup) {
+    hk.cleanup();
+  }
+  hk.deps = deps;
+  lilact_default.insertion_effects.add(() => {
+    hk.cleanup = effect();
+  });
+  lilact_default.clearTimeout(lilact_default.effect_timeout);
+  lilact_default.setTimeout(lilact_default.processEffects, 0);
 }
 function useMemo(factory, deps = void 0) {
   if (deps !== void 0 && (typeof deps !== "object" || deps.constructor.name !== "Array")) {
@@ -3346,6 +3405,14 @@ function useImperativeHandle(ref, factory, deps = void 0) {
   }
   Object.assign(ref.current, factory(), 0);
 }
+function useDebugValue(val, formatter = (x) => x) {
+  if (true) {
+    console.log(formatter(val));
+  }
+}
+function startTransition(transition) {
+  transition();
+}
 
 // .tmp/src/run.jsx
 var run_exports = {};
@@ -3494,7 +3561,7 @@ var timers_exports = {};
 __export(timers_exports, {
   animationFramePromise: () => animationFramePromise,
   clearInterval: () => clearInterval,
-  clearTimeout: () => clearTimeout,
+  clearTimeout: () => clearTimeout2,
   grabTimers: () => grabTimers,
   pauseTimers: () => pauseTimers,
   releaseTimers: () => releaseTimers,
@@ -3603,7 +3670,7 @@ function setTimeout2(callback, delay, ...args) {
 function setInterval(callback, interval, ...args) {
   return add_timer({ [CALLBACK]: callback, [INTERVAL]: interval, [DUE]: Date.now() + interval, [REPEAT]: true, [ARGS]: args });
 }
-function clearTimeout(id) {
+function clearTimeout2(id) {
   if (all_timers[id]) all_timers[id][CLEARED] = true;
 }
 function clearInterval(id) {
@@ -3686,14 +3753,14 @@ function Transition({
     } else this[CORE].mount_state = EXITED;
   }
   useEffect(() => {
-    return () => clearTimeout(this[CORE].timer);
+    return () => clearTimeout2(this[CORE].timer);
   }, []);
   useEffect(() => {
     if (!this[CORE].is_appeared && appear && this[CORE].mount_state === ENTERING && inProp) {
       onEnter == null ? void 0 : onEnter();
       requestAnimationFrame(() => {
         onEntering == null ? void 0 : onEntering(!this[CORE].is_appeared);
-        clearTimeout(this[CORE].timer);
+        clearTimeout2(this[CORE].timer);
         this[CORE].timer = setTimeout2(() => {
           this[CORE].mount_state = ENTERED;
           this.forceUpdate();
@@ -3711,7 +3778,7 @@ function Transition({
       this[CORE].mount_state = ENTERING;
       this.forceUpdate(() => {
         onEntering == null ? void 0 : onEntering(!this[CORE].is_appeared);
-        clearTimeout(this[CORE].timer);
+        clearTimeout2(this[CORE].timer);
         this[CORE].timer = setTimeout2(() => {
           this[CORE].mount_state = ENTERED;
           this.forceUpdate();
@@ -3725,7 +3792,7 @@ function Transition({
       this[CORE].mount_state = EXITING;
       this.forceUpdate(() => {
         onExiting == null ? void 0 : onExiting();
-        clearTimeout(this[CORE].timer);
+        clearTimeout2(this[CORE].timer);
         this[CORE].timer = setTimeout2(() => {
           this[CORE].mount_state = EXITED;
           this.forceUpdate();
@@ -4578,11 +4645,11 @@ var Suspense = class extends Component {
   /** @ignore */
   _clearTimers() {
     if (this._delayTimer) {
-      clearTimeout(this._delayTimer);
+      clearTimeout2(this._delayTimer);
       this._delayTimer = null;
     }
     if (this._minShowTimer) {
-      clearTimeout(this._minShowTimer);
+      clearTimeout2(this._minShowTimer);
       this._minShowTimer = null;
     }
   }
@@ -4593,7 +4660,7 @@ var Suspense = class extends Component {
     if (this._pending.size === 1) {
       const delay = Math.max(0, this.props.minDelay);
       if (this._delayTimer) {
-        clearTimeout(this._delayTimer);
+        clearTimeout2(this._delayTimer);
         this._delayTimer = null;
       }
       this._delayTimer = setTimeout2(() => {
@@ -4608,7 +4675,7 @@ var Suspense = class extends Component {
       }
       if (this._pending.size === 0) {
         if (this._delayTimer) {
-          clearTimeout(this._delayTimer);
+          clearTimeout2(this._delayTimer);
           this._delayTimer = null;
           this.setState({ showingFallback: false });
           return;
@@ -4619,7 +4686,7 @@ var Suspense = class extends Component {
           this.setState({ showingFallback: false });
         } else {
           if (this._minShowTimer) {
-            clearTimeout(this._minShowTimer);
+            clearTimeout2(this._minShowTimer);
             this._minShowTimer = null;
           }
           this._minShowTimer = setTimeout2(() => {
@@ -5760,7 +5827,7 @@ function transpileJSX(jsx2, {
 
 // .tmp/src/lilact.jsx
 var Lilact2 = {
-  VERSION: "beta.16",
+  VERSION: "beta.18",
   // Configuration
   defaultTransitionTimeout: 300,
   defaultIsEqual: Object.is,
@@ -5829,7 +5896,7 @@ export {
   boolean_html_attributes_set,
   capture_events_set,
   clearInterval,
-  clearTimeout,
+  clearTimeout2 as clearTimeout,
   combineReducers2 as combineReducers,
   connect,
   createComponent2 as createComponent,
@@ -5840,6 +5907,7 @@ export {
   current_component,
   deepEqual,
   lilact_default as default,
+  effect_timeout,
   emotion_css_esm_exports as emotion,
   error,
   eval_num,
@@ -5850,16 +5918,21 @@ export {
   globalErrorHandler,
   grabTimers,
   id_num,
+  insertion_effects,
   isAsync,
   isClass,
   isEmpty,
   isError2 as isError,
   isThenable,
+  isValidComponent,
   isValidElement,
   layout_effects,
   lazy,
   length_css_attributes_set,
+  memo,
+  passive_effects,
   pauseTimers,
+  processEffects,
   redux_exports as redux,
   releaseSyntheticEvent,
   releaseTimers,
@@ -5876,6 +5949,7 @@ export {
   setTimeout2 as setTimeout,
   shallowEqual,
   special_attributes,
+  startTransition,
   timeoutPromise,
   toBool,
   traceError,
@@ -5888,12 +5962,14 @@ export {
   useActionState,
   useCallback,
   useContext,
+  useDebugValue,
   useDeferredValue,
   useDispatch,
   useEffect,
   useHook,
   useId,
   useImperativeHandle,
+  useInsertionEffect,
   useLayoutEffect,
   useLocalStorage,
   useLocation,