lit-intlayer 8.4.10 → 8.5.0

package/dist/esm/markdown/runtime.mjs

@@ -14,7 +14,7 @@ var e = new Set([
 	"source",
 	"track",
 	"wbr"
-]), t = (e) => e ? Object.entries(e).filter(([, e]) => e != null).map(([e, t]) => typeof t == "boolean" ? t ? e : "" : e === "_innerHTML" ? "" : `${e}="${String(t).replace(/&/g, "&").replace(/"/g, """)}"`).filter(Boolean).join(" ") : "", n = "__lit_fragment__", r = {
+]), t = (e) => e ? Object.entries(e).filter(([e, t]) => t != null && e !== "key").map(([e, t]) => typeof t == "boolean" ? t ? e : "" : e === "_innerHTML" ? "" : `${e}="${String(t).replace(/&/g, "&").replace(/"/g, """)}"`).filter(Boolean).join(" ") : "", n = "__lit_fragment__", r = {
 	createElement: (r, i, ...a) => {
 		let o = a.flat(Infinity).join("");
 		if (r === n) return o;

package/dist/esm/plugins.mjs

@@ -1,22 +1,38 @@
-import { renderIntlayerNode as e } from "./renderIntlayerNode.mjs";
-import { conditionPlugin as t, enumerationPlugin as n, filePlugin as r, genderPlugin as i, nestedPlugin as a, splitInsertionTemplate as o, translationPlugin as s } from "@intlayer/core/interpreter";
-import c from "@intlayer/config/built";
-import { getMarkdownMetadata as l } from "@intlayer/core/markdown";
-import * as u from "@intlayer/types/nodeType";
+import e from "./markdown/runtime.mjs";
+import { renderIntlayerNode as t } from "./renderIntlayerNode.mjs";
+import { conditionPlugin as n, enumerationPlugin as r, filePlugin as i, genderPlugin as a, nestedPlugin as o, splitInsertionTemplate as s, translationPlugin as c } from "@intlayer/core/interpreter";
+import l from "@intlayer/config/built";
+import { compileWithOptions as u, getMarkdownMetadata as d } from "@intlayer/core/markdown";
+import { isEnabled as f } from "@intlayer/editor/isEnabled";
+import * as p from "@intlayer/types/nodeType";
+import { unsafeHTML as m } from "lit/directives/unsafe-html.js";
 //#region src/plugins.ts
-var d = {
+var h = (t = "", n = {}) => u(t, e, n), g = (e, t = e, n = {}) => {
+	let r = m(e);
+	return new Proxy(r, { get(e, r, i) {
+		if (r === "value" || r === "raw") return t;
+		if (r === "toString" || r === Symbol.toPrimitive) return () => t;
+		if (r !== Symbol.iterator) return r === "__update" ? () => {} : Object.hasOwn(n, r) ? n[r] : Reflect.get(e, r, i);
+	} });
+}, _ = (e) => e.replace(/&/g, "&amp;").replace(/"/g, "&quot;"), v = (e) => e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;"), y = {
 	id: "intlayer-node-plugin",
 	canHandle: (e) => typeof e == "bigint" || typeof e == "string" || typeof e == "number",
-	transform: (t, { children: n, ...r }) => e({
-		...r,
-		value: n,
-		children: n
-	})
-}, f = {
+	transform: (e, { children: n, keyPath: r, dictionaryKey: i, ...a }) => {
+		if (f) {
+			let e = String(n ?? "");
+			return g(`<intlayer-content-selector-wrapper key-path="${_(JSON.stringify(r ?? []))}" dictionary-key="${_(String(i ?? ""))}">${v(e)}</intlayer-content-selector-wrapper>`, e);
+		}
+		return t({
+			...a,
+			value: n,
+			children: n
+		});
+	}
+}, b = {
 	id: "insertion-plugin",
-	canHandle: (e) => typeof e == "object" && e?.nodeType === u.INSERTION,
+	canHandle: (e) => typeof e == "object" && e?.nodeType === p.INSERTION,
 	transform: (e, t, n) => {
-		let r = [...t.keyPath, { type: u.INSERTION }], i = e[u.INSERTION], a = {
+		let r = [...t.keyPath, { type: p.INSERTION }], i = e[p.INSERTION], a = {
 			id: "insertion-string-plugin",
 			canHandle: (e) => typeof e == "string",
 			transform: (e, n, r) => {
@@ -26,84 +42,77 @@ var d = {
 					plugins: (t.plugins ?? []).filter((e) => e.id !== "intlayer-node-plugin")
 				});
 				return (e) => {
-					let a = o(i, e), s = a.isSimple ? a.parts : a.parts.join("");
-					return r(s, {
+					let a = s(i, e), o = a.isSimple ? a.parts : a.parts.join("");
+					return r(o, {
 						...n,
 						plugins: t.plugins,
-						children: s
+						children: o
 					});
 				};
 			}
-		};
-		return n(i, {
+		}, o = n(i, {
 			...t,
 			children: i,
 			keyPath: r,
 			plugins: [a, ...t.plugins ?? []]
 		});
+		return typeof i == "object" && i && "nodeType" in i && [p.ENUMERATION, p.CONDITION].includes(i.nodeType) ? (e) => (t) => {
+			let n = o(t);
+			return typeof n == "function" ? n(e) : n;
+		} : o;
 	}
-}, p = {
+}, x = {
 	id: "markdown-string-plugin",
 	canHandle: (e) => typeof e == "string",
-	transform: (t, n, r) => {
-		let { plugins: i, ...a } = n, o = r(l(t) ?? {}, {
+	transform: (e, n, r) => {
+		let { plugins: i, ...a } = n, o = r(d(e) ?? {}, {
 			plugins: [{
 				id: "markdown-metadata-plugin",
 				canHandle: (e) => typeof e == "string" || typeof e == "number" || typeof e == "boolean" || !e,
-				transform: (n, r) => e({
+				transform: (n, r) => t({
 					...r,
 					value: n,
-					children: t
+					children: e
 				})
 			}],
 			dictionaryKey: a.dictionaryKey,
 			keyPath: []
-		});
-		return e({
-			...n,
-			value: t,
-			children: t,
-			additionalProps: {
-				metadata: o,
-				use: (e) => t
-			}
+		}), s = h(e);
+		return g(s, e, {
+			metadata: o,
+			use: (e) => s
 		});
 	}
-}, m = {
+}, S = {
 	id: "markdown-plugin",
-	canHandle: (e) => typeof e == "object" && e?.nodeType === u.MARKDOWN,
+	canHandle: (e) => typeof e == "object" && e?.nodeType === p.MARKDOWN,
 	transform: (e, t, n) => {
-		let r = [...t.keyPath, { type: u.MARKDOWN }], i = e[u.MARKDOWN];
+		let r = [...t.keyPath, { type: p.MARKDOWN }], i = e[p.MARKDOWN];
 		return n(i, {
 			...t,
 			children: i,
 			keyPath: r,
-			plugins: [p, ...t.plugins ?? []]
+			plugins: [x, ...t.plugins ?? []]
 		});
 	}
-}, h = {
+}, C = {
 	id: "html-plugin",
-	canHandle: (e) => typeof e == "object" && e?.nodeType === u.HTML,
-	transform: (t, n) => {
-		let r = t[u.HTML];
-		return e({
-			...n,
-			value: r,
-			children: r,
-			additionalProps: { use: (e) => r }
-		});
+	canHandle: (e) => typeof e == "object" && e?.nodeType === p.HTML,
+	transform: (e) => {
+		let t = e[p.HTML];
+		return g(t, t, { use: (e) => t });
 	}
-}, g = (e, o = !0) => [
-	s(e ?? c.internationalization.defaultLocale, o ? c.internationalization.defaultLocale : void 0),
-	n,
-	t,
-	a(e ?? c.internationalization.defaultLocale),
+}, w = (e, t = !0) => [
+	c(e ?? l.internationalization.defaultLocale, t ? l.internationalization.defaultLocale : void 0),
 	r,
+	n,
+	o(e ?? l.internationalization.defaultLocale),
 	i,
-	d,
-	f,
-	m,
-	h
+	a,
+	y,
+	b,
+	S,
+	C
 ];
 //#endregion
-export { g as getPlugins, h as htmlPlugin, f as insertionPlugin, d as intlayerNodePlugins, m as markdownPlugin, p as markdownStringPlugin };
+export { w as getPlugins, C as htmlPlugin, b as insertionPlugin, y as intlayerNodePlugins, S as markdownPlugin, x as markdownStringPlugin };

package/dist/esm/renderIntlayerNode.mjs

@@ -4,6 +4,7 @@ var e = ({ value: e, additionalProps: t = {} }) => {
 		toString: () => String(n ?? ""),
 		valueOf: () => n,
 		[Symbol.toPrimitive]: () => n,
+		[Symbol.iterator]: void 0,
 		toJSON: () => n,
 		get raw() {
 			return n;

package/dist/installIntlayer-3Fpy-rFd.mjs

@@ -0,0 +1,71 @@
+import e from "@intlayer/config/built";
+import { isEnabled as t } from "@intlayer/editor/isEnabled";
+//#region src/editor/useEditor.ts
+var n = class {
+	host;
+	_stopped = !1;
+	_unsubscribeLocale = null;
+	constructor(e) {
+		this.host = e, e.addController(this);
+	}
+	hostConnected() {
+		this._stopped = !1, t && import("@intlayer/editor").then(({ initEditorClient: e }) => {
+			if (this._stopped) return;
+			let t = e(), n = s();
+			t.currentLocale.set(n.locale), this._unsubscribeLocale = n.subscribe((e) => {
+				t.currentLocale.set(e);
+			});
+		});
+	}
+	hostDisconnected() {
+		this._stopped = !0, this._unsubscribeLocale?.(), this._unsubscribeLocale = null, import("@intlayer/editor").then(({ stopEditorClient: e }) => {
+			e();
+		});
+	}
+};
+function r(e) {
+	if (!t) return e ? void 0 : () => {};
+	if (!e) {
+		let e = !1, t = null;
+		return import("@intlayer/editor").then(({ initEditorClient: n }) => {
+			if (e) return;
+			let r = n(), i = s();
+			r.currentLocale.set(i.locale), t = i.subscribe((e) => {
+				r.currentLocale.set(e);
+			});
+		}), () => {
+			e = !0, t?.(), import("@intlayer/editor").then(({ stopEditorClient: e }) => {
+				e();
+			});
+		};
+	}
+	new n(e);
+}
+//#endregion
+//#region src/client/installIntlayer.ts
+var i = class {
+	_locale;
+	_listeners = /* @__PURE__ */ new Set();
+	isCookieEnabled;
+	constructor(t, n = !0) {
+		let { defaultLocale: r } = e.internationalization ?? {};
+		this._locale = t ?? r, this.isCookieEnabled = n;
+	}
+	get locale() {
+		return this._locale;
+	}
+	setLocale(e) {
+		this._locale = e;
+		for (let t of this._listeners) t(e);
+	}
+	subscribe(e) {
+		return this._listeners.add(e), () => {
+			this._listeners.delete(e);
+		};
+	}
+}, a = null, o = (e, t = !0) => a || (a = new i(e, t), a), s = () => (a ||= new i(), a), c = ({ locale: e, isCookieEnabled: t } = {}) => {
+	let n = o(e, t);
+	return r(), n;
+};
+//#endregion
+export { r as a, c as i, o as n, s as r, i as t };

package/dist/installIntlayer-CkFmSJJA.js

@@ -0,0 +1 @@
+const e=require(`./chunk-C91j1N6u.js`);let t=require(`@intlayer/config/built`);t=e.t(t);let n=require(`@intlayer/editor/isEnabled`);var r=class{host;_stopped=!1;_unsubscribeLocale=null;constructor(e){this.host=e,e.addController(this)}hostConnected(){this._stopped=!1,n.isEnabled&&import(`@intlayer/editor`).then(({initEditorClient:e})=>{if(this._stopped)return;let t=e(),n=c();t.currentLocale.set(n.locale),this._unsubscribeLocale=n.subscribe(e=>{t.currentLocale.set(e)})})}hostDisconnected(){this._stopped=!0,this._unsubscribeLocale?.(),this._unsubscribeLocale=null,import(`@intlayer/editor`).then(({stopEditorClient:e})=>{e()})}};function i(e){if(!n.isEnabled)return e?void 0:()=>{};if(!e){let e=!1,t=null;return import(`@intlayer/editor`).then(({initEditorClient:n})=>{if(e)return;let r=n(),i=c();r.currentLocale.set(i.locale),t=i.subscribe(e=>{r.currentLocale.set(e)})}),()=>{e=!0,t?.(),import(`@intlayer/editor`).then(({stopEditorClient:e})=>{e()})}}new r(e)}var a=class{_locale;_listeners=new Set;isCookieEnabled;constructor(e,n=!0){let{defaultLocale:r}=t.default.internationalization??{};this._locale=e??r,this.isCookieEnabled=n}get locale(){return this._locale}setLocale(e){this._locale=e;for(let t of this._listeners)t(e)}subscribe(e){return this._listeners.add(e),()=>{this._listeners.delete(e)}}},o=null,s=(e,t=!0)=>o||(o=new a(e,t),o),c=()=>(o||=new a,o),l=({locale:e,isCookieEnabled:t}={})=>{let n=s(e,t);return i(),n};Object.defineProperty(exports,`a`,{enumerable:!0,get:function(){return i}}),Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return l}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return a}});

package/dist/types/client/IntlayerBinding.d.ts

@@ -0,0 +1,40 @@
+import { ReactiveController, ReactiveControllerHost } from 'lit';
+/**
+ * Proxy type returned by every `use*` hook in `lit-intlayer`.
+ *
+ * Wraps the translated content object with a reactive `.observe()` method so
+ * Lit elements participate in the reactive update cycle via a
+ * {@link IntlayerBinding} `ReactiveController`.
+ *
+ * ```ts
+ * private content = useIntlayer('app').observe(this);
+ * private content = useDictionary(_hash).observe(this);
+ * private content = useDictionaryDynamic(_dyn, 'app').observe(this);
+ * ```
+ */
+export type IntlayerLitProxy<T> = T & {
+    observe: (host: ReactiveControllerHost) => IntlayerLitProxy<T>;
+};
+/**
+ * `ReactiveController` that keeps a Lit element in sync with Intlayer locale
+ * changes and, optionally, async dictionary load events.
+ *
+ * Registered automatically by `.observe(this)` — you should never need to
+ * instantiate it directly.
+ *
+ * @param host         - The Lit element to update.
+ * @param onConnect    - Called inside `hostConnected` (after locale subscription
+ *                       is set up). Useful for triggering an immediate update
+ *                       when the dictionary is already cached.
+ * @param onDisconnect - Called inside `hostDisconnected`. Useful for removing
+ *                       the host from a dictionary's update-host registry.
+ */
+export declare class IntlayerBinding implements ReactiveController {
+    private host;
+    private unsubscribeLocale;
+    private readonly onConnect?;
+    private readonly onDisconnect?;
+    constructor(host: ReactiveControllerHost, onConnect?: () => void, onDisconnect?: () => void);
+    hostConnected(): void;
+    hostDisconnected(): void;
+}

package/dist/types/{src/client → client}/index.d.ts

@@ -1,5 +1,7 @@
+export * from './IntlayerBinding';
 export * from './installIntlayer';
 export * from './useDictionary';
+export * from './useDictionaryDynamic';
 export * from './useIntlayer';
 export * from './useLocale';
 export * from './useLocaleStorage';

package/dist/types/{src/client → client}/installIntlayer.d.ts

@@ -22,16 +22,32 @@ export declare const getIntlayerClient: () => IntlayerClient;
  *
  * Call this once at application startup before any Lit elements are rendered.
  *
+ * When called with a `config` argument, `window.INTLAYER_CONFIG` is set so
+ * that `@intlayer/config/built` resolves the correct values in the browser
+ * without requiring module aliasing in the bundler configuration.
+ *
  * @param locale - Initial locale (defaults to config defaultLocale).
  * @param isCookieEnabled - Whether to persist locale in cookies/localStorage.
+ * @param config - Optional Intlayer configuration. When provided, sets
+ *   `window.INTLAYER_CONFIG` with the browser-safe subset of the config so
+ *   the application works without a Vite/webpack plugin alias.
  * @returns The IntlayerClient singleton.
  *
  * @example
  * ```ts
  * import { installIntlayer } from 'lit-intlayer';
  *
+ * // With explicit config (no build plugin alias needed):
+ * installIntlayer('en', true, {
+ *   internationalization: { locales: ['en', 'fr'], defaultLocale: 'en' },
+ * });
+ *
+ * // With build plugin (alias handles config automatically):
  * installIntlayer('en');
  * ```
  */
-export declare const installIntlayer: (locale?: LocalesValues, isCookieEnabled?: boolean) => IntlayerClient;
+export declare const installIntlayer: ({ locale, isCookieEnabled, }?: {
+    locale?: LocalesValues;
+    isCookieEnabled?: boolean;
+}) => IntlayerClient;
 export {};

package/dist/types/client/useDictionary.d.ts

@@ -0,0 +1,31 @@
+import { Dictionary } from '@intlayer/types/dictionary';
+import { DeclaredLocales, LocalesValues } from '@intlayer/types/module_augmentation';
+import { DeepTransformContent } from '../plugins';
+import { IntlayerLitProxy } from './IntlayerBinding';
+/**
+ * Returns the translated content for a raw dictionary object, wrapped in an
+ * {@link IntlayerLitProxy} so the caller can subscribe to locale changes via
+ * a Lit `ReactiveController`.
+ *
+ * This is the babel-optimized counterpart of `useIntlayer` — it accepts a
+ * pre-imported dictionary object directly instead of a string key, matching
+ * the same signature as `react-intlayer` and other framework adapters.
+ *
+ * The content is resolved synchronously on every property access via a proxy,
+ * so the first render always shows the correct locale without a loading phase.
+ * Chain `.observe(this)` to register a `ReactiveController` that triggers
+ * `requestUpdate()` on every subsequent locale change.
+ *
+ * @param dictionary - The raw dictionary object (pre-imported by the build plugin).
+ * @param locale     - Optional locale override.
+ * @returns An {@link IntlayerLitProxy} that exposes the current locale's content
+ *          together with an `.observe()` registration method.
+ *
+ * @example
+ * ```ts
+ * // Typically injected by the babel/SWC optimization plugin:
+ * import _hash from '.intlayer/dictionaries/app.json' with { type: 'json' };
+ * private content = useDictionary(_hash).observe(this);
+ * ```
+ */
+export declare const useDictionary: <T extends Dictionary, L extends LocalesValues = DeclaredLocales>(dictionary: T, locale?: L) => IntlayerLitProxy<DeepTransformContent<T["content"], L>>;

package/dist/types/client/useDictionaryDynamic.d.ts

@@ -0,0 +1,36 @@
+import { Dictionary } from '@intlayer/types/dictionary';
+import { DictionaryKeys, LocalesValues, StrictModeLocaleMap } from '@intlayer/types/module_augmentation';
+import { DeepTransformContent } from '../plugins';
+import { IntlayerLitProxy } from './IntlayerBinding';
+/**
+ * Returns the translated content for a lazily-loaded dictionary, wrapped in an
+ * {@link IntlayerLitProxy} so the caller can register a Lit `ReactiveController`
+ * that keeps the element in sync with both the async bundle load and locale
+ * changes.
+ *
+ * This is the babel-optimized counterpart of `useIntlayer` when
+ * `importMode = 'dynamic'` — it accepts the locale-keyed loader map injected
+ * by the build plugin, matching the same signature as `react-intlayer` and
+ * other framework adapters.
+ *
+ * While loading, property accesses return safe empty-string placeholders via
+ * a recursive proxy. Chain `.observe(this)` so Lit triggers `requestUpdate()`
+ * once the bundle is ready and on every subsequent locale change.
+ *
+ * The `intlayerLitPlugin` Vite plugin automatically appends
+ * `.observe(this)` at build / serve time, so manual chaining is usually
+ * unnecessary.
+ *
+ * @param dictionaryPromise - Locale-keyed map of `() => Promise<Dictionary>` loaders.
+ * @param key               - The dictionary key (used for cache namespacing).
+ * @param locale            - Optional locale override.
+ * @returns An {@link IntlayerLitProxy} proxy with an `.observe()` method.
+ *
+ * @example
+ * ```ts
+ * // Typically injected by the babel/SWC optimization plugin:
+ * import _hash_dyn from '.intlayer/dynamic_dictionaries/app.mjs';
+ * private content = useDictionaryDynamic(_hash_dyn, 'app').observe(this);
+ * ```
+ */
+export declare const useDictionaryDynamic: <T extends Dictionary, K extends DictionaryKeys, L extends LocalesValues = LocalesValues>(dictionaryPromise: StrictModeLocaleMap<() => Promise<T>>, key: K, locale?: L) => IntlayerLitProxy<DeepTransformContent<T["content"], L>>;

package/dist/types/client/useIntlayer.d.ts

@@ -0,0 +1,22 @@
+import { DictionaryKeys, DictionaryRegistryContent, LocalesValues } from '@intlayer/types/module_augmentation';
+import { DeepTransformContent } from '../plugins';
+import { IntlayerLitProxy } from './IntlayerBinding';
+/**
+ * Returns the translated content for the given dictionary key, wrapped in an
+ * {@link IntlayerLitProxy} so the caller can subscribe to locale changes via
+ * a Lit `ReactiveController`.
+ *
+ * Matches the same signature as `react-intlayer` and all other framework
+ * adapters:
+ * ```ts
+ * private content = useIntlayer('my-component').observe(this);
+ * ```
+ *
+ * The babel/SWC optimization plugin transforms this at build time into either:
+ * - static mode:  `useDictionary(_hash)` — synchronous JSON import
+ * - dynamic mode: `useDictionaryDynamic(_dyn, 'key')` — lazy locale split
+ *
+ * In non-optimized builds (dev without babel) the content is re-fetched from
+ * `getIntlayer` on every property access, caching by locale.
+ */
+export declare const useIntlayer: <T extends DictionaryKeys>(key: T, locale?: LocalesValues) => IntlayerLitProxy<DeepTransformContent<DictionaryRegistryContent<T>>>;

package/dist/types/editor/useEditor.d.ts

@@ -0,0 +1,34 @@
+import { ReactiveControllerHost } from 'lit';
+/**
+ * Initialises the Intlayer visual editor client.
+ *
+ * Does nothing when `INTLAYER_EDITOR_ENABLED` is `"false"` or the editor
+ * package reports that it is disabled.
+ *
+ * **Without a host** — starts the editor globally (not tied to any element
+ * lifecycle). Returns a cleanup function. Called automatically by
+ * `installIntlayer`; you only need this when you want to manage cleanup
+ * manually.
+ *
+ * **With a host** — attaches an `EditorController` to the given
+ * `ReactiveControllerHost` so the editor lifecycle follows the element's
+ * connected/disconnected callbacks.
+ *
+ * @param host - Optional LitElement (or any ReactiveControllerHost).
+ *
+ * @example
+ * ```ts
+ * // Global (called automatically by installIntlayer)
+ * const stopEditor = useEditor();
+ *
+ * // Element-scoped
+ * class AppShell extends LitElement {
+ *   constructor() {
+ *     super();
+ *     useEditor(this);
+ *   }
+ * }
+ * ```
+ */
+export declare function useEditor(): () => void;
+export declare function useEditor(host: ReactiveControllerHost): void;

package/dist/types/html/index.d.ts

@@ -0,0 +1,3 @@
+export { type RenderHTMLProps, renderHTML, useHTMLRenderer, } from './HTMLRenderer';
+export { type IntlayerHTMLPluginOptions, type IntlayerHTMLProvider, installIntlayerHTML, installIntlayerHTMLDynamic, type RenderHTMLFunction, type RenderHTMLOptions, useHTML, } from './installIntlayerHTML';
+export type { HTMLComponents } from './types';

package/dist/types/{src/html → html}/installIntlayerHTML.d.ts

@@ -38,3 +38,28 @@ export declare const installIntlayerHTML: (pluginOptions?: IntlayerHTMLPluginOpt
  * provider has been installed.
  */
 export declare const useHTML: () => IntlayerHTMLProvider;
+/**
+ * Asynchronously install an HTML renderer whose implementation is loaded
+ * via a dynamic `import()`.
+ *
+ * Use this to keep a heavy HTML sanitiser / component renderer out of the
+ * initial bundle — the loader is only called the first time this function
+ * is executed.
+ *
+ * The returned promise resolves once the provider is ready. Any calls to
+ * `useHTML()` before the promise resolves will use the fallback (identity)
+ * renderer.
+ *
+ * @param loader - A zero-argument async function that resolves to either a
+ *   `RenderHTMLFunction` or an `IntlayerHTMLPluginOptions` object.
+ *
+ * @example
+ * ```ts
+ * // Load a custom HTML sanitiser only when needed
+ * await installIntlayerHTMLDynamic(async () => {
+ *   const DOMPurify = await import('dompurify');
+ *   return (html) => DOMPurify.sanitize(html);
+ * });
+ * ```
+ */
+export declare const installIntlayerHTMLDynamic: (loader: () => Promise<IntlayerHTMLPluginOptions | RenderHTMLFunction>) => Promise<IntlayerHTMLProvider>;

package/dist/types/{src/index.d.ts → index.d.ts}

@@ -9,6 +9,4 @@ export * from './editor/useEditor';
 export * from './format/useIntl';
 export * from './getDictionary';
 export * from './getIntlayer';
-export * from './html';
-export * from './markdown';
 export * from './plugins';

package/dist/types/markdown/index.d.ts

@@ -0,0 +1,3 @@
+export { compileMarkdown } from './compiler';
+export { type IntlayerMarkdownPluginOptions, type IntlayerMarkdownProvider, installIntlayerMarkdown, installIntlayerMarkdownDynamic, type MarkdownProviderOptions, type RenderMarkdownFunction, useMarkdown, } from './installIntlayerMarkdown';
+export { type RenderMarkdownProps, renderMarkdown, useMarkdownRenderer, } from './MarkdownRenderer';

package/dist/types/{src/markdown → markdown}/installIntlayerMarkdown.d.ts

@@ -13,7 +13,7 @@ export type RenderMarkdownOptions = MarkdownProviderOptions & {
     components?: HTMLComponents<'permissive', {}>;
     wrapper?: string;
 };
-export type RenderMarkdownFunction = (markdown: string, options?: MarkdownProviderOptions, components?: HTMLComponents<'permissive', {}>, wrapper?: string) => string;
+export type RenderMarkdownFunction = (markdown: string, options?: MarkdownProviderOptions, components?: HTMLComponents<'permissive', {}>, wrapper?: string) => string | Promise<string>;
 export type IntlayerMarkdownProvider = {
     components?: HTMLComponents<'permissive', {}>;
     renderMarkdown: RenderMarkdownFunction;
@@ -48,3 +48,27 @@ export declare const installIntlayerMarkdown: (pluginOptions?: IntlayerMarkdownP
  * provider has been installed.
  */
 export declare const useMarkdown: () => IntlayerMarkdownProvider;
+/**
+ * Asynchronously install a markdown renderer whose implementation is loaded
+ * via a dynamic `import()`.
+ *
+ * Use this to keep the markdown compiler out of the initial bundle — the
+ * loader is only called the first time this function is executed.
+ *
+ * The returned promise resolves once the provider is ready. Any calls to
+ * `useMarkdown()` before the promise resolves will use the fallback
+ * (raw-string) renderer.
+ *
+ * @param loader - A zero-argument async function that resolves to either a
+ *   `RenderMarkdownFunction` or an `IntlayerMarkdownPluginOptions` object.
+ *
+ * @example
+ * ```ts
+ * // Load a custom markdown renderer (e.g. marked) only when needed
+ * await installIntlayerMarkdownDynamic(async () => {
+ *   const { marked } = await import('marked');
+ *   return (markdown) => marked(markdown) as string;
+ * });
+ * ```
+ */
+export declare const installIntlayerMarkdownDynamic: (loader: () => Promise<IntlayerMarkdownPluginOptions | RenderMarkdownFunction>) => Promise<IntlayerMarkdownProvider>;

package/dist/types/{src/plugins.d.ts → plugins.d.ts}

@@ -12,18 +12,20 @@ export type IntlayerNode<T, P = {}> = IntlayerNodeCore<T> & P;
 /**
  * Wraps string/number leaf values in an IntlayerNode so they carry
  * `.value`, `.raw`, `toString()`, and `__update()`.
+ * When the editor is enabled, wraps the content with
+ * `<intlayer-content-selector-wrapper>` so the visual editor can highlight it.
  */
 export declare const intlayerNodePlugins: Plugins;
 /** ---------------------------------------------
  * INSERTION PLUGIN
  * --------------------------------------------- */
-export type InsertionCond<T, _S, _L> = T extends {
+export type InsertionCond<T, _S, L extends LocalesValues> = T extends {
     nodeType: NodeType | string;
-    [NodeTypes.INSERTION]: string;
-    fields: readonly string[];
+    [NodeTypes.INSERTION]: infer I;
+    fields: readonly (infer F)[];
 } ? <V extends {
-    [K in T['fields'][number]]: string | number;
-}>(values: V) => IntlayerNode<string> : never;
+    [K in Extract<F, string>]: string | number;
+}>(values: V) => I extends string ? IntlayerNode<string> : DeepTransformContent<I, L> : never;
 export declare const insertionPlugin: Plugins;
 /** ---------------------------------------------
  * MARKDOWN PLUGIN