@reckona/mreact-compat 0.0.1

package/dist/hooks.js

@@ -0,0 +1,1296 @@
+import { scheduleCallback } from "./fiber-scheduler.js";
+import { Activity, Fragment, FORWARD_REF_TYPE, MEMO_TYPE, Profiler, isReactCompatElement, } from "./element.js";
+import { isReactCompatContext, isReactCompatConsumer, isReactCompatProvider, renderWithContextProvider, useContext, } from "./context.js";
+import { isThenable } from "./thenable.js";
+import { isDangerousHtmlAttribute, isDangerousHtmlOptIn } from "./url-safety.js";
+import { escapeHtmlAttribute as escapeHtml } from "@reckona/mreact-shared/html-escape";
+let currentRuntime;
+let currentInstance;
+let currentCacheScope;
+const CACHE_SCOPE_SYMBOL = Symbol.for("modular.react.cache_scope");
+const emptyCacheOwnerStack = [];
+let syncVersion = 0;
+let transitionVersion = 0;
+let transitionDepth = 0;
+let currentTransitionContext;
+let transitionRerenderScheduled = false;
+let eventBatchDepth = 0;
+let currentEventPriority = "default";
+let eventRerenderScheduled = false;
+const queuedTransitionRerenders = new Map();
+const queuedEventRerenders = new Set();
+export const version = "19.2.6";
+export function act(callback) {
+    const result = callback();
+    return (isThenable(result) ? Promise.resolve(result).then(() => undefined) : undefined);
+}
+export function createRootRuntime(rerender, options = {}) {
+    return {
+        instances: new Map(),
+        activeInstanceKeys: undefined,
+        activeProfilerPaths: undefined,
+        mountedProfilerPaths: new Set(),
+        profilerBaseDurations: new Map(),
+        pendingProfilerCommits: [],
+        pendingInsertionEffects: [],
+        pendingLayoutEffects: [],
+        pendingEffects: [],
+        externalStoreChecks: [],
+        portalContainers: new Set(),
+        idCounter: 0,
+        identifierPrefix: options.identifierPrefix ?? "",
+        idMode: options.idMode ?? "client",
+        strictModeDepth: 0,
+        profilerFlushDepth: 0,
+        rerender,
+        beginRender() {
+            this.activeInstanceKeys = new Set();
+            this.activeProfilerPaths = new Set();
+            this.pendingProfilerCommits = [];
+            this.pendingInsertionEffects = [];
+            this.pendingLayoutEffects = [];
+            this.pendingEffects = [];
+            this.externalStoreChecks = [];
+        },
+        endRender(committed = true) {
+            const profilerCommits = committed ? this.pendingProfilerCommits.splice(0) : [];
+            const activeProfilerPaths = this.activeProfilerPaths;
+            if (committed) {
+                cleanupInactiveInstances(this);
+                this.mountedProfilerPaths =
+                    activeProfilerPaths === undefined ? new Set() : new Set(activeProfilerPaths);
+            }
+            else {
+                this.pendingProfilerCommits = [];
+            }
+            this.activeInstanceKeys = undefined;
+            this.activeProfilerPaths = undefined;
+            currentRuntime = undefined;
+            currentInstance = undefined;
+            if (committed) {
+                flushProfilerCommits(this, profilerCommits);
+            }
+        },
+        flushEffects() {
+            this.profilerFlushDepth += 1;
+            try {
+                flushPendingEffects(this.pendingInsertionEffects);
+                const strictLayoutEffects = flushPendingEffects(this.pendingLayoutEffects);
+                const strictEffects = flushPendingEffects(this.pendingEffects);
+                const strictReplayEffects = [...strictLayoutEffects, ...strictEffects];
+                cleanupStrictEffects(strictReplayEffects);
+                replayStrictEffects(strictReplayEffects);
+            }
+            finally {
+                this.profilerFlushDepth -= 1;
+            }
+        },
+        dispose() {
+            for (const instance of this.instances.values()) {
+                cleanupInstance(instance);
+            }
+            this.pendingLayoutEffects = [];
+            this.pendingInsertionEffects = [];
+            this.pendingEffects = [];
+            this.pendingProfilerCommits = [];
+            this.activeProfilerPaths = undefined;
+            this.mountedProfilerPaths.clear();
+            this.profilerBaseDurations.clear();
+            for (const container of this.portalContainers) {
+                container.replaceChildren();
+            }
+            this.portalContainers.clear();
+        },
+    };
+}
+export function createCacheScope() {
+    return {
+        functionCaches: new WeakMap(),
+        controller: new AbortController(),
+        ownerStack: [],
+    };
+}
+export function refreshCacheScope(scope) {
+    scope.controller.abort();
+    scope.functionCaches = new WeakMap();
+    scope.controller = new AbortController();
+}
+export function runWithCacheScope(scope, callback) {
+    const previousScope = currentCacheScope;
+    const previousGlobalScope = getGlobalCacheScope();
+    currentCacheScope = scope;
+    setGlobalCacheScope(scope);
+    try {
+        const result = callback();
+        if (isThenable(result)) {
+            return Promise.resolve(result).finally(() => {
+                currentCacheScope = previousScope;
+                setGlobalCacheScope(previousGlobalScope);
+            });
+        }
+        currentCacheScope = previousScope;
+        setGlobalCacheScope(previousGlobalScope);
+        return result;
+    }
+    catch (error) {
+        currentCacheScope = previousScope;
+        setGlobalCacheScope(previousGlobalScope);
+        throw error;
+    }
+}
+export function renderWithProfiler(runtime, path, props, render) {
+    const startTime = getCurrentTime();
+    const phase = runtime.profilerFlushDepth > 0
+        ? "nested-update"
+        : runtime.mountedProfilerPaths.has(path)
+            ? "update"
+            : "mount";
+    try {
+        return render();
+    }
+    finally {
+        runtime.activeProfilerPaths?.add(path);
+        const onRender = props.onRender;
+        const id = props.id;
+        if (typeof onRender === "function" && typeof id === "string") {
+            const actualDuration = Math.max(0, getCurrentTime() - startTime);
+            const baseDuration = Math.max(runtime.profilerBaseDurations.get(path) ?? 0, actualDuration);
+            runtime.profilerBaseDurations.set(path, baseDuration);
+            runtime.pendingProfilerCommits.push({
+                id,
+                phase,
+                onRender: onRender,
+                actualDuration,
+                baseDuration,
+                startTime,
+            });
+        }
+    }
+}
+export function renderWithRootRuntime(runtime, path, render) {
+    const previousRuntime = currentRuntime;
+    const previousInstance = currentInstance;
+    const instance = runtime.instances.get(path) ?? {
+        hooks: [],
+        hookIndex: 0,
+        dirty: false,
+        devToolsHooks: [],
+        devToolsHookTypes: [],
+        devToolsHookSuppressionDepth: 0,
+    };
+    runtime.instances.set(path, instance);
+    runtime.activeInstanceKeys?.add(path);
+    instance.hookIndex = 0;
+    instance.dirty = false;
+    instance.devToolsHooks = [];
+    instance.devToolsHookTypes = [];
+    instance.devToolsHookSuppressionDepth = 0;
+    currentRuntime = runtime;
+    currentInstance = instance;
+    try {
+        return render();
+    }
+    finally {
+        currentRuntime = previousRuntime;
+        currentInstance = previousInstance;
+    }
+}
+export function getDevToolsHookState(runtime, path) {
+    const instance = runtime.instances.get(path);
+    if (instance === undefined) {
+        return undefined;
+    }
+    return {
+        hooks: [...instance.devToolsHooks],
+        hookTypes: [...instance.devToolsHookTypes],
+    };
+}
+export function renderWithStrictMode(runtime, render) {
+    runtime.strictModeDepth += 1;
+    try {
+        return render();
+    }
+    finally {
+        runtime.strictModeDepth -= 1;
+    }
+}
+export function takeRuntimeSnapshot(runtime) {
+    return {
+        instanceKeys: new Set(runtime.instances.keys()),
+        portalContainers: new Set(runtime.portalContainers),
+        pendingInsertionEffectsLength: runtime.pendingInsertionEffects.length,
+        pendingLayoutEffectsLength: runtime.pendingLayoutEffects.length,
+        pendingEffectsLength: runtime.pendingEffects.length,
+        pendingProfilerCommitsLength: runtime.pendingProfilerCommits.length,
+        profilerBaseDurations: new Map(runtime.profilerBaseDurations),
+        idCounter: runtime.idCounter,
+        identifierPrefix: runtime.identifierPrefix,
+        idMode: runtime.idMode,
+        strictModeDepth: runtime.strictModeDepth,
+        profilerFlushDepth: runtime.profilerFlushDepth,
+    };
+}
+export function restoreRuntimeSnapshot(runtime, snapshot) {
+    runtime.pendingInsertionEffects.length = snapshot.pendingInsertionEffectsLength;
+    runtime.pendingLayoutEffects.length = snapshot.pendingLayoutEffectsLength;
+    runtime.pendingEffects.length = snapshot.pendingEffectsLength;
+    runtime.pendingProfilerCommits.length = snapshot.pendingProfilerCommitsLength;
+    runtime.profilerBaseDurations = new Map(snapshot.profilerBaseDurations);
+    runtime.idCounter = snapshot.idCounter;
+    runtime.identifierPrefix = snapshot.identifierPrefix;
+    runtime.idMode = snapshot.idMode;
+    runtime.strictModeDepth = snapshot.strictModeDepth;
+    runtime.profilerFlushDepth = snapshot.profilerFlushDepth;
+    for (const key of runtime.instances.keys()) {
+        if (!snapshot.instanceKeys.has(key)) {
+            runtime.instances.delete(key);
+        }
+    }
+    for (const container of runtime.portalContainers) {
+        if (!snapshot.portalContainers.has(container)) {
+            container.replaceChildren();
+        }
+    }
+    runtime.portalContainers.clear();
+    for (const container of snapshot.portalContainers) {
+        runtime.portalContainers.add(container);
+    }
+}
+export function useState(initial) {
+    const runtime = requireRuntime();
+    const instance = requireInstance();
+    const index = instance.hookIndex;
+    instance.hookIndex += 1;
+    let slot = instance.hooks[index];
+    if (slot === undefined) {
+        slot = {
+            kind: "state",
+            value: typeof initial === "function" ? initial() : initial,
+        };
+        instance.hooks[index] = slot;
+    }
+    if (slot.kind !== "state") {
+        throw new Error("Hook order changed between renders.");
+    }
+    const setState = (value) => {
+        const nextValue = typeof value === "function"
+            ? value(slot.value)
+            : value;
+        if (Object.is(slot.value, nextValue)) {
+            return;
+        }
+        slot.value = nextValue;
+        scheduleInstanceUpdate(runtime, instance);
+    };
+    recordDevToolsHook("useState", {
+        kind: "state",
+        value: slot.value,
+    });
+    return [slot.value, setState];
+}
+export function useReducer(reducer, initialArg, init) {
+    const [state, setState] = runWithoutDevToolsHookTracking(() => useState(() => init === undefined ? initialArg : init(initialArg)));
+    const reducerRef = runWithoutDevToolsHookTracking(() => useRef(reducer));
+    const dispatchRef = runWithoutDevToolsHookTracking(() => useRef(undefined));
+    reducerRef.current = reducer;
+    if (dispatchRef.current === undefined) {
+        dispatchRef.current = (action) => {
+            setState((previousState) => reducerRef.current(previousState, action));
+        };
+    }
+    recordDevToolsHook("useReducer", {
+        kind: "reducer",
+        value: state,
+    });
+    return [state, dispatchRef.current];
+}
+export function useRef(initial) {
+    const instance = requireInstance();
+    const index = instance.hookIndex;
+    instance.hookIndex += 1;
+    let slot = instance.hooks[index];
+    if (slot === undefined) {
+        slot = { kind: "ref", value: { current: initial } };
+        instance.hooks[index] = slot;
+    }
+    if (slot.kind !== "ref") {
+        throw new Error("Hook order changed between renders.");
+    }
+    recordDevToolsHook("useRef", {
+        kind: "ref",
+        value: slot.value,
+    });
+    return slot.value;
+}
+export function useId() {
+    const runtime = requireRuntime();
+    const idRef = runWithoutDevToolsHookTracking(() => useRef(undefined));
+    if (idRef.current === undefined) {
+        const mode = runtime.idMode === "server" ? "R" : "r";
+        idRef.current = `_${runtime.identifierPrefix}${mode}_${runtime.idCounter}_`;
+        runtime.idCounter += 1;
+    }
+    recordDevToolsHook("useId", {
+        kind: "id",
+        value: idRef.current,
+    });
+    return idRef.current;
+}
+export function useImperativeHandle(ref, create, deps) {
+    const handle = runWithoutDevToolsHookTracking(() => useMemo(create, deps));
+    runWithoutDevToolsHookTracking(() => useInsertionEffect(() => {
+        assignRef(ref, handle);
+        return () => {
+            assignRef(ref, null);
+        };
+    }, [ref, handle]));
+    recordDevToolsHook("useImperativeHandle", deps === undefined
+        ? { kind: "imperative-handle" }
+        : { kind: "imperative-handle", deps });
+}
+export function useMemo(factory, deps) {
+    const instance = requireInstance();
+    const index = instance.hookIndex;
+    instance.hookIndex += 1;
+    let slot = instance.hooks[index];
+    if (slot !== undefined && slot.kind !== "memo") {
+        throw new Error("Hook order changed between renders.");
+    }
+    if (slot === undefined ||
+        deps === undefined ||
+        slot.deps === undefined ||
+        !areHookInputsEqual(deps, slot.deps)) {
+        const value = factory();
+        slot =
+            deps === undefined
+                ? { kind: "memo", value }
+                : { kind: "memo", value, deps };
+        instance.hooks[index] = slot;
+    }
+    recordDevToolsHook("useMemo", slot.deps === undefined
+        ? { kind: "memo", value: slot.value }
+        : { kind: "memo", value: slot.value, deps: slot.deps });
+    return slot.value;
+}
+function assignRef(ref, value) {
+    if (typeof ref === "function") {
+        ref(value);
+        return;
+    }
+    if (typeof ref === "object" && ref !== null && "current" in ref) {
+        ref.current = value;
+    }
+}
+function recordDevToolsHook(type, value) {
+    const instance = currentInstance;
+    if (instance === undefined || instance.devToolsHookSuppressionDepth > 0) {
+        return;
+    }
+    instance.devToolsHookTypes.push(type);
+    instance.devToolsHooks.push(value);
+}
+function runWithoutDevToolsHookTracking(callback) {
+    const instance = requireInstance();
+    instance.devToolsHookSuppressionDepth += 1;
+    try {
+        return callback();
+    }
+    finally {
+        instance.devToolsHookSuppressionDepth -= 1;
+    }
+}
+export function useCallback(callback, deps) {
+    const value = runWithoutDevToolsHookTracking(() => useMemo(() => callback, deps));
+    recordDevToolsHook("useCallback", deps === undefined
+        ? { kind: "callback", value }
+        : { kind: "callback", value, deps });
+    return value;
+}
+export function useDebugValue(_value, _format) {
+    const instance = requireInstance();
+    const index = instance.hookIndex;
+    instance.hookIndex += 1;
+    const value = _format === undefined ? _value : _format(_value);
+    let slot = instance.hooks[index];
+    if (slot !== undefined && slot.kind !== "debug") {
+        throw new Error("Hook order changed between renders.");
+    }
+    if (slot === undefined) {
+        slot = { kind: "debug", value };
+        instance.hooks[index] = slot;
+        recordDevToolsHook("useDebugValue", {
+            kind: "debug",
+            value,
+        });
+        return;
+    }
+    slot.value = value;
+    recordDevToolsHook("useDebugValue", {
+        kind: "debug",
+        value,
+    });
+}
+export function useEffectEvent(callback) {
+    const ref = runWithoutDevToolsHookTracking(() => useRef(callback));
+    ref.current = callback;
+    const event = runWithoutDevToolsHookTracking(() => useCallback((...args) => ref.current(...args), []));
+    recordDevToolsHook("useEffectEvent", {
+        kind: "callback",
+        value: event,
+        deps: [],
+    });
+    return event;
+}
+export function useEffect(callback, deps) {
+    useEffectImpl("normal", callback, deps);
+    recordDevToolsHook("useEffect", deps === undefined
+        ? { kind: "effect", effectKind: "normal" }
+        : { kind: "effect", effectKind: "normal", deps });
+}
+export function useInsertionEffect(callback, deps) {
+    useEffectImpl("insertion", callback, deps);
+    recordDevToolsHook("useInsertionEffect", deps === undefined
+        ? { kind: "effect", effectKind: "insertion" }
+        : { kind: "effect", effectKind: "insertion", deps });
+}
+export function useLayoutEffect(callback, deps) {
+    useEffectImpl("layout", callback, deps);
+    recordDevToolsHook("useLayoutEffect", deps === undefined
+        ? { kind: "effect", effectKind: "layout" }
+        : { kind: "effect", effectKind: "layout", deps });
+}
+export function useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot = getSnapshot) {
+    const runtime = requireRuntime();
+    const instance = requireInstance();
+    const index = instance.hookIndex;
+    instance.hookIndex += 1;
+    let slot = instance.hooks[index];
+    if (slot === undefined) {
+        slot = { kind: "store", value: getServerSnapshot() };
+        instance.hooks[index] = slot;
+    }
+    if (slot.kind !== "store") {
+        throw new Error("Hook order changed between renders.");
+    }
+    const currentSnapshot = getSnapshot();
+    if (!Object.is(slot.value, currentSnapshot)) {
+        slot.value = currentSnapshot;
+    }
+    recordExternalStoreCheck(getSnapshot, currentSnapshot);
+    runWithoutDevToolsHookTracking(() => useEffect(() => {
+        const checkForUpdates = () => {
+            const nextSnapshot = getSnapshot();
+            if (!Object.is(slot.value, nextSnapshot)) {
+                slot.value = nextSnapshot;
+                runtime.rerender("sync");
+            }
+        };
+        checkForUpdates();
+        return subscribe(checkForUpdates);
+    }, [subscribe, getSnapshot]));
+    recordDevToolsHook("useSyncExternalStore", {
+        kind: "store",
+        value: slot.value,
+    });
+    return slot.value;
+}
+export function useActionState(action, initialState) {
+    const runtime = requireRuntime();
+    const instance = requireInstance();
+    const index = instance.hookIndex;
+    instance.hookIndex += 1;
+    let slot = instance.hooks[index];
+    if (slot !== undefined && slot.kind !== "action-state") {
+        throw new Error("Hook order changed between renders.");
+    }
+    if (slot === undefined) {
+        slot = {
+            kind: "action-state",
+            state: initialState,
+            pendingCount: 0,
+            action: action,
+        };
+        instance.hooks[index] = slot;
+    }
+    if ("error" in slot) {
+        throw slot.error;
+    }
+    slot.action = action;
+    if (slot.dispatch === undefined) {
+        slot.dispatch = (payload) => {
+            runActionStateDispatch(slot, runtime, instance, payload);
+        };
+    }
+    recordDevToolsHook("useActionState", {
+        kind: "state",
+        value: slot.state,
+    });
+    return [
+        slot.state,
+        slot.dispatch,
+        slot.pendingCount > 0,
+    ];
+}
+export function useOptimistic(state, update) {
+    const runtime = requireRuntime();
+    const instance = requireInstance();
+    const index = instance.hookIndex;
+    instance.hookIndex += 1;
+    let slot = instance.hooks[index];
+    const updateFn = update === undefined
+        ? (_current, payload) => payload
+        : update;
+    if (slot !== undefined && slot.kind !== "optimistic") {
+        throw new Error("Hook order changed between renders.");
+    }
+    if (slot === undefined) {
+        slot = {
+            kind: "optimistic",
+            baseState: state,
+            optimisticState: state,
+            update: updateFn,
+        };
+        instance.hooks[index] = slot;
+    }
+    slot.update = updateFn;
+    if (!Object.is(slot.baseState, state)) {
+        slot.baseState = state;
+        slot.optimisticState = state;
+    }
+    if (slot.dispatch === undefined) {
+        slot.dispatch = (payload) => {
+            slot.optimisticState = slot.update(slot.optimisticState, payload);
+            scheduleInstanceUpdate(runtime, instance);
+        };
+    }
+    recordDevToolsHook("useOptimistic", {
+        kind: "state",
+        value: slot.optimisticState,
+    });
+    return [slot.optimisticState, slot.dispatch];
+}
+export function use(usable) {
+    if (isReactCompatContext(usable)) {
+        return useContext(usable);
+    }
+    if (isThenable(usable)) {
+        return readThenable(usable);
+    }
+    return usable;
+}
+export function cache(callback) {
+    return (...args) => {
+        const scope = getCurrentCacheScope();
+        if (scope === undefined) {
+            return callback(...args);
+        }
+        const leaf = getCacheLeaf(scope, callback, args);
+        if (leaf.status === "fulfilled") {
+            return leaf.value;
+        }
+        if (leaf.status === "rejected") {
+            throw leaf.reason;
+        }
+        try {
+            const value = callback(...args);
+            leaf.status = "fulfilled";
+            leaf.value = value;
+            return value;
+        }
+        catch (error) {
+            leaf.status = "rejected";
+            leaf.reason = error;
+            throw error;
+        }
+    };
+}
+export function cacheSignal() {
+    return getCurrentCacheScope()?.controller.signal ?? null;
+}
+export function captureOwnerStack() {
+    const stack = getCurrentCacheScope()?.ownerStack ?? emptyCacheOwnerStack;
+    return stack.length === 0 ? null : stack.join("\n");
+}
+export function unstable_useCacheRefresh() {
+    return useCallback(() => undefined, []);
+}
+export function hasStableExternalStores(runtime) {
+    return runtime.externalStoreChecks.every((check) => Object.is(check.getSnapshot(), check.value));
+}
+export function renderToString(component, props, options = {}) {
+    const runtime = createRootRuntime(() => undefined, {
+        ...options,
+        idMode: "server",
+    });
+    return runWithCacheScope(createCacheScope(), () => {
+        try {
+            const rendered = renderWithRootRuntime(runtime, "0", () => component(props));
+            return typeof rendered === "string"
+                ? rendered
+                : renderNodeToString(rendered, runtime, "0");
+        }
+        finally {
+            runtime.dispose();
+        }
+    });
+}
+function renderNodeToString(node, runtime, path) {
+    if (node === null || node === undefined || typeof node === "boolean") {
+        return "";
+    }
+    if (typeof node === "string" || typeof node === "number") {
+        return escapeHtml(node);
+    }
+    if (Array.isArray(node)) {
+        return node.map((child, index) => renderNodeToString(child, runtime, `${path}.${index}`)).join("");
+    }
+    if (!isReactCompatElement(node)) {
+        return "";
+    }
+    return renderElementToString(node, runtime, path);
+}
+function renderElementToString(element, runtime, path) {
+    if (typeof element.type === "string") {
+        if (element.type === "textarea") {
+            return renderTextareaToString(element, runtime, path);
+        }
+        if (element.type === "select") {
+            return renderSelectToString(element, runtime, path);
+        }
+        const attributes = element.type === "input"
+            ? renderInputAttributesToString(element.props)
+            : Object.entries(element.props)
+                .map(([name, value]) => renderHtmlAttribute(name, value))
+                .filter((attribute) => attribute !== "")
+                .join("");
+        if (voidHtmlElements.has(element.type)) {
+            return `<${element.type}${attributes}/>`;
+        }
+        return `<${element.type}${attributes}>${renderNodeToString(element.props.children, runtime, `${path}.children`)}</${element.type}>`;
+    }
+    if (element.type === Fragment) {
+        return renderNodeToString(element.props.children, runtime, `${path}.fragment`);
+    }
+    if (element.type === Activity) {
+        if (element.props.mode === "hidden") {
+            return "";
+        }
+        return `<!--&-->${renderNodeToString(element.props.children, runtime, `${path}.activity`)}<!--/&-->`;
+    }
+    if (element.type === Profiler) {
+        return renderNodeToString(element.props.children, runtime, `${path}.profiler`);
+    }
+    if (isReactCompatProvider(element.type)) {
+        return renderWithContextProvider(element.type, element.props.value, () => renderNodeToString(element.props.children, runtime, `${path}.provider`));
+    }
+    if (isReactCompatConsumer(element.type)) {
+        const children = element.props.children;
+        if (typeof children === "function") {
+            return renderNodeToString(children(useContext(element.type.context)), runtime, `${path}.consumer`);
+        }
+        return "";
+    }
+    if (isForwardRefType(element.type)) {
+        const forwardRefType = element.type;
+        return renderNodeToString(renderWithRootRuntime(runtime, `${path}.forwardRef`, () => forwardRefType.render(element.props, element.ref)), runtime, `${path}.forwardRef`);
+    }
+    if (isMemoType(element.type)) {
+        return renderNodeToString({
+            ...element,
+            type: element.type.type,
+        }, runtime, `${path}.memo`);
+    }
+    if (isClassComponentType(element.type)) {
+        const instance = new element.type(element.props);
+        return renderNodeToString(renderWithRootRuntime(runtime, path, () => instance.render()), runtime, path);
+    }
+    if (typeof element.type === "function") {
+        const component = element.type;
+        return renderNodeToString(renderWithRootRuntime(runtime, path, () => component(element.props)), runtime, path);
+    }
+    return "";
+}
+function isClassComponentType(value) {
+    return (typeof value === "function" &&
+        typeof value.prototype?.render === "function");
+}
+function renderTextareaToString(element, runtime, path) {
+    const value = element.props.value ??
+        element.props.defaultValue ??
+        element.props.children;
+    const attributes = Object.entries(element.props)
+        .filter(([name]) => name !== "value" && name !== "defaultValue")
+        .map(([name, child]) => renderHtmlAttribute(name, child))
+        .filter((attribute) => attribute !== "")
+        .join("");
+    return `<textarea${attributes}>${renderNodeToString(value, runtime, `${path}.textarea`)}</textarea>`;
+}
+function renderSelectToString(element, runtime, path) {
+    const selectedValue = element.props.value ??
+        element.props.defaultValue;
+    const attributes = Object.entries(element.props)
+        .filter(([name]) => name !== "value" && name !== "defaultValue")
+        .map(([name, child]) => renderHtmlAttribute(name, child))
+        .filter((attribute) => attribute !== "")
+        .join("");
+    return `<select${attributes}>${renderSelectChildrenToString(element.props.children, selectedValue, runtime, `${path}.select`)}</select>`;
+}
+function renderSelectChildrenToString(children, selectedValue, runtime, path) {
+    const childArray = Array.isArray(children) ? children : [children];
+    return childArray.map((child, index) => {
+        if (!isReactCompatElement(child) || child.type !== "option") {
+            return renderNodeToString(child, runtime, `${path}.${index}`);
+        }
+        const optionValue = child.props.value ?? child.props.children;
+        const selected = selectedValue !== undefined && String(optionValue) === String(selectedValue);
+        const props = selected
+            ? { ...child.props, selected: true }
+            : child.props;
+        return renderElementToString({ ...child, props }, runtime, `${path}.${index}`);
+    }).join("");
+}
+function renderInputAttributesToString(props) {
+    const hasValue = props.value !== undefined;
+    const hasChecked = props.checked !== undefined;
+    return Object.entries(props)
+        .filter(([name]) => !((name === "defaultValue" && hasValue) || (name === "defaultChecked" && hasChecked)))
+        .sort(([leftName], [rightName]) => Number(isInputValueAttribute(leftName)) - Number(isInputValueAttribute(rightName)))
+        .map(([name, value]) => renderHtmlAttribute(toInputHtmlAttributeName(name), value))
+        .filter((attribute) => attribute !== "")
+        .join("");
+}
+function renderHtmlAttribute(name, value) {
+    if (name === "children" ||
+        name === "key" ||
+        name === "ref" ||
+        /^on[A-Z]/.test(name) ||
+        value === null ||
+        value === undefined ||
+        value === false ||
+        typeof value === "function") {
+        return "";
+    }
+    if (name === "style") {
+        const style = renderStyleAttribute(value);
+        return style === "" ? "" : ` style="${escapeHtml(style)}"`;
+    }
+    const attributeName = toHtmlAttributeName(name);
+    if (isDangerousHtmlAttribute(attributeName)) {
+        return isDangerousHtmlOptIn(value)
+            ? ` ${attributeName}="${escapeHtml(value.__html)}"`
+            : "";
+    }
+    if (typeof value === "object") {
+        return "";
+    }
+    if (value === true) {
+        return ` ${attributeName}=""`;
+    }
+    return ` ${attributeName}="${escapeHtml(value)}"`;
+}
+function isInputValueAttribute(name) {
+    return name === "value" || name === "defaultValue";
+}
+function toInputHtmlAttributeName(name) {
+    if (name === "defaultValue") {
+        return "value";
+    }
+    if (name === "defaultChecked") {
+        return "checked";
+    }
+    return name;
+}
+function toHtmlAttributeName(name) {
+    return HTML_ATTRIBUTE_ALIASES[name] ?? name;
+}
+const HTML_ATTRIBUTE_ALIASES = {
+    acceptCharset: "accept-charset",
+    autoFocus: "autofocus",
+    autoPlay: "autoplay",
+    charSet: "charset",
+    className: "class",
+    colSpan: "colspan",
+    contentEditable: "contenteditable",
+    crossOrigin: "crossorigin",
+    encType: "enctype",
+    formAction: "formaction",
+    frameBorder: "frameborder",
+    htmlFor: "for",
+    httpEquiv: "http-equiv",
+    maxLength: "maxlength",
+    minLength: "minlength",
+    noValidate: "novalidate",
+    playsInline: "playsinline",
+    readOnly: "readOnly",
+    rowSpan: "rowspan",
+    spellCheck: "spellcheck",
+    srcDoc: "srcdoc",
+    srcSet: "srcset",
+    tabIndex: "tabindex",
+    useMap: "usemap",
+};
+function renderStyleAttribute(value) {
+    if (typeof value !== "object" || value === null) {
+        return "";
+    }
+    return Object.entries(value)
+        .filter(([, propertyValue]) => propertyValue !== null &&
+        propertyValue !== undefined &&
+        typeof propertyValue !== "boolean" &&
+        propertyValue !== "")
+        .map(([name, propertyValue]) => `${toKebabCase(name)}:${renderCssValue(name, propertyValue)}`)
+        .join(";");
+}
+function renderCssValue(name, value) {
+    if (typeof value !== "number" || value === 0 || isUnitlessCssProperty(name)) {
+        return String(value);
+    }
+    return `${value}px`;
+}
+function toKebabCase(value) {
+    return value.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`);
+}
+function isUnitlessCssProperty(name) {
+    return (name === "flex" ||
+        name === "fontWeight" ||
+        name === "lineHeight" ||
+        name === "opacity" ||
+        name === "order" ||
+        name === "zIndex" ||
+        name === "zoom");
+}
+const voidHtmlElements = new Set([
+    "area",
+    "base",
+    "br",
+    "col",
+    "embed",
+    "hr",
+    "img",
+    "input",
+    "link",
+    "meta",
+    "param",
+    "source",
+    "track",
+    "wbr",
+]);
+function isForwardRefType(value) {
+    return (typeof value === "object" &&
+        value !== null &&
+        value.$$typeof === FORWARD_REF_TYPE);
+}
+function isMemoType(value) {
+    return (typeof value === "object" &&
+        value !== null &&
+        value.$$typeof === MEMO_TYPE);
+}
+function readThenable(thenable) {
+    const record = thenable;
+    if (record.status === "fulfilled") {
+        return record.value;
+    }
+    if (record.status === "rejected") {
+        throw record.reason;
+    }
+    if (record.status === undefined) {
+        record.status = "pending";
+        thenable.then((value) => {
+            if (record.status === "pending") {
+                record.status = "fulfilled";
+                record.value = value;
+            }
+        }, (reason) => {
+            if (record.status === "pending") {
+                record.status = "rejected";
+                record.reason = reason;
+            }
+        });
+    }
+    throw thenable;
+}
+export function startTransition(scope) {
+    const context = {
+        syncVersion,
+        transitionVersion: ++transitionVersion,
+    };
+    scheduleCallback("low", () => {
+        if (!isTransitionContextCurrent(context)) {
+            return;
+        }
+        runTransitionScope(scope, context);
+    });
+}
+export function runWithEventPriority(priority, callback) {
+    const previousPriority = currentEventPriority;
+    currentEventPriority = priority;
+    eventBatchDepth += 1;
+    try {
+        return callback();
+    }
+    finally {
+        eventBatchDepth -= 1;
+        currentEventPriority = previousPriority;
+        if (eventBatchDepth === 0) {
+            flushEventRerendersForPriority(priority);
+        }
+    }
+}
+export function flushSyncUpdates(callback) {
+    const previousEventBatchDepth = eventBatchDepth;
+    const previousEventPriority = currentEventPriority;
+    eventBatchDepth = 0;
+    currentEventPriority = "discrete";
+    try {
+        const value = callback();
+        flushQueuedEventRerenders();
+        return value;
+    }
+    finally {
+        eventBatchDepth = previousEventBatchDepth;
+        currentEventPriority = previousEventPriority;
+    }
+}
+export function useTransition() {
+    const [pending, setPending] = runWithoutDevToolsHookTracking(() => useState(false));
+    const startTransitionWithPending = (scope) => {
+        setPending(true);
+        const context = {
+            syncVersion,
+            transitionVersion: ++transitionVersion,
+        };
+        scheduleCallback("low", () => {
+            if (!isTransitionContextCurrent(context)) {
+                setPending(false);
+                return;
+            }
+            runTransitionScope(() => {
+                scope();
+                setPending(false);
+            }, context);
+        });
+    };
+    recordDevToolsHook("useTransition", {
+        kind: "transition",
+        value: pending,
+    });
+    return [
+        pending,
+        startTransitionWithPending,
+    ];
+}
+export function useDeferredValue(value) {
+    const [deferredValue, setDeferredValue] = runWithoutDevToolsHookTracking(() => useState(value));
+    runWithoutDevToolsHookTracking(() => useEffect(() => {
+        if (Object.is(deferredValue, value)) {
+            return;
+        }
+        startTransition(() => {
+            setDeferredValue(value);
+        });
+    }, [value, deferredValue]));
+    const currentValue = Object.is(deferredValue, value) ? value : deferredValue;
+    recordDevToolsHook("useDeferredValue", {
+        kind: "deferred",
+        value: currentValue,
+    });
+    return currentValue;
+}
+function runTransitionScope(scope, context) {
+    transitionDepth += 1;
+    const previousContext = currentTransitionContext;
+    currentTransitionContext = context;
+    try {
+        scope();
+    }
+    finally {
+        currentTransitionContext = previousContext;
+        transitionDepth -= 1;
+    }
+}
+function queueTransitionRerender(runtime, context) {
+    queuedTransitionRerenders.set(runtime, context);
+    if (transitionRerenderScheduled) {
+        return;
+    }
+    transitionRerenderScheduled = true;
+    scheduleCallback("low", flushQueuedTransitionRerenders);
+}
+function queueEventRerender(runtime) {
+    queuedEventRerenders.add(runtime);
+}
+function flushEventRerendersForPriority(priority) {
+    if (priority === "discrete") {
+        flushQueuedEventRerenders("sync");
+        return;
+    }
+    if (eventRerenderScheduled || queuedEventRerenders.size === 0) {
+        return;
+    }
+    eventRerenderScheduled = true;
+    scheduleCallback(priority === "continuous" ? "normal" : "low", () => {
+        eventRerenderScheduled = false;
+        flushQueuedEventRerenders(priority === "continuous" ? "continuous" : "sync");
+    });
+}
+function flushQueuedEventRerenders(priority = "sync") {
+    const runtimes = Array.from(queuedEventRerenders);
+    queuedEventRerenders.clear();
+    for (const runtime of runtimes) {
+        runtime.rerender(priority);
+    }
+}
+function flushQueuedTransitionRerenders() {
+    transitionRerenderScheduled = false;
+    const entries = Array.from(queuedTransitionRerenders.entries());
+    queuedTransitionRerenders.clear();
+    for (const [runtime, context] of entries) {
+        if (isTransitionContextCurrent(context)) {
+            runtime.rerender("transition");
+        }
+    }
+}
+function isTransitionContextCurrent(context) {
+    return (context.syncVersion === syncVersion &&
+        context.transitionVersion === transitionVersion);
+}
+function useEffectImpl(effectKind, callback, deps) {
+    const runtime = requireRuntime();
+    const instance = requireInstance();
+    const index = instance.hookIndex;
+    instance.hookIndex += 1;
+    let slot = instance.hooks[index];
+    if (slot !== undefined && slot.kind !== "effect") {
+        throw new Error("Hook order changed between renders.");
+    }
+    const shouldRun = slot === undefined ||
+        deps === undefined ||
+        slot.deps === undefined ||
+        !areHookInputsEqual(deps, slot.deps);
+    if (slot === undefined) {
+        slot =
+            deps === undefined
+                ? { kind: "effect", effectKind, callback }
+                : { kind: "effect", effectKind, callback, deps };
+        instance.hooks[index] = slot;
+    }
+    else {
+        slot.effectKind = effectKind;
+        slot.callback = callback;
+        slot.disposed = false;
+        if (deps === undefined) {
+            delete slot.deps;
+        }
+        else {
+            slot.deps = deps;
+        }
+    }
+    slot.strictReplay =
+        runtime.strictModeDepth > 0 && effectKind !== "insertion";
+    if (shouldRun) {
+        const queue = effectKind === "insertion"
+            ? runtime.pendingInsertionEffects
+            : effectKind === "layout"
+                ? runtime.pendingLayoutEffects
+                : runtime.pendingEffects;
+        queue.push({ slot });
+    }
+}
+function recordExternalStoreCheck(getSnapshot, value) {
+    currentRuntime?.externalStoreChecks.push({ getSnapshot, value });
+}
+function flushPendingEffects(queue) {
+    const pending = queue.splice(0);
+    const strictReplay = [];
+    for (const { slot } of pending) {
+        if (slot.disposed === true) {
+            continue;
+        }
+        slot.cleanup?.();
+        const shouldReplay = slot.strictReplay === true && slot.cleanup === undefined;
+        const cleanup = slot.callback();
+        if (typeof cleanup === "function") {
+            slot.cleanup = cleanup;
+        }
+        else {
+            delete slot.cleanup;
+        }
+        if (shouldReplay) {
+            strictReplay.push({ slot });
+        }
+    }
+    return strictReplay;
+}
+function replayStrictEffects(effects) {
+    for (const { slot } of effects) {
+        if (slot.disposed === true) {
+            continue;
+        }
+        const cleanup = slot.callback();
+        if (typeof cleanup === "function") {
+            slot.cleanup = cleanup;
+        }
+        else {
+            delete slot.cleanup;
+        }
+    }
+}
+function flushProfilerCommits(runtime, commits) {
+    if (commits.length === 0) {
+        return;
+    }
+    const commitTime = getCurrentTime();
+    runtime.profilerFlushDepth += 1;
+    try {
+        for (const commit of commits) {
+            commit.onRender(commit.id, commit.phase, commit.actualDuration, commit.baseDuration, commit.startTime, commitTime);
+        }
+    }
+    finally {
+        runtime.profilerFlushDepth -= 1;
+    }
+}
+function runActionStateDispatch(slot, runtime, instance, payload) {
+    let result;
+    try {
+        result = slot.action(slot.state, payload);
+    }
+    catch (error) {
+        slot.error = error;
+        scheduleInstanceUpdate(runtime, instance);
+        return;
+    }
+    if (!isThenable(result)) {
+        slot.state = result;
+        scheduleInstanceUpdate(runtime, instance);
+        return;
+    }
+    slot.pendingCount += 1;
+    scheduleInstanceUpdate(runtime, instance);
+    result.then((nextState) => {
+        slot.state = nextState;
+        slot.pendingCount = Math.max(0, slot.pendingCount - 1);
+        scheduleInstanceUpdate(runtime, instance);
+    }, (error) => {
+        slot.error = error;
+        slot.pendingCount = Math.max(0, slot.pendingCount - 1);
+        scheduleInstanceUpdate(runtime, instance);
+    });
+}
+function scheduleInstanceUpdate(runtime, instance) {
+    instance.dirty = true;
+    if (transitionDepth === 0) {
+        syncVersion += 1;
+        if (eventBatchDepth > 0) {
+            queueEventRerender(runtime);
+            return;
+        }
+        runtime.rerender("sync");
+        return;
+    }
+    if (currentTransitionContext !== undefined) {
+        queueTransitionRerender(runtime, currentTransitionContext);
+    }
+}
+function getCacheLeaf(scope, callback, args) {
+    let node = scope.functionCaches.get(callback);
+    if (node === undefined) {
+        node = createCacheTrieNode();
+        scope.functionCaches.set(callback, node);
+    }
+    for (const arg of args) {
+        node = getCacheChild(node, arg);
+    }
+    return node;
+}
+function getCacheChild(node, key) {
+    if ((typeof key === "object" && key !== null) || typeof key === "function") {
+        const objectKey = key;
+        let child = node.objectChildren.get(objectKey);
+        if (child === undefined) {
+            child = createCacheTrieNode();
+            node.objectChildren.set(objectKey, child);
+        }
+        return child;
+    }
+    let child = node.primitiveChildren.get(key);
+    if (child === undefined) {
+        child = createCacheTrieNode();
+        node.primitiveChildren.set(key, child);
+    }
+    return child;
+}
+function createCacheTrieNode() {
+    return {
+        primitiveChildren: new Map(),
+        objectChildren: new WeakMap(),
+    };
+}
+function getCurrentCacheScope() {
+    return currentCacheScope ?? getGlobalCacheScope();
+}
+function getGlobalCacheScope() {
+    return globalThis[CACHE_SCOPE_SYMBOL];
+}
+function setGlobalCacheScope(scope) {
+    if (scope === undefined) {
+        delete globalThis[CACHE_SCOPE_SYMBOL];
+        return;
+    }
+    globalThis[CACHE_SCOPE_SYMBOL] = scope;
+}
+function cleanupStrictEffects(effects) {
+    for (const { slot } of effects) {
+        if (slot.disposed !== true) {
+            slot.cleanup?.();
+        }
+    }
+}
+function cleanupInactiveInstances(runtime) {
+    const activeInstanceKeys = runtime.activeInstanceKeys;
+    if (activeInstanceKeys === undefined) {
+        return;
+    }
+    for (const [key, instance] of runtime.instances) {
+        if (!activeInstanceKeys.has(key)) {
+            cleanupInstance(instance);
+            runtime.instances.delete(key);
+        }
+    }
+}
+function cleanupInstance(instance) {
+    for (const slot of instance.hooks) {
+        if (slot?.kind === "effect") {
+            slot.disposed = true;
+            slot.cleanup?.();
+            delete slot.cleanup;
+        }
+    }
+}
+function requireRuntime() {
+    if (currentRuntime === undefined) {
+        throw new Error("Hooks can only be called while rendering.");
+    }
+    return currentRuntime;
+}
+function requireInstance() {
+    if (currentInstance === undefined) {
+        throw new Error("Hooks can only be called while rendering.");
+    }
+    return currentInstance;
+}
+function areHookInputsEqual(nextDeps, previousDeps) {
+    if (nextDeps.length !== previousDeps.length) {
+        return false;
+    }
+    for (let index = 0; index < nextDeps.length; index += 1) {
+        if (!Object.is(nextDeps[index], previousDeps[index])) {
+            return false;
+        }
+    }
+    return true;
+}
+function getCurrentTime() {
+    return typeof performance === "undefined" ? Date.now() : performance.now();
+}
+//# sourceMappingURL=hooks.js.map