@askrjs/askr 0.3.0 → 0.4.0

package/dist/ssr-DoV-vJ-5.js

@@ -0,0 +1,229 @@
+import { n as isPromiseLike } from "./promise-Dz8iIHAm.js";
+import { d as isCustomElementName } from "./url-CnbfpX0K.js";
+//#region src/common/prop-classification.ts
+/**
+* The prop vocabulary shared by the DOM renderer and the SSR renderer.
+*
+* These questions — is this prop framework-internal, is it an ARIA attribute,
+* how is a style property named, does a `true` value render bare — were
+* previously answered separately on each side, and the answers had drifted.
+* Both renderers must agree for hydration to match, so the answers live here.
+*/
+/** Props that are never rendered as attributes by either renderer. */
+function isSkippedProp(key) {
+	return key === "children" || key === "imperativeChildren" || key === "key" || key === "ref";
+}
+/**
+* ARIA state attributes take the strings `"true"`/`"false"`, so unlike HTML
+* boolean attributes a `false` value is meaningful and must still be rendered.
+*/
+function isAriaAttribute(key) {
+	return key.length > 5 && key.slice(0, 5).toLowerCase() === "aria-";
+}
+/**
+* Enumerated attributes whose `"false"` state differs from being absent: an
+* `<img>` or link is draggable by default, and `spellcheck`/`contenteditable`
+* inherit when missing. `false` must render the literal string for these.
+*/
+const ENUMERATED_FALSE_ATTRIBUTES = /* @__PURE__ */ new Set([
+	"contenteditable",
+	"draggable",
+	"spellcheck",
+	"writingsuggestions"
+]);
+/**
+* Whether a `false` prop renders as the string `"false"` rather than removing
+* the attribute: true for ARIA state and the enumerated attributes above.
+* Accepts either the JSX prop name or the rendered attribute name.
+*/
+function keepsFalseValue(key) {
+	return isAriaAttribute(key) || ENUMERATED_FALSE_ATTRIBUTES.has(key.toLowerCase());
+}
+/**
+* CSS custom properties are case-sensitive and must survive verbatim; every
+* other style property is camelCase in JSX and kebab-case in CSS.
+*/
+function normalizeStylePropertyName(propertyName) {
+	if (propertyName.startsWith("--")) return propertyName;
+	const kebab = propertyName.replace(/[A-Z]/g, (char) => `-${char.toLowerCase()}`);
+	return kebab.startsWith("ms-") ? `-${kebab}` : kebab;
+}
+/**
+* CSS properties (kebab-case, vendor prefix stripped) that accept a bare
+* number. This follows React's unitless list, plus `font-size-adjust`,
+* `initial-letter` and `math-depth`. Numeric values for every other property get a `px` unit, matching
+* the conventional JSX style contract.
+*/
+const UNITLESS_STYLE_PROPERTIES = new Set("animation-iteration-count aspect-ratio border-image-outset border-image-slice border-image-width box-flex box-flex-group box-ordinal-group column-count columns fill-opacity flex flex-grow flex-negative flex-order flex-positive flex-shrink flood-opacity font-size-adjust font-weight grid-area grid-column grid-column-end grid-column-span grid-column-start grid-row grid-row-end grid-row-span grid-row-start initial-letter line-clamp line-height mask-border-outset mask-border-slice mask-border-width math-depth opacity order orphans scale shape-image-threshold stop-opacity stroke-dasharray stroke-dashoffset stroke-miterlimit stroke-opacity stroke-width tab-size widows z-index zoom".split(" "));
+const VENDOR_PREFIX_RE = /^-(?:webkit|moz|ms|o)-/;
+/**
+* The CSS text for one style entry, given its normalized property name.
+*
+* A non-zero number on a dimensional property gets `px` (`width: 10` is
+* `10px`); custom properties and unitless properties keep the bare number.
+*/
+function styleValueText(propertyName, value) {
+	if (typeof value !== "number" || value === 0 || !Number.isFinite(value) || propertyName.startsWith("--") || UNITLESS_STYLE_PROPERTIES.has(propertyName.replace(VENDOR_PREFIX_RE, ""))) return String(value);
+	return `${value}px`;
+}
+/**
+* HTML boolean content attributes: present means true, and the value is
+* ignored. A `true` prop renders these bare on both sides. Anything else —
+* `aria-*`, `data-*`, arbitrary attributes — renders the literal `"true"`,
+* because for those the value carries the meaning.
+*/
+const BOOLEAN_HTML_ATTRIBUTES = new Set("allowfullscreen async autofocus autoplay checked controls default defer disabled formnovalidate inert ismap itemscope loop multiple muted nomodule novalidate open playsinline readonly required reversed selected".split(" "));
+/**
+* The attribute text for a prop value that is exactly `true`.
+*
+* Boolean attributes render bare (an empty value); everything else renders
+* `"true"` so ARIA state and `data-` payloads survive a round trip.
+*/
+function booleanAttributeValue(attributeName) {
+	return BOOLEAN_HTML_ATTRIBUTES.has(attributeName.toLowerCase()) ? "" : "true";
+}
+//#endregion
+//#region src/common/dom-properties.ts
+/**
+* Which JSX props are written to DOM properties instead of attributes.
+*
+* Attributes are the default because SSR can serialize them and hydration can
+* compare them. Some element state only lives in a property, though: the
+* `muted` attribute is only the initial value of `media.muted`, `indeterminate`
+* has no attribute at all, and custom elements take objects and arrays as
+* properties. Both renderers classify props here so the DOM renderer writes
+* the property and SSR leaves out whatever it cannot serialize.
+*
+* - `prop:name` always assigns `el.name`, verbatim, and never renders.
+* - `attr:name` always renders the `name` attribute (see attr-names.ts).
+*/
+const PROPERTY_PROP_PREFIX = "prop:";
+const ATTRIBUTE_PROP_PREFIX = "attr:";
+/**
+* Known properties the attribute does not keep in sync, on the elements that
+* have them. Their value is coerced to a boolean and an absent prop resets
+* them to `false`. `muted` also keeps its attribute, which SSR renders and
+* which sets the initial state on parse; `indeterminate` has no attribute and
+* never renders.
+*/
+function isKnownPropertyOf(tagName, key) {
+	if (key === "muted") {
+		const tag = tagName.toLowerCase();
+		return tag === "video" || tag === "audio";
+	}
+	return key === "indeterminate" && tagName.toLowerCase() === "input";
+}
+function isKnownBooleanProperty(key) {
+	return key === "muted" || key === "indeterminate";
+}
+/**
+* The DOM property a prop is written to, or `null` when it is an attribute.
+*
+* Custom elements (a tag name containing `-`) receive object and array values
+* as properties; their primitive values stay attributes.
+*/
+function getDomPropertyName(tagName, key, value) {
+	if (key.startsWith("prop:")) return key.slice(5);
+	if (isKnownPropertyOf(tagName, key)) return key;
+	if (value !== null && typeof value === "object" && key !== "style" && key !== "dangerouslySetInnerHTML" && isCustomElementName(tagName)) return key;
+	return null;
+}
+/** Whether a property-routed prop also renders its attribute (`muted`). */
+function propertyReflectsAttribute(key) {
+	return key === "muted";
+}
+/**
+* Whether SSR leaves a prop out entirely because it is written only as a
+* property on the client.
+*/
+function isPropertyOnlyProp(tagName, key, value) {
+	return getDomPropertyName(tagName, key, value) !== null && !propertyReflectsAttribute(key);
+}
+/** The value a property prop assigns: `muted`/`indeterminate` are booleans. */
+function domPropertyValue(key, value) {
+	return key === "muted" || key === "indeterminate" ? Boolean(value) : value;
+}
+//#endregion
+//#region src/common/css.ts
+const CSS_UNSAFE_RE = /[{}<>\\]/g;
+const CSS_URI_SCHEME_RE = /(?:^|[\s(,])([a-z][a-z0-9+.-]*):/i;
+const CSS_FUNCTION_NAME_RE = /([a-z-][a-z0-9-]*)\s*\(/gi;
+const CSS_ALLOWED_FUNCTIONS = /* @__PURE__ */ new Set([
+	"var",
+	"calc",
+	"min",
+	"max",
+	"clamp",
+	"rgb",
+	"rgba",
+	"hsl",
+	"hsla",
+	"lab",
+	"lch",
+	"oklab",
+	"oklch",
+	"color",
+	"color-mix",
+	"translate",
+	"translatex",
+	"translatey",
+	"translatez",
+	"scale",
+	"scalex",
+	"scaley",
+	"scalez",
+	"rotate",
+	"rotatex",
+	"rotatey",
+	"rotatez",
+	"skew",
+	"skewx",
+	"skewy",
+	"matrix",
+	"matrix3d",
+	"linear-gradient",
+	"radial-gradient",
+	"conic-gradient",
+	"repeating-linear-gradient",
+	"repeating-radial-gradient",
+	"repeating-conic-gradient",
+	"cubic-bezier",
+	"steps"
+]);
+function sanitizeCssValue(value) {
+	const str = String(value);
+	if (CSS_URI_SCHEME_RE.test(str)) return "";
+	if (str.includes("(")) {
+		for (const match of str.matchAll(CSS_FUNCTION_NAME_RE)) if (!CSS_ALLOWED_FUNCTIONS.has(match[1].toLowerCase())) return "";
+	}
+	return str.replace(CSS_UNSAFE_RE, "");
+}
+//#endregion
+//#region src/common/ssr.ts
+/**
+* Common call contracts: SSR types
+*/
+function escapedStyleRawText(value) {
+	return value.replace(/<\//gi, "<\\/");
+}
+function validateDocumentStyleRegistrations(html, styles, apiName, validation) {
+	if (validation === "off" || !styles || styles.length === 0) return;
+	const dropped = styles.filter(({ cssText }) => !html.includes(cssText) && !html.includes(escapedStyleRawText(cssText)));
+	if (dropped.length === 0) return;
+	const registrations = dropped.map(({ id }) => JSON.stringify(id)).join(", ");
+	const message = `${apiName} document() dropped ${dropped.length} registered SSR style${dropped.length === 1 ? "" : "s"}: ${registrations}. Serialize context.styles into the returned document, or set styleRegistrationValidation to "off" when omission is intentional.`;
+	if (validation === "error") throw new Error(message);
+	console.warn(message);
+}
+function renderDocument(document, args, apiName, styleRegistrationValidation = "warn") {
+	const html = document(args);
+	if (typeof html !== "string") {
+		const received = isPromiseLike(html) ? "a Promise-like value" : html === null ? "null" : Array.isArray(html) ? "an array" : typeof html;
+		throw new Error(`${apiName} document() must synchronously return a string; received ${received}.`);
+	}
+	validateDocumentStyleRegistrations(html, args.context.styles, apiName, styleRegistrationValidation);
+	return html;
+}
+const SSR_RENDER_DATA_ATTR = "data-askr-render-data";
+//#endregion
+export { PROPERTY_PROP_PREFIX as a, isKnownBooleanProperty as c, booleanAttributeValue as d, isSkippedProp as f, styleValueText as h, ATTRIBUTE_PROP_PREFIX as i, isPropertyOnlyProp as l, normalizeStylePropertyName as m, renderDocument as n, domPropertyValue as o, keepsFalseValue as p, sanitizeCssValue as r, getDomPropertyName as s, SSR_RENDER_DATA_ATTR as t, propertyReflectsAttribute as u };

package/dist/state-DWO1KzkX.js

@@ -0,0 +1,232 @@
+import { D as isTracking, E as getTrackingComputation, F as logger, L as isProductionEnvironment, O as notifySource, S as queueTask, T as Signal, a as getCurrentInstance, b as getFlushVersion, h as isRendering, k as trackSource, r as claimHook, s as requireInstance, v as effectScheduler, w as Computation } from "./instance-BAnfmXOR.js";
+import { t as markReadable } from "./readable-DFWOsTac.js";
+import { n as isSnapshotSource } from "./snapshot-Cjx4N988.js";
+//#region src/core/api/state.ts
+/**
+* Public reactive primitives: state(), derive(), selector().
+*/
+/** A derived computation is running: writes would loop. */
+function isDerivedComputationActive() {
+	const running = getTrackingComputation();
+	return running !== null && running._derived === true;
+}
+/** Create a callable state cell backed by `signal`. */
+function createStateCell(signal, trackReads = false) {
+	const read = trackReads ? () => {
+		read._everRead = true;
+		return signal.read();
+	} : () => signal.read();
+	read._signal = signal;
+	const set = (valueOrUpdater) => {
+		if (isRendering() && !isDerivedComputationActive()) throw new Error("[Askr] state.set() cannot be called during component render. A write during render would schedule another render of the same component and could loop forever. Move state updates to event handlers or use conditional rendering instead.");
+		const next = typeof valueOrUpdater === "function" ? valueOrUpdater(signal.peek()) : valueOrUpdater;
+		if (Object.is(signal.peek(), next)) return;
+		if (isDerivedComputationActive()) throw new Error("[Askr] state.set() cannot be called inside a derive() or selector() computation. Derived computations must be pure; a write from one can re-trigger it in an update loop. Move the state update to an event handler.");
+		signal.write(next);
+	};
+	markReadable(read);
+	read.set = set;
+	return makeDestructurable(read);
+}
+/** Let a getter with a `set` method destructure into `[getter, setter]`. */
+function makeDestructurable(read) {
+	read[Symbol.iterator] = function* () {
+		yield read;
+		yield read.set;
+	};
+	return read;
+}
+function state(initialValue) {
+	const instance = requireInstance("state()");
+	const index = claimHook(instance, "state");
+	const existing = instance.hooks[index];
+	if (existing) return existing;
+	const development = !isProductionEnvironment();
+	const cell = createStateCell(new Signal(initialValue), development);
+	instance.hooks[index] = cell;
+	if (development) warnUnusedStateOnUnmount(instance);
+	return cell;
+}
+const unusedStateChecks = /* @__PURE__ */ new WeakSet();
+/**
+* Warn, when a committed component unmounts, about state it never read. A
+* branch that has not rendered is no evidence that its state is unused, so
+* the check waits for the end of the component's lifetime.
+*/
+function warnUnusedStateOnUnmount(instance) {
+	if (unusedStateChecks.has(instance)) return;
+	unusedStateChecks.add(instance);
+	instance.onCleanup(() => {
+		if (!instance.mounted) return;
+		const name = instance.displayName || "<anonymous>";
+		for (let index = 0; index < instance.hookKinds.length; index++) {
+			if (instance.hookKinds[index] !== "state") continue;
+			if (instance.hooks[index]._everRead) continue;
+			logger.warn(`[askr] Unused state variable detected in ${name} at index ${index}. State should be read during render or removed.`);
+		}
+	});
+}
+const MAX_DERIVED_RUNS = 50;
+function mapped(source, map) {
+	return () => {
+		let value;
+		if (typeof source === "function") value = source();
+		else if (isSnapshotSource(source)) {
+			const snapshot = source;
+			if (snapshot.pending) return null;
+			value = snapshot.value;
+		} else value = source;
+		if (value == null) return null;
+		return map(value);
+	};
+}
+function derive(source, map) {
+	const instance = requireInstance("derive()");
+	const index = claimHook(instance, "derive");
+	const compute = map === void 0 ? source : mapped(source, map);
+	let slot = instance.hooks[index];
+	if (!slot) {
+		slot = createDerived(instance, compute, "derive()");
+		instance.hooks[index] = slot;
+	} else slot.setCompute(compute);
+	return slot.read;
+}
+function createDerived(owner, compute, label) {
+	let current = compute;
+	let runs = 0;
+	let runsFlush = -1;
+	const computation = new Computation(owner, () => {
+		const flush = getFlushVersion();
+		if (flush !== runsFlush) {
+			runsFlush = flush;
+			runs = 0;
+		}
+		if (++runs > MAX_DERIVED_RUNS) throw new Error(`[Askr] ${label} exceeded ${MAX_DERIVED_RUNS} runs`);
+		return current();
+	}, null);
+	computation._derived = true;
+	return {
+		computation,
+		read: markReadable((() => {
+			if (computation.disposed) throw new Error(`${label} owner has been disposed`);
+			if (computation._running) throw new Error(`${label} cannot read itself recursively`);
+			return computation.read();
+		})),
+		setCompute(fn) {
+			if (fn === current) return;
+			current = fn;
+			computation.invalidate();
+		}
+	};
+}
+function selector(source, equals = Object.is) {
+	const instance = requireInstance("selector()");
+	const index = claimHook(instance, "selector");
+	let slot = instance.hooks[index];
+	if (!slot) {
+		slot = createSelector(instance, source, equals);
+		instance.hooks[index] = slot;
+	} else slot.setSource(source, equals);
+	return slot.predicate;
+}
+const candidateCounts = /* @__PURE__ */ new WeakMap();
+function createSelector(owner, initialSource, initialEquals) {
+	let source = initialSource;
+	let equals = initialEquals;
+	let value;
+	let hasValue = false;
+	const primitives = /* @__PURE__ */ new Map();
+	const objects = /* @__PURE__ */ new WeakMap();
+	const sweepCandidates = /* @__PURE__ */ new Set();
+	let sweepQueued = false;
+	const sweep = () => {
+		sweepQueued = false;
+		for (const entry of sweepCandidates) {
+			if (entry._observers?.size) continue;
+			const candidate = entry.candidate;
+			if (typeof candidate === "object" && candidate !== null || typeof candidate === "function") {
+				if (objects.get(candidate) === entry) objects.delete(candidate);
+			} else if (primitives.get(candidate) === entry) primitives.delete(candidate);
+		}
+		sweepCandidates.clear();
+	};
+	const queueSweep = (entry) => {
+		sweepCandidates.add(entry);
+		if (sweepQueued) return;
+		sweepQueued = true;
+		queueTask(sweep);
+	};
+	const candidateSource = (candidate, create) => {
+		const isObject = typeof candidate === "object" && candidate !== null || typeof candidate === "function";
+		let entry = isObject ? objects.get(candidate) : primitives.get(candidate);
+		if (!entry && create) {
+			const created = {
+				_observers: null,
+				candidate
+			};
+			created._unobserved = () => queueSweep(created);
+			queueSweep(created);
+			entry = created;
+			if (isObject) objects.set(candidate, entry);
+			else primitives.set(candidate, entry);
+		}
+		return entry;
+	};
+	const notifyChange = (previous, next) => {
+		if (equals !== Object.is) {
+			if (equals(previous, next)) return;
+			for (const entry of primitives.values()) notifySource(entry);
+			notifySource(allObjects);
+			return;
+		}
+		const a = candidateSource(previous, false);
+		if (a) notifySource(a);
+		const b = candidateSource(next, false);
+		if (b) notifySource(b);
+	};
+	const allObjects = { _observers: null };
+	const watcher = new Computation(owner, () => {
+		const next = source();
+		if (hasValue && !Object.is(value, next)) {
+			const previous = value;
+			value = next;
+			notifyChange(previous, next);
+		} else {
+			value = next;
+			hasValue = true;
+		}
+	}, effectScheduler("render", owner.depth), null);
+	watcher._derived = true;
+	watcher.run();
+	const predicate = ((candidate) => {
+		if (watcher.disposed) throw new Error("selector() owner has been disposed");
+		if (watcher._running) throw new Error("selector() cannot read itself recursively");
+		if (watcher.stale) watcher.update();
+		if (isTracking()) {
+			trackSource(candidateSource(candidate, true));
+			trackSource(allObjects);
+		}
+		return equals(value, candidate);
+	});
+	candidateCounts.set(predicate, () => primitives.size);
+	return {
+		predicate,
+		setSource(nextSource, nextEquals) {
+			const comparatorChanged = equals !== nextEquals;
+			equals = nextEquals;
+			if (comparatorChanged) notifySource(allObjects, getTrackingComputation() ?? void 0);
+			if (nextSource !== source) {
+				source = nextSource;
+				watcher.invalidate();
+				watcher.update();
+			}
+		}
+	};
+}
+function getSignal() {
+	const instance = getCurrentInstance();
+	if (!instance) throw new Error("getSignal() can only be called during component render execution.");
+	return instance.signal;
+}
+//#endregion
+export { state as a, selector as i, getSignal as n, makeDestructurable as r, derive as t };

package/dist/structures-D4dDMqHX.js

@@ -0,0 +1,231 @@
+import { n as Fragment, t as ELEMENT_TYPE } from "./jsx-DRS-qjiN.js";
+//#region src/jsx/utils.ts
+/** Check whether `value` is a JSX element vnode. */
+function isElement(value) {
+	return typeof value === "object" && value !== null && value.$$typeof === ELEMENT_TYPE;
+}
+/** Clone a JSX element, shallow-merging `props` over its existing props. */
+function cloneElement(element, props) {
+	return {
+		$$typeof: element.$$typeof,
+		type: element.type,
+		key: element.key,
+		props: {
+			...element.props,
+			...props
+		}
+	};
+}
+//#endregion
+//#region src/foundations/structures/layout.tsx
+/**
+* Wrap a {@link LayoutComponent} so it can be invoked as `(children, props)`,
+* matching route layout conventions.
+*/
+function layout(Layout) {
+	return (children, props) => {
+		return Layout({
+			...props,
+			children
+		});
+	};
+}
+//#endregion
+//#region src/foundations/structures/slot.tsx
+/**
+* Slot
+*
+* Structural primitive for prop forwarding patterns.
+*
+* POLICY DECISIONS (LOCKED):
+*
+* 1. asChild Pattern
+*    When asChild=true, merges props into the single child element.
+*    Child must be a valid JSXElement; non-element children return null.
+*    **Slot props override child props** (injection pattern).
+*
+* 2. Fallback Behavior
+*    When asChild=false, returns a Fragment (structural no-op).
+*    No DOM element is introduced.
+*
+* 3. Type Safety
+*    asChild=true requires exactly one JSXElement child (enforced by type).
+*    Runtime validates with isElement() check.
+*/
+function Slot(props) {
+	if (props.asChild) {
+		const { children, asChild: _asChild, ...rest } = props;
+		if (isElement(children)) return cloneElement(children, rest);
+		return null;
+	}
+	return {
+		$$typeof: ELEMENT_TYPE,
+		type: Fragment,
+		props: { children: props.children },
+		key: null
+	};
+}
+//#endregion
+//#region src/foundations/structures/presence.ts
+/**
+* Presence
+*
+* Structural policy primitive for conditional mount/unmount.
+* - No timers
+* - No animation coupling
+* - No DOM side-effects
+*
+* POLICY DECISIONS (LOCKED):
+*
+* 1. Present as Function
+*    Accepts boolean OR function to support lazy evaluation patterns.
+*    Function is called once per render. Use boolean form for static values.
+*
+* 2. Children Type
+*    Presence forwards normal renderable child content only.
+*    Imperative DOM nodes are not part of the public contract.
+*
+* 3. Immediate Mount/Unmount
+*    No exit animations or transitions. When `present` becomes false,
+*    children are removed immediately. Animation must be layered above
+*    this primitive.
+*/
+function Presence({ present, children }) {
+	if (!(typeof present === "function" ? present() : Boolean(present))) return null;
+	return {
+		$$typeof: ELEMENT_TYPE,
+		type: Fragment,
+		props: { children },
+		key: null
+	};
+}
+//#endregion
+//#region src/foundations/structures/collection.ts
+/** Create an empty, insertion-ordered {@link Collection} registry. */
+function createCollection() {
+	const registry = /* @__PURE__ */ new Map();
+	function register(node, metadata) {
+		const item = {
+			node,
+			metadata
+		};
+		registry.set(node, item);
+		return () => {
+			registry.delete(node);
+		};
+	}
+	function items() {
+		return Array.from(registry.values());
+	}
+	function clear() {
+		registry.clear();
+	}
+	function size() {
+		return registry.size;
+	}
+	return {
+		register,
+		items,
+		clear,
+		size
+	};
+}
+/**
+* USAGE EXAMPLE:
+*
+* // Create a collection for menu items
+* const menuItems = createCollection<HTMLElement, { disabled: boolean }>();
+*
+* // Register items
+* const unregister1 = menuItems.register(element1, { disabled: false });
+* const unregister2 = menuItems.register(element2, { disabled: true });
+*
+* // Query items
+* const allItems = menuItems.items();
+* const enabledItems = allItems.filter(item => !item.metadata.disabled);
+*
+* // Cleanup
+* unregister1();
+* unregister2();
+*/
+//#endregion
+//#region src/foundations/structures/layer.ts
+/** Create a new, empty {@link LayerManager} for coordinating overlay stacking. */
+function createLayer() {
+	const stack = [];
+	let nextId = 1;
+	function register(options) {
+		const id = nextId++;
+		const entry = {
+			id,
+			options
+		};
+		stack.push(entry);
+		function isTop() {
+			return stack[stack.length - 1]?.id === id;
+		}
+		function unregister() {
+			const index = stack.findIndex((e) => e.id === id);
+			if (index !== -1) stack.splice(index, 1);
+		}
+		return {
+			id,
+			isTop,
+			unregister
+		};
+	}
+	function layers() {
+		return stack.map((entry) => ({
+			id: entry.id,
+			isTop: () => stack[stack.length - 1]?.id === entry.id,
+			unregister: () => {
+				const index = stack.findIndex((e) => e.id === entry.id);
+				if (index !== -1) stack.splice(index, 1);
+			}
+		}));
+	}
+	function handleEscape() {
+		const top = stack[stack.length - 1];
+		if (top) top.options.onEscape?.();
+	}
+	function handleOutsidePointer(e) {
+		const top = stack[stack.length - 1];
+		if (!top) return;
+		const node = top.options.node;
+		if (node && e.target instanceof Node) {
+			if (!node.contains(e.target)) top.options.onOutsidePointer?.(e);
+		} else top.options.onOutsidePointer?.(e);
+	}
+	return {
+		register,
+		layers,
+		handleEscape,
+		handleOutsidePointer
+	};
+}
+/**
+* USAGE EXAMPLE:
+*
+* const layerManager = createLayer();
+*
+* function Modal({ onClose }) {
+*   const modalRef = ref<HTMLDivElement>();
+*
+*   const layer = layerManager.register({
+*     node: modalRef.current,
+*     onEscape: onClose,
+*     onOutsidePointer: onClose,
+*   });
+*
+*   onUnmount(() => layer.unregister());
+*
+*   return (
+*     <div ref={modalRef}>
+*       <h1>Modal</h1>
+*       {layer.isTop() && <p>I am on top!</p>}
+*     </div>
+*   );
+* }
+*/
+//#endregion
+export { layout as a, Slot as i, createCollection as n, cloneElement as o, Presence as r, isElement as s, createLayer as t };