@unifast/react 0.0.4

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 kenzwada
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.cjs

@@ -0,0 +1,156 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+//#region \0rolldown/runtime.js
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, key),
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+//#endregion
+let style_to_object = require("style-to-object");
+style_to_object = __toESM(style_to_object);
+let _unifast_node = require("@unifast/node");
+//#region src/hast-to-react.ts
+const PROP_RENAMES = {
+	class: "className",
+	for: "htmlFor",
+	accesskey: "accessKey",
+	autocapitalize: "autoCapitalize",
+	autocomplete: "autoComplete",
+	autofocus: "autoFocus",
+	autoplay: "autoPlay",
+	charset: "charSet",
+	colspan: "colSpan",
+	contenteditable: "contentEditable",
+	crossorigin: "crossOrigin",
+	datetime: "dateTime",
+	enctype: "encType",
+	formaction: "formAction",
+	formenctype: "formEncType",
+	formmethod: "formMethod",
+	formnovalidate: "formNoValidate",
+	formtarget: "formTarget",
+	hreflang: "hrefLang",
+	htmlfor: "htmlFor",
+	httpequiv: "httpEquiv",
+	inputmode: "inputMode",
+	maxlength: "maxLength",
+	mediagroup: "mediaGroup",
+	minlength: "minLength",
+	nomodule: "noModule",
+	novalidate: "noValidate",
+	readonly: "readOnly",
+	referrerpolicy: "referrerPolicy",
+	rowspan: "rowSpan",
+	spellcheck: "spellCheck",
+	srcdoc: "srcDoc",
+	srclang: "srcLang",
+	srcset: "srcSet",
+	tabindex: "tabIndex",
+	usemap: "useMap"
+};
+function parseStyleString(style) {
+	const result = {};
+	(0, style_to_object.default)(style, (name, value) => {
+		if (name && value) {
+			const camelName = name.startsWith("--") ? name : name.replaceAll(/-([a-z])/g, (_, c) => String(c).toUpperCase());
+			result[camelName] = value;
+		}
+	});
+	return result;
+}
+function convertProperties(properties) {
+	const props = {};
+	for (const [key, value] of Object.entries(properties)) {
+		if (value === false || value == null) continue;
+		if (key === "style" && typeof value === "string") {
+			props.style = parseStyleString(value);
+			continue;
+		}
+		if (key === "className" && Array.isArray(value)) {
+			props.className = value.join(" ");
+			continue;
+		}
+		const renamed = PROP_RENAMES[key];
+		if (renamed) props[renamed] = value;
+		else props[key] = value;
+	}
+	return props;
+}
+function convertNode(node, options, key) {
+	const { createElement, Fragment, components } = options;
+	switch (node.type) {
+		case "root": return createElement(Fragment, null, ...convertChildren(node.children, options));
+		case "element": {
+			const component = components?.[node.tagName] ?? node.tagName;
+			const props = convertProperties(node.properties);
+			props.key = key;
+			const children = convertChildren(node.children, options);
+			if (children.length > 0) return createElement(component, props, ...children);
+			return createElement(component, props);
+		}
+		case "text": return node.value;
+		case "raw": return createElement("div", {
+			key,
+			dangerouslySetInnerHTML: { __html: node.value }
+		});
+		case "comment":
+		case "doctype": return null;
+		default: return null;
+	}
+}
+function convertChildren(children, options) {
+	const result = [];
+	for (let i = 0; i < children.length; i++) {
+		const converted = convertNode(children[i], options, i);
+		if (converted != null) result.push(converted);
+	}
+	return result;
+}
+function hastToReact(hast, options) {
+	return convertNode(hast, options, 0);
+}
+//#endregion
+//#region src/compile.ts
+function compileToReact(input, options) {
+	const { components, createElement, Fragment, ...compileOpts } = options;
+	const result = (0, _unifast_node.compile)(input, {
+		...compileOpts,
+		outputKind: "hast"
+	});
+	let hast;
+	if (typeof result.output === "string") try {
+		hast = JSON.parse(result.output);
+	} catch {
+		throw new Error("Failed to parse HAST output from compiler");
+	}
+	else hast = result.output;
+	return {
+		element: hastToReact(hast, {
+			createElement,
+			Fragment,
+			components
+		}),
+		frontmatter: result.frontmatter,
+		diagnostics: result.diagnostics,
+		stats: result.stats,
+		toc: result.toc
+	};
+}
+//#endregion
+exports.compileToReact = compileToReact;
+exports.hastToReact = hastToReact;

