coldwired 0.18.0

package/dist/react.mjs

@@ -0,0 +1,635 @@
+import { _ as isElement, z as parseHTMLFragment } from "./utils-C2S0wWJJ.mjs";
+import { createRequire } from "node:module";
+import { createPortal } from "react-dom";
+import { createRoot as createRoot$1 } from "react-dom/client";
+import { Fragment, StrictMode, createElement, useEffect, useSyncExternalStore } from "react";
+import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
+import { decode } from "html-entities";
+//#region \0rolldown/runtime.js
+var __commonJSMin = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
+var __require = /* @__PURE__ */ createRequire(import.meta.url);
+//#endregion
+//#region src/react/plugin.ts
+function createReactPlugin(root) {
+	const pending = /* @__PURE__ */ new Set();
+	return {
+		init(element) {
+			let onReady;
+			const ready = new Promise((resolve) => {
+				onReady = resolve;
+			});
+			pending.add(ready);
+			const mountAndRender = async () => {
+				const batch = root.render(element);
+				if (batch.count != 0) await batch.done;
+			};
+			mountAndRender().then(() => {
+				pending.delete(ready);
+				onReady();
+			});
+		},
+		async ready() {
+			await Promise.all(pending);
+		},
+		validate(element) {
+			if (root.contains("body" in element ? element.body : element)) throw new Error("Cannot apply actions inside fragment");
+		},
+		onCreateElement(element) {
+			const batch = root.render(element);
+			if (batch.count == 0) return false;
+			pending.add(batch.done);
+			batch.done.then(() => pending.delete(batch.done));
+			return true;
+		},
+		onBeforeUpdateElement(element, toElement) {
+			const batch = root.render(element, toElement);
+			if (batch.count == 0) return false;
+			pending.add(batch.done);
+			batch.done.then(() => pending.delete(batch.done));
+			return true;
+		},
+		onBeforeDestroyElement(element) {
+			return root.remove(element);
+		}
+	};
+}
+//#endregion
+//#region src/react/preload.ts
+const defaultSchema$1 = {
+	componentTagName: "react-component",
+	slotTagName: "react-slot",
+	nameAttribute: "name",
+	propsAttribute: "props"
+};
+function preload(documentOrFragment, loader, schema) {
+	const { componentTagName, nameAttribute } = Object.assign({}, defaultSchema$1, schema);
+	const components = documentOrFragment.querySelectorAll(componentTagName);
+	return loader([...new Set(Array.from(components).map((component) => {
+		const name = component.getAttribute(nameAttribute);
+		if (!name) throw new Error(`Missing "${nameAttribute}" attribute on <${componentTagName}>`);
+		return name;
+	}))]);
+}
+//#endregion
+//#region src/react/tree-builder.react.ts
+var import_react_error_boundary = (/* @__PURE__ */ __commonJSMin(((exports) => {
+	Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+	const s = __require("react"), c = s.createContext(null), u = {
+		didCatch: !1,
+		error: null
+	};
+	var y = class extends s.Component {
+		constructor(e) {
+			super(e), this.resetErrorBoundary = this.resetErrorBoundary.bind(this), this.state = u;
+		}
+		static getDerivedStateFromError(e) {
+			return {
+				didCatch: !0,
+				error: e
+			};
+		}
+		resetErrorBoundary(...e) {
+			const { error: t } = this.state;
+			t !== null && (this.props.onReset?.({
+				args: e,
+				reason: "imperative-api"
+			}), this.setState(u));
+		}
+		componentDidCatch(e, t) {
+			this.props.onError?.(e, t);
+		}
+		componentDidUpdate(e, t) {
+			const { didCatch: o } = this.state, { resetKeys: n } = this.props;
+			o && t.error !== null && h(e.resetKeys, n) && (this.props.onReset?.({
+				next: n,
+				prev: e.resetKeys,
+				reason: "keys"
+			}), this.setState(u));
+		}
+		render() {
+			const { children: e, fallbackRender: t, FallbackComponent: o, fallback: n } = this.props, { didCatch: a, error: i } = this.state;
+			let d = e;
+			if (a) {
+				const l = {
+					error: i,
+					resetErrorBoundary: this.resetErrorBoundary
+				};
+				if (typeof t == "function") d = t(l);
+				else if (o) d = s.createElement(o, l);
+				else if (n !== void 0) d = n;
+				else throw i;
+			}
+			return s.createElement(c.Provider, { value: {
+				didCatch: a,
+				error: i,
+				resetErrorBoundary: this.resetErrorBoundary
+			} }, d);
+		}
+	};
+	function h(r = [], e = []) {
+		return r.length !== e.length || r.some((t, o) => !Object.is(t, e[o]));
+	}
+	function E(r) {
+		return r !== null && typeof r == "object" && "didCatch" in r && typeof r.didCatch == "boolean" && "error" in r && "resetErrorBoundary" in r && typeof r.resetErrorBoundary == "function";
+	}
+	function f(r) {
+		if (!E(r)) throw new Error("ErrorBoundaryContext not found");
+	}
+	function p() {
+		const r = s.useContext(c);
+		f(r);
+		const { error: e, resetErrorBoundary: t } = r, [o, n] = s.useState({
+			error: null,
+			hasError: !1
+		}), a = s.useMemo(() => ({
+			error: e,
+			resetBoundary: () => {
+				t(), n({
+					error: null,
+					hasError: !1
+				});
+			},
+			showBoundary: (i) => n({
+				error: i,
+				hasError: !0
+			})
+		}), [e, t]);
+		if (o.hasError) throw o.error;
+		return a;
+	}
+	function B(r) {
+		switch (typeof r) {
+			case "object":
+				if (r !== null && "message" in r && typeof r.message == "string") return r.message;
+				break;
+			case "string": return r;
+		}
+	}
+	function m(r, e) {
+		const t = s.forwardRef((n, a) => s.createElement(y, e, s.createElement(r, {
+			...n,
+			ref: a
+		})));
+		return t.displayName = `withErrorBoundary(${r.displayName || r.name || "Unknown"})`, t;
+	}
+	exports.ErrorBoundary = y;
+	exports.ErrorBoundaryContext = c;
+	exports.getErrorMessage = B;
+	exports.useErrorBoundary = p;
+	exports.withErrorBoundary = m;
+})))();
+function isReactElement(node) {
+	return !!(node && typeof node == "object" && "tagName" in node && "attributes" in node);
+}
+function isReactComponent(node) {
+	return !!(node && typeof node == "object" && "name" in node && "props" in node);
+}
+function hydrate(documentOrFragment, manifest, schema) {
+	const { children: tree } = hydrateChildNodes(getChildNodes(documentOrFragment), Object.assign({}, defaultSchema$1, schema));
+	return createReactTree(tree, manifest);
+}
+function createReactTree(tree, manifest) {
+	if (Array.isArray(tree)) return createElement(Fragment, null, ...tree.map((child) => createChild(child, manifest)));
+	else if (typeof tree == "string") return createElement(Fragment, null, tree);
+	return createElementOrComponent(tree, manifest);
+}
+function getChildNodes(documentOrFragment) {
+	return "body" in documentOrFragment ? documentOrFragment.body.childNodes : documentOrFragment.childNodes;
+}
+function hydrateChildNodes(childNodes, schema) {
+	const result = {
+		children: [],
+		props: {}
+	};
+	childNodes.forEach((childNode) => {
+		if (isTextNode(childNode)) {
+			const text = childNode.textContent;
+			if (text?.trim()) result.children.push(text);
+		} else if (isElementNode(childNode)) {
+			const tagName = childNode.tagName.toLowerCase();
+			const { children, props } = hydrateChildNodes(childNode.childNodes, schema);
+			if (tagName == schema.componentTagName) {
+				const name = childNode.getAttribute(schema.nameAttribute);
+				if (!name) throw new Error(`Missing "${schema.nameAttribute}" attribute on <${schema.componentTagName}>`);
+				const hydratedProps = hydrateProps(childNode, schema.propsAttribute);
+				result.children.push({
+					name,
+					props: {
+						...hydratedProps,
+						...props
+					},
+					children
+				});
+			} else {
+				if (Object.keys(props).length > 0) throw new Error(`<${schema.slotTagName}> only allowed as direct child of <${schema.componentTagName}>`);
+				if (tagName == schema.slotTagName) {
+					const name = childNode.getAttribute(schema.nameAttribute);
+					if (!name) throw new Error(`Missing "${schema.nameAttribute}" attribute on <${schema.slotTagName}>`);
+					if (children.length == 1) {
+						const child = children[0];
+						if (typeof child == "string") result.props[name] = {
+							name: "Fragment",
+							props: {},
+							children: [child]
+						};
+						else result.props[name] = child;
+					} else result.props[name] = {
+						name: "Fragment",
+						props: {},
+						children
+					};
+				} else result.children.push({
+					tagName,
+					attributes: Array.from(childNode.attributes).reduce((attrs, attr) => ({
+						...attrs,
+						[attr.name]: attr.value
+					}), {}),
+					children
+				});
+			}
+		}
+	});
+	return result;
+}
+function decodeProps(props) {
+	return JSON.parse(decode(props));
+}
+function hydrateProps(childNode, propsAttribute) {
+	const serializedProps = childNode.getAttribute(propsAttribute);
+	return serializedProps ? decodeProps(serializedProps) : {};
+}
+function createElementOrComponent(child, manifest) {
+	if ("tagName" in child) {
+		const attributes = Object.fromEntries(Object.entries(child.attributes).map(([key, value]) => {
+			const attrName = transformAttributeName(key);
+			const attrValue = transformAttributeValue(key, value);
+			if (attrName.match(/^on[A-Z]/) && typeof attrValue != "function") throw new Error(`Event handler must be a function: ${key}`);
+			return [attrName, attrValue];
+		}));
+		const children = child.children?.map((child) => createChild(child, manifest)) || [];
+		return createElement(child.tagName, attributes, ...children);
+	}
+	const ComponentImpl = child.name == "Fragment" ? Fragment : manifest[child.name];
+	if (!ComponentImpl) throw new Error(`Unknown component: ${child.name}`);
+	return createElement(ComponentImpl, Object.fromEntries(Object.entries(child.props).map(([key, value]) => {
+		const propName = transformPropName(key);
+		if (isReactElement(value) || isReactComponent(value)) return [propName, createElementOrComponent(value, manifest)];
+		const propValue = transformPropValue(value);
+		if (propName.match(/^on[A-Z]/) && typeof propValue != "function") throw new Error(`Event handler must be a function: ${key}`);
+		return [propName, propValue];
+	})), ...child.children?.map((child) => createChild(child, manifest)) || []);
+}
+function createChild(child, manifest) {
+	if (typeof child == "string") return child;
+	return createElementOrComponent(child, manifest);
+}
+function transformAttributeName(name) {
+	const attributeName = cebabCase(name);
+	if (attributeMap[attributeName]) return attributeMap[attributeName];
+	else if (attributeName.startsWith("aria-")) return attributeName;
+	return camelcase(attributeName);
+}
+function transformAttributeValue(name, value) {
+	if (name == "style") return parseStyleAttribute(value);
+	if (booleanAttribute.includes(name)) return value != "false" && value != "off" && value != "0";
+	return transformStringValue(value);
+}
+function transformPropName(name) {
+	if (defaultAttributeMap[name]) return name;
+	return transformAttributeName(name);
+}
+function transformPropValue(value) {
+	if (isPlainObject(value)) return Object.fromEntries(Object.entries(value).map(([key, value]) => [key, transformPropValue(value)]));
+	if (Array.isArray(value)) return value.map((value) => transformPropValue(value));
+	if (typeof value == "string") return transformStringValue(value);
+	return value;
+}
+function transformStringValue(value) {
+	if (value[0] == "$") switch (value[1]) {
+		case "$": return value.slice(1);
+		case "D": return new Date(Date.parse(value.slice(2)));
+		case "n": return BigInt(value.slice(2));
+	}
+	return value;
+}
+const reactAttributeMap = {
+	"accept-charset": "acceptCharset",
+	accesskey: "accessKey",
+	allowfullscreen: "allowFullScreen",
+	allowtransparency: "allowTransparency",
+	autocomplete: "autoComplete",
+	autofocus: "autoFocus",
+	autoplay: "autoPlay",
+	cellpadding: "cellPadding",
+	cellspacing: "cellSpacing",
+	charset: "charSet",
+	class: "className",
+	colspan: "colSpan",
+	contenteditable: "contentEditable",
+	contextmenu: "contextMenu",
+	crossorigin: "crossOrigin",
+	datetime: "dateTime",
+	enctype: "encType",
+	formaction: "formAction",
+	formenctype: "formEncType",
+	formmethod: "formMethod",
+	formnovalidate: "formNoValidate",
+	formtarget: "formTarget",
+	frameborder: "frameBorder",
+	hreflang: "hrefLang",
+	for: "htmlFor",
+	inputmode: "inputMode",
+	tabindex: "tabIndex",
+	usemap: "useMap",
+	maxlength: "maxLength",
+	minlength: "minLength",
+	readonly: "readOnly",
+	srcdoc: "srcDoc",
+	srclang: "srcLang",
+	srcset: "srcSet",
+	spellcheck: "spellCheck"
+};
+const defaultAttributeMap = {
+	value: "defaultValue",
+	checked: "defaultChecked",
+	selected: "defaultSelected"
+};
+const attributeMap = {
+	...reactAttributeMap,
+	...defaultAttributeMap
+};
+const booleanAttribute = [
+	"allowfullscreen",
+	"autofocus",
+	"checked",
+	"disabled",
+	"formnovalidate",
+	"hidden",
+	"multiple",
+	"novalidate",
+	"readonly",
+	"required",
+	"selected"
+];
+const isElementNode = (node) => node.nodeType == Node.ELEMENT_NODE;
+const isTextNode = (node) => node.nodeType == Node.TEXT_NODE;
+function parseStyleAttribute(styleString) {
+	return Object.fromEntries(styleString.split(";").filter((pair) => !!pair.trim()).map((pair) => {
+		const [key, value] = pair.split(":");
+		if (key && value) return [camelcase(key).trim(), value.trim()];
+		throw new Error(`Invalid style attribute: ${styleString}`);
+	}));
+}
+function camelcase(str) {
+	return str.replace(/-([a-z])/g, ([, a]) => a.toUpperCase());
+}
+function cebabCase(str) {
+	return str.replace(/_/g, "-");
+}
+function isPlainObject(value) {
+	return typeof value == "object" && value != null && value.constructor == Object;
+}
+//#endregion
+//#region src/react/root.react.tsx
+function createAndRenderReactRoot({ container, subscribe, getSnapshot, onMounted, LayoutComponent, ErrorBoundaryFallbackComponent }) {
+	const props = {
+		subscribe,
+		getSnapshot,
+		onMounted,
+		ErrorBoundaryFallback: ErrorBoundaryFallbackComponent || DefaultErrorBoundaryFallbackComponent
+	};
+	const Layout = LayoutComponent || DefaultLayoutComponent;
+	const root = createRoot$1(container);
+	root.render(/* @__PURE__ */ jsx(Layout, { children: /* @__PURE__ */ jsx(RootProvider, { ...props }) }));
+	return () => root.unmount();
+}
+const DefaultLayoutComponent = StrictMode;
+const DefaultErrorBoundaryFallbackComponent = ({ error, element }) => {
+	return /* @__PURE__ */ jsx("div", {
+		role: "alert",
+		children: /* @__PURE__ */ jsx("pre", {
+			style: { color: "red" },
+			children: element.getAttribute("fallback-message") ?? error.message
+		})
+	});
+};
+function RootProvider({ subscribe, getSnapshot, onMounted, ErrorBoundaryFallback }) {
+	useEffect(onMounted, []);
+	const cache = useSyncExternalStore(subscribe, getSnapshot);
+	return /* @__PURE__ */ jsx(Fragment$1, { children: [...Array.from(cache).map(([element, content]) => createPortal(/* @__PURE__ */ jsx(import_react_error_boundary.ErrorBoundary, {
+		fallbackRender: (props) => /* @__PURE__ */ jsx(ErrorBoundaryFallback, {
+			element,
+			...props
+		}),
+		children: content
+	}), element, getKeyForElement(element)))] });
+}
+const keys = /* @__PURE__ */ new WeakMap();
+function getKeyForElement(element) {
+	let key = keys.get(element);
+	if (!key) {
+		key = Math.random().toString(36).slice(2);
+		keys.set(element, key);
+	}
+	return key;
+}
+//#endregion
+//#region src/react/root.ts
+const defaultSchema = {
+	...defaultSchema$1,
+	fragmentTagName: "react-fragment",
+	loadingClassName: "loading"
+};
+const containerElementMap = /* @__PURE__ */ new Map();
+function findOrCreateContainerElement(id) {
+	let container = containerElementMap.get(id) ?? null;
+	if (container?.isConnected) return container;
+	container = document.querySelector(`body > #${id}`);
+	if (container?.isConnected) {
+		containerElementMap.set(id, container);
+		return container;
+	}
+	container = document.createElement("div");
+	container.id = id;
+	document.body.appendChild(container);
+	containerElementMap.set(id, container);
+	return container;
+}
+function createRoot(containerOrOptions, maybeOptions) {
+	const container = containerOrOptions instanceof Element ? containerOrOptions : findOrCreateContainerElement("react-root");
+	const options = containerOrOptions instanceof Element ? maybeOptions : containerOrOptions;
+	const { loader, manifest: preloadedManifest } = options;
+	let isDestroyed = false;
+	let cache = /* @__PURE__ */ new Map();
+	const mounted = /* @__PURE__ */ new Map();
+	const subscriptions = /* @__PURE__ */ new Set();
+	const manifest = Object.assign({}, preloadedManifest);
+	const schema = Object.assign({}, defaultSchema, options.schema);
+	const notify = () => {
+		if (!isDestroyed) {
+			cache.forEach((_, element) => {
+				if (!element.isConnected) {
+					cache.delete(element);
+					mounted.delete(element);
+				}
+			});
+			cache = new Map(cache);
+			subscriptions.forEach((callback) => callback());
+		}
+	};
+	const render = async (element, fragmentOrHTML, reset) => {
+		const fragment = typeof fragmentOrHTML == "string" ? parseHTMLFragment(fragmentOrHTML, element.ownerDocument) : fragmentOrHTML;
+		if (isElement(fragment) && fragment.tagName.toLowerCase() != schema.fragmentTagName) throw new Error("Cannot rerender with a non-fragment element");
+		await preload(fragment, (names) => manifestLoader(names, loader, manifest), schema);
+		const tree = hydrate(fragment, manifest, schema);
+		if (options.cache) saveFragmentCache(element, fragmentOrHTML);
+		if (reset) element.innerHTML = "";
+		cache.set(element, tree);
+		notify();
+		element.classList.remove(schema.loadingClassName);
+		if (element.classList.length == 0) element.removeAttribute("class");
+	};
+	const registerDestroyer = (element) => {
+		const observer = new MutationObserver((mutations) => {
+			const node = mutations.flatMap((mutation) => Array.from(mutation.removedNodes)).find((node) => node == element);
+			if (node && !node.isConnected) {
+				mounted.delete(element);
+				cache.delete(element);
+				observer.disconnect();
+				notify();
+			}
+		});
+		observer.observe(element.parentNode, { childList: true });
+	};
+	const create = async (element) => {
+		if (!isDestroyed && !mounted.has(element)) {
+			await mounting;
+			mounted.set(element, (fragmentOrHTML) => render(element, fragmentOrHTML, false));
+			registerDestroyer(element);
+			if (options.cache) restoreFragmentCache(element);
+			await render(element, element, true);
+		}
+	};
+	const getSnapshot = () => cache;
+	const subscribe = (callback) => {
+		if (!isDestroyed) subscriptions.add(callback);
+		return () => {
+			subscriptions.delete(callback);
+		};
+	};
+	let mounting;
+	let unmount;
+	const mount = async () => {
+		if (isDestroyed) throw new Error("Root is destroyed");
+		let onMounted = () => {};
+		const mounting = new Promise((resolve) => {
+			onMounted = resolve;
+		});
+		const [LayoutComponent, ErrorBoundaryFallbackComponent] = await Promise.all([getLayoutComponent(loader, options.layoutComponentName), getErrorBoundaryFallbackComponent(loader, options.errorBoundaryFallbackComponentName)]);
+		unmount = createAndRenderReactRoot({
+			container,
+			subscribe,
+			getSnapshot,
+			onMounted,
+			LayoutComponent,
+			ErrorBoundaryFallbackComponent
+		});
+		await mounting;
+	};
+	return {
+		render(element, fragmentOrHTML) {
+			if (fragmentOrHTML) {
+				const update = mounted.get(element);
+				if (update) return {
+					count: 1,
+					done: update(fragmentOrHTML)
+				};
+			} else {
+				if (!mounting) mounting = mount();
+				if (element.tagName.toLowerCase() == schema.fragmentTagName) return {
+					count: 1,
+					done: create(element)
+				};
+				else {
+					const elements = Array.from(element.querySelectorAll(schema.fragmentTagName));
+					if (elements.length) return {
+						count: elements.length,
+						done: Promise.all(elements.map(create)).then(() => void 0)
+					};
+				}
+			}
+			return {
+				count: 0,
+				done: Promise.resolve()
+			};
+		},
+		remove(element) {
+			if (mounted.has(element)) {
+				mounted.delete(element);
+				cache.delete(element);
+				notify();
+				return true;
+			}
+			return false;
+		},
+		contains(element) {
+			return element.tagName.toLowerCase() != schema.fragmentTagName && !!element.closest(schema.fragmentTagName);
+		},
+		destroy() {
+			isDestroyed = true;
+			cache.clear();
+			notify();
+			subscriptions.clear();
+			unmount?.();
+			mounted.clear();
+			container.remove();
+			containerElementMap.clear();
+		},
+		getCache() {
+			return cache;
+		}
+	};
+}
+async function manifestLoader(names, loader, manifest) {
+	await Promise.all(names.filter((name) => !manifest[name]).map((name) => loader(name).then((component) => {
+		manifest[name] = component;
+	})));
+	return manifest;
+}
+async function getLayoutComponent(loader, name) {
+	if (name) return await loader(name);
+}
+async function getErrorBoundaryFallbackComponent(loader, name) {
+	if (name) return await loader(name);
+}
+let fragmentCacheIdSequence = 0;
+const fragmentCacheIdAttributeName = "data-fragment-id";
+const fragmentCache = /* @__PURE__ */ new Map();
+function resetFragmentCache() {
+	fragmentCache.clear();
+}
+function saveFragmentCache(element, fragment) {
+	let fragmentCacheId = element.getAttribute(fragmentCacheIdAttributeName);
+	if (!fragmentCacheId) {
+		fragmentCacheId = `fragment-${fragmentCacheIdSequence++}`;
+		element.setAttribute(fragmentCacheIdAttributeName, fragmentCacheId);
+	}
+	fragmentCache.set(fragmentCacheId, stringifyFragment(fragment));
+}
+function restoreFragmentCache(element) {
+	const fragmentCacheId = element.getAttribute(fragmentCacheIdAttributeName);
+	if (fragmentCacheId) {
+		const html = fragmentCache.get(fragmentCacheId);
+		if (html) element.innerHTML = html;
+	}
+}
+function stringifyFragment(fragmentOrHTML) {
+	if (typeof fragmentOrHTML == "string") return fragmentOrHTML;
+	if (isElement(fragmentOrHTML)) return fragmentOrHTML.innerHTML;
+	const html = [];
+	for (const node of fragmentOrHTML.childNodes) if (isElement(node)) html.push(node.outerHTML);
+	else if (node.nodeType == Node.TEXT_NODE && node.textContent) html.push(node.textContent);
+	return html.join(" ");
+}
+//#endregion
+export { createReactPlugin, createRoot, defaultSchema, findOrCreateContainerElement, preload, resetFragmentCache };

package/dist/turbo-stream.d.mts

@@ -0,0 +1,7 @@
+import { f as Action, m as Actions } from "./actions-CQVSvZlC.mjs";
+
+//#region src/turbo-stream.d.ts
+declare function renderTurboStream(actions: Actions, stream: string): Promise<void>;
+declare function parseTurboStream(stream: Element): Action;
+//#endregion
+export { parseTurboStream, renderTurboStream };