fynixui 1.0.10

package/dist/runtime.js

@@ -0,0 +1,1361 @@
+import { activeContext, setActiveContext } from "./context/context";
+import { Button, Path } from "./custom/index";
+import { removeErrorOverlay, showErrorOverlay } from "./error/errorOverlay";
+import { nixAsync } from "./hooks/nixAsync";
+import { nixAsyncCached } from "./hooks/nixAsyncCache";
+import { nixAsyncDebounce } from "./hooks/nixAsyncDebounce";
+import { nixAsyncQuery } from "./hooks/nixAsyncQuery";
+import { nixCallback } from "./hooks/nixCallback";
+import { nixComputed } from "./hooks/nixComputed";
+import { nixDebounce } from "./hooks/nixDebounce";
+import { nixEffect, nixEffectAlways, nixEffectOnce } from "./hooks/nixEffect";
+import { nixForm } from "./hooks/nixForm";
+import { nixFormAsync } from "./hooks/nixFormAsync";
+import { nixInterval } from "./hooks/nixInterval";
+import { nixLazy, Suspense } from "./hooks/nixLazy";
+import { nixLazyAsync } from "./hooks/nixLazyAsync";
+import { nixLazyFormAsync } from "./hooks/nixLazyFormAsync";
+import { nixLocalStorage } from "./hooks/nixLocalStorage";
+import { nixMemo } from "./hooks/nixMemo";
+import { nixPrevious } from "./hooks/nixPrevious";
+import { nixRef } from "./hooks/nixRef";
+import { nixState } from "./hooks/nixState";
+import { nixStore } from "./hooks/nixStore";
+import createFynix from "./router/router";
+class SimplePriorityQueue {
+    constructor() {
+        this.items = [];
+        this.priorityOrder = {
+            immediate: 0,
+            high: 1,
+            normal: 2,
+            low: 3,
+            idle: 4,
+        };
+    }
+    push(item, priority) {
+        this.items.push({ item, priority });
+        this.items.sort((a, b) => this.priorityOrder[a.priority] - this.priorityOrder[b.priority]);
+    }
+    pop() {
+        return this.items.shift()?.item;
+    }
+    peek() {
+        return this.items[0]?.item;
+    }
+    size() {
+        return this.items.length;
+    }
+    isEmpty() {
+        return this.items.length === 0;
+    }
+}
+class FynixScheduler {
+    constructor() {
+        this.updateQueue = new SimplePriorityQueue();
+        this.batchedUpdates = new Set();
+        this.isScheduled = false;
+        this.isWorking = false;
+        this.currentPriority = "normal";
+        this.updateIdCounter = 0;
+    }
+    schedule(update, priority = "normal") {
+        update.id = `update_${this.updateIdCounter++}`;
+        update.priority = priority;
+        update.timestamp = performance.now();
+        if (priority === "immediate") {
+            this.flushUpdate(update);
+        }
+        else {
+            this.updateQueue.push(update, priority);
+            this.scheduleWork();
+        }
+    }
+    batchUpdates(updates) {
+        updates.forEach((update) => this.batchedUpdates.add(update));
+        this.scheduleWork();
+    }
+    timeSlice(deadline) {
+        const startTime = performance.now();
+        const previousPriority = this.currentPriority;
+        while (!this.updateQueue.isEmpty() &&
+            performance.now() - startTime < deadline) {
+            const update = this.updateQueue.pop();
+            if (update) {
+                if (this.shouldYield() && update.priority !== "immediate") {
+                    this.updateQueue.push(update, update.priority);
+                    break;
+                }
+                this.flushUpdate(update);
+            }
+        }
+        this.currentPriority = previousPriority;
+        return this.updateQueue.isEmpty();
+    }
+    flush() {
+        if (this.isWorking)
+            return;
+        this.isWorking = true;
+        try {
+            while (!this.updateQueue.isEmpty()) {
+                const update = this.updateQueue.peek();
+                if (update && update.priority === "immediate") {
+                    this.flushUpdate(this.updateQueue.pop());
+                }
+                else {
+                    break;
+                }
+            }
+            this.batchedUpdates.forEach((update) => this.flushUpdate(update));
+            this.batchedUpdates.clear();
+        }
+        finally {
+            this.isWorking = false;
+            this.isScheduled = false;
+        }
+    }
+    flushUpdate(update) {
+        const previousPriority = this.currentPriority;
+        this.currentPriority = update.priority;
+        try {
+            update.callback();
+        }
+        catch (error) {
+            console.error("[FynixScheduler] Update error:", error);
+            showErrorOverlay(error);
+        }
+        finally {
+            this.currentPriority = previousPriority;
+        }
+    }
+    scheduleWork() {
+        if (this.isScheduled)
+            return;
+        this.isScheduled = true;
+        const nextUpdate = this.updateQueue.peek();
+        if (nextUpdate) {
+            if (nextUpdate.priority === "high") {
+                requestAnimationFrame(() => this.workLoop(16.67));
+            }
+            else {
+                if ("requestIdleCallback" in window) {
+                    requestIdleCallback((deadline) => {
+                        this.workLoop(deadline.timeRemaining());
+                    });
+                }
+                else {
+                    setTimeout(() => this.workLoop(5), 0);
+                }
+            }
+        }
+    }
+    workLoop(deadline) {
+        const hasMoreWork = !this.timeSlice(deadline);
+        if (hasMoreWork) {
+            this.isScheduled = false;
+            this.scheduleWork();
+        }
+        else {
+            this.flush();
+        }
+    }
+    getCurrentPriority() {
+        return this.currentPriority;
+    }
+    shouldYield() {
+        const nextUpdate = this.updateQueue.peek();
+        if (!nextUpdate)
+            return false;
+        const currentPriorityLevel = this.getPriorityLevel(this.currentPriority);
+        const nextPriorityLevel = this.getPriorityLevel(nextUpdate.priority);
+        return nextPriorityLevel < currentPriorityLevel;
+    }
+    getPriorityLevel(priority) {
+        const levels = { immediate: 0, high: 1, normal: 2, low: 3, idle: 4 };
+        return levels[priority];
+    }
+}
+const scheduler = new FynixScheduler();
+class FiberRenderer {
+    constructor() {
+        this.workInProgressRoot = null;
+        this.nextUnitOfWork = null;
+        this.currentRoot = null;
+        this.deletions = [];
+    }
+    scheduleWork(fiber) {
+        this.workInProgressRoot = {
+            ...fiber,
+            alternate: this.currentRoot,
+        };
+        this.nextUnitOfWork = this.workInProgressRoot;
+        this.deletions = [];
+        scheduler.schedule({
+            id: "",
+            type: "layout",
+            priority: "high",
+            callback: () => this.workLoop(5),
+            timestamp: performance.now(),
+        }, "high");
+    }
+    workLoop(deadline) {
+        const startTime = performance.now();
+        while (this.nextUnitOfWork && performance.now() - startTime < deadline) {
+            this.nextUnitOfWork = this.performUnitOfWork(this.nextUnitOfWork);
+        }
+        if (!this.nextUnitOfWork && this.workInProgressRoot) {
+            this.commitRoot();
+        }
+        else if (this.nextUnitOfWork) {
+            scheduler.schedule({
+                id: "",
+                type: "layout",
+                priority: "normal",
+                callback: () => this.workLoop(5),
+                timestamp: performance.now(),
+            }, "normal");
+        }
+    }
+    performUnitOfWork(fiber) {
+        this.reconcileChildren(fiber, fiber.props?.children || []);
+        if (fiber.child) {
+            return fiber.child;
+        }
+        let nextFiber = fiber;
+        while (nextFiber) {
+            if (nextFiber.sibling) {
+                return nextFiber.sibling;
+            }
+            nextFiber = nextFiber.parent;
+        }
+        return null;
+    }
+    reconcileChildren(wipFiber, elements) {
+        let index = 0;
+        let oldFiber = wipFiber.alternate?.child;
+        let prevSibling = null;
+        while (index < elements.length || oldFiber != null) {
+            const element = elements[index];
+            let newFiber = null;
+            const sameType = oldFiber && element && element.type === oldFiber.type;
+            if (sameType && oldFiber) {
+                newFiber = {
+                    type: oldFiber.type,
+                    props: element.props,
+                    key: element.key,
+                    _domNode: oldFiber._domNode,
+                    parent: wipFiber,
+                    alternate: oldFiber,
+                    effectTag: "UPDATE",
+                    updatePriority: "normal",
+                    child: null,
+                    sibling: null,
+                    _rendered: null,
+                };
+            }
+            if (element && !sameType) {
+                newFiber = {
+                    type: element.type,
+                    props: element.props,
+                    key: element.key,
+                    _domNode: null,
+                    parent: wipFiber,
+                    alternate: null,
+                    effectTag: "PLACEMENT",
+                    updatePriority: "normal",
+                    child: null,
+                    sibling: null,
+                    _rendered: null,
+                };
+            }
+            if (oldFiber && !sameType) {
+                oldFiber.effectTag = "DELETION";
+                this.deletions.push(oldFiber);
+            }
+            if (oldFiber) {
+                oldFiber = oldFiber.sibling;
+            }
+            if (index === 0) {
+                wipFiber.child = newFiber;
+            }
+            else if (newFiber && prevSibling) {
+                prevSibling.sibling = newFiber;
+            }
+            prevSibling = newFiber;
+            index++;
+        }
+    }
+    commitRoot() {
+        this.deletions.forEach((fiber) => this.commitWork(fiber));
+        if (this.workInProgressRoot?.child) {
+            this.commitWork(this.workInProgressRoot.child);
+        }
+        this.currentRoot = this.workInProgressRoot;
+        this.workInProgressRoot = null;
+    }
+    commitWork(fiber) {
+        if (!fiber)
+            return;
+        let domParentFiber = fiber.parent;
+        while (!domParentFiber?._domNode) {
+            domParentFiber = domParentFiber?.parent || null;
+        }
+        const domParent = domParentFiber?._domNode;
+        if (fiber.effectTag === "PLACEMENT" && fiber._domNode && domParent) {
+            domParent.appendChild(fiber._domNode);
+        }
+        else if (fiber.effectTag === "UPDATE" && fiber._domNode) {
+            this.updateDom(fiber._domNode, fiber.alternate?.props || {}, fiber.props);
+        }
+        else if (fiber.effectTag === "DELETION" && domParent) {
+            this.commitDeletion(fiber, domParent);
+        }
+        this.commitWork(fiber.child);
+        this.commitWork(fiber.sibling);
+    }
+    commitDeletion(fiber, domParent) {
+        if (fiber._domNode) {
+            domParent.removeChild(fiber._domNode);
+        }
+        else if (fiber.child) {
+            this.commitDeletion(fiber.child, domParent);
+        }
+    }
+    updateDom(dom, prevProps, nextProps) {
+        Object.keys(prevProps)
+            .filter((key) => key !== "children" && !(key in nextProps))
+            .forEach((name) => {
+            if (name.startsWith("on")) {
+                const eventType = name.toLowerCase().substring(2);
+                dom.removeEventListener(eventType, prevProps[name]);
+            }
+            else {
+                dom[name] = "";
+            }
+        });
+        Object.keys(nextProps)
+            .filter((key) => key !== "children")
+            .forEach((name) => {
+            if (prevProps[name] !== nextProps[name]) {
+                if (name.startsWith("on")) {
+                    const eventType = name.toLowerCase().substring(2);
+                    dom.addEventListener(eventType, nextProps[name]);
+                }
+                else {
+                    dom[name] = nextProps[name];
+                }
+            }
+        });
+    }
+}
+const fiberRenderer = new FiberRenderer();
+export function useFiberRenderer() {
+    return fiberRenderer;
+}
+class HierarchicalStore {
+    constructor() {
+        this.root = new Map();
+        this.selectorCache = new Map();
+        this.stateSnapshot = {};
+    }
+    select(selector) {
+        const selectorKey = selector.toString();
+        if (this.selectorCache.has(selectorKey)) {
+            return this.selectorCache.get(selectorKey);
+        }
+        const result = selector(this.getState());
+        this.selectorCache.set(selectorKey, result);
+        return result;
+    }
+    optimisticUpdate(path, update, rollback) {
+        const original = this.get(path);
+        this.set(path, update);
+        return {
+            commit: () => this.clearRollback(path),
+            rollback: () => {
+                this.set(path, original);
+                rollback?.();
+            },
+        };
+    }
+    getState() {
+        return this.stateSnapshot;
+    }
+    get(path) {
+        return this.root.get(path)?.value;
+    }
+    set(path, value) {
+        const node = this.root.get(path);
+        if (node) {
+            node.value = value;
+            this.stateSnapshot = { ...this.stateSnapshot, [path]: value };
+            this.invalidateSelectors();
+        }
+    }
+    clearRollback(path) {
+        console.log(`[HierarchicalStore] Optimistic update committed for path: ${path}`);
+    }
+    invalidateSelectors() {
+        this.selectorCache.clear();
+    }
+}
+const hierarchicalStore = new HierarchicalStore();
+export function useHierarchicalStore() {
+    return hierarchicalStore;
+}
+export const TEXT = Symbol("text");
+export const Fragment = Symbol("Fragment");
+const BOOLEAN_ATTRS = new Set([
+    "checked",
+    "selected",
+    "disabled",
+    "readonly",
+    "multiple",
+    "autoplay",
+    "controls",
+    "loop",
+    "muted",
+    "open",
+    "required",
+    "reversed",
+    "scoped",
+    "seamless",
+    "autofocus",
+    "novalidate",
+    "formnovalidate",
+]);
+const DOM_PROPERTIES = new Set([
+    "value",
+    "checked",
+    "selected",
+    "selectedIndex",
+    "innerHTML",
+    "textContent",
+    "innerText",
+]);
+const DANGEROUS_HTML_PROPS = new Set([
+    "innerHTML",
+    "outerHTML",
+    "insertAdjacentHTML",
+    "srcdoc",
+]);
+const DANGEROUS_PROTOCOLS = new Set([
+    "javascript:",
+    "data:",
+    "vbscript:",
+    "file:",
+    "about:",
+]);
+const SAFE_PROTOCOLS = new Set([
+    "http:",
+    "https:",
+    "ftp:",
+    "ftps:",
+    "mailto:",
+    "tel:",
+    "#",
+    "/",
+    "./",
+    "../",
+]);
+export function createTextVNode(text) {
+    if (text == null || text === false) {
+        return { type: TEXT, props: { nodeValue: "" }, key: null };
+    }
+    if (text && typeof text === "object" && text._isNixState) {
+        const vnode = {
+            type: TEXT,
+            props: { nodeValue: String(text.value) },
+            key: null,
+            _state: text,
+            _cleanup: null,
+        };
+        vnode._cleanup = text.subscribe(() => {
+            if (vnode._domNode) {
+                vnode._domNode.nodeValue = String(text.value);
+            }
+        });
+        return vnode;
+    }
+    return { type: TEXT, props: { nodeValue: String(text) }, key: null };
+}
+export function h(type, props = null, ...children) {
+    const normalizedProps = props === null || typeof props !== "object" || Array.isArray(props)
+        ? {}
+        : props;
+    const flatChildren = [];
+    for (const c of children.flat(Infinity)) {
+        if (c == null || c === false)
+            continue;
+        if (c && typeof c === "object" && "_isNixState" in c) {
+            flatChildren.push(createTextVNode(c));
+        }
+        else if (typeof c === "string" || typeof c === "number") {
+            flatChildren.push(createTextVNode(c));
+        }
+        else if (c && typeof c === "object" && "type" in c) {
+            if (c.type === Fragment) {
+                const fragmentChildren = (c.props.children || []).filter((x) => x != null && x !== false);
+                flatChildren.push(...fragmentChildren);
+            }
+            else {
+                flatChildren.push(c);
+            }
+        }
+        else if (typeof c === "function") {
+            flatChildren.push(c);
+        }
+        else {
+            flatChildren.push(createTextVNode(String(c)));
+        }
+    }
+    const key = normalizedProps.key ?? null;
+    if (key !== undefined)
+        delete normalizedProps.key;
+    if (type === Fragment) {
+        return { type: Fragment, props: { children: flatChildren }, key };
+    }
+    return {
+        type,
+        props: { ...normalizedProps, children: flatChildren },
+        key,
+    };
+}
+h.Fragment = ({ children }) => children || [];
+export const Fynix = h;
+Fynix.Fragment = h.Fragment;
+const componentInstances = new WeakMap();
+let rootRenderFn = null;
+const pendingRerenders = new WeakSet();
+function beginComponent(vnode) {
+    let ctx = componentInstances.get(vnode);
+    if (!ctx) {
+        ctx = {
+            hooks: [],
+            hookIndex: 0,
+            effects: [],
+            cleanups: [],
+            _vnode: vnode,
+            _accessedStates: new Set(),
+            _subscriptions: new Set(),
+            _subscriptionCleanups: [],
+            version: 0,
+            rerender: null,
+            Component: vnode.type,
+            _isMounted: false,
+            _isRerendering: false,
+        };
+        componentInstances.set(vnode, ctx);
+    }
+    ctx.hookIndex = 0;
+    ctx._accessedStates.clear();
+    setActiveContext(ctx);
+    ctx.version++;
+    return ctx;
+}
+function endComponent() {
+    const ctx = activeContext;
+    if (!ctx)
+        return;
+    ctx._accessedStates.forEach((state) => {
+        if (!ctx._subscriptions.has(state)) {
+            if (!ctx.rerender) {
+                let rerenderTimeout = null;
+                ctx.rerender = function rerender() {
+                    if (ctx._isRerendering || pendingRerenders.has(ctx)) {
+                        return;
+                    }
+                    if (rerenderTimeout) {
+                        clearTimeout(rerenderTimeout);
+                    }
+                    rerenderTimeout = setTimeout(async () => {
+                        if (ctx._isRerendering || !ctx._isMounted)
+                            return;
+                        ctx._isRerendering = true;
+                        pendingRerenders.add(ctx);
+                        try {
+                            removeErrorOverlay();
+                            const vnode = ctx._vnode;
+                            const oldRendered = vnode._rendered;
+                            beginComponent(vnode);
+                            const result = ctx.Component(vnode.props);
+                            const newRendered = result instanceof Promise ? await result : result;
+                            endComponent();
+                            vnode._rendered = newRendered;
+                            const domNode = vnode._domNode;
+                            if (domNode && domNode.parentNode) {
+                                await patch(domNode.parentNode, newRendered, oldRendered);
+                                if (newRendered && typeof newRendered === "object") {
+                                    vnode._domNode = newRendered._domNode;
+                                }
+                                ctx._isRerendering = false;
+                                pendingRerenders.delete(ctx);
+                            }
+                            else if (rootRenderFn) {
+                                await rootRenderFn();
+                                ctx._isRerendering = false;
+                                pendingRerenders.delete(ctx);
+                            }
+                            else {
+                                ctx._isRerendering = false;
+                                pendingRerenders.delete(ctx);
+                            }
+                        }
+                        catch (err) {
+                            console.error("[Fynix] Component rerender error:", err);
+                            showErrorOverlay(err);
+                            ctx._isRerendering = false;
+                            pendingRerenders.delete(ctx);
+                        }
+                        rerenderTimeout = null;
+                    }, 0);
+                };
+            }
+            const unsub = state.subscribe(() => {
+                if (ctx.rerender && ctx._isMounted) {
+                    if (typeof queueMicrotask === "function") {
+                        queueMicrotask(() => ctx.rerender());
+                    }
+                    else {
+                        setTimeout(ctx.rerender, 0);
+                    }
+                }
+            });
+            ctx._subscriptions.add(state);
+            ctx._subscriptionCleanups.push(unsub);
+        }
+    });
+    setActiveContext(null);
+}
+export function renderComponent(Component, props = {}) {
+    const vnode = { type: Component, props, key: null };
+    const ctx = beginComponent(vnode);
+    ctx.Component = Component;
+    if (!ctx.rerender) {
+        let rerenderTimeout = null;
+        ctx.rerender = () => {
+            if (ctx._isRerendering || pendingRerenders.has(ctx))
+                return;
+            if (rerenderTimeout) {
+                clearTimeout(rerenderTimeout);
+            }
+            rerenderTimeout = setTimeout(async () => {
+                if (ctx._isRerendering || !ctx._isMounted)
+                    return;
+                ctx._isRerendering = true;
+                pendingRerenders.add(ctx);
+                try {
+                    removeErrorOverlay();
+                    const vnode = ctx._vnode;
+                    const oldRendered = vnode._rendered;
+                    beginComponent(vnode);
+                    const result = ctx.Component(vnode.props);
+                    const newRendered = result instanceof Promise ? await result : result;
+                    endComponent();
+                    vnode._rendered = newRendered;
+                    const domNode = vnode._domNode;
+                    if (domNode && domNode.parentNode) {
+                        await patch(domNode.parentNode, newRendered, oldRendered);
+                        if (newRendered && typeof newRendered === "object") {
+                            vnode._domNode = newRendered._domNode;
+                        }
+                        ctx._isRerendering = false;
+                        pendingRerenders.delete(ctx);
+                    }
+                    else if (rootRenderFn) {
+                        await rootRenderFn();
+                        ctx._isRerendering = false;
+                        pendingRerenders.delete(ctx);
+                    }
+                    else {
+                        ctx._isRerendering = false;
+                        pendingRerenders.delete(ctx);
+                    }
+                }
+                catch (err) {
+                    console.error("[Fynix] Component rerender error:", err);
+                    showErrorOverlay(err);
+                    ctx._isRerendering = false;
+                    pendingRerenders.delete(ctx);
+                }
+                rerenderTimeout = null;
+            }, 0);
+        };
+    }
+    try {
+        removeErrorOverlay();
+        const result = Component(props);
+        if (result instanceof Promise) {
+            const placeholderVNode = h("div", null, "Loading...");
+            ctx._vnode = vnode;
+            vnode._rendered = placeholderVNode;
+            ctx._isMounted = true;
+            result
+                .then((resolvedVNode) => {
+                vnode._rendered = resolvedVNode;
+                if (ctx.rerender) {
+                    ctx.rerender();
+                }
+            })
+                .catch((err) => {
+                console.error("[Fynix] Async component error:", err);
+                showErrorOverlay(err);
+            });
+            return placeholderVNode;
+        }
+        ctx._vnode = vnode;
+        vnode._rendered = result;
+        ctx._isMounted = true;
+        return result;
+    }
+    catch (err) {
+        console.error("[Fynix] Component render error:", err);
+        showErrorOverlay(err);
+        return h("div", { style: "color:red" }, `Error: ${sanitizeErrorMessage(err)}`);
+    }
+    finally {
+        endComponent();
+    }
+}
+const delegatedEvents = new Map();
+let eventIdCounter = 1;
+function ensureDelegated(eventType) {
+    if (delegatedEvents.has(eventType))
+        return;
+    delegatedEvents.set(eventType, new Map());
+    document.addEventListener(eventType, (e) => {
+        let cur = e.target;
+        while (cur && cur !== document) {
+            if (cur.nodeType !== 1)
+                break;
+            const el = cur;
+            const eid = el._rest_eid;
+            const map = delegatedEvents.get(eventType);
+            if (eid != null && map?.has(eid)) {
+                map.get(eid)(e);
+                return;
+            }
+            cur = cur.parentElement;
+        }
+    });
+}
+function registerDelegatedHandler(el, eventName, fn) {
+    if (!fn || el.nodeType !== 1)
+        return;
+    const anyEl = el;
+    const eid = anyEl._rest_eid ?? (anyEl._rest_eid = ++eventIdCounter);
+    ensureDelegated(eventName);
+    delegatedEvents.get(eventName).set(eid, (e) => {
+        try {
+            fn.call(el, e);
+        }
+        catch (err) {
+            console.error("[Fynix] Event handler error:", err);
+            showErrorOverlay(err);
+        }
+    });
+}
+function sanitizeText(text) {
+    if (typeof text !== "string")
+        return String(text);
+    return text
+        .replace(/[<>"'&]/g, (match) => {
+        const entityMap = {
+            "<": "&lt;",
+            ">": "&gt;",
+            '"': "&quot;",
+            "'": "&#x27;",
+            "&": "&amp;",
+        };
+        return entityMap[match] || match;
+    })
+        .replace(/javascript:/gi, "blocked:")
+        .replace(/data:.*?base64/gi, "blocked:");
+}
+function sanitizeAttributeValue(value) {
+    if (typeof value !== "string")
+        return String(value);
+    return value
+        .replace(/["'<>]/g, (match) => {
+        const entityMap = {
+            '"': "&quot;",
+            "'": "&#x27;",
+            "<": "&lt;",
+            ">": "&gt;",
+        };
+        return entityMap[match] || match;
+    })
+        .replace(/javascript:/gi, "blocked:")
+        .replace(/on\w+=/gi, "blocked=");
+}
+function sanitizeErrorMessage(error) {
+    if (!error)
+        return "Unknown error";
+    const message = error.message || error.toString() || "Unknown error";
+    return sanitizeText(String(message)).slice(0, 200);
+}
+function setProperty(el, key, value) {
+    const k = key.toLowerCase();
+    if (key === "r-class" || key === "rc") {
+        if (typeof value === "string") {
+            el.setAttribute("class", value);
+        }
+        else if (value && (value._isNixState || value._isRestState)) {
+            el.setAttribute("class", value.value);
+            const anyEl = el;
+            if (!anyEl._fynixCleanups)
+                anyEl._fynixCleanups = [];
+            const unsub = value.subscribe(() => el.setAttribute("class", value.value));
+            anyEl._fynixCleanups.push(unsub);
+        }
+        return;
+    }
+    if (key.startsWith("r-")) {
+        registerDelegatedHandler(el, key.slice(2).toLowerCase(), value);
+        return;
+    }
+    if (key === "style" && typeof value === "object") {
+        Object.assign(el.style, value);
+        return;
+    }
+    if (DANGEROUS_HTML_PROPS.has(key)) {
+        console.error(`[Fynix] Security: ${key} is blocked for security reasons. Use textContent or children instead.`);
+        return;
+    }
+    if ((key === "href" ||
+        key === "src" ||
+        key === "action" ||
+        key === "formaction") &&
+        typeof value === "string") {
+        const normalizedValue = value.trim().toLowerCase();
+        for (const protocol of DANGEROUS_PROTOCOLS) {
+            if (normalizedValue.startsWith(protocol)) {
+                console.error(`[Fynix] Security: ${protocol} protocol blocked in ${key}`);
+                return;
+            }
+        }
+        if (normalizedValue.includes(":")) {
+            const protocol = normalizedValue.split(":")[0] + ":";
+            if (!SAFE_PROTOCOLS.has(protocol) &&
+                !SAFE_PROTOCOLS.has(normalizedValue.charAt(0))) {
+                console.error(`[Fynix] Security: Protocol '${protocol}' not in safe list for ${key}`);
+                return;
+            }
+        }
+        if (normalizedValue.startsWith("data:")) {
+            if (normalizedValue.includes("javascript") ||
+                normalizedValue.includes("<script")) {
+                console.error(`[Fynix] Security: Suspicious data: URL blocked in ${key}`);
+                return;
+            }
+        }
+    }
+    if (key.toLowerCase().startsWith("on") && key !== "open") {
+        console.error(`[Fynix] Security: Inline event handler '${key}' blocked. Use r-${key.slice(2)} instead.`);
+        return;
+    }
+    if (BOOLEAN_ATTRS.has(k)) {
+        if (value) {
+            el.setAttribute(k, "");
+            el[k] = true;
+        }
+        else {
+            el.removeAttribute(k);
+            el[k] = false;
+        }
+        return;
+    }
+    if (DOM_PROPERTIES.has(key) && !DANGEROUS_HTML_PROPS.has(key)) {
+        if (key === "textContent" || key === "innerText") {
+            el[key] = sanitizeText(value ?? "");
+        }
+        else {
+            el[key] = value ?? "";
+        }
+        return;
+    }
+    if (key.startsWith("data-") || key.startsWith("aria-")) {
+        if (value != null && value !== false) {
+            el.setAttribute(key, sanitizeAttributeValue(String(value)));
+        }
+        else {
+            el.removeAttribute(key);
+        }
+        return;
+    }
+    if (value != null && value !== false) {
+        el.setAttribute(key, value);
+    }
+}
+async function createDom(vnode, existing = null) {
+    if (vnode == null) {
+        return document.createTextNode("");
+    }
+    if (typeof vnode === "string" || typeof vnode === "number") {
+        return document.createTextNode(String(vnode));
+    }
+    if (vnode instanceof Promise) {
+        const placeholder = document.createTextNode("Loading...");
+        vnode
+            .then(async (resolved) => {
+            try {
+                const dom = await createDom(resolved);
+                if (placeholder.parentNode) {
+                    placeholder.replaceWith(dom);
+                }
+            }
+            catch (err) {
+                console.error("[Fynix] Async component error:", err);
+                if (placeholder.parentNode) {
+                    placeholder.textContent = "Error loading component";
+                }
+            }
+        })
+            .catch((err) => {
+            console.error("[Fynix] Async component promise error:", err);
+            if (placeholder.parentNode) {
+                placeholder.textContent = "Error loading async component";
+            }
+        });
+        return placeholder;
+    }
+    const vnodeObj = vnode;
+    if (vnodeObj.type === TEXT) {
+        const textNode = existing || document.createTextNode(vnodeObj.props.nodeValue ?? "");
+        vnodeObj._domNode = textNode;
+        return textNode;
+    }
+    if (vnodeObj.type === Fragment) {
+        const frag = document.createDocumentFragment();
+        for (const child of vnodeObj.props?.children || []) {
+            frag.appendChild(await createDom(child));
+        }
+        vnodeObj._domNode = frag;
+        return frag;
+    }
+    if (typeof vnodeObj.type === "function") {
+        const rendered = await renderMaybeAsyncComponent(vnodeObj.type, vnodeObj.props, vnodeObj);
+        vnodeObj._rendered = rendered;
+        const dom = await createDom(rendered);
+        vnodeObj._domNode = dom;
+        return dom;
+    }
+    const el = existing || document.createElement(vnodeObj.type);
+    for (const [k, v] of Object.entries(vnodeObj.props || {})) {
+        if (k !== "children") {
+            setProperty(el, k, v);
+        }
+    }
+    for (const child of vnodeObj.props?.children || []) {
+        el.appendChild(await createDom(child));
+    }
+    vnodeObj._domNode = el;
+    return el;
+}
+async function renderMaybeAsyncComponent(Component, props, vnode) {
+    const ctx = beginComponent(vnode);
+    removeErrorOverlay();
+    try {
+        const result = await Component(props);
+        ctx._vnode = vnode;
+        vnode._rendered = result;
+        ctx._isMounted = true;
+        endComponent();
+        return result ?? null;
+    }
+    catch (err) {
+        console.error("[Fynix] async render error:", err);
+        showErrorOverlay(err);
+        ctx._isMounted = false;
+        endComponent();
+        return h("div", { style: "color:red" }, `Error: ${sanitizeErrorMessage(err)}`);
+    }
+}
+export async function patch(parent, newVNode, oldVNode) {
+    if (!(parent instanceof Node)) {
+        console.error("[Fynix] patch() expects a DOM Node, got:", typeof parent, parent);
+        return;
+    }
+    if (!newVNode && !oldVNode)
+        return;
+    if (!newVNode && oldVNode) {
+        const domNode = oldVNode._domNode;
+        if (domNode?.parentNode) {
+            domNode.parentNode.removeChild(domNode);
+        }
+        unmountVNode(oldVNode);
+        return;
+    }
+    if (newVNode && !oldVNode) {
+        const newDom = await createDom(newVNode);
+        if (newDom instanceof Node) {
+            parent.appendChild(newDom);
+        }
+        return;
+    }
+    const newIsPrimitive = typeof newVNode === "string" || typeof newVNode === "number";
+    const oldIsPrimitive = typeof oldVNode === "string" || typeof oldVNode === "number";
+    if (newIsPrimitive || oldIsPrimitive) {
+        if (newIsPrimitive &&
+            oldIsPrimitive &&
+            String(newVNode) === String(oldVNode))
+            return;
+        const newDom = await createDom(newVNode);
+        const oldDom = oldVNode?._domNode || parent.firstChild;
+        if (oldDom?.parentNode && newDom instanceof Node) {
+            oldDom.parentNode.replaceChild(newDom, oldDom);
+        }
+        if (oldVNode && typeof oldVNode === "object") {
+            unmountVNode(oldVNode);
+        }
+        return;
+    }
+    const newVN = newVNode;
+    const oldVN = oldVNode;
+    const newType = newVN.type;
+    const oldType = oldVN.type;
+    if (newType !== oldType) {
+        const newDom = await createDom(newVN);
+        const oldDom = oldVN._domNode;
+        if (oldDom?.parentNode && newDom instanceof Node) {
+            oldDom.parentNode.replaceChild(newDom, oldDom);
+        }
+        unmountVNode(oldVN);
+        return;
+    }
+    if (newType === TEXT) {
+        const oldDom = oldVN._domNode;
+        const newText = newVN.props.nodeValue ?? "";
+        const oldText = oldVN.props.nodeValue ?? "";
+        if (newText !== oldText && oldDom) {
+            oldDom.nodeValue = newText;
+        }
+        newVN._domNode = oldDom;
+        return;
+    }
+    if (newType === Fragment) {
+        const newChildren = newVN.props?.children || [];
+        const oldChildren = oldVN.props?.children || [];
+        await patchChildren(parent, newChildren, oldChildren);
+        newVN._domNode = oldVN._domNode;
+        return;
+    }
+    if (typeof newType === "function") {
+        const oldCtx = componentInstances.get(oldVN);
+        if (oldCtx && newType === oldType) {
+            componentInstances.delete(oldVN);
+            componentInstances.set(newVN, oldCtx);
+            oldCtx._vnode = newVN;
+            beginComponent(newVN);
+            const rendered = await oldCtx.Component(newVN.props);
+            endComponent();
+            newVN._rendered = rendered;
+            const oldRendered = oldVN._rendered;
+            const oldDom = oldVN._domNode;
+            if (oldDom?.parentNode instanceof Node) {
+                await patch(oldDom.parentNode, rendered, oldRendered);
+                newVN._domNode = rendered?._domNode || oldDom;
+            }
+        }
+        else {
+            const rendered = await renderMaybeAsyncComponent(newType, newVN.props, newVN);
+            newVN._rendered = rendered;
+            const oldRendered = oldVN._rendered;
+            const oldDom = oldVN._domNode;
+            if (oldDom?.parentNode instanceof Node) {
+                await patch(oldDom.parentNode, rendered, oldRendered);
+                newVN._domNode = rendered?._domNode || oldDom;
+            }
+            else {
+                const newDom = await createDom(rendered);
+                if (parent && newDom instanceof Node) {
+                    parent.appendChild(newDom);
+                }
+                newVN._domNode = newDom;
+            }
+            if (oldCtx && newType !== oldType) {
+                unmountVNode(oldVN);
+            }
+        }
+        return;
+    }
+    const el = oldVN._domNode;
+    if (!el || el.nodeType !== 1) {
+        const newDom = await createDom(newVN);
+        if (parent && newDom instanceof Node) {
+            parent.appendChild(newDom);
+        }
+        unmountVNode(oldVN);
+        return;
+    }
+    updateProps(el, newVN.props, oldVN.props);
+    newVN._domNode = el;
+    const newChildren = newVN.props?.children || [];
+    const oldChildren = oldVN.props?.children || [];
+    await patchChildren(el, newChildren, oldChildren);
+}
+async function patchChildren(parent, newChildren, oldChildren) {
+    if (!(parent instanceof Node))
+        return;
+    const hasKeys = newChildren.some((c) => c?.key != null) ||
+        oldChildren.some((c) => c?.key != null);
+    if (!hasKeys) {
+        const maxLen = Math.max(newChildren.length, oldChildren.length);
+        for (let i = 0; i < maxLen; i++) {
+            const newChild = newChildren[i];
+            const oldChild = oldChildren[i];
+            if (i >= newChildren.length) {
+                const dom = oldChild?._domNode;
+                if (dom?.parentNode) {
+                    dom.parentNode.removeChild(dom);
+                }
+                unmountVNode(oldChild);
+            }
+            else if (i >= oldChildren.length) {
+                const newDom = await createDom(newChild);
+                if (newDom instanceof Node) {
+                    parent.appendChild(newDom);
+                }
+            }
+            else {
+                await patch(parent, newChild, oldChild);
+            }
+        }
+        return;
+    }
+    const oldKeyMap = new Map();
+    oldChildren.forEach((child) => {
+        if (child?.key != null) {
+            oldKeyMap.set(child.key, child);
+        }
+    });
+    const newKeySet = new Set(newChildren.filter((c) => c?.key != null).map((c) => c.key));
+    oldChildren.forEach((oldChild) => {
+        if (oldChild?.key != null && !newKeySet.has(oldChild.key)) {
+            const dom = oldChild._domNode;
+            if (dom?.parentNode) {
+                dom.parentNode.removeChild(dom);
+            }
+            unmountVNode(oldChild);
+        }
+    });
+    for (let i = 0; i < newChildren.length; i++) {
+        const newChild = newChildren[i];
+        const key = newChild?.key;
+        if (key != null && oldKeyMap.has(key)) {
+            const oldChild = oldKeyMap.get(key);
+            const oldDom = oldChild._domNode;
+            const childNodes = Array.from(parent.childNodes);
+            const currentPos = childNodes.indexOf(oldDom);
+            const desiredPos = i;
+            if (currentPos !== desiredPos) {
+                const refNode = childNodes[desiredPos] || null;
+                if (oldDom && oldDom.parentNode === parent) {
+                    parent.insertBefore(oldDom, refNode);
+                }
+            }
+            await patch(parent, newChild, oldChild);
+        }
+        else {
+            const newDom = await createDom(newChild);
+            if (newDom instanceof Node) {
+                const childNodes = Array.from(parent.childNodes);
+                const refNode = childNodes[i] || null;
+                parent.insertBefore(newDom, refNode);
+            }
+        }
+    }
+}
+function unmountVNode(vnode) {
+    if (!vnode)
+        return;
+    if (vnode._cleanup && typeof vnode._cleanup === "function") {
+        try {
+            vnode._cleanup();
+        }
+        catch (e) {
+            console.error("[Fynix] Text vnode cleanup error:", e);
+        }
+        vnode._cleanup = null;
+    }
+    if (typeof vnode.type === "function") {
+        const ctx = componentInstances.get(vnode);
+        if (ctx) {
+            ctx._isMounted = false;
+            ctx._subscriptionCleanups.forEach((u) => {
+                try {
+                    u();
+                }
+                catch (e) {
+                    console.error("[Fynix] Cleanup error:", e);
+                }
+            });
+            ctx.cleanups.forEach((c) => {
+                try {
+                    c?.();
+                }
+                catch (e) {
+                    console.error("[Fynix] Effect cleanup error:", e);
+                }
+            });
+            ctx._subscriptions.clear();
+            ctx._accessedStates.clear();
+            ctx._subscriptionCleanups = [];
+            ctx.cleanups = [];
+            ctx.hooks = [];
+            ctx.effects = [];
+            ctx.rerender = null;
+            ctx._vnode = null;
+            componentInstances.delete(vnode);
+            pendingRerenders.delete(ctx);
+        }
+        unmountVNode(vnode._rendered);
+        return;
+    }
+    if (vnode._domNode && vnode._domNode.nodeType === 1) {
+        const anyNode = vnode._domNode;
+        const eid = anyNode._rest_eid;
+        if (eid) {
+            delegatedEvents.forEach((map) => map.delete(eid));
+        }
+        if (anyNode._fynixCleanups) {
+            anyNode._fynixCleanups.forEach((cleanup) => {
+                try {
+                    cleanup();
+                }
+                catch (e) {
+                    console.error("[Fynix] Element cleanup error:", e);
+                }
+            });
+            anyNode._fynixCleanups = null;
+        }
+    }
+    if (vnode.props?.children) {
+        vnode.props.children.forEach((c) => unmountVNode(c));
+    }
+    vnode._domNode = null;
+    vnode._rendered = null;
+}
+function updateProps(el, newProps = {}, oldProps = {}) {
+    if (!el || el.nodeType !== 1)
+        return;
+    for (const k of Object.keys(oldProps)) {
+        if (k === "children")
+            continue;
+        if (!(k in newProps)) {
+            if (k.startsWith("r-")) {
+                const anyEl = el;
+                const eid = anyEl._rest_eid;
+                if (eid && delegatedEvents.has(k.slice(2).toLowerCase())) {
+                    delegatedEvents.get(k.slice(2).toLowerCase()).delete(eid);
+                }
+            }
+            else if (BOOLEAN_ATTRS.has(k.toLowerCase())) {
+                el.removeAttribute(k);
+                el[k] = false;
+            }
+            else if (DOM_PROPERTIES.has(k)) {
+                el[k] = "";
+            }
+            else {
+                el.removeAttribute(k);
+            }
+        }
+    }
+    for (const [k, v] of Object.entries(newProps)) {
+        if (k === "children")
+            continue;
+        if (oldProps[k] !== v) {
+            setProperty(el, k, v);
+        }
+    }
+}
+export function mount(AppComponent, root, props = {}) {
+    if (typeof root === "string") {
+        const element = document.querySelector(root);
+        if (!element) {
+            console.error("[Fynix] Mount error: Element not found for selector:", root);
+            return;
+        }
+        root = element;
+    }
+    if (!(root instanceof Element)) {
+        console.error("[Fynix] Mount error: Invalid root element", root);
+        return;
+    }
+    let Component = AppComponent;
+    let oldVNode = null;
+    let currentProps = props;
+    let appVNode = null;
+    let isRendering = false;
+    async function renderApp() {
+        if (isRendering)
+            return;
+        isRendering = true;
+        try {
+            removeErrorOverlay();
+            const win = window;
+            const propsToUse = win.__lastRouteProps || win.__fynix__?.lastRouteProps || currentProps;
+            if (!appVNode) {
+                appVNode = { type: Component, props: propsToUse, key: null };
+                if (root instanceof Element) {
+                    root.innerHTML = "";
+                    const dom = await createDom(appVNode);
+                    if (dom instanceof Node) {
+                        root.appendChild(dom);
+                    }
+                }
+                else {
+                    console.error("[Fynix] Mount error: root is not a DOM Element", root);
+                    return;
+                }
+                oldVNode = appVNode;
+            }
+            else {
+                appVNode.props = propsToUse;
+                if (root instanceof Node) {
+                    await patch(root, appVNode, oldVNode);
+                    oldVNode = appVNode;
+                }
+                else {
+                    console.error("[Fynix] Patch error: root is not a DOM Node", root);
+                    return;
+                }
+            }
+        }
+        catch (err) {
+            console.error("[Fynix] Mount error:", err);
+            showErrorOverlay(err);
+        }
+        finally {
+            isRendering = false;
+        }
+    }
+    rootRenderFn = renderApp;
+    const win = window;
+    win.__fynix__ = win.__fynix__ || {};
+    win.__fynix__.rerender = renderApp;
+    renderApp();
+    if (import.meta.hot) {
+        if (!win.__fynix__.hmr) {
+            win.__fynix__.hmr = async ({ mod }) => {
+                try {
+                    const UpdatedComponent = mod.App || mod.default;
+                    if (UpdatedComponent) {
+                        Component = UpdatedComponent;
+                        if (appVNode) {
+                            appVNode.type = UpdatedComponent;
+                        }
+                        win.__fynix__.rerender?.();
+                    }
+                }
+                catch (err) {
+                    console.error("[Fynix HMR] update error:", err);
+                    showErrorOverlay(err);
+                }
+            };
+            import.meta.hot.accept();
+        }
+    }
+}
+export { Button, createFynix, nixAsync, nixAsyncCached, nixAsyncDebounce, nixAsyncQuery, nixCallback, nixComputed, nixDebounce, nixEffect, nixEffectAlways, nixEffectOnce, nixForm, nixFormAsync, nixInterval, nixLazy, nixLazyAsync, nixLazyFormAsync, nixLocalStorage, nixMemo, nixPrevious, nixRef, nixState, nixStore, Path, Suspense, };