react-intlayer/dist/cjs/html/HTMLRenderer.cjs

Easily internationalize i18n your React applications with type-safe multilingual content management.

'use client';

Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
const require_runtime = require('../_virtual/_rolldown/runtime.cjs');
const require_html_HTMLProvider = require('./HTMLProvider.cjs');
let _intlayer_core_interpreter = require("@intlayer/core/interpreter");
let react = require("react");
let react_jsx_runtime = require("react/jsx-runtime");
let _intlayer_core_transpiler = require("@intlayer/core/transpiler");

//#region src/html/HTMLRenderer.tsx
/**
* Renders HTML-like content to JSX with the provided components.
*
* This function does not use context from HTMLProvider. Use `useHTMLRenderer`
* hook if you want to leverage provider context.
*/
const renderHTML = (content, { components = {} } = {}) => {
	const userComponents = Object.fromEntries(Object.entries(components).filter(([, Component]) => Component).map(([key, Component]) => [key, (props) => (0, react.createElement)(Component, props)]));
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Fragment, { children: (0, _intlayer_core_interpreter.getHTML)(content, new Proxy(userComponents, { get(target, prop) {
		if (typeof prop === "string" && prop in target) return target[prop];
		if (typeof prop === "string" && /^[a-z][a-z0-9]*$/.test(prop)) {
			if (_intlayer_core_transpiler.VOID_HTML_ELEMENTS.has(prop)) return ({ children: _children, ...rest }) => (0, react.createElement)(prop, rest);
			return (props) => (0, react.createElement)(prop, props);
		}
	} })) });
};
/**
* Hook that returns a function to render HTML content.
*
* This hook considers the configuration from the `HTMLProvider` context if available,
* falling back to the provided components.
*/
const useHTMLRenderer = ({ components } = {}) => {
	const context = require_html_HTMLProvider.useHTMLContext();
	return (content) => {
		return renderHTML(content, { components: {
			...context?.components,
			...components
		} });
	};
};
/**
* React component that renders HTML-like content to JSX.
*
* This component uses the components from the `HTMLProvider` context
* if available.
*/
const HTMLRenderer = ({ children = "", components }) => {
	return useHTMLRenderer({ components })(children);
};

//#endregion
exports.HTMLRenderer = HTMLRenderer;
exports.renderHTML = renderHTML;
exports.useHTMLRenderer = useHTMLRenderer;
//# sourceMappingURL=HTMLRenderer.cjs.map