package/dist/index.d.cts

@@ -0,0 +1,28 @@
+import { CompileOptions, CompileResult, HastRoot, TocEntry } from "@unifast/core";
+
+//#region src/hast-to-react.d.ts
+type CreateElement = (type: any, props: any, ...children: any[]) => any;
+type ComponentMap = Record<string, unknown>;
+type HastToReactOptions = {
+  createElement: CreateElement;
+  Fragment: unknown;
+  components?: ComponentMap;
+};
+declare function hastToReact(hast: HastRoot, options: HastToReactOptions): unknown;
+//#endregion
+//#region src/compile.d.ts
+type CompileToReactOptions = CompileOptions & {
+  components?: ComponentMap;
+  createElement: CreateElement;
+  Fragment: unknown;
+};
+type CompileToReactResult = {
+  element: unknown;
+  frontmatter: Record<string, unknown>;
+  diagnostics: CompileResult["diagnostics"];
+  stats: CompileResult["stats"];
+  toc: TocEntry[];
+};
+declare function compileToReact(input: string, options: CompileToReactOptions): CompileToReactResult;
+//#endregion
+export { type CompileToReactOptions, type CompileToReactResult, type ComponentMap, type CreateElement, type HastToReactOptions, compileToReact, hastToReact };

package/dist/index.d.mts

@@ -0,0 +1,28 @@
+import { CompileOptions, CompileResult, HastRoot, TocEntry } from "@unifast/core";
+
+//#region src/hast-to-react.d.ts
+type CreateElement = (type: any, props: any, ...children: any[]) => any;
+type ComponentMap = Record<string, unknown>;
+type HastToReactOptions = {
+  createElement: CreateElement;
+  Fragment: unknown;
+  components?: ComponentMap;
+};
+declare function hastToReact(hast: HastRoot, options: HastToReactOptions): unknown;
+//#endregion
+//#region src/compile.d.ts
+type CompileToReactOptions = CompileOptions & {
+  components?: ComponentMap;
+  createElement: CreateElement;
+  Fragment: unknown;
+};
+type CompileToReactResult = {
+  element: unknown;
+  frontmatter: Record<string, unknown>;
+  diagnostics: CompileResult["diagnostics"];
+  stats: CompileResult["stats"];
+  toc: TocEntry[];
+};
+declare function compileToReact(input: string, options: CompileToReactOptions): CompileToReactResult;
+//#endregion
+export { type CompileToReactOptions, type CompileToReactResult, type ComponentMap, type CreateElement, type HastToReactOptions, compileToReact, hastToReact };

package/dist/index.mjs

