@tachui/data 0.8.1-alpha → 0.8.8

package/dist/List.js

@@ -1,118 +1,2717 @@
-var L = Object.defineProperty;
-var b = (l, t, e) => t in l ? L(l, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : l[t] = e;
-var a = (l, t, e) => b(l, typeof t != "symbol" ? t + "" : t, e);
-import { createSignal as S, isSignal as f, createEffect as I, h as u, withModifiers as x } from "@tachui/core";
-import { ScrollView as E } from "@tachui/mobile";
-class $ {
-  constructor(t) {
-    a(this, "type", "component");
-    a(this, "id");
-    a(this, "mounted", !1);
-    a(this, "cleanup", []);
-    a(this, "dataSignal");
-    a(this, "setData");
-    a(this, "sectionsSignal");
-    a(this, "setSections");
-    a(this, "selectedItemsSignal");
-    a(this, "setSelectedItems");
-    a(this, "isLoadingSignal");
-    a(this, "setIsLoading");
+var de = Object.defineProperty;
+var ue = (n, e, t) => e in n ? de(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t;
+var u = (n, e, t) => ue(n, typeof e != "symbol" ? e + "" : e, t);
+import { withModifiers as re, createSignal as A, isSignal as v, createEffect as I, h as b } from "@tachui/core";
+import "@tachui/modifiers";
+const g = {
+  Clean: 0,
+  Check: 1,
+  Dirty: 2,
+  Disposed: 3
+};
+var pe = Object.defineProperty, fe = (n, e, t) => e in n ? pe(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, M = (n, e, t) => fe(n, typeof e != "symbol" ? e + "" : e, t);
+let me = 0;
+const ge = Math.random().toString(36).substr(2, 6);
+let Z = null, J = null;
+const ye = /* @__PURE__ */ new Set();
+ye.add(ge);
+const D = {
+  get currentComputation() {
+    return Z;
+  },
+  set currentComputation(n) {
+    Z = n;
+  },
+  get currentOwner() {
+    return J;
+  },
+  set currentOwner(n) {
+    J = n;
+  }
+};
+function ie() {
+  return D.currentComputation;
+}
+function ne() {
+  return D.currentOwner;
+}
+let oe = class {
+  constructor(e, t = null) {
+    M(this, "id"), M(this, "owner"), M(this, "fn"), M(this, "sources", /* @__PURE__ */ new Set()), M(this, "observers", /* @__PURE__ */ new Set()), M(this, "state", g.Dirty), M(this, "value"), this.id = ++me, this.fn = e, this.owner = t, t && !t.disposed && t.sources.add(this);
+  }
+  execute() {
+    if (this.state === g.Disposed)
+      return this.value;
+    for (const t of this.sources)
+      t && typeof t == "object" && "removeObserver" in t && t.removeObserver(this);
+    this.sources.clear();
+    const e = D.currentComputation;
+    D.currentComputation = this;
+    try {
+      return this.state = g.Clean, this.value = this.fn(), this.value;
+    } catch (t) {
+      throw this.state = g.Disposed, (typeof process > "u" || process.env.NODE_ENV !== "test") && console.error("Error in computation:", t), t;
+    } finally {
+      D.currentComputation = e;
+    }
+  }
+  dispose() {
+    if (this.state !== g.Disposed) {
+      this.state = g.Disposed;
+      for (const e of this.sources)
+        e && typeof e == "object" && "removeObserver" in e && e.removeObserver(this);
+      this.sources.clear();
+      for (const e of this.observers)
+        e.sources.delete(this);
+      this.observers.clear(), this.owner && !this.owner.disposed && this.owner.sources.delete(this);
+    }
+  }
+};
+var ve = Object.defineProperty, be = (n, e, t) => e in n ? ve(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, B = (n, e, t) => be(n, typeof e != "symbol" ? e + "" : e, t);
+let Se = 0, Ce = class {
+  constructor(e) {
+    B(this, "id"), B(this, "observers", /* @__PURE__ */ new Set()), B(this, "_value"), this.id = ++Se, this._value = e;
+  }
+  /**
+   * Get the current value and track dependency
+   */
+  getValue() {
+    const e = ie();
+    return e && e.state !== g.Disposed && (this.observers.add(e), e.sources.add(this)), this._value;
+  }
+  /**
+   * Get the current value without tracking dependency
+   */
+  peek() {
+    return this._value;
+  }
+  /**
+   * Set a new value and notify observers
+   */
+  set(e) {
+    const t = typeof e == "function" ? e(this._value) : e;
+    return t !== this._value && (this._value = t, this.notify()), t;
+  }
+  /**
+   * Notify all observers that this signal has changed
+   */
+  notify() {
+    for (const e of this.observers)
+      e.state !== g.Disposed && (e.state = g.Dirty, Ee(e));
+  }
+  /**
+   * Remove an observer (cleanup)
+   */
+  removeObserver(e) {
+    this.observers.delete(e);
+  }
+  /**
+   * Get debug information about this signal
+   */
+  [Symbol.for("tachui.debug")]() {
+    return {
+      id: this.id,
+      value: this._value,
+      observerCount: this.observers.size,
+      type: "Signal"
+    };
+  }
+};
+const U = /* @__PURE__ */ new Set();
+let j = !1;
+function Ee(n) {
+  U.add(n), !j && queueMicrotask(we);
+}
+function we() {
+  if (!j) {
+    j = !0;
+    try {
+      for (; U.size > 0; ) {
+        const n = Array.from(U).sort((e, t) => e.id - t.id);
+        U.clear();
+        for (const e of n)
+          e.state === g.Dirty && e.execute();
+      }
+    } finally {
+      j = !1;
+    }
+  }
+}
+function G(n) {
+  const e = new Ce(n), t = e.getValue.bind(e);
+  t.peek = e.peek.bind(e);
+  const s = e.set.bind(e);
+  return Object.defineProperty(t, Symbol.for("tachui.signal"), {
+    value: e,
+    enumerable: !1
+  }), [t, s];
+}
+function T(n) {
+  return typeof n == "function" && Symbol.for("tachui.signal") in n;
+}
+const Ae = (n, e) => n === e;
+var Ie = Object.defineProperty, Me = (n, e, t) => e in n ? Ie(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, S = (n, e, t) => Me(n, typeof e != "symbol" ? e + "" : e, t), _ = /* @__PURE__ */ ((n) => (n[n.Immediate = 0] = "Immediate", n[n.High = 1] = "High", n[n.Normal = 2] = "Normal", n[n.Low = 3] = "Low", n[n.Idle = 4] = "Idle", n))(_ || {});
+let Ne = class extends Error {
+  constructor(e, t, s) {
+    super(e), this.cause = t, this.node = s, this.name = "ReactiveError";
+  }
+};
+const xe = class $ {
+  constructor() {
+    S(this, "updateQueues", /* @__PURE__ */ new Map()), S(this, "isFlushPending", !1), S(this, "isDestroyed", !1), S(this, "errorHandlers", /* @__PURE__ */ new Set()), S(this, "maxRetries", 3), S(this, "totalUpdateCycles", 0), S(this, "totalUpdateTime", 0), S(this, "errorCount", 0), S(this, "nodeRegistry", /* @__PURE__ */ new WeakSet());
+    for (const e of Object.values(_))
+      typeof e == "number" && this.updateQueues.set(e, /* @__PURE__ */ new Set());
+  }
+  static getInstance() {
+    return $.instance || ($.instance = new $()), $.instance;
+  }
+  /**
+   * Schedule reactive node for update
+   */
+  schedule(e) {
+    this.isDestroyed || (this.nodeRegistry.add(e), this.getQueue(e.priority).add(e), this.isFlushPending || (this.isFlushPending = !0, this.scheduleFlush(e.priority)));
+  }
+  /**
+   * Process all queued updates by priority
+   */
+  async flush() {
+    if (this.isDestroyed) return;
+    this.isFlushPending = !1;
+    const e = performance.now();
+    try {
+      for (const t of [
+        0,
+        1,
+        2,
+        3,
+        4
+        /* Idle */
+      ]) {
+        const s = this.updateQueues.get(t);
+        if (!s || s.size === 0) continue;
+        const r = Array.from(s);
+        s.clear();
+        for (const i of r)
+          try {
+            await this.updateNodeWithRetry(i);
+          } catch (o) {
+            this.handleReactiveError(
+              new Ne(`Failed to update ${i.type} node ${i.id}`, o, i)
+            );
+          }
+        if (this.hasHigherPriorityWork(t))
+          return this.flush();
+      }
+      this.totalUpdateCycles++;
+    } finally {
+      const t = performance.now();
+      this.totalUpdateTime += t - e;
+    }
+  }
+  /**
+   * Update node with retry logic
+   */
+  async updateNodeWithRetry(e, t = 1) {
+    try {
+      e.notify();
+    } catch (s) {
+      if (t < this.maxRetries)
+        return console.warn(`Reactive update failed, retrying (${t}/${this.maxRetries})`), await new Promise((r) => setTimeout(r, t * 10)), this.updateNodeWithRetry(e, t + 1);
+      throw s;
+    }
+  }
+  /**
+   * Schedule flush based on priority
+   */
+  scheduleFlush(e) {
+    switch (e) {
+      case 0:
+        this.flush();
+        break;
+      case 1:
+        queueMicrotask(() => this.flush());
+        break;
+      case 2:
+        typeof requestAnimationFrame < "u" ? requestAnimationFrame(() => this.flush()) : queueMicrotask(() => this.flush());
+        break;
+      case 3:
+      case 4:
+        typeof requestIdleCallback < "u" ? requestIdleCallback(() => this.flush(), { timeout: 1e3 }) : setTimeout(() => this.flush(), 50);
+        break;
+    }
+  }
+  /**
+   * Check if there's higher priority work waiting
+   */
+  hasHigherPriorityWork(e) {
+    for (let t = 0; t < e; t++) {
+      const s = this.updateQueues.get(t);
+      if (s && s.size > 0)
+        return !0;
+    }
+    return !1;
+  }
+  /**
+   * Get queue for priority level
+   */
+  getQueue(e) {
+    const t = this.updateQueues.get(e);
+    if (!t)
+      throw new Error(`Invalid priority level: ${e}`);
+    return t;
+  }
+  /**
+   * Register error handler
+   */
+  onError(e) {
+    return this.errorHandlers.add(e), () => this.errorHandlers.delete(e);
+  }
+  /**
+   * Handle reactive errors with recovery
+   */
+  handleReactiveError(e) {
+    this.errorCount++;
+    let t = !1;
+    for (const s of this.errorHandlers)
+      try {
+        s(e), t = !0;
+      } catch (r) {
+        console.error("Error handler threw error:", r);
+      }
+    if (!t && (console.error("Unhandled reactive error:", e), process.env.NODE_ENV === "development"))
+      throw e;
+  }
+  /**
+   * Get performance metrics
+   */
+  getPerformanceMetrics() {
+    let e = 0;
+    for (const t of this.updateQueues.values())
+      e += t.size;
+    return {
+      totalNodes: e,
+      updateCycles: this.totalUpdateCycles,
+      averageUpdateTime: this.totalUpdateCycles > 0 ? this.totalUpdateTime / this.totalUpdateCycles : 0,
+      memoryUsage: this.estimateMemoryUsage(),
+      errorCount: this.errorCount
+    };
+  }
+  /**
+   * Estimate memory usage (rough approximation)
+   */
+  estimateMemoryUsage() {
+    let e = 0;
+    for (const t of this.updateQueues.values())
+      e += t.size * 50;
+    return e += this.errorHandlers.size * 100, e;
+  }
+  /**
+   * Check if node is scheduled
+   */
+  hasNode(e) {
+    for (const t of this.updateQueues.values())
+      if (t.has(e))
+        return !0;
+    return !1;
+  }
+  /**
+   * Flush all pending updates synchronously
+   */
+  flushSync() {
+    this.isFlushPending && (this.isFlushPending = !1, this.flush());
+  }
+  /**
+   * Clear all pending updates
+   */
+  clearPending() {
+    for (const e of this.updateQueues.values())
+      e.clear();
+    this.isFlushPending = !1;
+  }
+  /**
+   * Cleanup all reactive nodes and destroy scheduler
+   */
+  destroy() {
+    this.isDestroyed = !0;
+    for (const e of this.updateQueues.values()) {
+      for (const t of e)
+        try {
+          t.cleanup();
+        } catch (s) {
+          console.error("Error cleaning up reactive node:", s);
+        }
+      e.clear();
+    }
+    this.updateQueues.clear(), this.errorHandlers.clear(), $.instance = null;
+  }
+  /**
+   * Get debug information
+   */
+  getDebugInfo() {
+    const e = {};
+    for (const [t, s] of this.updateQueues)
+      e[_[t]] = s.size;
+    return {
+      isFlushPending: this.isFlushPending,
+      isDestroyed: this.isDestroyed,
+      queueSizes: e,
+      errorHandlerCount: this.errorHandlers.size,
+      performance: this.getPerformanceMetrics()
+    };
+  }
+};
+S(xe, "instance", null);
+var $e = Object.defineProperty, Oe = (n, e, t) => e in n ? $e(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, x = (n, e, t) => Oe(n, typeof e != "symbol" ? e + "" : e, t);
+let Re = class extends oe {
+  constructor(e, t = {}, s = ne()) {
+    super(e, s), x(this, "type", "computed"), x(this, "priority"), x(this, "_hasValue", !1), x(this, "_error", null), x(this, "equalsFn"), x(this, "options"), this.priority = t.priority ?? _.Normal, this.equalsFn = t.equals ?? Ae, this.options = t;
+  }
+  /**
+   * Get the computed value, tracking dependency and lazily computing
+   */
+  getValue() {
+    const e = ie();
+    return e && e.state !== g.Disposed && (this.observers.add(e), e.sources.add(this)), (this.state === g.Dirty || !this._hasValue) && (this.execute(), this._hasValue = !0), this.value;
+  }
+  /**
+   * Get the current value without tracking dependency
+   */
+  peek() {
+    return (this.state === g.Dirty || !this._hasValue) && (this.execute(), this._hasValue = !0), this.value;
+  }
+  /**
+   * Remove an observer (cleanup)
+   */
+  removeObserver(e) {
+    this.observers.delete(e), this.options.releaseOnNoObservers === !0 && this.observers.size === 0 && e.state === g.Disposed && this.releaseSources();
+  }
+  releaseSources() {
+    for (const e of this.sources)
+      "removeObserver" in e && e.removeObserver(this);
+    this.sources.clear(), this._hasValue = !1, this.state = g.Dirty;
+  }
+  /**
+   * Execute the computation and notify observers
+   */
+  execute() {
+    const e = this._hasValue ? this.value : void 0, t = super.execute();
+    if (!this._hasValue || !this.equalsFn(e, t))
+      for (const s of this.observers)
+        s.state !== g.Disposed && (s.state = g.Dirty, "execute" in s && typeof s.execute == "function" && queueMicrotask(() => {
+          s.state === g.Dirty && s.execute();
+        }));
+    return t;
+  }
+  /**
+   * Notify method for ReactiveNode compatibility
+   */
+  notify() {
+    this.execute();
+  }
+  /**
+   * Complete cleanup for memory management
+   */
+  cleanup() {
+    for (const e of this.sources)
+      "removeObserver" in e && e.removeObserver(this);
+    this.sources.clear();
+    for (const e of this.observers)
+      e.sources.delete(this);
+    this.observers.clear(), this._hasValue = !1, this._error = null, this.state = g.Disposed;
+  }
+  /**
+   * Dispose the computed value
+   */
+  dispose() {
+    this.cleanup(), super.dispose();
+  }
+  /**
+   * Debug information
+   */
+  [Symbol.for("tachui.debug")]() {
+    return {
+      id: this.id,
+      type: this.type,
+      value: this._hasValue ? this.value : void 0,
+      hasValue: this._hasValue,
+      error: this._error?.message,
+      state: this.state,
+      sourceCount: this.sources.size,
+      observerCount: this.observers.size,
+      priority: _[this.priority],
+      debugName: this.options.debugName,
+      equalsFn: this.equalsFn.name || "anonymous"
+    };
+  }
+  toString() {
+    return `Computed(${this.options.debugName || this.id}): ${this._hasValue ? this.value : "no value"}`;
+  }
+};
+function Te(n, e) {
+  const t = new Re(n, e), s = t.getValue.bind(t);
+  return s.peek = t.peek.bind(t), Object.defineProperty(s, Symbol.for("tachui.computed"), {
+    value: t,
+    enumerable: !1
+  }), s;
+}
+function P(n) {
+  return typeof n == "function" && Symbol.for("tachui.computed") in n;
+}
+const [Pe, Tt] = G("light");
+Te(() => {
+  const n = Pe();
+  return n === "system" ? Le() : n;
+});
+function Le() {
+  return typeof window < "u" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+}
+typeof globalThis.__DEV__ > "u" && (globalThis.__DEV__ = process.env.NODE_ENV !== "production");
+var ke = Object.defineProperty, ze = (n, e, t) => e in n ? ke(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, ee = (n, e, t) => ze(n, typeof e != "symbol" ? e + "" : e, t);
+let De = class {
+  constructor() {
+    ee(this, "pending", /* @__PURE__ */ new Set()), ee(this, "isFlushScheduled", !1);
+  }
+  schedule(e) {
+    this.pending.add(e), this.isFlushScheduled || (this.isFlushScheduled = !0, queueMicrotask(() => this.flush()));
+  }
+  flush() {
+    if (this.pending.size === 0) {
+      this.isFlushScheduled = !1;
+      return;
+    }
+    const e = Array.from(this.pending);
+    this.pending.clear(), this.isFlushScheduled = !1;
+    for (const t of e)
+      try {
+        t();
+      } catch (s) {
+        console.error("Error in scheduled task:", s);
+      }
+    this.pending.size > 0 && (this.isFlushScheduled = !0, queueMicrotask(() => this.flush()));
+  }
+};
+new De();
+let Q = null;
+const y = class y {
+  constructor() {
+    u(this, "instanceId");
+    u(this, "createdAt");
+    u(this, "modifiers", /* @__PURE__ */ new Map());
+    u(this, "lazyLoaders", /* @__PURE__ */ new Map());
+    u(this, "loadingPromises", /* @__PURE__ */ new Map());
+    // Feature flags
+    u(this, "featureFlags", {
+      proxyModifiers: !1,
+      // Disabled by default for safe rollout
+      autoTypeGeneration: !1,
+      hmrCacheInvalidation: !1,
+      pluginValidation: !0,
+      performanceMonitoring: !1,
+      metadataRegistration: !0
+      // Enable for new system
+    });
+    // Metadata storage for type generation
+    u(this, "metadata", /* @__PURE__ */ new Map());
+    u(this, "metadataHistory", /* @__PURE__ */ new Map());
+    u(this, "conflicts", /* @__PURE__ */ new Map());
+    // Plugin metadata storage
+    u(this, "plugins", /* @__PURE__ */ new Map());
+    y.instanceCount++, this.instanceId = Math.random().toString(36).substr(2, 9), this.createdAt = Date.now(), process.env.NODE_ENV === "development" && console.log(
+      `🏗️ ModifierRegistry instance created: ${this.instanceId} (total: ${y.instanceCount})`
+    );
+  }
+  static validateModifierName(e, t = {}) {
+    if (y.FORBIDDEN_NAMES.has(e))
+      throw new Error(
+        `Security Error: Cannot register modifier '${e}' (forbidden name)`
+      );
+    if (!y.NAME_PATTERN.test(e)) {
+      if (t.strict)
+        throw new Error(
+          `Invalid modifier name '${e}'. Modifier names must match ${y.NAME_PATTERN}`
+        );
+      process.env.NODE_ENV !== "production" && console.warn(
+        `⚠️ Modifier name '${e}' does not match ${y.NAME_PATTERN}. Prefer alphanumeric names for best tooling support.`
+      );
+    }
+  }
+  register(e, t) {
+    y.validateModifierName(e), this.modifiers.set(e, t), this.lazyLoaders.delete(e), this.loadingPromises.delete(e);
+  }
+  registerLazy(e, t) {
+    if (y.validateModifierName(e), this.modifiers.has(e)) {
+      process.env.NODE_ENV === "development" && console.warn(
+        `⚠️ Modifier '${e}' already registered, skipping lazy registration`
+      );
+      return;
+    }
+    this.lazyLoaders.set(e, t);
+  }
+  get(e, t) {
+    const s = this.modifiers.get(e);
+    if (s)
+      return s;
+    const r = this.lazyLoaders.get(e);
+    if (!r) {
+      process.env.NODE_ENV === "development" && console.warn(
+        `⚠️ Modifier '${e}' not found in registry ${this.instanceId}`
+      );
+      return;
+    }
+    if (t?.async)
+      return this.getAsync(e);
+    try {
+      const i = r();
+      return i instanceof Promise ? i.then((o) => (this.modifiers.set(e, o), this.lazyLoaders.delete(e), o)).catch((o) => {
+        process.env.NODE_ENV === "development" && console.warn(`⚠️ Failed to load modifier '${e}':`, o);
+      }) : (this.modifiers.set(e, i), this.lazyLoaders.delete(e), i);
+    } catch (i) {
+      process.env.NODE_ENV === "development" && console.warn(
+        `⚠️ Failed to load modifier '${e}' synchronously:`,
+        i
+      );
+      return;
+    }
+  }
+  async getAsync(e) {
+    const t = this.loadingPromises.get(e);
+    if (t)
+      return t;
+    const s = this.lazyLoaders.get(e);
+    if (!s)
+      return;
+    const r = this.loadModifier(e, s);
+    this.loadingPromises.set(e, r);
+    try {
+      const i = await r;
+      return this.loadingPromises.delete(e), i;
+    } catch (i) {
+      throw this.loadingPromises.delete(e), process.env.NODE_ENV === "development" && console.error(`❌ Failed to load modifier '${e}':`, i), i;
+    }
+  }
+  async loadModifier(e, t) {
+    try {
+      const s = await t();
+      return this.modifiers.set(e, s), this.lazyLoaders.delete(e), s;
+    } catch (s) {
+      throw process.env.NODE_ENV === "development" && console.error(`❌ Error loading modifier '${e}':`, s), s;
+    }
+  }
+  has(e) {
+    return this.modifiers.has(e) || this.lazyLoaders.has(e);
+  }
+  list() {
+    const e = Array.from(this.modifiers.keys()), t = Array.from(this.lazyLoaders.keys());
+    return [...e, ...t];
+  }
+  clear() {
+    this.modifiers.clear(), this.lazyLoaders.clear(), this.loadingPromises.clear(), this.metadata.clear(), this.metadataHistory.clear(), this.conflicts.clear(), this.plugins.clear(), process.env.NODE_ENV === "development" && console.log(
+      `🧹 Cleared all modifiers and lazy loaders from registry ${this.instanceId}`
+    );
+  }
+  reset() {
+    this.clear(), process.env.NODE_ENV === "test" && (y.instanceCount = 0);
+  }
+  validateRegistry() {
+    const e = this.list(), t = e.filter(
+      (s, r) => e.indexOf(s) !== r
+    );
+    return {
+      totalModifiers: this.modifiers.size + this.lazyLoaders.size,
+      duplicateNames: t,
+      orphanedReferences: [],
+      // Could be enhanced to scan for broken references
+      instanceId: this.instanceId,
+      createdAt: this.createdAt,
+      instanceCount: y.instanceCount
+    };
+  }
+  /**
+   * Get diagnostic information about this registry instance
+   */
+  getDiagnostics() {
+    return {
+      instanceId: this.instanceId,
+      createdAt: this.createdAt,
+      modifierCount: this.modifiers.size,
+      lazyLoaderCount: this.lazyLoaders.size,
+      modifiers: this.list(),
+      loadedModifiers: Array.from(this.modifiers.keys()),
+      lazyModifiers: Array.from(this.lazyLoaders.keys()),
+      featureFlags: this.featureFlags,
+      metadataCount: this.metadata.size
+    };
+  }
+  // ============================================================================
+  // Feature Flag Methods
+  // ============================================================================
+  /**
+   * Set feature flags for the registry
+   * Allows enabling/disabling features for gradual rollout
+   */
+  setFeatureFlags(e) {
+    this.featureFlags = {
+      ...this.featureFlags,
+      ...e
+    };
+  }
+  /**
+   * Get current feature flags
+   */
+  getFeatureFlags() {
+    return { ...this.featureFlags };
+  }
+  /**
+   * Check if a specific feature is enabled
+   */
+  isFeatureEnabled(e) {
+    return this.featureFlags[e] === !0;
+  }
+  // ============================================================================
+  // Metadata Methods (for build-time type generation)
+  // ============================================================================
+  /**
+   * Register metadata for a modifier (for type generation)
+   */
+  registerMetadata(e) {
+    if (!this.isFeatureEnabled("metadataRegistration")) {
+      process.env.NODE_ENV === "development" && console.warn(
+        "⚠️ Metadata registration is disabled. Enable 'metadataRegistration' feature flag."
+      );
+      return;
+    }
+    if (!e.plugin)
+      throw new Error(
+        `Modifier metadata '${String(e.name)}' must include a plugin identifier`
+      );
+    typeof e.name == "string" && y.validateModifierName(e.name, {
+      strict: !0
+    });
+    const t = this.metadata.get(e.name), s = t?.plugin === e.plugin;
+    if (this.recordMetadataHistoryEntry(e), !t) {
+      this.metadata.set(e.name, e);
+      return;
+    }
+    if (s) {
+      this.metadata.set(e.name, e);
+      return;
+    }
+    if (e.priority > t.priority) {
+      process.env.NODE_ENV === "development" && console.warn(
+        `⚠️ Overriding modifier metadata '${String(e.name)}' from ${t.plugin} (priority ${t.priority}) with ${e.plugin} (priority ${e.priority})`
+      ), this.metadata.set(e.name, e);
+      return;
+    }
+    e.priority === t.priority && e.plugin !== t.plugin && process.env.NODE_ENV === "development" && console.error(
+      `❌ Metadata conflict for '${String(e.name)}': ${t.plugin} vs ${e.plugin} (both priority ${e.priority})`
+    );
+  }
+  recordMetadataHistoryEntry(e) {
+    const t = this.metadataHistory.get(e.name) ?? [], s = `${e.plugin}:${e.priority}`, r = t.findIndex(
+      (i) => `${i.plugin}:${i.priority}` === s
+    );
+    r >= 0 ? t[r] = e : t.push(e), this.metadataHistory.set(e.name, t), this.refreshConflictsFor(e.name, t);
+  }
+  refreshConflictsFor(e, t) {
+    const s = [], r = /* @__PURE__ */ new Map();
+    for (const i of t) {
+      const o = r.get(i.priority) ?? /* @__PURE__ */ new Map();
+      o.set(i.plugin, i), r.set(i.priority, o);
+    }
+    for (const i of r.values())
+      if (i.size > 1)
+        for (const o of i.values())
+          s.push(o);
+    s.length > 0 ? this.conflicts.set(e, s) : this.conflicts.delete(e);
+  }
+  /**
+   * Get metadata for a specific modifier
+   */
+  getMetadata(e) {
+    return this.metadata.get(e);
+  }
+  /**
+   * Get all registered metadata
+   */
+  getAllMetadata() {
+    return Array.from(this.metadata.values());
+  }
+  /**
+   * Get metadata filtered by category
+   */
+  getModifiersByCategory(e) {
+    return this.getAllMetadata().filter((t) => t.category === e);
+  }
+  getMetadataByCategory(e) {
+    return this.getModifiersByCategory(e);
+  }
+  /**
+   * Get conflicts (multiple modifiers with same name but different plugins)
+   */
+  getConflicts() {
+    return new Map(
+      Array.from(this.conflicts.entries(), ([e, t]) => [e, [...t]])
+    );
+  }
+  registerPlugin(e) {
+    if (!e.name || !e.version)
+      throw new Error("Plugin must define both name and version");
+    if (!e.author)
+      throw new Error(
+        `Plugin '${e.name}' must include an author or organization`
+      );
+    !e.verified && process.env.NODE_ENV !== "production" && console.warn(
+      `⚠️ Registering unverified plugin '${e.name}'. Install plugins from trusted sources.`
+    ), this.plugins.set(e.name, e);
+  }
+  getPluginInfo(e) {
+    return this.plugins.get(e);
+  }
+  listPlugins() {
+    return Array.from(this.plugins.values());
+  }
+};
+u(y, "instanceCount", 0), u(y, "FORBIDDEN_NAMES", /* @__PURE__ */ new Set([
+  "__proto__",
+  "constructor",
+  "prototype",
+  "hasOwnProperty",
+  "isPrototypeOf",
+  "toString",
+  "valueOf"
+])), u(y, "NAME_PATTERN", /^[a-zA-Z_$][a-zA-Z0-9_$]*$/);
+let K = y;
+function _e() {
+  return Q || (Q = new K()), Q;
+}
+const te = _e();
+function w(n, e = {}) {
+  const t = ne();
+  let s;
+  const r = () => {
+    const o = n(s);
+    return s = o, o;
+  }, i = new oe(r, t);
+  return e.name && Object.defineProperty(i, "name", {
+    value: e.name,
+    enumerable: !1
+  }), i.execute(), i;
+}
+process.env.NODE_ENV === "development" && console.log("📤 Created RegistryAdapter for globalModifierRegistry", {
+  registryId: te.instanceId,
+  currentSize: te.list().length
+});
+function Ve(n, e, t = {}, s = {}) {
+  if (!e.length) return n;
+  const r = {
+    componentId: t.componentId || "unknown",
+    phase: t.phase || "creation",
+    ...t.element && { element: t.element },
+    ...t.parentElement && { parentElement: t.parentElement },
+    ...t.componentInstance && {
+      componentInstance: t.componentInstance
+    },
+    ...t.previousModifiers && {
+      previousModifiers: t.previousModifiers
+    }
+  };
+  switch (s.batch ? "batch" : "sequential") {
+    case "batch":
+      return Fe(n, e, r, s);
+    default:
+      return He(n, e, r, s);
+  }
+}
+function He(n, e, t, s) {
+  const r = [...e].sort(
+    (h, c) => h.priority - c.priority
+  );
+  let i = n;
+  const o = [], a = [];
+  for (const h of r)
+    try {
+      const c = h.apply(i, t);
+      c && typeof c == "object" && "type" in c && (i = c), s.immediate && !s.suppressEffects && (o.forEach((l) => l()), o.length = 0);
+    } catch (c) {
+      console.error(`Failed to apply modifier ${h.type}:`, c);
+    }
+  if (a.length > 0) {
+    const h = i.dispose;
+    i.dispose = () => {
+      a.forEach((c) => c()), h && h();
+    };
+  }
+  return i;
+}
+function Fe(n, e, t, s) {
+  const r = Ue(e);
+  let i = n;
+  const o = [], a = [];
+  for (const [h, c] of r)
+    try {
+      i = je(i, c, t);
+    } catch (l) {
+      (typeof process > "u" || process.env.NODE_ENV !== "test") && console.error(`Failed to apply modifier group ${h}:`, l);
+    }
+  if (s.suppressEffects || o.forEach((h) => h()), a.length > 0) {
+    const h = i.dispose;
+    i.dispose = () => {
+      a.forEach((c) => c()), h && h();
+    };
+  }
+  return i;
+}
+function Ue(n) {
+  const e = /* @__PURE__ */ new Map();
+  for (const t of n) {
+    const s = e.get(t.type) || [];
+    s.push(t), e.set(t.type, s);
+  }
+  return e;
+}
+function je(n, e, t) {
+  const s = [...e].sort(
+    (i, o) => i.priority - o.priority
+  );
+  let r = n;
+  for (const i of s)
+    try {
+      const o = i.apply(r, t);
+      o && typeof o == "object" && "type" in o && (r = o);
+    } catch (o) {
+      (typeof process > "u" || process.env.NODE_ENV !== "test") && console.error(`Failed to apply modifier ${i.type}:`, o);
+    }
+  return r;
+}
+const H = /* @__PURE__ */ new Map([
+  ["nav", { role: "navigation", applyARIA: !0 }],
+  ["main", { role: "main", applyARIA: !0 }],
+  ["article", { role: "article", applyARIA: !0 }],
+  ["section", { role: "region", applyARIA: !0 }],
+  ["aside", { role: "complementary", applyARIA: !0 }],
+  ["header", { role: "banner", applyARIA: !1 }],
+  // Context dependent - may not always be page banner
+  ["footer", { role: "contentinfo", applyARIA: !1 }],
+  // Context dependent - may not always be page footer
+  ["form", { role: "form", applyARIA: !0 }],
+  ["search", { role: "search", applyARIA: !0 }],
+  ["dialog", { role: "dialog", applyARIA: !0 }],
+  ["button", { role: "button", applyARIA: !1 }],
+  // Usually implicit
+  ["a", { role: "link", applyARIA: !1 }]
+  // Usually implicit
+]);
+let We = {
+  autoApplySemanticRoles: !0,
+  warnOnOverrides: process.env.NODE_ENV !== "production",
+  warnOnSemanticIssues: process.env.NODE_ENV !== "production",
+  validateTags: !0,
+  allowInvalidTags: !0
+};
+function Be() {
+  return { ...We };
+}
+var Qe = Object.defineProperty, qe = (n, e, t) => e in n ? Qe(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, Ye = (n, e, t) => qe(n, e + "", t);
+const ae = class L {
+  static getInstance() {
+    return L.instance || (L.instance = new L()), L.instance;
+  }
+  /**
+   * Apply semantic ARIA attributes to an element based on its tag
+   */
+  applySemanticAttributes(e, t, s) {
+    const r = Be();
+    if (!r.autoApplySemanticRoles) return;
+    const i = H.get(t);
+    if (!(!i || !i.applyARIA)) {
+      if (s?.role) {
+        r.warnOnSemanticIssues && process.env.NODE_ENV !== "production" && console.warn(
+          `ARIA role '${s.role}' overrides semantic role '${i.role}' for tag '${t}'`
+        );
+        return;
+      }
+      if (e.hasAttribute("role")) {
+        r.warnOnSemanticIssues && process.env.NODE_ENV !== "production" && console.warn(
+          `Existing role attribute overrides semantic role '${i.role}' for tag '${t}'`
+        );
+        return;
+      }
+      e.setAttribute("role", i.role);
+    }
+  }
+  /**
+   * Get semantic role information for a tag
+   */
+  getSemanticRole(e) {
+    return H.get(e);
+  }
+  /**
+   * Check if a tag has automatic ARIA role application enabled
+   */
+  hasAutoARIA(e) {
+    const t = H.get(e);
+    return t ? t.applyARIA : !1;
+  }
+  /**
+   * Get all tags that support automatic ARIA roles
+   */
+  getAutoARIATags() {
+    return Array.from(H.entries()).filter(([, e]) => e.applyARIA).map(([e]) => e);
+  }
+  /**
+   * Apply semantic attributes during DOM node creation
+   * This is called by the renderer when creating elements
+   */
+  processElementNode(e, t, s, r) {
+    if (this.applySemanticAttributes(e, t, r), s && process.env.NODE_ENV !== "production") {
+      const i = this.getSemanticRole(t);
+      i && e.setAttribute(
+        "data-tachui-semantic",
+        JSON.stringify({
+          originalComponent: s.originalType,
+          overriddenTo: t,
+          semanticRole: i.role,
+          autoApplied: i.applyARIA
+        })
+      );
+    }
+  }
+};
+Ye(ae, "instance");
+let Xe = ae;
+const Ge = Xe.getInstance();
+var Ke = Object.defineProperty, Ze = (n, e, t) => e in n ? Ke(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, q = (n, e, t) => Ze(n, typeof e != "symbol" ? e + "" : e, t);
+const Je = /* @__PURE__ */ new Set([
+  "click",
+  "dblclick",
+  "mousedown",
+  "mouseup",
+  "mouseover",
+  "mouseout",
+  "mouseenter",
+  "mouseleave",
+  "focusin",
+  // Bubbles, unlike 'focus'
+  "focusout",
+  // Bubbles, unlike 'blur'
+  "input",
+  "change",
+  "submit",
+  "keydown",
+  "keyup",
+  "keypress"
+]), se = /* @__PURE__ */ new Set([
+  "scroll",
+  "wheel",
+  "touchstart",
+  "touchmove",
+  "touchend"
+]);
+class et {
+  constructor() {
+    q(this, "containerListeners", /* @__PURE__ */ new WeakMap()), q(this, "elementHandlers", /* @__PURE__ */ new WeakMap()), q(this, "handlerCounts", /* @__PURE__ */ new WeakMap());
+  }
+  /**
+   * Register an event handler with delegation
+   */
+  register(e, t, s, r) {
+    let i = this.elementHandlers.get(t);
+    i && i.has(s) && this.unregister(e, t, s), i || (i = /* @__PURE__ */ new Map(), this.elementHandlers.set(t, i)), i.set(s, { handler: r, element: t });
+    let o = this.handlerCounts.get(e);
+    o || (o = /* @__PURE__ */ new Map(), this.handlerCounts.set(e, o));
+    const a = o.get(s) || 0;
+    return o.set(s, a + 1), this.ensureRootListener(e, s), () => {
+      this.unregister(e, t, s);
+    };
+  }
+  /**
+   * Unregister an event handler
+   */
+  unregister(e, t, s) {
+    const r = this.elementHandlers.get(t);
+    r && (r.delete(s), r.size === 0 && this.elementHandlers.delete(t));
+    const i = this.handlerCounts.get(e);
+    if (i) {
+      const o = (i.get(s) || 0) - 1;
+      o <= 0 ? (i.delete(s), this.removeRootListener(e, s)) : i.set(s, o);
+    }
+  }
+  /**
+   * Ensure root listener exists for event type on container
+   */
+  ensureRootListener(e, t) {
+    let s = this.containerListeners.get(e);
+    if (s || (s = /* @__PURE__ */ new Map(), this.containerListeners.set(e, s)), s.has(t))
+      return;
+    const r = (o) => {
+      this.handleDelegatedEvent(e, t, o);
+    }, i = se.has(t) ? { passive: !0 } : { passive: !1 };
+    e.addEventListener(t, r, i), s.set(t, r);
+  }
+  /**
+   * Remove root listener for event type on container
+   */
+  removeRootListener(e, t) {
+    const s = this.containerListeners.get(e);
+    if (!s) return;
+    const r = s.get(t);
+    r && (e.removeEventListener(t, r), s.delete(t));
+  }
+  /**
+   * Handle delegated event by finding target handler
+   */
+  handleDelegatedEvent(e, t, s) {
+    const r = s.target;
+    if (!r) return;
+    let i = r;
+    for (; i && i !== e; ) {
+      const o = this.elementHandlers.get(i);
+      if (o) {
+        const a = o.get(t);
+        if (a) {
+          try {
+            a.handler(s);
+          } catch (h) {
+            console.error(`Delegated event handler error for ${t}:`, h);
+          }
+          return;
+        }
+      }
+      i = i.parentElement;
+    }
+  }
+  /**
+   * Check if event type should use delegation
+   */
+  shouldDelegate(e) {
+    return Je.has(e);
+  }
+  /**
+   * Check if event type should use passive listeners
+   */
+  shouldBePassive(e) {
+    return se.has(e);
+  }
+  /**
+   * Get metrics for debugging
+   */
+  getMetrics(e) {
+    const t = this.handlerCounts.get(e);
+    if (!t)
+      return { eventTypes: [], totalHandlers: 0, handlersPerType: {} };
+    const s = {};
+    let r = 0;
+    return t.forEach((i, o) => {
+      s[o] = i, r += i;
+    }), {
+      eventTypes: Array.from(t.keys()),
+      totalHandlers: r,
+      handlersPerType: s
+    };
+  }
+  /**
+   * Cleanup all handlers for a container
+   */
+  cleanupContainer(e) {
+    const t = this.containerListeners.get(e);
+    t && (t.forEach((s, r) => {
+      e.removeEventListener(r, s);
+    }), this.containerListeners.delete(e)), this.handlerCounts.delete(e);
+  }
+}
+const Y = new et();
+var tt = Object.defineProperty, st = (n, e, t) => e in n ? tt(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, R = (n, e, t) => st(n, typeof e != "symbol" ? e + "" : e, t);
+class le {
+  constructor() {
+    R(this, "nodeMap", /* @__PURE__ */ new WeakMap()), R(this, "cleanupMap", /* @__PURE__ */ new WeakMap()), R(this, "renderedNodes", /* @__PURE__ */ new Set()), R(this, "elementToContainer", /* @__PURE__ */ new WeakMap()), R(this, "metrics", {
+      created: 0,
+      adopted: 0,
+      removed: 0,
+      inserted: 0,
+      moved: 0,
+      cacheHits: 0,
+      cacheMisses: 0,
+      attributeWrites: 0,
+      attributeRemovals: 0,
+      textUpdates: 0,
+      modifierApplications: 0
+    });
+  }
+  /**
+   * Render a DOM node to an actual DOM element
+   */
+  render(e, t) {
+    return Array.isArray(e) ? this.renderFragment(e, t) : this.renderSingle(e, t);
+  }
+  /**
+   * Check if a DOM node has been rendered and tracked.
+   */
+  hasNode(e) {
+    return this.nodeMap.has(e);
+  }
+  /**
+   * Get the rendered DOM element associated with a node.
+   */
+  getRenderedNode(e) {
+    return this.nodeMap.get(e);
+  }
+  /**
+   * Render a single DOM node
+   */
+  renderSingle(e, t) {
+    this.renderedNodes.add(e);
+    let s;
+    switch (e.type) {
+      case "element":
+        s = this.createOrUpdateElement(e, t);
+        break;
+      case "text":
+        s = this.createOrUpdateTextNode(e);
+        break;
+      case "comment":
+        s = this.createComment(e), this.metrics.created++;
+        break;
+      default:
+        throw new Error(`Unknown node type: ${e.type}`);
+    }
+    if (this.nodeMap.set(e, s), e.element = s, s instanceof Element && t && this.elementToContainer.set(s, t), s instanceof Element) {
+      let r = [];
+      "modifiers" in e && Array.isArray(e.modifiers) && e.modifiers.length > 0 && (r = e.modifiers), "componentMetadata" in e && e.componentMetadata?.modifiers && Array.isArray(e.componentMetadata.modifiers) && e.componentMetadata.modifiers.length > 0 && (r = e.componentMetadata.modifiers), r.length > 0 && this.applyModifiersToElement(s, r, e);
+    }
+    return e.dispose && this.addCleanup(s, e.dispose), t && this.appendNode(t, s), s;
+  }
+  /**
+   * Render multiple nodes as a document fragment
+   */
+  renderFragment(e, t) {
+    const s = document.createDocumentFragment();
+    return e.forEach((r) => {
+      const i = this.renderSingle(r);
+      s.appendChild(i);
+    }), t && (t.appendChild(s), this.metrics.inserted += e.length), s;
+  }
+  /**
+   * Create a DOM element with props and children
+   */
+  createOrUpdateElement(e, t) {
+    if (!e.tag)
+      throw new Error("Element node must have a tag");
+    if (e.element && e.element instanceof Element) {
+      const r = e.element;
+      return t && this.elementToContainer.set(r, t), this.updateProps(r, e, t), this.updateChildren(r, e), r;
+    }
+    const s = document.createElement(e.tag);
+    return this.metrics.created++, t && this.elementToContainer.set(s, t), this.applyDebugAttributes(s, e), this.updateProps(s, e, t), this.updateChildren(s, e), s;
+  }
+  updateProps(e, t, s) {
+    const r = t.props || {}, i = t.__appliedProps || {};
+    if (Object.keys(i).forEach((o) => {
+      if (!(o in r)) {
+        if (o === "key" || o === "children" || o.startsWith("on"))
+          return;
+        this.setElementProp(e, o, void 0);
+      }
+    }), Object.entries(r).forEach(([o, a]) => {
+      o === "key" || o === "children" || i && i[o] === a || this.applyProp(e, o, a, s);
+    }), t.__appliedProps = { ...r }, "componentMetadata" in t && t.componentMetadata) {
+      const o = t.componentMetadata;
+      if (o.overriddenTo && o.originalType && t.tag)
+        try {
+          Ge.processElementNode(
+            e,
+            t.tag,
+            o,
+            r?.aria || void 0
+          );
+        } catch (a) {
+          console.warn("[tachUI] Could not process semantic attributes:", a);
+        }
+    }
+  }
+  updateChildren(e, t) {
+    const s = t.__renderedChildren || [], r = t.children || [], i = this.elementToContainer.get(e), o = typeof process < "u" && process.env?.TACHUI_DEBUG_PHASE1B === "1";
+    if (s.length === r.length && s.length > 0 && s.every((l, d) => l === r[d])) {
+      r.forEach((l) => {
+        this.updateExistingNode(l);
+      }), t.__renderedChildren = r;
+      return;
+    }
+    if (s.length === 0) {
+      r.forEach((l) => {
+        if (!l || l.type == null) return;
+        const d = this.renderSingle(l, i);
+        this.appendNode(e, d);
+      }), t.__renderedChildren = r;
+      return;
+    }
+    const a = /* @__PURE__ */ new Map(), h = [];
+    s.forEach((l) => {
+      l.key != null ? a.set(l.key, l) : h.push(l);
+    });
+    const c = Array.from({ length: r.length });
+    if (r.forEach((l, d) => {
+      let f;
+      l.key != null ? (f = a.get(l.key), f && a.delete(l.key)) : h.length > 0 && (f = h.shift()), f && this.adoptNode(f, l);
+      const p = this.renderSingle(l, i);
+      c[d] = p;
+    }), o && t.tag) {
+      const l = r.map((p) => p.key ?? null), d = s.map((p) => p.key ?? null), f = c.map(
+        (p) => p && "getAttribute" in p ? p.getAttribute("data-id") : null
+      );
+      console.log("[diff] state", {
+        parent: t.tag,
+        prev: d,
+        next: l,
+        dom: f
+      });
+    }
+    if (a.forEach((l) => {
+      this.removeNode(l);
+    }), h.forEach((l) => {
+      this.removeNode(l);
+    }), typeof e.insertBefore == "function" && typeof e.appendChild == "function") {
+      let l = null;
+      for (let d = c.length - 1; d >= 0; d--) {
+        const f = c[d];
+        f && (this.insertNode(e, f, l), l = f);
+      }
+    }
+    t.__renderedChildren = r;
+  }
+  updateExistingNode(e) {
+    if (e.type === "element" && e.element instanceof Element) {
+      const t = this.elementToContainer.get(e.element);
+      this.updateProps(e.element, e, t), this.updateChildren(e.element, e);
+    } else e.type === "text" && e.element instanceof Text && e.element.textContent !== e.text && (e.element.textContent = e.text || "", this.recordTextUpdate());
+  }
+  /**
+   * Apply debug attributes to DOM element if debug mode is enabled
+   */
+  applyDebugAttributes(e, t) {
+  }
+  /**
+   * Create or update a text node
+   */
+  createOrUpdateTextNode(e) {
+    if (e.element && e.element instanceof Text) {
+      const t = e.element;
+      if (t.textContent !== e.text && (t.textContent = e.text || "", this.recordTextUpdate()), e.reactiveContent && !e.dispose) {
+        const s = e.reactiveContent, r = w(() => {
+          try {
+            const i = s();
+            e.text = String(i);
+            const o = t.parentElement;
+            if (o && o.__tachui_asHTML)
+              return;
+            t.textContent = e.text, this.recordTextUpdate();
+          } catch (i) {
+            console.error("createOrUpdateTextNode() reactive effect error:", i);
+          }
+        });
+        e.dispose = () => {
+          r.dispose();
+        };
+      }
+      return t;
+    }
+    return this.createTextNode(e);
+  }
+  /**
+   * Create a text node
+   */
+  createTextNode(e) {
+    const t = document.createTextNode(e.text || "");
+    if (this.metrics.created++, this.recordTextUpdate(), e.reactiveContent) {
+      const s = e.reactiveContent, r = w(() => {
+        try {
+          const i = s();
+          e.text = String(i);
+          const o = t.parentElement;
+          if (o && o.__tachui_asHTML)
+            return;
+          t.textContent = e.text, this.recordTextUpdate();
+        } catch (i) {
+          console.error("createTextNode() reactive effect error:", i);
+        }
+      });
+      e.dispose = () => {
+        r.dispose();
+      };
+    }
+    return t;
+  }
+  /**
+   * Create a comment node
+   */
+  createComment(e) {
+    return this.metrics.created++, document.createComment(e.text || "");
+  }
+  /**
+   * Apply props to a DOM element with reactive updates
+   */
+  applyProps(e, t) {
+    Object.entries(t).forEach(([s, r]) => {
+      this.applyProp(e, s, r);
+    });
+  }
+  /**
+   * Apply a single prop to an element
+   */
+  applyProp(e, t, s, r) {
+    if (t === "className" || t === "class") {
+      this.applyClassName(e, s);
+      return;
+    }
+    if (t === "style") {
+      this.applyStyle(e, s);
+      return;
+    }
+    if (t.startsWith("on") && typeof s == "function") {
+      this.applyEventListener(e, t, s, r);
+      return;
+    }
+    if (T(s) || P(s)) {
+      const i = w(() => {
+        const o = s();
+        this.setElementProp(e, t, o);
+      });
+      this.addCleanup(e, () => {
+        i.dispose();
+      });
+      return;
+    }
+    this.setElementProp(e, t, s);
+  }
+  /**
+   * Set a property on an element
+   */
+  setElementProp(e, t, s) {
+    if (s == null) {
+      e.hasAttribute(t) && (e.removeAttribute(t), this.recordAttributeRemoval());
+      return;
+    }
+    const r = e;
+    if ((t === "value" || t === "checked" || t === "disabled") && t in r) {
+      r[t] !== s && (r[t] = s, this.recordAttributeWrite());
+      return;
+    }
+    if (typeof s == "boolean") {
+      s ? e.hasAttribute(t) || (e.setAttribute(t, ""), this.recordAttributeWrite()) : e.hasAttribute(t) ? (e.removeAttribute(t), this.recordAttributeRemoval()) : e.removeAttribute(t);
+      return;
+    }
+    const i = e.getAttribute(t), o = String(s);
+    i !== o && (e.setAttribute(t, o), this.recordAttributeWrite());
+  }
+  /**
+   * Apply className with reactive updates
+   */
+  applyClassName(e, t) {
+    if (T(t) || P(t)) {
+      const s = w(() => {
+        const r = t(), i = this.normalizeClassName(r);
+        e.className !== i && (e.className = i, this.recordAttributeWrite());
+      });
+      this.addCleanup(e, () => {
+        s.dispose();
+      });
+    } else {
+      const s = this.normalizeClassName(t);
+      e.className !== s && (e.className = s, this.recordAttributeWrite());
+    }
+  }
+  /**
+   * Normalize className value
+   */
+  normalizeClassName(e) {
+    return Array.isArray(e) ? e.filter(Boolean).join(" ") : typeof e == "object" && e !== null ? Object.entries(e).filter(([, t]) => !!t).map(([t]) => t).join(" ") : String(e || "");
+  }
+  /**
+   * Apply styles with reactive updates
+   */
+  applyStyle(e, t) {
+    const s = e;
+    if (T(t) || P(t)) {
+      const r = w(() => {
+        const i = t();
+        this.setElementStyles(s, i);
+      });
+      this.addCleanup(e, () => {
+        r.dispose();
+      });
+    } else
+      this.setElementStyles(s, t);
+  }
+  /**
+   * Set styles on an element
+   */
+  setElementStyles(e, t) {
+    if (typeof t == "string") {
+      e.style.cssText !== t && (e.style.cssText = t, this.recordAttributeWrite());
+      return;
+    }
+    if (typeof t == "object" && t !== null) {
+      const s = e.__appliedStyles || {};
+      Object.keys(s).forEach((r) => {
+        r in t || (e.style.removeProperty(r.replace(/[A-Z]/g, (i) => `-${i.toLowerCase()}`)), this.recordAttributeRemoval());
+      }), Object.entries(t).forEach(([r, i]) => {
+        if (T(i) || P(i)) {
+          const o = w(() => {
+            const a = i(), h = r.replace(/[A-Z]/g, (c) => `-${c.toLowerCase()}`);
+            if (a == null)
+              e.style.removeProperty(h), this.recordAttributeRemoval();
+            else {
+              const c = String(a);
+              e.style.getPropertyValue(h) !== c && (e.style.setProperty(h, c), this.recordAttributeWrite());
+            }
+          });
+          this.addCleanup(e, () => {
+            o.dispose();
+          });
+        } else {
+          const o = r.replace(/[A-Z]/g, (a) => `-${a.toLowerCase()}`);
+          if (i == null)
+            e.style.getPropertyValue(o) && (e.style.removeProperty(o), this.recordAttributeRemoval());
+          else {
+            const a = String(i);
+            e.style.getPropertyValue(o) !== a && (e.style.setProperty(o, a), this.recordAttributeWrite());
+          }
+        }
+      }), e.__appliedStyles = { ...t };
+    }
+  }
+  /**
+   * Apply event listener (with delegation if possible)
+   */
+  applyEventListener(e, t, s, r) {
+    let i = t.slice(2).toLowerCase();
+    i === "focus" ? i = "focusin" : i === "blur" && (i = "focusout");
+    const o = r || this.elementToContainer.get(e);
+    if (o && Y.shouldDelegate(i)) {
+      const c = Y.register(
+        o,
+        e,
+        i,
+        s
+      );
+      this.addCleanup(e, c);
+      return;
+    }
+    const a = (c) => {
+      try {
+        s(c);
+      } catch (l) {
+        console.error(`Event handler error for ${t}:`, l);
+      }
+    }, h = Y.shouldBePassive(i) ? { passive: !0 } : void 0;
+    e.addEventListener(i, a, h), this.addCleanup(e, () => {
+      e.removeEventListener(i, a, h);
+    });
+  }
+  /**
+   * Add cleanup function for an element
+   */
+  addCleanup(e, t) {
+    const s = this.cleanupMap.get(e) || [];
+    s.push(t), this.cleanupMap.set(e, s);
+  }
+  /**
+   * Update an existing DOM node
+   */
+  updateNode(e, t) {
+    const s = this.nodeMap.get(e);
+    !s || typeof s.setAttribute != "function" || t && this.applyProps(s, t);
+  }
+  /**
+   * Remove a DOM node and run cleanup
+   */
+  removeNode(e) {
+    this.cleanupNode(e, !0);
+  }
+  /**
+   * Cleanup a node (and its descendants) and optionally remove from DOM.
+   */
+  cleanupNode(e, t) {
+    const s = this.nodeMap.get(e);
+    if (e.children && e.children.length > 0 && e.children.forEach((i) => {
+      this.cleanupNode(i, !1);
+    }), !s) {
+      e.element !== void 0 && (e.element = void 0), this.renderedNodes.delete(e), this.nodeMap.delete(e);
+      return;
+    }
+    const r = this.cleanupMap.get(s);
+    r && (r.forEach((i) => {
+      try {
+        i();
+      } catch (o) {
+        console.error("Cleanup error:", o);
+      }
+    }), this.cleanupMap.delete(s)), t && s.parentNode && s.parentNode.removeChild(s), this.nodeMap.delete(e), e.element !== void 0 && (e.element = void 0), this.renderedNodes.delete(e), this.metrics.removed++;
+  }
+  /**
+   * Create reactive text content
+   */
+  createReactiveText(e) {
+    const t = document.createTextNode("");
+    return w(() => {
+      t.textContent = e();
+    }), t;
+  }
+  /**
+   * Create reactive element with dynamic props
+   */
+  createReactiveElement(e, t, s) {
+    const r = document.createElement(e);
+    return w(() => {
+      const i = t();
+      this.applyProps(r, i);
+    }), s && s.forEach((i) => {
+      const o = this.renderSingle(i);
+      r.appendChild(o);
+    }), r;
+  }
+  /**
+   * Apply modifiers to a DOM element
+   */
+  applyModifiersToElement(e, t, s) {
+    try {
+      t.length > 0 && this.recordModifierApplications(t.length);
+      const r = s.componentInstance || s.componentMetadata && s.componentMetadata.componentInstance || s._originalComponent || // Use original component if available
+      s;
+      Ve(
+        s,
+        t,
+        {
+          element: e,
+          componentId: s.componentId || "unknown",
+          phase: "creation",
+          componentInstance: r
+          // Pass the component instance
+        },
+        {
+          batch: !0
+          // Enable batched modifier application
+        }
+      );
+    } catch (r) {
+      console.error("Failed to apply modifiers to element:", r);
+    }
+  }
+  /**
+   * Adopt an existing DOM mapping from one node to another.
+   */
+  adoptNode(e, t) {
+    const s = this.nodeMap.get(e);
+    s && (this.nodeMap.set(t, s), this.nodeMap.delete(e), this.renderedNodes.delete(e), this.renderedNodes.add(t), t.element = s, e.dispose && (t.dispose = e.dispose), e.__renderedChildren && (t.__renderedChildren = e.__renderedChildren), e.__appliedProps && (t.__appliedProps = e.__appliedProps), this.metrics.adopted++);
+  }
+  /**
+   * Cleanup all tracked elements
+   */
+  cleanup() {
+    for (const e of this.renderedNodes)
+      if (e.dispose && typeof e.dispose == "function")
+        try {
+          e.dispose();
+        } catch (t) {
+          console.error("Cleanup error:", t);
+        }
+    this.renderedNodes.clear(), this.nodeMap = /* @__PURE__ */ new WeakMap(), this.cleanupMap = /* @__PURE__ */ new WeakMap(), this.resetMetrics();
+  }
+  resetMetrics() {
+    this.metrics = {
+      created: 0,
+      adopted: 0,
+      removed: 0,
+      inserted: 0,
+      moved: 0,
+      cacheHits: 0,
+      cacheMisses: 0,
+      attributeWrites: 0,
+      attributeRemovals: 0,
+      textUpdates: 0,
+      modifierApplications: 0
+    };
+  }
+  getMetrics() {
+    return { ...this.metrics };
+  }
+  recordCacheHit() {
+    this.metrics.cacheHits++;
+  }
+  recordCacheMiss() {
+    this.metrics.cacheMisses++;
+  }
+  insertNode(e, t, s) {
+    const r = typeof process < "u" && process.env?.TACHUI_DEBUG_PHASE1B === "1";
+    t.parentNode !== e ? (r && console.log("[diff] insertNode append", {
+      tag: "tagName" in t ? t.tagName : "text",
+      before: s && "getAttribute" in s ? s.getAttribute("data-id") : null
+    }), e.insertBefore(t, s), this.metrics.inserted++) : t.nextSibling !== s && (r && console.log("[diff] insertNode move", {
+      tag: "tagName" in t ? t.tagName : "text",
+      before: s && "getAttribute" in s ? s.getAttribute("data-id") : null
+    }), e.insertBefore(t, s), this.metrics.moved++);
+  }
+  appendNode(e, t) {
+    t.parentNode !== e && (e.appendChild(t), this.metrics.inserted++);
+  }
+  recordAttributeWrite() {
+    this.metrics.attributeWrites++;
+  }
+  recordAttributeRemoval() {
+    this.metrics.attributeRemovals++;
+  }
+  recordTextUpdate() {
+    this.metrics.textUpdates++;
+  }
+  recordModifierApplications(e) {
+    this.metrics.modifierApplications += e;
+  }
+}
+new le();
+var rt = Object.defineProperty, it = (n, e, t) => e in n ? rt(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, E = (n, e, t) => it(n, typeof e != "symbol" ? e + "" : e, t);
+class nt {
+  constructor(e, t) {
+    E(this, "id"), E(this, "parent"), E(this, "providers", /* @__PURE__ */ new Map()), E(this, "consumers", /* @__PURE__ */ new Set()), E(this, "cleanup", /* @__PURE__ */ new Set()), E(this, "stateStore", /* @__PURE__ */ new Map()), E(this, "bindingStore", /* @__PURE__ */ new Map()), E(this, "createdAt", Date.now()), E(this, "updateCount", 0), this.id = e, this.parent = t;
+  }
+  /**
+   * Store state value for a property
+   */
+  setState(e, t) {
+    this.stateStore.set(e, t), this.updateCount++;
+  }
+  /**
+   * Get state value for a property
+   */
+  getState(e) {
+    return this.stateStore.get(e);
+  }
+  /**
+   * Check if state exists for a property
+   */
+  hasState(e) {
+    return this.stateStore.has(e);
+  }
+  /**
+   * Store binding for a property
+   */
+  setBinding(e, t) {
+    this.bindingStore.set(e, t);
+  }
+  /**
+   * Get binding for a property
+   */
+  getBinding(e) {
+    return this.bindingStore.get(e);
+  }
+  /**
+   * Provide a value for dependency injection
+   */
+  provide(e, t) {
+    this.providers.set(e, t);
+  }
+  /**
+   * Consume a value from dependency injection hierarchy
+   */
+  consume(e) {
+    if (this.consumers.add(e), this.providers.has(e))
+      return this.providers.get(e);
+    let t = this.parent;
+    for (; t; ) {
+      if (t.providers.has(e))
+        return t.providers.get(e);
+      t = t.parent;
+    }
+  }
+  /**
+   * Register cleanup function
+   */
+  onCleanup(e) {
+    this.cleanup.add(e);
+  }
+  /**
+   * Dispose of context and run cleanup
+   */
+  dispose() {
+    for (const e of this.cleanup)
+      try {
+        e();
+      } catch (t) {
+        console.error(`Error in component context cleanup (${this.id}):`, t);
+      }
+    this.cleanup.clear(), this.stateStore.clear(), this.bindingStore.clear(), this.providers.clear(), this.consumers.clear();
+  }
+  /**
+   * Get performance metrics
+   */
+  getMetrics() {
+    return {
+      id: this.id,
+      createdAt: this.createdAt,
+      updateCount: this.updateCount,
+      stateCount: this.stateStore.size,
+      bindingCount: this.bindingStore.size,
+      providerCount: this.providers.size,
+      consumerCount: this.consumers.size
+    };
+  }
+}
+function ot(n, e) {
+  return new nt(n, e);
+}
+var at = Object.defineProperty, lt = (n, e, t) => e in n ? at(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, O = (n, e, t) => lt(n, typeof e != "symbol" ? e + "" : e, t);
+const ct = class k {
+  constructor() {
+    O(this, "components", /* @__PURE__ */ new Map()), O(this, "contexts", /* @__PURE__ */ new Map()), O(this, "cleanupQueue", /* @__PURE__ */ new Set()), O(this, "updateQueue", /* @__PURE__ */ new Set()), O(this, "isUpdating", !1);
+  }
+  static getInstance() {
+    return k.instance || (k.instance = new k()), k.instance;
+  }
+  /**
+   * Register a new component instance
+   */
+  registerComponent(e) {
+    this.components.set(e.id, e), e.cleanup && e.cleanup.forEach((t) => {
+      this.cleanupQueue.add(t);
+    });
+  }
+  /**
+   * Unregister and cleanup a component
+   */
+  unregisterComponent(e) {
+    const t = this.components.get(e);
+    t && (t.cleanup && t.cleanup.forEach((s) => {
+      try {
+        s();
+      } catch (r) {
+        console.error(`Cleanup error for component ${e}:`, r);
+      }
+    }), this.components.delete(e), t.context && this.cleanupContext(t.context.id));
+  }
+  /**
+   * Get component instance by ID
+   */
+  getComponent(e) {
+    return this.components.get(e);
+  }
+  /**
+   * Schedule component for update
+   */
+  scheduleUpdate(e) {
+    this.updateQueue.add(e), this.isUpdating || this.flushUpdates();
+  }
+  /**
+   * Process all scheduled updates
+   */
+  async flushUpdates() {
+    if (this.isUpdating) return;
+    this.isUpdating = !0, await new Promise((t) => queueMicrotask(() => t(void 0)));
+    const e = Array.from(this.updateQueue);
+    this.updateQueue.clear(), e.forEach((t) => {
+      const s = this.components.get(t);
+      if (s)
+        try {
+          this.updateComponent(s);
+        } catch (r) {
+          console.error(`Update error for component ${t}:`, r);
+        }
+    }), this.isUpdating = !1;
+  }
+  /**
+   * Update a specific component instance
+   */
+  updateComponent(e) {
+    e.props && (e.prevProps = { ...e.props }), e.render(), e.mounted || (e.mounted = !0);
+  }
+  /**
+   * Cleanup context by ID
+   */
+  cleanupContext(e) {
+    const t = this.contexts.get(e);
+    t && (t.cleanup.forEach((s) => {
+      try {
+        s();
+      } catch (r) {
+        console.error(`Context cleanup error for ${e}:`, r);
+      }
+    }), this.contexts.delete(e));
+  }
+  /**
+   * Get all registered components (for debugging)
+   */
+  getAllComponents() {
+    return Array.from(this.components.values());
+  }
+  /**
+   * Cleanup all components and resources
+   */
+  cleanup() {
+    Array.from(this.components.keys()).forEach((e) => {
+      this.unregisterComponent(e);
+    }), this.cleanupQueue.forEach((e) => {
+      try {
+        e();
+      } catch (t) {
+        console.error("Global cleanup error:", t);
+      }
+    }), this.cleanupQueue.clear(), this.updateQueue.clear();
+  }
+};
+O(ct, "instance");
+var ht = Object.defineProperty, dt = (n, e, t) => e in n ? ht(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, C = (n, e, t) => dt(n, typeof e != "symbol" ? e + "" : e, t);
+const ce = class z {
+  constructor() {
+    C(this, "contexts", /* @__PURE__ */ new Map()), C(this, "providerStack", /* @__PURE__ */ new Map()), C(this, "currentComponent", null);
+  }
+  static getInstance() {
+    return z.instance || (z.instance = new z()), z.instance;
+  }
+  /**
+   * Set the current component context for provider resolution
+   */
+  setCurrentComponent(e) {
+    this.currentComponent = e;
+  }
+  /**
+   * Get the current component context
+   */
+  getCurrentComponent() {
+    return this.currentComponent;
+  }
+  /**
+   * Register a context provider
+   */
+  registerProvider(e, t, s) {
+    this.providerStack.has(e) || this.providerStack.set(e, []);
+    const r = this.providerStack.get(e), [i, o] = G(t), a = {
+      value: t,
+      signal: [i, o],
+      subscribers: /* @__PURE__ */ new Set(),
+      providers: /* @__PURE__ */ new Set([s])
+    };
+    return r.push(a), s.providers.set(e, a), () => {
+      const h = r.indexOf(a);
+      h !== -1 && r.splice(h, 1), s.providers.delete(e), a.subscribers.clear(), a.providers.clear();
+    };
+  }
+  /**
+   * Get context value with reactive subscription
+   */
+  getContextValue(e, t) {
+    const s = this.providerStack.get(e), r = s && s.length > 0 ? s[s.length - 1] : null;
+    if (r)
+      return this.currentComponent && (r.subscribers.add(this.currentComponent.id), this.currentComponent.consumers.add(e)), [r.signal[0], !0];
+    const [i] = G(t);
+    return [i, !1];
+  }
+  /**
+   * Update context value and notify subscribers
+   */
+  updateContextValue(e, t) {
+    const s = this.providerStack.get(e), r = s && s.length > 0 ? s[s.length - 1] : null;
+    return r ? (r.value = t, r.signal[1](t), !0) : !1;
+  }
+  /**
+   * Get all registered contexts (for debugging)
+   */
+  getAllContexts() {
+    const e = /* @__PURE__ */ new Map();
+    for (const [t, s] of this.providerStack.entries())
+      s.length > 0 && e.set(t, s[s.length - 1]);
+    return e;
+  }
+  /**
+   * Clear all contexts (for testing)
+   */
+  clear() {
+    this.contexts.clear(), this.providerStack.clear(), this.currentComponent = null;
+  }
+};
+C(ce, "instance");
+let ut = ce, pt = class {
+  constructor() {
+    C(this, "registry", ut.getInstance());
+  }
+  /**
+   * Create a context provider component
+   */
+  createProvider(e, t, s) {
+    return {
+      type: "component",
+      render: () => {
+        const r = this.registry.registerProvider(
+          e.symbol,
+          t,
+          ot(`provider_${e.symbol.toString()}`)
+        ), i = s.flatMap((o) => {
+          let a = o;
+          "build" in o && typeof o.build == "function" && (a = o.build());
+          const h = a.render();
+          return Array.isArray(h) ? h : [h];
+        });
+        return [
+          {
+            type: "element",
+            tag: "div",
+            props: { "data-context-provider": e.displayName || "provider" },
+            children: i,
+            dispose: r
+          }
+        ];
+      },
+      props: { children: s },
+      id: `provider_${Date.now()}`,
+      children: s
+    };
+  }
+  /**
+   * Set current component for context resolution
+   */
+  setCurrentComponent(e) {
+    this.registry.setCurrentComponent(e);
+  }
+  /**
+   * Update a context value
+   */
+  updateContext(e, t) {
+    return this.registry.updateContextValue(e.symbol, t);
+  }
+  /**
+   * Get all active contexts (for debugging)
+   */
+  getAllContexts() {
+    return this.registry.getAllContexts();
+  }
+  /**
+   * Clear all contexts
+   */
+  clear() {
+    this.registry.clear();
+  }
+};
+class ft {
+  constructor() {
+    C(this, "services", /* @__PURE__ */ new Map()), C(this, "factories", /* @__PURE__ */ new Map()), C(this, "singletons", /* @__PURE__ */ new Map()), C(this, "scoped", /* @__PURE__ */ new Map()), C(this, "dependencies", /* @__PURE__ */ new Map());
+  }
+  /**
+   * Register a service with the container
+   */
+  register(e, t, s = {}) {
+    this.services.set(e, t), s.dependencies && this.dependencies.set(e, s.dependencies), s.singleton && this.singletons.set(e, null), s.scoped && this.scoped.set(e, null);
+  }
+  /**
+   * Resolve a service from the container
+   */
+  resolve(e) {
+    if (this.singletons.has(e)) {
+      let t = this.singletons.get(e);
+      return t === null && (t = this.createInstance(e), this.singletons.set(e, t)), t;
+    }
+    if (this.scoped.has(e)) {
+      let t = this.scoped.get(e);
+      return t === null && (t = this.createInstance(e), this.scoped.set(e, t)), t;
+    }
+    return this.createInstance(e);
+  }
+  /**
+   * Create instance with dependency injection
+   */
+  createInstance(e) {
+    const t = (this.dependencies.get(e) || []).map((i) => this.resolve(i)), s = this.factories.get(e);
+    if (s)
+      return s(...t);
+    const r = this.services.get(e);
+    if (r) {
+      if (typeof r == "function")
+        try {
+          return new r(...t);
+        } catch {
+          return r(...t);
+        }
+      return r;
+    }
+    throw new Error(`Service ${String(e)} not found in DI container`);
+  }
+  /**
+   * Check if service is registered
+   */
+  has(e) {
+    return this.services.has(e) || this.factories.has(e);
+  }
+  /**
+   * Clear the container
+   */
+  clear() {
+    this.services.clear(), this.factories.clear(), this.singletons.clear(), this.scoped.clear(), this.dependencies.clear();
+  }
+  /**
+   * Get all registered services (for debugging)
+   */
+  getRegistered() {
+    return [...this.services.keys(), ...this.factories.keys()];
+  }
+}
+new ft();
+new pt();
+new le();
+var mt = Object.defineProperty, gt = (n, e, t) => e in n ? mt(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, X = (n, e, t) => gt(n, typeof e != "symbol" ? e + "" : e, t);
+const yt = {
+  sanitizeClassNames: !0,
+  sanitizationRules: {
+    allowNumbers: !0,
+    allowUnderscores: !0,
+    customReplacements: {}
+  },
+  enableCaching: !0,
+  maxCacheSize: 1e3,
+  warnDuplicateClasses: process.env.NODE_ENV === "development",
+  warnInvalidClasses: process.env.NODE_ENV === "development"
+};
+class vt {
+  constructor(e = {}) {
+    X(this, "config"), X(this, "classCache"), X(this, "processingCache"), this.config = { ...yt, ...e };
+    const t = (() => {
+      try {
+        return typeof Map < "u" && typeof Map == "function";
+      } catch {
+        return !1;
+      }
+    })();
+    this.classCache = t ? /* @__PURE__ */ new Map() : {}, this.processingCache = t ? /* @__PURE__ */ new Map() : {};
+  }
+  /**
+   * Cache helper methods to work with both Map and plain object fallbacks
+   */
+  cacheHas(e, t) {
+    try {
+      return e instanceof Map ? e.has(t) : t in e;
+    } catch {
+      return t in e;
+    }
+  }
+  cacheGet(e, t) {
+    try {
+      return e instanceof Map ? e.get(t) : e[t];
+    } catch {
+      return e[t];
+    }
+  }
+  cacheSet(e, t, s) {
+    try {
+      e instanceof Map ? e.set(t, s) : e[t] = s;
+    } catch {
+      e[t] = s;
+    }
+  }
+  cacheDelete(e, t) {
+    try {
+      e instanceof Map ? e.delete(t) : delete e[t];
+    } catch {
+      delete e[t];
+    }
+  }
+  cacheClear(e) {
+    try {
+      e instanceof Map ? e.clear() : Object.keys(e).forEach((t) => delete e[t]);
+    } catch {
+      Object.keys(e).forEach((t) => delete e[t]);
+    }
+  }
+  cacheSize(e) {
+    try {
+      return e instanceof Map ? e.size : Object.keys(e).length;
+    } catch {
+      return Object.keys(e).length;
+    }
+  }
+  cacheKeys(e) {
+    try {
+      return e instanceof Map ? e.keys() : Object.keys(e);
+    } catch {
+      return Object.keys(e);
+    }
+  }
+  /**
+   * Process CSS classes from various input formats
+   */
+  processClasses(e) {
+    if (!e) return [];
+    if (T(e) || P(e)) {
+      const i = e();
+      return this.processClasses(i);
+    }
+    const t = this.getCacheKey(e);
+    if (this.config.enableCaching && this.cacheHas(this.classCache, t))
+      return this.cacheGet(this.classCache, t);
+    let s = [];
+    if (typeof e == "string")
+      s = e.trim().split(/\s+/).filter(Boolean);
+    else if (Array.isArray(e))
+      s = e.flatMap((i) => {
+        if (i == null || i === "")
+          return [];
+        const o = (typeof i == "string" ? i : String(i)).trim();
+        return typeof i != "string" && o ? [o] : o.split(/\s+/);
+      }).filter(Boolean);
+    else {
+      const i = String(e).trim();
+      s = i ? [i] : [];
+    }
+    const r = this.processClassArray(s);
+    return this.config.enableCaching && this.setCachedClasses(t, r), r;
+  }
+  /**
+   * Process an array of class names
+   */
+  processClassArray(e) {
+    let t = e;
+    return this.config.sanitizeClassNames && (t = t.map((s) => this.sanitizeClassName(s))), t = this.deduplicateClasses(t), this.config.warnDuplicateClasses && e.length !== t.length && console.warn(
+      "[tachUI] Duplicate CSS classes detected and removed:",
+      e.filter((s, r) => e.indexOf(s) !== r)
+    ), t;
+  }
+  /**
+   * Sanitize class name to be valid CSS identifier
+   */
+  sanitizeClassName(e) {
+    if (!e || typeof e != "string") return "";
+    const t = this.config.sanitizationRules;
+    let s = e.trim();
+    s.includes(" ") && (s = s.replace(/\s+/g, "-"), this.config.warnInvalidClasses && console.warn(`[tachUI] CSS class names cannot contain spaces. Converted "${e}" to "${s}"`)), Object.entries(t.customReplacements || {}).forEach(([i, o]) => {
+      s = s.replace(new RegExp(i, "g"), o);
+    });
+    let r = "a-zA-Z\\-\\.";
+    return t.allowNumbers && (r += "0-9"), t.allowUnderscores && (r += "_"), r += ":\\[\\]/%", s = s.replace(new RegExp(`[^${r}]`, "g"), "-"), /^[0-9]/.test(s) && (s = "cls-" + s), s = s.replace(/---+/g, "--"), this.config.warnInvalidClasses && s !== e.trim() && console.warn(`[tachUI] CSS class "${e}" sanitized to "${s}"`), s;
+  }
+  /**
+   * Deduplicate classes while preserving first occurrence order
+   */
+  deduplicateClasses(e) {
+    return [...new Set(e.filter(Boolean))];
+  }
+  /**
+   * Combine tachUI classes with user-provided CSS classes
+   * User classes come AFTER tachUI classes for proper CSS cascade
+   */
+  combineClasses(e, t) {
+    const s = this.processClasses(t), r = [...e, ...s];
+    return this.deduplicateClasses(r);
+  }
+  /**
+   * Update configuration
+   */
+  updateConfig(e) {
+    this.config = { ...this.config, ...e }, this.clearCaches();
+  }
+  /**
+   * Get current configuration
+   */
+  getConfig() {
+    return { ...this.config };
+  }
+  /**
+   * Clear all caches
+   */
+  clearCaches() {
+    this.cacheClear(this.classCache), this.cacheClear(this.processingCache);
+  }
+  /**
+   * Get cache statistics for debugging
+   */
+  getCacheStats() {
+    return {
+      size: this.cacheSize(this.classCache),
+      maxSize: this.config.maxCacheSize,
+      hitRate: 0
+      // TODO: Implement hit rate tracking if needed
+    };
+  }
+  /**
+   * Generate cache key for input
+   */
+  getCacheKey(e) {
+    return Array.isArray(e) ? e.join("|") : e;
+  }
+  /**
+   * Set cached classes with LRU eviction
+   */
+  setCachedClasses(e, t) {
+    if (this.cacheSize(this.classCache) >= this.config.maxCacheSize) {
+      const s = this.cacheKeys(this.classCache), r = Array.isArray(s) ? s[0] : s.next().value;
+      r !== void 0 && this.cacheDelete(this.classCache, r);
+    }
+    this.cacheSet(this.classCache, e, t);
+  }
+}
+new vt();
+var bt = Object.defineProperty, St = (n, e, t) => e in n ? bt(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t, m = (n, e, t) => St(n, typeof e != "symbol" ? e + "" : e, t);
+class Ct {
+  constructor(e) {
+    this.props = e, m(this, "type", "component"), m(this, "id"), m(this, "mounted", !1), m(this, "cleanup", []), m(this, "scrollElement", null), m(this, "contentOffsetSignal"), m(this, "setContentOffset"), m(this, "contentSizeSignal"), m(this, "setContentSize"), m(this, "setIsScrolling"), m(this, "pullToRefreshStateSignal"), m(this, "setPullToRefreshState"), m(this, "scrollEventThrottle"), m(this, "lastScrollTime", 0), m(this, "scrollVelocity", { x: 0, y: 0 }), m(this, "lastScrollOffset", { x: 0, y: 0 }), m(this, "pullStartY", 0), m(this, "isPulling", !1), m(this, "handleScroll", (c) => {
+      if (!this.scrollElement) return;
+      const l = performance.now(), d = l - this.lastScrollTime;
+      if (d < this.scrollEventThrottle) return;
+      const f = {
+        x: this.scrollElement.scrollLeft,
+        y: this.scrollElement.scrollTop
+      };
+      this.scrollVelocity = this.calculateVelocity(f, d), this.setContentOffset(f), this.setContentSize({
+        width: this.scrollElement.scrollWidth,
+        height: this.scrollElement.scrollHeight
+      });
+      const p = this.detectScrollEdges(), N = {
+        offset: f,
+        velocity: this.scrollVelocity,
+        contentSize: {
+          width: this.scrollElement.scrollWidth,
+          height: this.scrollElement.scrollHeight
+        },
+        containerSize: {
+          width: this.scrollElement.clientWidth,
+          height: this.scrollElement.clientHeight
+        },
+        edges: p
+      };
+      this.props.onScroll && this.props.onScroll(N), p.top && this.props.onReachTop && this.props.onReachTop(), p.bottom && this.props.onReachBottom && this.props.onReachBottom(), p.left && this.props.onReachLeft && this.props.onReachLeft(), p.right && this.props.onReachRight && this.props.onReachRight(), this.lastScrollOffset = f, this.lastScrollTime = l;
+    }), m(this, "handleScrollStart", () => {
+      this.setIsScrolling(!0), this.props.onScrollBegin && this.props.onScrollBegin();
+    }), m(this, "handleScrollEnd", () => {
+      this.setIsScrolling(!1), this.props.onScrollEnd && this.props.onScrollEnd();
+    }), m(this, "handleTouchStart", (c) => {
+      this.props.refreshControl?.enabled && (this.pullStartY = c.touches[0].clientY, this.isPulling = !1);
+    }), m(this, "handleTouchMove", (c) => {
+      if (!this.props.refreshControl?.enabled || !this.scrollElement) return;
+      const l = c.touches[0].clientY - this.pullStartY, d = this.props.refreshControl.threshold || 80;
+      this.scrollElement.scrollTop <= 0 && l > 0 && (this.isPulling = !0, l > d ? this.setPullToRefreshState("ready") : this.setPullToRefreshState("pulling"));
+    }), m(this, "handleTouchEnd", async () => {
+      if (!(!this.props.refreshControl?.enabled || !this.isPulling)) {
+        if (this.pullToRefreshStateSignal() === "ready") {
+          this.setPullToRefreshState("refreshing");
+          try {
+            await this.props.refreshControl.onRefresh();
+          } catch (c) {
+            console.error("Pull to refresh error:", c);
+          } finally {
+            this.setPullToRefreshState("idle");
+          }
+        } else
+          this.setPullToRefreshState("idle");
+        this.isPulling = !1;
+      }
+    }), this.id = `scrollview-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, this.scrollEventThrottle = e.scrollEventThrottle || 16;
+    const [t, s] = A(
+      { x: 0, y: 0 }
+    );
+    this.contentOffsetSignal = t, this.setContentOffset = s;
+    const [r, i] = A({
+      width: 0,
+      height: 0
+    });
+    this.contentSizeSignal = r, this.setContentSize = i;
+    const [, o] = A(!1);
+    this.setIsScrolling = o;
+    const [a, h] = A("idle");
+    if (this.pullToRefreshStateSignal = a, this.setPullToRefreshState = h, e.contentOffset && v(e.contentOffset)) {
+      this.setContentOffset(e.contentOffset());
+      const c = I(() => {
+        e.contentOffset && v(e.contentOffset) && this.setContentOffset(e.contentOffset());
+      });
+      this.cleanup.push(() => c.dispose());
+    }
+    if (e.contentSize && v(e.contentSize)) {
+      this.setContentSize(e.contentSize());
+      const c = I(() => {
+        e.contentSize && v(e.contentSize) && this.setContentSize(e.contentSize());
+      });
+      this.cleanup.push(() => c.dispose());
+    }
+  }
+  /**
+   * Calculate scroll velocity
+   */
+  calculateVelocity(e, t) {
+    const s = e.x - this.lastScrollOffset.x, r = e.y - this.lastScrollOffset.y;
+    return {
+      x: t > 0 ? s / t : 0,
+      y: t > 0 ? r / t : 0
+    };
+  }
+  /**
+   * Detect scroll edges
+   */
+  detectScrollEdges() {
+    if (!this.scrollElement)
+      return { top: !1, bottom: !1, left: !1, right: !1 };
+    const {
+      scrollTop: e,
+      scrollLeft: t,
+      scrollHeight: s,
+      scrollWidth: r,
+      clientHeight: i,
+      clientWidth: o
+    } = this.scrollElement;
+    return {
+      top: e <= 0,
+      bottom: e + i >= s - 1,
+      left: t <= 0,
+      right: t + o >= r - 1
+    };
+  }
+  /**
+   * Set up scroll event handlers
+   */
+  setupScrollHandlers(e) {
+    let t;
+    const s = () => {
+      clearTimeout(t), this.handleScrollStart();
+    }, r = () => {
+      clearTimeout(t), t = setTimeout(() => {
+        this.handleScrollEnd();
+      }, 150);
+    }, i = (o) => {
+      s(), this.handleScroll(o), r();
+    };
+    e.addEventListener("scroll", i, { passive: !0 }), e.addEventListener("touchstart", this.handleTouchStart, {
+      passive: !0
+    }), e.addEventListener("touchmove", this.handleTouchMove, {
+      passive: !1
+    }), e.addEventListener("touchend", this.handleTouchEnd, { passive: !0 }), this.cleanup.push(() => {
+      e.removeEventListener("scroll", i), e.removeEventListener("touchstart", this.handleTouchStart), e.removeEventListener("touchmove", this.handleTouchMove), e.removeEventListener("touchend", this.handleTouchEnd), clearTimeout(t);
+    });
+  }
+  /**
+   * Get overflow styles based on direction
+   */
+  getOverflowStyles(e) {
+    switch (e) {
+      case "vertical":
+        return {
+          overflowX: "hidden",
+          overflowY: "auto"
+        };
+      case "horizontal":
+        return {
+          overflowX: "auto",
+          overflowY: "hidden"
+        };
+      case "both":
+        return {
+          overflow: "auto"
+        };
+      default:
+        return {
+          overflowX: "hidden",
+          overflowY: "auto"
+        };
+    }
+  }
+  /**
+   * Apply additional scroll view styling (position and overflow already set in initial render)
+   */
+  applyScrollViewStyles(e) {
+    const { showsScrollIndicator: t = !0, bounces: s = !0 } = this.props;
+    if (!t) {
+      e.style.scrollbarWidth = "none", e.style.msOverflowStyle = "none";
+      const r = document.createElement("style");
+      r.textContent = `
+        #${e.id}::-webkit-scrollbar {
+          display: none;
+        }
+      `, document.head.appendChild(r), this.cleanup.push(() => {
+        document.head.removeChild(r);
+      });
+    }
+    s ? e.style.webkitOverflowScrolling = "touch" : e.style.overscrollBehavior = "none", e.style.scrollBehavior = "smooth";
+  }
+  /**
+   * Apply content insets
+   */
+  applyContentInsets(e) {
+    const { contentInset: t } = this.props;
+    if (t) {
+      const { top: s = 0, bottom: r = 0, left: i = 0, right: o = 0 } = t;
+      e.style.padding = `${s}px ${o}px ${r}px ${i}px`;
+    }
+  }
+  /**
+   * Create pull to refresh indicator
+   */
+  createPullToRefreshIndicator() {
+    if (!this.props.refreshControl?.enabled) return null;
+    const e = this.pullToRefreshStateSignal(), t = this.props.refreshControl.tintColor || "#007AFF";
+    let s = "";
+    switch (e) {
+      case "pulling":
+        s = "↓ Pull to refresh";
+        break;
+      case "ready":
+        s = "↑ Release to refresh";
+        break;
+      case "refreshing":
+        s = "⟳ Refreshing...";
+        break;
+      default:
+        s = "";
+    }
+    return s ? {
+      type: "component",
+      id: `${this.id}-refresh`,
+      mounted: !1,
+      cleanup: [],
+      props: {},
+      render: () => [
+        b(
+          "div",
+          {
+            style: {
+              position: "absolute",
+              top: "-60px",
+              left: "50%",
+              transform: "translateX(-50%)",
+              padding: "10px 20px",
+              backgroundColor: "#f8f9fa",
+              borderRadius: "20px",
+              color: t,
+              fontSize: "14px",
+              fontWeight: "500",
+              textAlign: "center",
+              zIndex: 1e3,
+              transition: "all 0.3s ease",
+              opacity: e === "idle" ? 0 : 1
+            }
+          },
+          s
+        )
+      ]
+    } : null;
+  }
+  /**
+   * Scroll to specific position
+   */
+  scrollTo(e, t = "smooth") {
+    if (!this.scrollElement) return;
+    const s = { behavior: t };
+    e.x !== void 0 && (s.left = e.x), e.y !== void 0 && (s.top = e.y), this.scrollElement.scrollTo(s);
+  }
+  /**
+   * Scroll to top
+   */
+  scrollToTop(e = "smooth") {
+    this.scrollTo({ x: 0, y: 0 }, e);
+  }
+  /**
+   * Scroll to bottom
+   */
+  scrollToBottom(e = "smooth") {
+    this.scrollElement && this.scrollTo(
+      {
+        x: 0,
+        y: this.scrollElement.scrollHeight - this.scrollElement.clientHeight
+      },
+      e
+    );
+  }
+  /**
+   * Render the scroll view component
+   */
+  render() {
+    const { children: e = [], scrollEnabled: t = !0 } = this.props;
+    let s = [];
+    const r = e;
+    if (typeof r == "function") {
+      const d = r();
+      s = Array.isArray(d) ? d : [];
+    } else Array.isArray(e) && (s = e);
+    const i = b(
+      "div",
+      {
+        class: "tachui-scrollview-content",
+        style: {
+          minHeight: "100%",
+          minWidth: "100%"
+        }
+      },
+      ...s.flatMap((d) => d.render())
+    ), o = this.createPullToRefreshIndicator(), a = [];
+    if (o) {
+      const d = o.render(), f = Array.isArray(d) ? d : [d];
+      a.push(...f.filter((p) => p));
+    }
+    a.push(i);
+    const { direction: h = "vertical" } = this.props, c = this.getOverflowStyles(h), l = b(
+      "div",
+      {
+        id: this.id,
+        class: "tachui-scrollview",
+        style: {
+          height: "100%",
+          width: "100%",
+          position: "relative",
+          ...c
+        }
+      },
+      ...a
+    );
+    if (l.element) {
+      const d = l.element;
+      this.scrollElement = d, this.applyScrollViewStyles(d), this.setupScrollHandlers(d), i.element && this.applyContentInsets(i.element);
+      const f = () => {
+        const p = v(t) ? t() : t;
+        d.style.overflow = p ? "auto" : "hidden", d.style.pointerEvents = p ? "auto" : "none";
+      };
+      if (v(t)) {
+        const p = I(f);
+        this.cleanup.push(() => p.dispose());
+      } else
+        f();
+      if (typeof r == "function") {
+        const p = I(() => {
+          const N = r(), he = (Array.isArray(N) ? N : []).flatMap((V) => V.render());
+          if (i.element) {
+            const V = i.element;
+            V.innerHTML = "", he.forEach((W) => {
+              W && W.element && V.appendChild(W.element);
+            });
+          }
+        });
+        this.cleanup.push(() => p.dispose());
+      }
+    }
+    return [l];
+  }
+}
+function Et(n = {}) {
+  const e = new Ct(n);
+  return re(e);
+}
+const wt = `
+@keyframes spin {
+  from { transform: rotate(0deg); }
+  to { transform: rotate(360deg); }
+}
+`;
+if (typeof document < "u") {
+  const n = document.createElement("style");
+  n.textContent = wt, document.head.appendChild(n);
+}
+process.env.NODE_ENV;
+class At {
+  constructor(e) {
+    u(this, "type", "component");
+    u(this, "id");
+    u(this, "mounted", !1);
+    u(this, "cleanup", []);
+    u(this, "dataSignal");
+    u(this, "setData");
+    u(this, "sectionsSignal");
+    u(this, "setSections");
+    u(this, "selectedItemsSignal");
+    u(this, "setSelectedItems");
+    u(this, "isLoadingSignal");
+    u(this, "setIsLoading");
     // Virtual scrolling state
-    a(this, "virtualItems", []);
-    a(this, "visibleStartIndex", 0);
-    a(this, "visibleEndIndex", 0);
-    a(this, "scrollOffset", 0);
-    a(this, "containerHeight", 0);
-    a(this, "totalHeight", 0);
+    u(this, "virtualItems", []);
+    u(this, "visibleStartIndex", 0);
+    u(this, "visibleEndIndex", 0);
+    u(this, "scrollOffset", 0);
+    u(this, "containerHeight", 0);
+    u(this, "totalHeight", 0);
     /**
      * Handle scroll events for virtual scrolling and infinite scroll
      */
-    a(this, "handleListScroll", (t) => {
-      this.scrollOffset = t.offset.y, this.containerHeight = t.containerSize.height, this.props.virtualScrolling?.enabled && this.calculateVisibleRange(), this.props.onLoadMore && t.edges.bottom && (f(this.props.hasMore) ? this.props.hasMore() : this.props.hasMore) && !this.isLoadingSignal() && (this.setIsLoading(!0), this.props.onLoadMore().finally(() => {
+    u(this, "handleListScroll", (e) => {
+      this.scrollOffset = e.offset.y, this.containerHeight = e.containerSize.height, this.props.virtualScrolling?.enabled && this.calculateVisibleRange(), this.props.onLoadMore && e.edges.bottom && (v(this.props.hasMore) ? this.props.hasMore() : this.props.hasMore) && !this.isLoadingSignal() && (this.setIsLoading(!0), this.props.onLoadMore().finally(() => {
         this.setIsLoading(!1);
-      })), this.props.onScroll && this.props.onScroll(t);
+      })), this.props.onScroll && this.props.onScroll(e);
     });
-    this.props = t, this.id = `list-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
-    const [e, n] = S(this.resolveData());
-    this.dataSignal = e, this.setData = n;
-    const [r, i] = S(
+    this.props = e, this.id = `list-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
+    const [t, s] = A(this.resolveData());
+    this.dataSignal = t, this.setData = s;
+    const [r, i] = A(
       this.resolveSections()
     );
     this.sectionsSignal = r, this.setSections = i;
-    const s = /* @__PURE__ */ new Set(), [o, h] = S(s);
-    this.selectedItemsSignal = o, this.setSelectedItems = h;
-    const [d, c] = S(
+    const o = /* @__PURE__ */ new Set(), [a, h] = A(o);
+    this.selectedItemsSignal = a, this.setSelectedItems = h;
+    const [c, l] = A(
       this.resolveIsLoading()
     );
-    this.isLoadingSignal = d, this.setIsLoading = c, this.setupReactiveUpdates(), t.virtualScrolling?.enabled && this.initializeVirtualScrolling();
+    this.isLoadingSignal = c, this.setIsLoading = l, this.setupReactiveUpdates(), e.virtualScrolling?.enabled && this.initializeVirtualScrolling();
   }
   /**
    * Helper to flatten render results
    */
-  flattenRenderResult(t) {
-    return Array.isArray(t) ? t : [t];
+  flattenRenderResult(e) {
+    return Array.isArray(e) ? e : [e];
+  }
+  /**
+   * Normalize item render output into safe DOM node payloads.
+   *
+   * Strings and primitives are always emitted as text nodes to avoid HTML
+   * interpretation in list item rendering.
+   */
+  normalizeItemRenderOutput(e) {
+    return e && typeof e.render == "function" ? this.flattenRenderResult(e.render()) : e == null || e === !1 ? [] : typeof e == "string" || typeof e == "number" || typeof e == "boolean" ? [{ type: "text", text: String(e) }] : this.flattenRenderResult(e);
   }
   /**
    * Resolve data from various input types
    */
   resolveData() {
-    const { data: t } = this.props;
-    return Array.isArray(t) ? t : f(t) ? t() : [];
+    const { data: e } = this.props;
+    return Array.isArray(e) ? e : v(e) ? e() : [];
   }
   /**
    * Resolve sections from various input types
    */
   resolveSections() {
-    const { sections: t } = this.props;
-    return Array.isArray(t) ? t : f(t) ? t() : [];
+    const { sections: e } = this.props;
+    return Array.isArray(e) ? e : v(e) ? e() : [];
   }
   /**
    * Resolve loading state
    */
   resolveIsLoading() {
-    const { isLoading: t } = this.props;
-    return typeof t == "boolean" ? t : f(t) ? t() : !1;
+    const { isLoading: e } = this.props;
+    return typeof e == "boolean" ? e : v(e) ? e() : !1;
   }
   /**
    * Set up reactive updates for data and state
    */
   setupReactiveUpdates() {
-    if (f(this.props.data)) {
-      const t = I(() => {
+    if (v(this.props.data)) {
+      const e = I(() => {
         this.setData(this.resolveData()), this.updateVirtualScrolling();
       });
-      this.cleanup.push(() => t.dispose());
+      this.cleanup.push(() => e.dispose());
     }
-    if (f(this.props.sections)) {
-      const t = I(() => {
+    if (v(this.props.sections)) {
+      const e = I(() => {
         this.setSections(this.resolveSections()), this.updateVirtualScrolling();
       });
-      this.cleanup.push(() => t.dispose());
+      this.cleanup.push(() => e.dispose());
     }
-    if (f(this.props.isLoading)) {
-      const t = I(() => {
+    if (v(this.props.isLoading)) {
+      const e = I(() => {
         this.setIsLoading(this.resolveIsLoading());
       });
-      this.cleanup.push(() => t.dispose());
+      this.cleanup.push(() => e.dispose());
     }
     if (this.props.selectedItems) {
-      const t = I(() => {
+      const e = I(() => {
         this.props.selectedItems && this.setSelectedItems(this.props.selectedItems());
       });
-      this.cleanup.push(() => t.dispose());
+      this.cleanup.push(() => e.dispose());
     }
   }
   /**
    * Initialize virtual scrolling calculations
    */
   initializeVirtualScrolling() {
-    const t = this.dataSignal(), n = this.props.virtualScrolling.estimatedItemHeight || 50;
-    this.virtualItems = t.map((r, i) => ({
+    const e = this.dataSignal(), s = this.props.virtualScrolling.estimatedItemHeight || 50;
+    this.virtualItems = e.map((r, i) => ({
       index: i,
-      height: n,
-      offset: i * n,
+      height: s,
+      offset: i * s,
       item: r
-    })), this.totalHeight = t.length * n;
+    })), this.totalHeight = e.length * s;
   }
   /**
    * Update virtual scrolling calculations
@@ -125,17 +2724,17 @@ class $ {
    */
   calculateVisibleRange() {
     if (!this.props.virtualScrolling?.enabled) return;
-    const t = this.props.virtualScrolling, e = t.overscan || 5, n = t.threshold || 0;
+    const e = this.props.virtualScrolling, t = e.overscan || 5, s = e.threshold || 0;
     let r = 0;
-    for (let s = 0; s < this.virtualItems.length; s++)
-      if (this.virtualItems[s].offset + this.virtualItems[s].height > this.scrollOffset - n) {
-        r = Math.max(0, s - e);
+    for (let o = 0; o < this.virtualItems.length; o++)
+      if (this.virtualItems[o].offset + this.virtualItems[o].height > this.scrollOffset - s) {
+        r = Math.max(0, o - t);
         break;
       }
     let i = this.virtualItems.length - 1;
-    for (let s = r; s < this.virtualItems.length; s++)
-      if (this.virtualItems[s].offset > this.scrollOffset + this.containerHeight + n) {
-        i = Math.min(this.virtualItems.length - 1, s + e);
+    for (let o = r; o < this.virtualItems.length; o++)
+      if (this.virtualItems[o].offset > this.scrollOffset + this.containerHeight + s) {
+        i = Math.min(this.virtualItems.length - 1, o + t);
         break;
       }
     this.visibleStartIndex = r, this.visibleEndIndex = i;
@@ -143,25 +2742,25 @@ class $ {
   /**
    * Handle item selection
    */
-  handleItemSelection(t, e) {
-    const { selectionMode: n, getItemId: r, onSelectionChange: i } = this.props;
-    if (n === "none") return;
-    const s = r ? r(t, e) : e, o = new Set(this.selectedItemsSignal());
-    n === "single" ? (o.clear(), o.add(s)) : n === "multiple" && (o.has(s) ? o.delete(s) : o.add(s)), this.setSelectedItems(o), i && i(o);
+  handleItemSelection(e, t) {
+    const { selectionMode: s, getItemId: r, onSelectionChange: i } = this.props;
+    if (s === "none") return;
+    const o = r ? r(e, t) : t, a = new Set(this.selectedItemsSignal());
+    s === "single" ? (a.clear(), a.add(o)) : s === "multiple" && (a.has(o) ? a.delete(o) : a.add(o)), this.setSelectedItems(a), i && i(a);
   }
   /**
    * Create list item component
    */
-  createListItem(t, e, n) {
-    const { renderItem: r, style: i, onItemTap: s, onItemLongPress: o } = this.props, h = r(t, e);
+  createListItem(e, t, s) {
+    const { renderItem: r, style: i, onItemTap: o, onItemLongPress: a } = this.props, h = r(e, t);
     return {
       type: "component",
-      id: `${this.id}-item-${e}`,
+      id: `${this.id}-item-${t}`,
       mounted: !1,
       cleanup: [],
       props: {},
       render: () => {
-        const d = u(
+        const c = b(
           "div",
           {
             class: `tachui-list-item tachui-list-item-${i || "plain"}`,
@@ -169,32 +2768,32 @@ class $ {
               display: "flex",
               flexDirection: "column",
               position: "relative",
-              backgroundColor: n ? "#e6f3ff" : "transparent",
+              backgroundColor: s ? "#e6f3ff" : "transparent",
               transition: "background-color 0.2s ease",
-              cursor: s ? "pointer" : "default"
+              cursor: o ? "pointer" : "default"
             }
           },
-          ...this.flattenRenderResult(h.render())
+          ...this.normalizeItemRenderOutput(h)
         );
-        if (d.element) {
-          const c = d.element;
-          if (s && c.addEventListener("click", () => s(t, e)), o) {
-            let p;
-            const g = () => {
-              p = setTimeout(
-                () => o(t, e),
+        if (c.element) {
+          const l = c.element;
+          if (o && l.addEventListener("click", () => o(e, t)), a) {
+            let d;
+            const f = () => {
+              d = setTimeout(
+                () => a(e, t),
                 500
               );
-            }, m = () => {
-              clearTimeout(p);
+            }, p = () => {
+              clearTimeout(d);
             };
-            c.addEventListener("mousedown", g), c.addEventListener("mouseup", m), c.addEventListener("mouseleave", m), c.addEventListener("touchstart", g), c.addEventListener("touchend", m);
+            l.addEventListener("mousedown", f), l.addEventListener("mouseup", p), l.addEventListener("mouseleave", p), l.addEventListener("touchstart", f), l.addEventListener("touchend", p);
           }
-          this.props.selectionMode !== "none" && c.addEventListener("click", (p) => {
-            (p.metaKey || p.ctrlKey || this.props.selectionMode === "multiple") && (p.preventDefault(), this.handleItemSelection(t, e));
+          this.props.selectionMode !== "none" && l.addEventListener("click", (d) => {
+            (d.metaKey || d.ctrlKey || this.props.selectionMode === "multiple") && (d.preventDefault(), this.handleItemSelection(e, t));
           });
         }
-        return [d];
+        return [c];
       }
     };
   }
@@ -202,15 +2801,15 @@ class $ {
    * Create list separator
    */
   createSeparator() {
-    const { separator: t } = this.props;
-    return t ? typeof t == "object" && "render" in t ? t : {
+    const { separator: e } = this.props;
+    return e ? typeof e == "object" && "render" in e ? e : {
       type: "component",
       id: `${this.id}-separator`,
       mounted: !1,
       cleanup: [],
       props: {},
       render: () => [
-        u("div", {
+        b("div", {
           class: "tachui-list-separator",
           style: {
             height: "1px",
@@ -224,72 +2823,66 @@ class $ {
   /**
    * Create section header
    */
-  createSectionHeader(t, e) {
-    return t.header ? typeof t.header == "string" ? {
+  createSectionHeader(e, t) {
+    return e.header ? typeof e.header == "string" ? {
       type: "component",
-      id: `${this.id}-section-header-${e}`,
+      id: `${this.id}-section-header-${t}`,
       mounted: !1,
       cleanup: [],
       props: {},
-      render: () => [
-        u(
-          "div",
-          {
-            class: "tachui-list-section-header",
-            style: {
-              padding: "8px 16px",
-              backgroundColor: "#f8f9fa",
-              fontWeight: "600",
-              fontSize: "14px",
-              color: "#666",
-              textTransform: "uppercase",
-              letterSpacing: "0.5px"
-            }
-          },
-          t.header
-        )
-      ]
-    } : this.props.renderSectionHeader ? this.props.renderSectionHeader(t, e) : t.header : null;
+      render: () => {
+        const s = b("div", {
+          class: "tachui-list-section-header",
+          style: {
+            padding: "8px 16px",
+            backgroundColor: "#f8f9fa",
+            fontWeight: "600",
+            fontSize: "14px",
+            color: "#666",
+            textTransform: "uppercase",
+            letterSpacing: "0.5px"
+          }
+        }), r = s.element;
+        return r && (r.textContent = e.header), [s];
+      }
+    } : this.props.renderSectionHeader ? this.props.renderSectionHeader(e, t) : e.header : null;
   }
   /**
    * Create section footer
    */
-  createSectionFooter(t, e) {
-    return t.footer ? typeof t.footer == "string" ? {
+  createSectionFooter(e, t) {
+    return e.footer ? typeof e.footer == "string" ? {
       type: "component",
-      id: `${this.id}-section-footer-${e}`,
+      id: `${this.id}-section-footer-${t}`,
       mounted: !1,
       cleanup: [],
       props: {},
-      render: () => [
-        u(
-          "div",
-          {
-            class: "tachui-list-section-footer",
-            style: {
-              padding: "8px 16px",
-              fontSize: "12px",
-              color: "#999"
-            }
-          },
-          t.footer
-        )
-      ]
-    } : this.props.renderSectionFooter ? this.props.renderSectionFooter(t, e) : t.footer : null;
+      render: () => {
+        const s = b("div", {
+          class: "tachui-list-section-footer",
+          style: {
+            padding: "8px 16px",
+            fontSize: "12px",
+            color: "#999"
+          }
+        }), r = s.element;
+        return r && (r.textContent = e.footer), [s];
+      }
+    } : this.props.renderSectionFooter ? this.props.renderSectionFooter(e, t) : e.footer : null;
   }
   /**
    * Create empty state component
    */
   createEmptyState() {
-    const { emptyState: t } = this.props;
-    return t || {
+    const { emptyState: e } = this.props;
+    return e || {
       type: "component",
       id: `${this.id}-empty`,
       mounted: !1,
       cleanup: [],
       props: {},
       render: () => [
-        u(
+        b(
           "div",
           {
             class: "tachui-list-empty",
@@ -312,15 +2905,15 @@ class $ {
    * Create loading indicator
    */
   createLoadingIndicator() {
-    const { loadingIndicator: t } = this.props;
-    return t || {
+    const { loadingIndicator: e } = this.props;
+    return e || {
       type: "component",
       id: `${this.id}-loading`,
       mounted: !1,
       cleanup: [],
       props: {},
       render: () => [
-        u(
+        b(
           "div",
           {
             class: "tachui-list-loading",
@@ -343,7 +2936,7 @@ class $ {
   renderVirtualContent() {
     if (!this.props.virtualScrolling?.enabled)
       return this.renderRegularContent();
-    const t = this.dataSignal(), e = this.selectedItemsSignal(), n = this.createSeparator(), r = [];
+    const e = this.dataSignal(), t = this.selectedItemsSignal(), s = this.createSeparator(), r = [];
     if (this.visibleStartIndex > 0) {
       const i = this.virtualItems[this.visibleStartIndex]?.offset || 0;
       r.push({
@@ -353,17 +2946,17 @@ class $ {
         cleanup: [],
         props: {},
         render: () => [
-          u("div", {
+          b("div", {
             style: { height: `${i}px` }
           })
         ]
       });
     }
-    for (let i = this.visibleStartIndex; i <= this.visibleEndIndex && i < t.length; i++) {
-      const s = t[i], o = this.props.getItemId ? this.props.getItemId(s, i) : i, h = e.has(o);
-      r.push(this.createListItem(s, i, h)), n && i < t.length - 1 && r.push(n);
+    for (let i = this.visibleStartIndex; i <= this.visibleEndIndex && i < e.length; i++) {
+      const o = e[i], a = this.props.getItemId ? this.props.getItemId(o, i) : i, h = t.has(a);
+      r.push(this.createListItem(o, i, h)), s && i < e.length - 1 && r.push(s);
     }
-    if (this.visibleEndIndex < t.length - 1) {
+    if (this.visibleEndIndex < e.length - 1) {
       const i = this.totalHeight - (this.virtualItems[this.visibleEndIndex + 1]?.offset || 0);
       r.push({
         type: "component",
@@ -372,7 +2965,7 @@ class $ {
         cleanup: [],
         props: {},
         render: () => [
-          u("div", {
+          b("div", {
             style: { height: `${i}px` }
           })
         ]
@@ -384,98 +2977,97 @@ class $ {
    * Render regular (non-virtual) content
    */
   renderRegularContent() {
-    const t = this.dataSignal(), e = this.sectionsSignal(), n = this.selectedItemsSignal(), r = this.createSeparator(), i = [];
-    return e.length > 0 ? e.forEach((s, o) => {
-      const h = this.createSectionHeader(s, o);
-      h && i.push(h), s.items.forEach((c, p) => {
-        const g = o * 1e3 + p, m = this.props.getItemId ? this.props.getItemId(c, g) : g, y = n.has(m);
-        i.push(this.createListItem(c, g, y)), r && p < s.items.length - 1 && i.push(r);
+    const e = this.dataSignal(), t = this.sectionsSignal(), s = this.selectedItemsSignal(), r = this.createSeparator(), i = [];
+    return t.length > 0 ? t.forEach((o, a) => {
+      const h = this.createSectionHeader(o, a);
+      h && i.push(h), o.items.forEach((l, d) => {
+        const f = a * 1e3 + d, p = this.props.getItemId ? this.props.getItemId(l, f) : f, N = s.has(p);
+        i.push(this.createListItem(l, f, N)), r && d < o.items.length - 1 && i.push(r);
       });
-      const d = this.createSectionFooter(s, o);
-      d && i.push(d);
-    }) : t.forEach((s, o) => {
-      const h = this.props.getItemId ? this.props.getItemId(s, o) : o, d = n.has(h);
-      i.push(this.createListItem(s, o, d)), r && o < t.length - 1 && i.push(r);
+      const c = this.createSectionFooter(o, a);
+      c && i.push(c);
+    }) : e.forEach((o, a) => {
+      const h = this.props.getItemId ? this.props.getItemId(o, a) : a, c = s.has(h);
+      i.push(this.createListItem(o, a, c)), r && a < e.length - 1 && i.push(r);
     }), i;
   }
   /**
    * Render the list component
    */
   render() {
-    const t = this.dataSignal(), e = this.isLoadingSignal();
-    if (e && t.length === 0) {
-      const s = this.createLoadingIndicator();
-      return s ? s.render() : [];
+    const e = this.dataSignal(), t = this.isLoadingSignal();
+    if (t && e.length === 0) {
+      const o = this.createLoadingIndicator();
+      return o ? o.render() : [];
     }
-    if (t.length === 0 && !e) {
-      const s = this.createEmptyState();
-      return s ? s.render() : [];
+    if (e.length === 0 && !t) {
+      const o = this.createEmptyState();
+      return o ? o.render() : [];
     }
-    const n = this.props.virtualScrolling?.enabled ? this.renderVirtualContent() : this.renderRegularContent();
-    if (e && t.length > 0) {
-      const s = this.createLoadingIndicator();
-      s && n.push(s);
+    const s = this.props.virtualScrolling?.enabled ? this.renderVirtualContent() : this.renderRegularContent();
+    if (t && e.length > 0) {
+      const o = this.createLoadingIndicator();
+      o && s.push(o);
     }
     const r = {
       ...this.props,
-      children: n,
+      children: s,
       onScroll: this.handleListScroll
     };
-    return new E(r).render();
+    return new Et(r).render();
   }
 }
-function v(l) {
-  const t = new $(l);
-  return x(t);
+function F(n) {
+  const e = new At(n);
+  return re(e);
 }
-const C = {
+const kt = {
   /**
    * Create a simple list from array
    */
-  simple(l, t, e = {}) {
-    return v({
-      ...e,
-      data: l,
-      renderItem: t
+  simple(n, e, t = {}) {
+    return F({
+      ...t,
+      data: n,
+      renderItem: e
     });
   },
   /**
    * Create a sectioned list
    */
-  sectioned(l, t, e = {}) {
-    return v({
-      ...e,
-      sections: l,
-      renderItem: t
+  sectioned(n, e, t = {}) {
+    return F({
+      ...t,
+      sections: n,
+      renderItem: e
     });
   },
   /**
    * Create a virtual scrolling list for large datasets
    */
-  virtual(l, t, e, n = {}) {
-    return v({
-      ...n,
-      data: l,
-      renderItem: t,
-      virtualScrolling: e
+  virtual(n, e, t, s = {}) {
+    return F({
+      ...s,
+      data: n,
+      renderItem: e,
+      virtualScrolling: t
     });
   },
   /**
    * Create an infinite scrolling list
    */
-  infinite(l, t, e, n, r = {}) {
-    return v({
+  infinite(n, e, t, s, r = {}) {
+    return F({
       ...r,
-      data: l,
-      renderItem: t,
-      onLoadMore: e,
-      hasMore: n
+      data: n,
+      renderItem: e,
+      onLoadMore: t,
+      hasMore: s
     });
   }
 };
 export {
-  $ as E,
-  v as L,
-  C as a
+  At as E,
+  F as L,
+  kt as a
 };
-//# sourceMappingURL=List.js.map