@@ -0,0 +1,131 @@
+import StyleToObject from "style-to-object";
+import { compile } from "@unifast/node";
+//#region src/hast-to-react.ts
+const PROP_RENAMES = {
+	class: "className",
+	for: "htmlFor",
+	accesskey: "accessKey",
+	autocapitalize: "autoCapitalize",
+	autocomplete: "autoComplete",
+	autofocus: "autoFocus",
+	autoplay: "autoPlay",
+	charset: "charSet",
+	colspan: "colSpan",
+	contenteditable: "contentEditable",
+	crossorigin: "crossOrigin",
+	datetime: "dateTime",
+	enctype: "encType",
+	formaction: "formAction",
+	formenctype: "formEncType",
+	formmethod: "formMethod",
+	formnovalidate: "formNoValidate",
+	formtarget: "formTarget",
+	hreflang: "hrefLang",
+	htmlfor: "htmlFor",
+	httpequiv: "httpEquiv",
+	inputmode: "inputMode",
+	maxlength: "maxLength",
+	mediagroup: "mediaGroup",
+	minlength: "minLength",
+	nomodule: "noModule",
+	novalidate: "noValidate",
+	readonly: "readOnly",
+	referrerpolicy: "referrerPolicy",
+	rowspan: "rowSpan",
+	spellcheck: "spellCheck",
+	srcdoc: "srcDoc",
+	srclang: "srcLang",
+	srcset: "srcSet",
+	tabindex: "tabIndex",
+	usemap: "useMap"
+};
+function parseStyleString(style) {
+	const result = {};
+	StyleToObject(style, (name, value) => {
+		if (name && value) {
+			const camelName = name.startsWith("--") ? name : name.replaceAll(/-([a-z])/g, (_, c) => String(c).toUpperCase());
+			result[camelName] = value;
+		}
+	});
+	return result;
+}
+function convertProperties(properties) {
+	const props = {};
+	for (const [key, value] of Object.entries(properties)) {
+		if (value === false || value == null) continue;
+		if (key === "style" && typeof value === "string") {
+			props.style = parseStyleString(value);
+			continue;
+		}
+		if (key === "className" && Array.isArray(value)) {
+			props.className = value.join(" ");
+			continue;
+		}
+		const renamed = PROP_RENAMES[key];
+		if (renamed) props[renamed] = value;
+		else props[key] = value;
+	}
+	return props;
+}
+function convertNode(node, options, key) {
+	const { createElement, Fragment, components } = options;
+	switch (node.type) {
+		case "root": return createElement(Fragment, null, ...convertChildren(node.children, options));
+		case "element": {
+			const component = components?.[node.tagName] ?? node.tagName;
+			const props = convertProperties(node.properties);
+			props.key = key;
+			const children = convertChildren(node.children, options);
+			if (children.length > 0) return createElement(component, props, ...children);
+			return createElement(component, props);
+		}
+		case "text": return node.value;
+		case "raw": return createElement("div", {
+			key,
+			dangerouslySetInnerHTML: { __html: node.value }
+		});
+		case "comment":
+		case "doctype": return null;
+		default: return null;
+	}
+}
+function convertChildren(children, options) {
+	const result = [];
+	for (let i = 0; i < children.length; i++) {
+		const converted = convertNode(children[i], options, i);
+		if (converted != null) result.push(converted);
+	}
+	return result;
+}
+function hastToReact(hast, options) {
+	return convertNode(hast, options, 0);
+}
+//#endregion
+//#region src/compile.ts
+function compileToReact(input, options) {
+	const { components, createElement, Fragment, ...compileOpts } = options;
+	const result = compile(input, {
+		...compileOpts,
+		outputKind: "hast"
+	});
+	let hast;
+	if (typeof result.output === "string") try {
+		hast = JSON.parse(result.output);
+	} catch {
+		throw new Error("Failed to parse HAST output from compiler");
+	}
+	else hast = result.output;
+	return {
+		element: hastToReact(hast, {
+			createElement,
+			Fragment,
+			components
+		}),
+		frontmatter: result.frontmatter,
+		diagnostics: result.diagnostics,
+		stats: result.stats,
+		toc: result.toc
+	};
+}
+//#endregion
+export { compileToReact, hastToReact };

package/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "@unifast/react",
+  "version": "0.0.4",
+  "description": "Convert HAST to React elements for unifast",
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.cts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    },
+    "./package.json": "./package.json"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "style-to-object": "^1.0.14",
+    "@unifast/core": "0.0.4",
+    "@unifast/node": "0.0.4"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.14",
+    "react": "^19.2.4",
+    "typescript": "^5.9.3",
+    "vitest": "^4.1.0"
+  },
+  "scripts": {
+    "build": "tsdown",
+    "lint:oxc": "oxlint -c ../../.oxlintrc.json .",
+    "lint:oxc:fix": "oxlint -c ../../.oxlintrc.json --fix .",
+    "typecheck": "tsc --noEmit",
+    "fmt:oxc": "oxfmt --write .",
+    "fmt:oxc:check": "oxfmt --check .",
+    "test": "vitest run",
+    "test:coverage": "vitest run --coverage --coverage.reporter=text --coverage.reporter=lcov"
+  }
+}