angular-intlayer 8.0.0-canary.4 → 8.0.0-canary.6

package/dist/esm/editor/ContentSelectorWrapper.component.mjs

@@ -1,3 +1,5 @@
+import { __decorateMetadata } from "../_virtual/_@oxc-project_runtime@0.110.0/helpers/decorateMetadata.mjs";
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.110.0/helpers/decorate.mjs";
 import { ContentSelectorComponent } from "../UI/ContentSelector.component.mjs";
 import { useEditorEnabled } from "./editorEnabled.mjs";
 import { useFocusDictionary } from "./focusDictionary.mjs";
@@ -8,23 +10,9 @@ import { CommonModule } from "@angular/common";
 import { Component, Input, computed } from "@angular/core";
 
 //#region src/editor/ContentSelectorWrapper.component.ts
-var ContentSelectorWrapperComponent = @Component({
-	selector: "app-content-selector-wrapper",
-	standalone: true,
-	imports: [CommonModule, ContentSelectorComponent],
-	template: `
-    <app-content-selector
-      *ngIf="enabled()"
-      (press)="handleSelect()"
-      [isSelecting]="isSelected()"
-    >
-      <ng-content></ng-content>
-    </app-content-selector>
-    <ng-content *ngIf="!enabled()"></ng-content>
-  `
-}) class {
-	@Input() dictionaryKey;
-	@Input() keyPath;
+let ContentSelectorWrapperComponent = class ContentSelectorWrapperComponent {
+	dictionaryKey;
+	keyPath;
 	focusDictionary = useFocusDictionary();
 	editorEnabled = useEditorEnabled();
 	constructor() {
@@ -42,6 +30,23 @@ var ContentSelectorWrapperComponent = @Component({
 		});
 	}
 };
+__decorate([Input(), __decorateMetadata("design:type", String)], ContentSelectorWrapperComponent.prototype, "dictionaryKey", void 0);
+__decorate([Input(), __decorateMetadata("design:type", Array)], ContentSelectorWrapperComponent.prototype, "keyPath", void 0);
+ContentSelectorWrapperComponent = __decorate([Component({
+	selector: "app-content-selector-wrapper",
+	standalone: true,
+	imports: [CommonModule, ContentSelectorComponent],
+	template: `
+    <app-content-selector
+      *ngIf="enabled()"
+      (press)="handleSelect()"
+      [isSelecting]="isSelected()"
+    >
+      <ng-content></ng-content>
+    </app-content-selector>
+    <ng-content *ngIf="!enabled()"></ng-content>
+  `
+}), __decorateMetadata("design:paramtypes", [])], ContentSelectorWrapperComponent);
 
 //#endregion
 export { ContentSelectorWrapperComponent };

package/dist/esm/editor/ContentSelectorWrapper.component.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ContentSelectorWrapper.component.mjs","names":[],"sources":["../../../src/editor/ContentSelectorWrapper.component.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, computed, Input } from '@angular/core';\nimport { isSameKeyPath, type NodeProps } from '@intlayer/core';\nimport { NodeType } from '@intlayer/types';\nimport { ContentSelectorComponent } from '../UI/ContentSelector.component';\nimport { useEditorEnabled } from './editorEnabled';\nimport { useFocusDictionary } from './focusDictionary';\nimport { useEditor } from './useEditor';\n\n/**\n * Combine your NodeProps (which include dictionaryKey & keyPath)\n * with any other div-like attributes.\n */\nexport interface ContentSelectorWrapperProps extends NodeProps {\n  [key: string]: any;\n}\n\n@Component({\n  selector: 'app-content-selector-wrapper',\n  standalone: true,\n  imports: [CommonModule, ContentSelectorComponent],\n  template: `\n    <app-content-selector\n      *ngIf=\"enabled()\"\n      (press)=\"handleSelect()\"\n      [isSelecting]=\"isSelected()\"\n    >\n      <ng-content></ng-content>\n    </app-content-selector>\n    <ng-content *ngIf=\"!enabled()\"></ng-content>\n  `,\n})\nexport class ContentSelectorWrapperComponent {\n  @Input() dictionaryKey!: string;\n  @Input() keyPath!: any[];\n\n  // pull in the editor state & focus API\n  private focusDictionary = useFocusDictionary();\n  private editorEnabled = useEditorEnabled();\n\n  constructor() {\n    useEditor();\n  }\n\n  // compute whether this node is the current focus\n  isSelected = computed(() => {\n    const focusedContent = this.focusDictionary.focusedContent();\n    return (\n      focusedContent?.dictionaryKey === this.dictionaryKey &&\n      (focusedContent.keyPath?.length ?? 0) > 0 &&\n      isSameKeyPath(focusedContent.keyPath ?? [], this.keyPath)\n    );\n  });\n\n  enabled = computed(() => this.editorEnabled.enabled());\n\n  // when the selector is clicked, update focus\n  handleSelect() {\n    this.focusDictionary.setFocusedContent({\n      dictionaryKey: this.dictionaryKey,\n      keyPath: this.keyPath.filter((key) => key.type !== NodeType.Translation),\n    });\n  }\n}\n"],"mappings":";;;;;;;;;;AAgCA,IAAa,kCAfb,CAAC,UAAU;CACT,UAAU;CACV,YAAY;CACZ,SAAS,CAAC,cAAc,yBAAyB;CACjD,UAAU;;;;;;;;;;CAUX,CAAC,CACF,MAA6C;CAC3C,CAAC,OAAO,CAAC;CACT,CAAC,OAAO,CAAC;CAGT,AAAQ,kBAAkB,oBAAoB;CAC9C,AAAQ,gBAAgB,kBAAkB;CAE1C,cAAc;AACZ,aAAW;;CAIb,aAAa,eAAe;EAC1B,MAAM,iBAAiB,KAAK,gBAAgB,gBAAgB;AAC5D,SACE,gBAAgB,kBAAkB,KAAK,kBACtC,eAAe,SAAS,UAAU,KAAK,KACxC,cAAc,eAAe,WAAW,EAAE,EAAE,KAAK,QAAQ;GAE3D;CAEF,UAAU,eAAe,KAAK,cAAc,SAAS,CAAC;CAGtD,eAAe;AACb,OAAK,gBAAgB,kBAAkB;GACrC,eAAe,KAAK;GACpB,SAAS,KAAK,QAAQ,QAAQ,QAAQ,IAAI,SAAS,SAAS,YAAY;GACzE,CAAC"}
+{"version":3,"file":"ContentSelectorWrapper.component.mjs","names":[],"sources":["../../../src/editor/ContentSelectorWrapper.component.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, computed, Input } from '@angular/core';\nimport { isSameKeyPath, type NodeProps } from '@intlayer/core';\nimport { NodeType } from '@intlayer/types';\nimport { ContentSelectorComponent } from '../UI/ContentSelector.component';\nimport { useEditorEnabled } from './editorEnabled';\nimport { useFocusDictionary } from './focusDictionary';\nimport { useEditor } from './useEditor';\n\n/**\n * Combine your NodeProps (which include dictionaryKey & keyPath)\n * with any other div-like attributes.\n */\nexport interface ContentSelectorWrapperProps extends NodeProps {\n  [key: string]: any;\n}\n\n@Component({\n  selector: 'app-content-selector-wrapper',\n  standalone: true,\n  imports: [CommonModule, ContentSelectorComponent],\n  template: `\n    <app-content-selector\n      *ngIf=\"enabled()\"\n      (press)=\"handleSelect()\"\n      [isSelecting]=\"isSelected()\"\n    >\n      <ng-content></ng-content>\n    </app-content-selector>\n    <ng-content *ngIf=\"!enabled()\"></ng-content>\n  `,\n})\nexport class ContentSelectorWrapperComponent {\n  @Input() dictionaryKey!: string;\n  @Input() keyPath!: any[];\n\n  // pull in the editor state & focus API\n  private focusDictionary = useFocusDictionary();\n  private editorEnabled = useEditorEnabled();\n\n  constructor() {\n    useEditor();\n  }\n\n  // compute whether this node is the current focus\n  isSelected = computed(() => {\n    const focusedContent = this.focusDictionary.focusedContent();\n    return (\n      focusedContent?.dictionaryKey === this.dictionaryKey &&\n      (focusedContent.keyPath?.length ?? 0) > 0 &&\n      isSameKeyPath(focusedContent.keyPath ?? [], this.keyPath)\n    );\n  });\n\n  enabled = computed(() => this.editorEnabled.enabled());\n\n  // when the selector is clicked, update focus\n  handleSelect() {\n    this.focusDictionary.setFocusedContent({\n      dictionaryKey: this.dictionaryKey,\n      keyPath: this.keyPath.filter((key) => key.type !== NodeType.Translation),\n    });\n  }\n}\n"],"mappings":";;;;;;;;;;;;AAgCO,4CAAM,gCAAgC;CAC3C,AAAS;CACT,AAAS;CAGT,AAAQ,kBAAkB,oBAAoB;CAC9C,AAAQ,gBAAgB,kBAAkB;CAE1C,cAAc;AACZ,aAAW;;CAIb,aAAa,eAAe;EAC1B,MAAM,iBAAiB,KAAK,gBAAgB,gBAAgB;AAC5D,SACE,gBAAgB,kBAAkB,KAAK,kBACtC,eAAe,SAAS,UAAU,KAAK,KACxC,cAAc,eAAe,WAAW,EAAE,EAAE,KAAK,QAAQ;GAE3D;CAEF,UAAU,eAAe,KAAK,cAAc,SAAS,CAAC;CAGtD,eAAe;AACb,OAAK,gBAAgB,kBAAkB;GACrC,eAAe,KAAK;GACpB,SAAS,KAAK,QAAQ,QAAQ,QAAQ,IAAI,SAAS,SAAS,YAAY;GACzE,CAAC;;;YA5BH,OAAO;YACP,OAAO;8CAjBT,UAAU;CACT,UAAU;CACV,YAAY;CACZ,SAAS,CAAC,cAAc,yBAAyB;CACjD,UAAU;;;;;;;;;;CAUX,CAAC"}

package/dist/esm/editor/EditedContentRenderer.component.mjs

@@ -1,18 +1,15 @@
+import { __decorateMetadata } from "../_virtual/_@oxc-project_runtime@0.110.0/helpers/decorateMetadata.mjs";
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.110.0/helpers/decorate.mjs";
 import { useEditedContentRenderer } from "./useEditedContentRenderer.mjs";
 import { getContent } from "@intlayer/core";
 import { CommonModule } from "@angular/common";
 import { Component, Input, computed, signal } from "@angular/core";
 
 //#region src/editor/EditedContentRenderer.component.ts
-var EditedContentRendererComponent = @Component({
-	selector: "app-edited-content-renderer",
-	standalone: true,
-	imports: [CommonModule],
-	template: ` <span [innerHTML]="renderedContent()"></span> `
-}) class {
-	@Input() dictionaryKey;
-	@Input() keyPath;
-	@Input() locale;
+let EditedContentRendererComponent = class EditedContentRendererComponent {
+	dictionaryKey;
+	keyPath;
+	locale;
 	fallback = signal("");
 	rawContent = computed(() => {
 		return useEditedContentRenderer(this.dictionaryKey, this.keyPath, this.fallback);
@@ -36,6 +33,15 @@ var EditedContentRendererComponent = @Component({
 		return rawContentValue();
 	});
 };
+__decorate([Input(), __decorateMetadata("design:type", String)], EditedContentRendererComponent.prototype, "dictionaryKey", void 0);
+__decorate([Input(), __decorateMetadata("design:type", Array)], EditedContentRendererComponent.prototype, "keyPath", void 0);
+__decorate([Input(), __decorateMetadata("design:type", Object)], EditedContentRendererComponent.prototype, "locale", void 0);
+EditedContentRendererComponent = __decorate([Component({
+	selector: "app-edited-content-renderer",
+	standalone: true,
+	imports: [CommonModule],
+	template: ` <span [innerHTML]="renderedContent()"></span> `
+})], EditedContentRendererComponent);
 
 //#endregion
 export { EditedContentRendererComponent };

package/dist/esm/editor/EditedContentRenderer.component.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"EditedContentRenderer.component.mjs","names":[],"sources":["../../../src/editor/EditedContentRenderer.component.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, computed, Input, signal } from '@angular/core';\nimport { getContent } from '@intlayer/core';\nimport type { ContentNode, KeyPath, Locale } from '@intlayer/types';\nimport { useEditedContentRenderer } from './useEditedContentRenderer';\n\nexport interface EditedContentRendererProps {\n  dictionaryKey: string;\n  keyPath: KeyPath[];\n  locale?: Locale;\n}\n\n@Component({\n  selector: 'app-edited-content-renderer',\n  standalone: true,\n  imports: [CommonModule],\n  template: ` <span [innerHTML]=\"renderedContent()\"></span> `,\n})\nexport class EditedContentRendererComponent {\n  @Input() dictionaryKey!: string;\n  @Input() keyPath!: KeyPath[];\n  @Input() locale?: Locale;\n\n  private fallback = signal('');\n\n  private rawContent = computed(() => {\n    return useEditedContentRenderer(\n      this.dictionaryKey,\n      this.keyPath,\n      this.fallback\n    );\n  });\n\n  /**\n   * Object → getContent → string, same as the React version.\n   */\n  renderedContent = computed(() => {\n    const rawContentValue = this.rawContent();\n\n    if (typeof rawContentValue === 'object' && rawContentValue !== null) {\n      const transformed = getContent(\n        rawContentValue as ContentNode,\n        {\n          dictionaryKey: this.dictionaryKey,\n          keyPath: this.keyPath,\n        },\n        this.locale\n      );\n\n      if (typeof transformed !== 'string') {\n        console.error(\n          `Incorrect edited content format. Content type: ${typeof transformed}. Expected string. Value ${JSON.stringify(\n            transformed\n          )}`\n        );\n        return this.fallback();\n      }\n      return transformed;\n    }\n\n    return rawContentValue() as string;\n  });\n}\n"],"mappings":";;;;;;AAkBA,IAAa,iCANb,CAAC,UAAU;CACT,UAAU;CACV,YAAY;CACZ,SAAS,CAAC,aAAa;CACvB,UAAU;CACX,CAAC,CACF,MAA4C;CAC1C,CAAC,OAAO,CAAC;CACT,CAAC,OAAO,CAAC;CACT,CAAC,OAAO,CAAC;CAET,AAAQ,WAAW,OAAO,GAAG;CAE7B,AAAQ,aAAa,eAAe;AAClC,SAAO,yBACL,KAAK,eACL,KAAK,SACL,KAAK,SACN;GACD;;;;CAKF,kBAAkB,eAAe;EAC/B,MAAM,kBAAkB,KAAK,YAAY;AAEzC,MAAI,OAAO,oBAAoB,YAAY,oBAAoB,MAAM;GACnE,MAAM,cAAc,WAClB,iBACA;IACE,eAAe,KAAK;IACpB,SAAS,KAAK;IACf,EACD,KAAK,OACN;AAED,OAAI,OAAO,gBAAgB,UAAU;AACnC,YAAQ,MACN,kDAAkD,OAAO,YAAY,2BAA2B,KAAK,UACnG,YACD,GACF;AACD,WAAO,KAAK,UAAU;;AAExB,UAAO;;AAGT,SAAO,iBAAiB;GACxB"}
+{"version":3,"file":"EditedContentRenderer.component.mjs","names":[],"sources":["../../../src/editor/EditedContentRenderer.component.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, computed, Input, signal } from '@angular/core';\nimport { getContent } from '@intlayer/core';\nimport type { ContentNode, KeyPath, Locale } from '@intlayer/types';\nimport { useEditedContentRenderer } from './useEditedContentRenderer';\n\nexport interface EditedContentRendererProps {\n  dictionaryKey: string;\n  keyPath: KeyPath[];\n  locale?: Locale;\n}\n\n@Component({\n  selector: 'app-edited-content-renderer',\n  standalone: true,\n  imports: [CommonModule],\n  template: ` <span [innerHTML]=\"renderedContent()\"></span> `,\n})\nexport class EditedContentRendererComponent {\n  @Input() dictionaryKey!: string;\n  @Input() keyPath!: KeyPath[];\n  @Input() locale?: Locale;\n\n  private fallback = signal('');\n\n  private rawContent = computed(() => {\n    return useEditedContentRenderer(\n      this.dictionaryKey,\n      this.keyPath,\n      this.fallback\n    );\n  });\n\n  /**\n   * Object → getContent → string, same as the React version.\n   */\n  renderedContent = computed(() => {\n    const rawContentValue = this.rawContent();\n\n    if (typeof rawContentValue === 'object' && rawContentValue !== null) {\n      const transformed = getContent(\n        rawContentValue as ContentNode,\n        {\n          dictionaryKey: this.dictionaryKey,\n          keyPath: this.keyPath,\n        },\n        this.locale\n      );\n\n      if (typeof transformed !== 'string') {\n        console.error(\n          `Incorrect edited content format. Content type: ${typeof transformed}. Expected string. Value ${JSON.stringify(\n            transformed\n          )}`\n        );\n        return this.fallback();\n      }\n      return transformed;\n    }\n\n    return rawContentValue() as string;\n  });\n}\n"],"mappings":";;;;;;;;AAkBO,2CAAM,+BAA+B;CAC1C,AAAS;CACT,AAAS;CACT,AAAS;CAET,AAAQ,WAAW,OAAO,GAAG;CAE7B,AAAQ,aAAa,eAAe;AAClC,SAAO,yBACL,KAAK,eACL,KAAK,SACL,KAAK,SACN;GACD;;;;CAKF,kBAAkB,eAAe;EAC/B,MAAM,kBAAkB,KAAK,YAAY;AAEzC,MAAI,OAAO,oBAAoB,YAAY,oBAAoB,MAAM;GACnE,MAAM,cAAc,WAClB,iBACA;IACE,eAAe,KAAK;IACpB,SAAS,KAAK;IACf,EACD,KAAK,OACN;AAED,OAAI,OAAO,gBAAgB,UAAU;AACnC,YAAQ,MACN,kDAAkD,OAAO,YAAY,2BAA2B,KAAK,UACnG,YACD,GACF;AACD,WAAO,KAAK,UAAU;;AAExB,UAAO;;AAGT,SAAO,iBAAiB;GACxB;;YA1CD,OAAO;YACP,OAAO;YACP,OAAO;6CATT,UAAU;CACT,UAAU;CACV,YAAY;CACZ,SAAS,CAAC,aAAa;CACvB,UAAU;CACX,CAAC"}

package/dist/esm/editor/EditorSelectorRenderer.component.mjs

@@ -1,10 +1,18 @@
+import { __decorateMetadata } from "../_virtual/_@oxc-project_runtime@0.110.0/helpers/decorateMetadata.mjs";
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.110.0/helpers/decorate.mjs";
 import { ContentSelectorWrapperComponent } from "./ContentSelectorWrapper.component.mjs";
 import { EditedContentRendererComponent } from "./EditedContentRenderer.component.mjs";
 import { CommonModule } from "@angular/common";
 import { Component, Input } from "@angular/core";
 
 //#region src/editor/EditorSelectorRenderer.component.ts
-var EditorSelectorRendererComponent = @Component({
+let EditorSelectorRendererComponent = class EditorSelectorRendererComponent {
+	dictionaryKey;
+	keyPath;
+};
+__decorate([Input(), __decorateMetadata("design:type", String)], EditorSelectorRendererComponent.prototype, "dictionaryKey", void 0);
+__decorate([Input(), __decorateMetadata("design:type", Array)], EditorSelectorRendererComponent.prototype, "keyPath", void 0);
+EditorSelectorRendererComponent = __decorate([Component({
 	selector: "app-editor-selector-renderer",
 	standalone: true,
 	imports: [
@@ -25,10 +33,7 @@ var EditorSelectorRendererComponent = @Component({
       </app-edited-content-renderer>
     </app-content-selector-wrapper>
   `
-}) class {
-	@Input() dictionaryKey;
-	@Input() keyPath;
-};
+})], EditorSelectorRendererComponent);
 
 //#endregion
 export { EditorSelectorRendererComponent };

package/dist/esm/editor/EditorSelectorRenderer.component.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"EditorSelectorRenderer.component.mjs","names":[],"sources":["../../../src/editor/EditorSelectorRenderer.component.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, Input } from '@angular/core';\nimport type { NodeProps } from '@intlayer/core';\nimport { ContentSelectorWrapperComponent } from './ContentSelectorWrapper.component';\nimport { EditedContentRendererComponent } from './EditedContentRenderer.component';\n\n/**\n * Combine your NodeProps (which include dictionaryKey & keyPath)\n * with any other div-like attributes.\n */\nexport interface EditorSelectorRendererProps extends NodeProps {\n  [key: string]: any;\n}\n\n@Component({\n  selector: 'app-editor-selector-renderer',\n  standalone: true,\n  imports: [\n    CommonModule,\n    ContentSelectorWrapperComponent,\n    EditedContentRendererComponent,\n  ],\n  template: `\n    <app-content-selector-wrapper\n      [dictionaryKey]=\"dictionaryKey\"\n      [keyPath]=\"keyPath\"\n    >\n      <app-edited-content-renderer\n        [dictionaryKey]=\"dictionaryKey\"\n        [keyPath]=\"keyPath\"\n      >\n        <ng-content></ng-content>\n      </app-edited-content-renderer>\n    </app-content-selector-wrapper>\n  `,\n})\nexport class EditorSelectorRendererComponent {\n  @Input() dictionaryKey!: string;\n  @Input() keyPath!: any[];\n}\n"],"mappings":";;;;;;AAoCA,IAAa,kCAtBb,CAAC,UAAU;CACT,UAAU;CACV,YAAY;CACZ,SAAS;EACP;EACA;EACA;EACD;CACD,UAAU;;;;;;;;;;;;;CAaX,CAAC,CACF,MAA6C;CAC3C,CAAC,OAAO,CAAC;CACT,CAAC,OAAO,CAAC"}
+{"version":3,"file":"EditorSelectorRenderer.component.mjs","names":[],"sources":["../../../src/editor/EditorSelectorRenderer.component.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, Input } from '@angular/core';\nimport type { NodeProps } from '@intlayer/core';\nimport { ContentSelectorWrapperComponent } from './ContentSelectorWrapper.component';\nimport { EditedContentRendererComponent } from './EditedContentRenderer.component';\n\n/**\n * Combine your NodeProps (which include dictionaryKey & keyPath)\n * with any other div-like attributes.\n */\nexport interface EditorSelectorRendererProps extends NodeProps {\n  [key: string]: any;\n}\n\n@Component({\n  selector: 'app-editor-selector-renderer',\n  standalone: true,\n  imports: [\n    CommonModule,\n    ContentSelectorWrapperComponent,\n    EditedContentRendererComponent,\n  ],\n  template: `\n    <app-content-selector-wrapper\n      [dictionaryKey]=\"dictionaryKey\"\n      [keyPath]=\"keyPath\"\n    >\n      <app-edited-content-renderer\n        [dictionaryKey]=\"dictionaryKey\"\n        [keyPath]=\"keyPath\"\n      >\n        <ng-content></ng-content>\n      </app-edited-content-renderer>\n    </app-content-selector-wrapper>\n  `,\n})\nexport class EditorSelectorRendererComponent {\n  @Input() dictionaryKey!: string;\n  @Input() keyPath!: any[];\n}\n"],"mappings":";;;;;;;;AAoCO,4CAAM,gCAAgC;CAC3C,AAAS;CACT,AAAS;;YADR,OAAO;YACP,OAAO;8CAxBT,UAAU;CACT,UAAU;CACV,YAAY;CACZ,SAAS;EACP;EACA;EACA;EACD;CACD,UAAU;;;;;;;;;;;;;CAaX,CAAC"}

package/dist/esm/editor/useEditedContentRenderer.mjs

@@ -1,8 +1,9 @@
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.110.0/helpers/decorate.mjs";
 import { Injectable, InjectionToken, computed, inject } from "@angular/core";
 
 //#region src/editor/useEditedContentRenderer.ts
 const EDITED_CONTENT_ACTIONS_TOKEN = new InjectionToken("editedContentActions");
-var EditedContentRendererService = @Injectable({ providedIn: "root" }) class {
+let EditedContentRendererService = class EditedContentRendererService {
 	/**
 	* Mirrors the React hook one-for-one.
 	*/
@@ -13,6 +14,7 @@ var EditedContentRendererService = @Injectable({ providedIn: "root" }) class {
 		});
 	}
 };
+EditedContentRendererService = __decorate([Injectable({ providedIn: "root" })], EditedContentRendererService);
 /**
 * Standalone function that can be used like the Vue composable
 */

package/dist/esm/editor/useEditedContentRenderer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useEditedContentRenderer.mjs","names":[],"sources":["../../../src/editor/useEditedContentRenderer.ts"],"sourcesContent":["import {\n  computed,\n  Injectable,\n  InjectionToken,\n  inject,\n  type Signal,\n} from '@angular/core';\nimport type { KeyPath } from '@intlayer/types';\n\nexport interface EditedContentActions {\n  getEditedContentValue(dictionaryKey: string, keyPath: KeyPath[]): unknown;\n}\n\nexport const EDITED_CONTENT_ACTIONS_TOKEN =\n  new InjectionToken<EditedContentActions | null>('editedContentActions');\n\n@Injectable({\n  providedIn: 'root',\n})\nexport class EditedContentRendererService {\n  /**\n   * Mirrors the React hook one-for-one.\n   */\n  useEditedContentRenderer(\n    dictionaryKey: string,\n    keyPath: KeyPath[],\n    fallback: unknown\n  ): Signal<unknown> {\n    const editedContentContext = inject(EDITED_CONTENT_ACTIONS_TOKEN, {\n      optional: true,\n    });\n\n    return computed(() => {\n      const edited = editedContentContext?.getEditedContentValue(\n        dictionaryKey,\n        keyPath\n      ) as string | undefined;\n\n      return edited ?? fallback;\n    });\n  }\n}\n\n/**\n * Standalone function that can be used like the Vue composable\n */\nexport const useEditedContentRenderer = (\n  dictionaryKey: string,\n  keyPath: KeyPath[],\n  fallback: unknown\n): Signal<unknown> => {\n  const service = inject(EditedContentRendererService);\n  return service.useEditedContentRenderer(dictionaryKey, keyPath, fallback);\n};\n"],"mappings":";;;AAaA,MAAa,+BACX,IAAI,eAA4C,uBAAuB;AAKzE,IAAa,+BAHb,CAAC,WAAW,EACV,YAAY,QACb,CAAC,CACF,MAA0C;;;;CAIxC,yBACE,eACA,SACA,UACiB;EACjB,MAAM,uBAAuB,OAAO,8BAA8B,EAChE,UAAU,MACX,CAAC;AAEF,SAAO,eAAe;AAMpB,UALe,sBAAsB,sBACnC,eACA,QACD,IAEgB;IACjB;;;;;;AAON,MAAa,4BACX,eACA,SACA,aACoB;AAEpB,QADgB,OAAO,6BAA6B,CACrC,yBAAyB,eAAe,SAAS,SAAS"}
+{"version":3,"file":"useEditedContentRenderer.mjs","names":[],"sources":["../../../src/editor/useEditedContentRenderer.ts"],"sourcesContent":["import {\n  computed,\n  Injectable,\n  InjectionToken,\n  inject,\n  type Signal,\n} from '@angular/core';\nimport type { KeyPath } from '@intlayer/types';\n\nexport interface EditedContentActions {\n  getEditedContentValue(dictionaryKey: string, keyPath: KeyPath[]): unknown;\n}\n\nexport const EDITED_CONTENT_ACTIONS_TOKEN =\n  new InjectionToken<EditedContentActions | null>('editedContentActions');\n\n@Injectable({\n  providedIn: 'root',\n})\nexport class EditedContentRendererService {\n  /**\n   * Mirrors the React hook one-for-one.\n   */\n  useEditedContentRenderer(\n    dictionaryKey: string,\n    keyPath: KeyPath[],\n    fallback: unknown\n  ): Signal<unknown> {\n    const editedContentContext = inject(EDITED_CONTENT_ACTIONS_TOKEN, {\n      optional: true,\n    });\n\n    return computed(() => {\n      const edited = editedContentContext?.getEditedContentValue(\n        dictionaryKey,\n        keyPath\n      ) as string | undefined;\n\n      return edited ?? fallback;\n    });\n  }\n}\n\n/**\n * Standalone function that can be used like the Vue composable\n */\nexport const useEditedContentRenderer = (\n  dictionaryKey: string,\n  keyPath: KeyPath[],\n  fallback: unknown\n): Signal<unknown> => {\n  const service = inject(EditedContentRendererService);\n  return service.useEditedContentRenderer(dictionaryKey, keyPath, fallback);\n};\n"],"mappings":";;;;AAaA,MAAa,+BACX,IAAI,eAA4C,uBAAuB;AAKlE,yCAAM,6BAA6B;;;;CAIxC,yBACE,eACA,SACA,UACiB;EACjB,MAAM,uBAAuB,OAAO,8BAA8B,EAChE,UAAU,MACX,CAAC;AAEF,SAAO,eAAe;AAMpB,UALe,sBAAsB,sBACnC,eACA,QACD,IAEgB;IACjB;;;2CAvBL,WAAW,EACV,YAAY,QACb,CAAC;;;;AA4BF,MAAa,4BACX,eACA,SACA,aACoB;AAEpB,QADgB,OAAO,6BAA6B,CACrC,yBAAyB,eAAe,SAAS,SAAS"}

package/dist/esm/getDictionary.mjs

@@ -1,4 +1,4 @@
-import { intlayerNodePlugins, markdownPlugin } from "./plugins.mjs";
+import { htmlPlugin, intlayerNodePlugins, markdownPlugin } from "./plugins.mjs";
 import { getDictionary as getDictionary$1 } from "@intlayer/core";
 
 //#region src/getDictionary.ts
@@ -6,6 +6,7 @@ const getDictionary = (dictionary, locale, additionalPlugins) => {
 	return getDictionary$1(dictionary, locale, [
 		intlayerNodePlugins,
 		markdownPlugin,
+		htmlPlugin,
 		...additionalPlugins ?? []
 	]);
 };

package/dist/esm/getDictionary.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"getDictionary.mjs","names":["getDictionaryCore"],"sources":["../../src/getDictionary.ts"],"sourcesContent":["import {\n  getDictionary as getDictionaryCore,\n  type Plugins,\n} from '@intlayer/core';\nimport type {\n  DeclaredLocales,\n  Dictionary,\n  LocalesValues,\n} from '@intlayer/types';\nimport { intlayerNodePlugins, markdownPlugin } from './plugins';\n\nexport const getDictionary = <\n  T extends Dictionary,\n  L extends LocalesValues = DeclaredLocales,\n>(\n  dictionary: T,\n  locale?: L,\n  additionalPlugins?: Plugins[]\n) => {\n  const plugins: Plugins[] = [\n    intlayerNodePlugins,\n    markdownPlugin,\n    ...(additionalPlugins ?? []),\n  ];\n\n  return getDictionaryCore<T, L>(dictionary, locale, plugins);\n};\n"],"mappings":";;;;AAWA,MAAa,iBAIX,YACA,QACA,sBACG;AAOH,QAAOA,gBAAwB,YAAY,QANhB;EACzB;EACA;EACA,GAAI,qBAAqB,EAAE;EAC5B,CAE0D"}
+{"version":3,"file":"getDictionary.mjs","names":["getDictionaryCore"],"sources":["../../src/getDictionary.ts"],"sourcesContent":["import {\n  getDictionary as getDictionaryCore,\n  type Plugins,\n} from '@intlayer/core';\nimport type {\n  DeclaredLocales,\n  Dictionary,\n  LocalesValues,\n} from '@intlayer/types';\nimport { htmlPlugin, intlayerNodePlugins, markdownPlugin } from './plugins';\n\nexport const getDictionary = <\n  T extends Dictionary,\n  L extends LocalesValues = DeclaredLocales,\n>(\n  dictionary: T,\n  locale?: L,\n  additionalPlugins?: Plugins[]\n) => {\n  const plugins: Plugins[] = [\n    intlayerNodePlugins,\n    markdownPlugin,\n    htmlPlugin,\n    ...(additionalPlugins ?? []),\n  ];\n\n  return getDictionaryCore<T, L>(dictionary, locale, plugins);\n};\n"],"mappings":";;;;AAWA,MAAa,iBAIX,YACA,QACA,sBACG;AAQH,QAAOA,gBAAwB,YAAY,QAPhB;EACzB;EACA;EACA;EACA,GAAI,qBAAqB,EAAE;EAC5B,CAE0D"}

package/dist/esm/getIntlayer.mjs

@@ -1,4 +1,4 @@
-import { intlayerNodePlugins, markdownPlugin } from "./plugins.mjs";
+import { htmlPlugin, insertionPlugin, intlayerNodePlugins, markdownPlugin } from "./plugins.mjs";
 import { getIntlayer as getIntlayer$1 } from "@intlayer/core";
 
 //#region src/getIntlayer.ts
@@ -6,6 +6,8 @@ const getIntlayer = (key, locale, additionalPlugins) => {
 	return getIntlayer$1(key, locale, [
 		intlayerNodePlugins,
 		markdownPlugin,
+		htmlPlugin,
+		insertionPlugin,
 		...additionalPlugins ?? []
 	]);
 };

package/dist/esm/getIntlayer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"getIntlayer.mjs","names":["getIntlayerCore"],"sources":["../../src/getIntlayer.ts"],"sourcesContent":["import { getIntlayer as getIntlayerCore, type Plugins } from '@intlayer/core';\nimport type {\n  DeclaredLocales,\n  DictionaryKeys,\n  DictionaryRegistryContent,\n  LocalesValues,\n} from '@intlayer/types';\nimport {\n  type DeepTransformContent,\n  intlayerNodePlugins,\n  markdownPlugin,\n} from './plugins';\n\nexport const getIntlayer = <\n  T extends DictionaryKeys,\n  L extends LocalesValues = DeclaredLocales,\n>(\n  key: T,\n  locale?: L,\n  additionalPlugins?: Plugins[]\n) => {\n  const plugins: Plugins[] = [\n    intlayerNodePlugins,\n    markdownPlugin,\n    ...(additionalPlugins ?? []),\n  ];\n\n  // @ts-ignore Type instantiation is excessively deep and possibly infinite\n  return getIntlayerCore<T, L>(key, locale, plugins) as DeepTransformContent<\n    DictionaryRegistryContent<T>\n  >;\n};\n"],"mappings":";;;;AAaA,MAAa,eAIX,KACA,QACA,sBACG;AAQH,QAAOA,cAAsB,KAAK,QAPP;EACzB;EACA;EACA,GAAI,qBAAqB,EAAE;EAC5B,CAGiD"}
+{"version":3,"file":"getIntlayer.mjs","names":["getIntlayerCore"],"sources":["../../src/getIntlayer.ts"],"sourcesContent":["import { getIntlayer as getIntlayerCore, type Plugins } from '@intlayer/core';\nimport type {\n  DeclaredLocales,\n  DictionaryKeys,\n  DictionaryRegistryContent,\n  LocalesValues,\n} from '@intlayer/types';\nimport {\n  type DeepTransformContent,\n  htmlPlugin,\n  insertionPlugin,\n  intlayerNodePlugins,\n  markdownPlugin,\n} from './plugins';\n\nexport const getIntlayer = <\n  T extends DictionaryKeys,\n  L extends LocalesValues = DeclaredLocales,\n>(\n  key: T,\n  locale?: L,\n  additionalPlugins?: Plugins[]\n) => {\n  const plugins: Plugins[] = [\n    intlayerNodePlugins,\n    markdownPlugin,\n    htmlPlugin,\n    insertionPlugin,\n    ...(additionalPlugins ?? []),\n  ];\n\n  // @ts-ignore Type instantiation is excessively deep and possibly infinite\n  return getIntlayerCore<T, L>(key, locale, plugins) as DeepTransformContent<\n    DictionaryRegistryContent<T>\n  >;\n};\n"],"mappings":";;;;AAeA,MAAa,eAIX,KACA,QACA,sBACG;AAUH,QAAOA,cAAsB,KAAK,QATP;EACzB;EACA;EACA;EACA;EACA,GAAI,qBAAqB,EAAE;EAC5B,CAGiD"}

package/dist/esm/index.mjs

@@ -7,8 +7,8 @@ import { useIntl } from "./client/useIntl.mjs";
 import { getIntlayer } from "./getIntlayer.mjs";
 import { isUpdatableNode, useIntlayer } from "./client/useIntlayer.mjs";
 import { useLocale } from "./client/useLocale.mjs";
-import { INTLAYER_MARKDOWN_TOKEN, IntlayerMarkdownService, createIntlayerMarkdownProvider, useMarkdown } from "./markdown/installIntlayerMarkdown.mjs";
-import { intlayerNodePlugins, markdownPlugin, markdownStringPlugin } from "./plugins.mjs";
+import { INTLAYER_MARKDOWN_TOKEN, IntlayerMarkdownService, createIntlayerMarkdownProvider, htmlRuntime, useMarkdown } from "./markdown/installIntlayerMarkdown.mjs";
+import { htmlPlugin, insertionPlugin, intlayerNodePlugins, markdownPlugin, markdownStringPlugin } from "./plugins.mjs";
 import { getDictionary } from "./getDictionary.mjs";
 
-export { INTLAYER_MARKDOWN_TOKEN, INTLAYER_TOKEN, IntlayerMarkdownService, IntlayerProvider, createIntlayerClient, createIntlayerMarkdownProvider, getDictionary, getIntlayer, installIntlayer, intlayerNodePlugins, isUpdatableNode, markdownPlugin, markdownStringPlugin, provideIntlayer, useDictionary, useDictionaryAsync, useDictionaryDynamic, useIntl, useIntlayer, useLoadDynamic, useLocale, useMarkdown };
+export { INTLAYER_MARKDOWN_TOKEN, INTLAYER_TOKEN, IntlayerMarkdownService, IntlayerProvider, createIntlayerClient, createIntlayerMarkdownProvider, getDictionary, getIntlayer, htmlPlugin, htmlRuntime, insertionPlugin, installIntlayer, intlayerNodePlugins, isUpdatableNode, markdownPlugin, markdownStringPlugin, provideIntlayer, useDictionary, useDictionaryAsync, useDictionaryDynamic, useIntl, useIntlayer, useLoadDynamic, useLocale, useMarkdown };

package/dist/esm/markdown/index.mjs

@@ -1,3 +1,3 @@
-import { INTLAYER_MARKDOWN_TOKEN, IntlayerMarkdownService, createIntlayerMarkdownProvider, useMarkdown } from "./installIntlayerMarkdown.mjs";
+import { INTLAYER_MARKDOWN_TOKEN, IntlayerMarkdownService, createIntlayerMarkdownProvider, htmlRuntime, useMarkdown } from "./installIntlayerMarkdown.mjs";
 
-export { INTLAYER_MARKDOWN_TOKEN, IntlayerMarkdownService, createIntlayerMarkdownProvider, useMarkdown };
+export { INTLAYER_MARKDOWN_TOKEN, IntlayerMarkdownService, createIntlayerMarkdownProvider, htmlRuntime, useMarkdown };

package/dist/esm/markdown/installIntlayerMarkdown.mjs

@@ -1,11 +1,45 @@
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.110.0/helpers/decorate.mjs";
+import { compile } from "@intlayer/core";
 import { Injectable, InjectionToken, inject } from "@angular/core";
 
 //#region src/markdown/installIntlayerMarkdown.ts
 const INTLAYER_MARKDOWN_TOKEN = new InjectionToken("intlayerMarkdown");
+const htmlRuntime = {
+	createElement: (tag, props, ...children) => {
+		if (typeof tag !== "string") {
+			if (tag === htmlRuntime.Fragment) return children.join("");
+			return "";
+		}
+		const attrs = props ? Object.entries(props).map(([k, v]) => {
+			if (k === "key" || v === void 0 || v === null) return "";
+			return `${k === "className" ? "class" : k}="${String(v).replace(/"/g, """)}"`;
+		}).filter(Boolean).join(" ") : "";
+		const childrenStr = children.join("");
+		if ([
+			"area",
+			"base",
+			"br",
+			"col",
+			"embed",
+			"hr",
+			"img",
+			"input",
+			"link",
+			"meta",
+			"param",
+			"source",
+			"track",
+			"wbr"
+		].includes(tag)) return `<${tag} ${attrs} />`;
+		return `<${tag}${attrs ? ` ${attrs}` : ""}>${childrenStr}</${tag}>`;
+	},
+	cloneElement: (element, _props) => element,
+	Fragment: Symbol("Fragment")
+};
 /**
-* Default markdown renderer that returns the markdown as is
+* Default markdown renderer that converts markdown to HTML string
 */
-const defaultMarkdownRenderer = (markdown) => markdown;
+const defaultMarkdownRenderer = (markdown) => compile(markdown, { runtime: htmlRuntime });
 /**
 * Create IntlayerMarkdown provider configuration
 */
@@ -13,13 +47,14 @@ const createIntlayerMarkdownProvider = (renderMarkdown = defaultMarkdownRenderer
 	provide: INTLAYER_MARKDOWN_TOKEN,
 	useValue: { renderMarkdown }
 });
-var IntlayerMarkdownService = @Injectable({ providedIn: "root" }) class {
+let IntlayerMarkdownService = class IntlayerMarkdownService {
 	markdownProvider = inject(INTLAYER_MARKDOWN_TOKEN, { optional: true });
 	renderMarkdown(markdown, overrides) {
 		if (!this.markdownProvider) return markdown;
 		return this.markdownProvider.renderMarkdown(markdown, overrides);
 	}
 };
+IntlayerMarkdownService = __decorate([Injectable({ providedIn: "root" })], IntlayerMarkdownService);
 /**
 * Function to inject markdown provider
 */
@@ -30,5 +65,5 @@ const useMarkdown = () => {
 };
 
 //#endregion
-export { INTLAYER_MARKDOWN_TOKEN, IntlayerMarkdownService, createIntlayerMarkdownProvider, useMarkdown };
+export { INTLAYER_MARKDOWN_TOKEN, IntlayerMarkdownService, createIntlayerMarkdownProvider, htmlRuntime, useMarkdown };
 //# sourceMappingURL=installIntlayerMarkdown.mjs.map

package/dist/esm/markdown/installIntlayerMarkdown.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"installIntlayerMarkdown.mjs","names":[],"sources":["../../../src/markdown/installIntlayerMarkdown.ts"],"sourcesContent":["import {\n  Injectable,\n  InjectionToken,\n  inject,\n  type TemplateRef,\n} from '@angular/core';\n\nexport const INTLAYER_MARKDOWN_TOKEN =\n  new InjectionToken<IntlayerMarkdownProvider>('intlayerMarkdown');\n\ntype RenderMarkdownOptions = {\n  components?: any;\n  wrapper?: any;\n  options?: any;\n};\n\ntype RenderMarkdownFunction = (\n  markdown: string,\n  overrides?: any | RenderMarkdownOptions\n) => string | TemplateRef<any>;\n\nexport type IntlayerMarkdownProvider = {\n  renderMarkdown: RenderMarkdownFunction;\n};\n\n/**\n * Default markdown renderer that returns the markdown as is\n */\nconst defaultMarkdownRenderer: RenderMarkdownFunction = (markdown: string) =>\n  markdown;\n\n/**\n * Create IntlayerMarkdown provider configuration\n */\nexport const createIntlayerMarkdownProvider = (\n  renderMarkdown: RenderMarkdownFunction = defaultMarkdownRenderer\n) => ({\n  provide: INTLAYER_MARKDOWN_TOKEN,\n  useValue: {\n    renderMarkdown,\n  } as IntlayerMarkdownProvider,\n});\n\n/**\n * Injectable service for markdown rendering\n */\n@Injectable({\n  providedIn: 'root',\n})\nexport class IntlayerMarkdownService {\n  private markdownProvider = inject(INTLAYER_MARKDOWN_TOKEN, {\n    optional: true,\n  });\n\n  renderMarkdown(markdown: string, overrides?: any): string | TemplateRef<any> {\n    if (!this.markdownProvider) {\n      return markdown; // Fallback to returning markdown as is\n    }\n    return this.markdownProvider.renderMarkdown(markdown, overrides);\n  }\n}\n\n/**\n * Function to inject markdown provider\n */\nexport const useMarkdown = (): IntlayerMarkdownProvider => {\n  const markdownProvider = inject(INTLAYER_MARKDOWN_TOKEN, { optional: true });\n\n  if (!markdownProvider) {\n    return {\n      renderMarkdown: defaultMarkdownRenderer,\n    };\n  }\n\n  return markdownProvider;\n};\n"],"mappings":";;;AAOA,MAAa,0BACX,IAAI,eAAyC,mBAAmB;;;;AAoBlE,MAAM,2BAAmD,aACvD;;;;AAKF,MAAa,kCACX,iBAAyC,6BACrC;CACJ,SAAS;CACT,UAAU,EACR,gBACD;CACF;AAQD,IAAa,0BAHb,CAAC,WAAW,EACV,YAAY,QACb,CAAC,CACF,MAAqC;CACnC,AAAQ,mBAAmB,OAAO,yBAAyB,EACzD,UAAU,MACX,CAAC;CAEF,eAAe,UAAkB,WAA4C;AAC3E,MAAI,CAAC,KAAK,iBACR,QAAO;AAET,SAAO,KAAK,iBAAiB,eAAe,UAAU,UAAU;;;;;;AAOpE,MAAa,oBAA8C;CACzD,MAAM,mBAAmB,OAAO,yBAAyB,EAAE,UAAU,MAAM,CAAC;AAE5E,KAAI,CAAC,iBACH,QAAO,EACL,gBAAgB,yBACjB;AAGH,QAAO"}
+{"version":3,"file":"installIntlayerMarkdown.mjs","names":[],"sources":["../../../src/markdown/installIntlayerMarkdown.ts"],"sourcesContent":["import {\n  Injectable,\n  InjectionToken,\n  inject,\n  type TemplateRef,\n} from '@angular/core';\nimport { compile, type MarkdownRuntime } from '@intlayer/core';\n\nexport const INTLAYER_MARKDOWN_TOKEN =\n  new InjectionToken<IntlayerMarkdownProvider>('intlayerMarkdown');\n\ntype RenderMarkdownOptions = {\n  components?: any;\n  wrapper?: any;\n  options?: any;\n};\n\ntype RenderMarkdownFunction = (\n  markdown: string,\n  overrides?: any | RenderMarkdownOptions\n) => string | TemplateRef<any>;\n\nexport type IntlayerMarkdownProvider = {\n  renderMarkdown: RenderMarkdownFunction;\n};\n\n// Minimal runtime to generate HTML strings\nexport const htmlRuntime: MarkdownRuntime = {\n  createElement: (tag: string | any, props: any, ...children: any[]) => {\n    if (typeof tag !== 'string') {\n      // Handle non-string tags if necessary (e.g. components), or fallback to div\n      if (tag === htmlRuntime.Fragment) {\n        return children.join('');\n      }\n      return '';\n    }\n\n    const attrs = props\n      ? Object.entries(props)\n          .map(([k, v]) => {\n            if (k === 'key' || v === undefined || v === null) return '';\n            const key = k === 'className' ? 'class' : k;\n            return `${key}=\"${String(v).replace(/\"/g, '&quot;')}\"`;\n          })\n          .filter(Boolean)\n          .join(' ')\n      : '';\n\n    const childrenStr = children.join('');\n    const voidTags = [\n      'area',\n      'base',\n      'br',\n      'col',\n      'embed',\n      'hr',\n      'img',\n      'input',\n      'link',\n      'meta',\n      'param',\n      'source',\n      'track',\n      'wbr',\n    ];\n\n    if (voidTags.includes(tag)) {\n      return `<${tag} ${attrs} />`;\n    }\n\n    return `<${tag}${attrs ? ` ${attrs}` : ''}>${childrenStr}</${tag}>`;\n  },\n  cloneElement: (element: any, _props: any) => element, // Not really supported for strings\n  Fragment: Symbol('Fragment'),\n};\n\n/**\n * Default markdown renderer that converts markdown to HTML string\n */\nconst defaultMarkdownRenderer: RenderMarkdownFunction = (markdown: string) =>\n  compile(markdown, { runtime: htmlRuntime }) as string;\n\n/**\n * Create IntlayerMarkdown provider configuration\n */\nexport const createIntlayerMarkdownProvider = (\n  renderMarkdown: RenderMarkdownFunction = defaultMarkdownRenderer\n) => ({\n  provide: INTLAYER_MARKDOWN_TOKEN,\n  useValue: {\n    renderMarkdown,\n  } as IntlayerMarkdownProvider,\n});\n\n/**\n * Injectable service for markdown rendering\n */\n@Injectable({\n  providedIn: 'root',\n})\nexport class IntlayerMarkdownService {\n  private markdownProvider = inject(INTLAYER_MARKDOWN_TOKEN, {\n    optional: true,\n  });\n\n  renderMarkdown(markdown: string, overrides?: any): string | TemplateRef<any> {\n    if (!this.markdownProvider) {\n      return markdown; // Fallback to returning markdown as is\n    }\n    return this.markdownProvider.renderMarkdown(markdown, overrides);\n  }\n}\n\n/**\n * Function to inject markdown provider\n */\nexport const useMarkdown = (): IntlayerMarkdownProvider => {\n  const markdownProvider = inject(INTLAYER_MARKDOWN_TOKEN, { optional: true });\n\n  if (!markdownProvider) {\n    return {\n      renderMarkdown: defaultMarkdownRenderer,\n    };\n  }\n\n  return markdownProvider;\n};\n"],"mappings":";;;;;AAQA,MAAa,0BACX,IAAI,eAAyC,mBAAmB;AAkBlE,MAAa,cAA+B;CAC1C,gBAAgB,KAAmB,OAAY,GAAG,aAAoB;AACpE,MAAI,OAAO,QAAQ,UAAU;AAE3B,OAAI,QAAQ,YAAY,SACtB,QAAO,SAAS,KAAK,GAAG;AAE1B,UAAO;;EAGT,MAAM,QAAQ,QACV,OAAO,QAAQ,MAAM,CAClB,KAAK,CAAC,GAAG,OAAO;AACf,OAAI,MAAM,SAAS,MAAM,UAAa,MAAM,KAAM,QAAO;AAEzD,UAAO,GADK,MAAM,cAAc,UAAU,EAC5B,IAAI,OAAO,EAAE,CAAC,QAAQ,MAAM,SAAS,CAAC;IACpD,CACD,OAAO,QAAQ,CACf,KAAK,IAAI,GACZ;EAEJ,MAAM,cAAc,SAAS,KAAK,GAAG;AAkBrC,MAjBiB;GACf;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CAEY,SAAS,IAAI,CACxB,QAAO,IAAI,IAAI,GAAG,MAAM;AAG1B,SAAO,IAAI,MAAM,QAAQ,IAAI,UAAU,GAAG,GAAG,YAAY,IAAI,IAAI;;CAEnE,eAAe,SAAc,WAAgB;CAC7C,UAAU,OAAO,WAAW;CAC7B;;;;AAKD,MAAM,2BAAmD,aACvD,QAAQ,UAAU,EAAE,SAAS,aAAa,CAAC;;;;AAK7C,MAAa,kCACX,iBAAyC,6BACrC;CACJ,SAAS;CACT,UAAU,EACR,gBACD;CACF;AAQM,oCAAM,wBAAwB;CACnC,AAAQ,mBAAmB,OAAO,yBAAyB,EACzD,UAAU,MACX,CAAC;CAEF,eAAe,UAAkB,WAA4C;AAC3E,MAAI,CAAC,KAAK,iBACR,QAAO;AAET,SAAO,KAAK,iBAAiB,eAAe,UAAU,UAAU;;;sCAZnE,WAAW,EACV,YAAY,QACb,CAAC;;;;AAiBF,MAAa,oBAA8C;CACzD,MAAM,mBAAmB,OAAO,yBAAyB,EAAE,UAAU,MAAM,CAAC;AAE5E,KAAI,CAAC,iBACH,QAAO,EACL,gBAAgB,yBACjB;AAGH,QAAO"}

package/dist/esm/plugins.mjs

@@ -1,10 +1,33 @@
 import { ContentSelectorWrapperComponent } from "./editor/ContentSelectorWrapper.component.mjs";
-import { useMarkdown } from "./markdown/installIntlayerMarkdown.mjs";
+import { htmlRuntime, useMarkdown } from "./markdown/installIntlayerMarkdown.mjs";
 import { renderIntlayerNode } from "./renderIntlayerNode.mjs";
-import { getMarkdownMetadata } from "@intlayer/core";
+import { compile, getMarkdownMetadata } from "@intlayer/core";
 import { NodeType } from "@intlayer/types";
 
 //#region src/plugins.ts
+/** ---------------------------------------------
+*  UTILS
+*  --------------------------------------------- */
+const createRuntimeWithOverides = (baseRuntime, overrides) => ({
+	...baseRuntime,
+	createElement: (tag, props, ...children) => {
+		const override = overrides?.[tag];
+		if (override) {
+			const newProps = {
+				...props,
+				...override
+			};
+			const originalClass = props?.class || props?.className;
+			const overrideClass = override.class || override.className;
+			if (originalClass && overrideClass) {
+				newProps.class = `${originalClass} ${overrideClass}`;
+				newProps.className = void 0;
+			}
+			return baseRuntime.createElement(tag, newProps, ...children);
+		}
+		return baseRuntime.createElement(tag, props, ...children);
+	}
+});
 /** Translation plugin. Replaces node with a locale string if nodeType = Translation. */
 const intlayerNodePlugins = {
 	id: "intlayer-node-plugin",
@@ -58,13 +81,25 @@ const markdownStringPlugin = {
 			}),
 			additionalProps: { metadata: metadataNodes }
 		});
-		const element = render();
-		return new Proxy(element, { get(target, prop, receiver) {
+		const createProxy = (element, components) => new Proxy(element, { get(target, prop, receiver) {
 			if (prop === "value") return node;
 			if (prop === "metadata") return metadataNodes;
-			if (prop === "use") return (components) => render(components);
+			if (prop === "toString") return () => {
+				return compile(node, { runtime: components ? createRuntimeWithOverides(htmlRuntime, components) : htmlRuntime });
+			};
+			if (prop === Symbol.toPrimitive) return () => {
+				return compile(node, { runtime: components ? createRuntimeWithOverides(htmlRuntime, components) : htmlRuntime });
+			};
+			if (prop === "use") return (newComponents) => {
+				const mergedComponents = {
+					...components,
+					...newComponents
+				};
+				return createProxy(render(mergedComponents), mergedComponents);
+			};
 			return Reflect.get(target, prop, receiver);
 		} });
+		return createProxy(render());
 	}
 };
 const markdownPlugin = {
@@ -81,7 +116,68 @@ const markdownPlugin = {
 		});
 	}
 };
+/** HTML plugin. Replaces node with a function that takes components => IntlayerNode. */
+const htmlPlugin = {
+	id: "html-plugin",
+	canHandle: (node) => typeof node === "object" && node?.nodeType === NodeType.HTML,
+	transform: (node, props) => {
+		const html = node[NodeType.HTML];
+		const { plugins, ...rest } = props;
+		const render = (userComponents) => renderIntlayerNode({
+			...rest,
+			value: html,
+			children: () => ({
+				component: ContentSelectorWrapperComponent,
+				props: {
+					dictionaryKey: rest.dictionaryKey,
+					keyPath: rest.keyPath,
+					...userComponents
+				},
+				children: html
+			})
+		});
+		const createProxy = (element, components) => new Proxy(element, { get(target, prop, receiver) {
+			if (prop === "value") return html;
+			if (prop === "toString") return () => {
+				if (!components || typeof components === "object" && Object.keys(components).length === 0) return String(html);
+				return compile(html, { runtime: createRuntimeWithOverides(htmlRuntime, components) });
+			};
+			if (prop === Symbol.toPrimitive) return () => {
+				if (!components || typeof components === "object" && Object.keys(components).length === 0) return String(html);
+				return compile(html, { runtime: createRuntimeWithOverides(htmlRuntime, components) });
+			};
+			if (prop === "use") return (userComponents) => {
+				const mergedComponents = {
+					...components,
+					...userComponents
+				};
+				return createProxy(render(mergedComponents), mergedComponents);
+			};
+			return Reflect.get(target, prop, receiver);
+		} });
+		return createProxy(render());
+	}
+};
+const insertionPlugin = {
+	id: "insertion-plugin",
+	canHandle: (node) => typeof node === "object" && node?.nodeType === NodeType.Insertion,
+	transform: (node, props) => {
+		const { plugins, ...rest } = props;
+		const render = (args = {}) => {
+			let text = node.insertion;
+			if (args) Object.entries(args).forEach(([key, value]) => {
+				text = text.replace(new RegExp(`{{\\s*${key}\\s*}}`, "g"), String(value));
+			});
+			return text;
+		};
+		return renderIntlayerNode({
+			...rest,
+			value: render,
+			children: render
+		});
+	}
+};
 
 //#endregion
-export { intlayerNodePlugins, markdownPlugin, markdownStringPlugin };
+export { htmlPlugin, insertionPlugin, intlayerNodePlugins, markdownPlugin, markdownStringPlugin };
 //# sourceMappingURL=plugins.mjs.map

package/dist/esm/plugins.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"plugins.mjs","names":[],"sources":["../../src/plugins.ts"],"sourcesContent":["import {\n  type DeepTransformContent as DeepTransformContentCore,\n  getMarkdownMetadata,\n  type HTMLCond,\n  type IInterpreterPluginState as IInterpreterPluginStateCore,\n  type MarkdownContent,\n  type Plugins,\n} from '@intlayer/core';\nimport {\n  type DeclaredLocales,\n  type KeyPath,\n  type LocalesValues,\n  NodeType,\n} from '@intlayer/types';\nimport { ContentSelectorWrapperComponent } from './editor';\nimport { useMarkdown } from './markdown/installIntlayerMarkdown';\nimport { renderIntlayerNode } from './renderIntlayerNode';\n\n/** ---------------------------------------------\n *  INTLAYER NODE PLUGIN\n *  --------------------------------------------- */\n\nexport type IntlayerNodeCond<T> = T extends number | string\n  ? IntlayerNode<T>\n  : never;\n\nexport interface IntlayerNode<T, P = {}> {\n  value: T;\n  children?: any;\n  additionalProps?: P;\n}\n\n/** Translation plugin. Replaces node with a locale string if nodeType = Translation. */\nexport const intlayerNodePlugins: Plugins = {\n  id: 'intlayer-node-plugin',\n  canHandle: (node) =>\n    typeof node === 'bigint' ||\n    typeof node === 'string' ||\n    typeof node === 'number',\n  transform: (_node, { children, ...rest }) =>\n    renderIntlayerNode({\n      ...rest,\n      value: children,\n      children: () => ({\n        component: ContentSelectorWrapperComponent,\n        props: {\n          dictionaryKey: rest.dictionaryKey,\n          keyPath: rest.keyPath,\n        },\n        children: children,\n      }),\n    }),\n};\n\n/**\n * MARKDOWN PLUGIN\n */\n\nexport type MarkdownStringCond<T> = T extends string\n  ? IntlayerNode<string, { metadata: DeepTransformContent<string> }>\n  : never;\n\n/** Markdown string plugin. Replaces string node with a component that render the markdown. */\nexport const markdownStringPlugin: Plugins = {\n  id: 'markdown-string-plugin',\n  canHandle: (node) => typeof node === 'string',\n  transform: (node: string, props, deepTransformNode) => {\n    const {\n      plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n      ...rest\n    } = props;\n\n    const metadata = getMarkdownMetadata(node);\n\n    const metadataPlugins: Plugins = {\n      id: 'markdown-metadata-plugin',\n      canHandle: (metadataNode) =>\n        typeof metadataNode === 'string' ||\n        typeof metadataNode === 'number' ||\n        typeof metadataNode === 'boolean' ||\n        !metadataNode,\n      transform: (metadataNode, props) =>\n        renderIntlayerNode({\n          ...props,\n          value: metadataNode,\n          children: node,\n        }),\n    };\n\n    // Transform metadata while keeping the same structure\n    const metadataNodes = deepTransformNode(metadata, {\n      plugins: [metadataPlugins],\n      dictionaryKey: rest.dictionaryKey,\n      keyPath: [],\n    });\n\n    const render = (components?: any) =>\n      renderIntlayerNode({\n        ...props,\n        value: node,\n        children: () => ({\n          component: ContentSelectorWrapperComponent,\n          props: {\n            dictionaryKey: rest.dictionaryKey,\n            keyPath: rest.keyPath,\n            ...components,\n          },\n          children: () => {\n            const { renderMarkdown } = useMarkdown();\n            return renderMarkdown(node, components);\n          },\n        }),\n        additionalProps: {\n          metadata: metadataNodes,\n        },\n      });\n\n    const element = render() as any;\n\n    return new Proxy(element, {\n      get(target, prop, receiver) {\n        if (prop === 'value') {\n          return node;\n        }\n        if (prop === 'metadata') {\n          return metadataNodes;\n        }\n\n        if (prop === 'use') {\n          return (components?: any) => render(components);\n        }\n\n        return Reflect.get(target, prop, receiver);\n      },\n    }) as any;\n  },\n};\n\nexport type MarkdownCond<T, S, L extends LocalesValues> = T extends {\n  nodeType: NodeType | string;\n  [NodeType.Markdown]: infer M;\n  metadata?: infer U;\n}\n  ? {\n      use: (components: any) => any;\n      metadata: DeepTransformContent<U>;\n    } & any\n  : never;\n\nexport const markdownPlugin: Plugins = {\n  id: 'markdown-plugin',\n  canHandle: (node) =>\n    typeof node === 'object' && node?.nodeType === NodeType.Markdown,\n  transform: (node: MarkdownContent, props, deepTransformNode) => {\n    const newKeyPath: KeyPath[] = [\n      ...props.keyPath,\n      {\n        type: NodeType.Markdown,\n      },\n    ];\n\n    const children = node[NodeType.Markdown];\n\n    return deepTransformNode(children, {\n      ...props,\n      children,\n      keyPath: newKeyPath,\n      plugins: [markdownStringPlugin, ...(props.plugins ?? [])],\n    });\n  },\n};\n\n/** ---------------------------------------------\n *  PLUGINS RESULT\n *  --------------------------------------------- */\n\nexport type HTMLPluginCond<T, S, L> = HTMLCond<T, S, L>;\n\nexport interface IInterpreterPluginAngular<T, S, L extends LocalesValues> {\n  angularIntlayerNode: IntlayerNodeCond<T>;\n  angularMarkdown: MarkdownCond<T, S, L>;\n  angularHtml: HTMLPluginCond<T, S, L>;\n}\n\n/**\n * Insert this type as param of `DeepTransformContent` to avoid `intlayer` package pollution.\n *\n * Otherwise the the `angular-intlayer` plugins will override the types of `intlayer` functions.\n */\nexport type IInterpreterPluginState = IInterpreterPluginStateCore & {\n  angularIntlayerNode: true;\n  angularMarkdown: true;\n  angularHtml: true;\n};\n\nexport type DeepTransformContent<\n  T,\n  L extends LocalesValues = DeclaredLocales,\n> = DeepTransformContentCore<T, IInterpreterPluginState, L>;\n"],"mappings":";;;;;;;;AAiCA,MAAa,sBAA+B;CAC1C,IAAI;CACJ,YAAY,SACV,OAAO,SAAS,YAChB,OAAO,SAAS,YAChB,OAAO,SAAS;CAClB,YAAY,OAAO,EAAE,UAAU,GAAG,WAChC,mBAAmB;EACjB,GAAG;EACH,OAAO;EACP,iBAAiB;GACf,WAAW;GACX,OAAO;IACL,eAAe,KAAK;IACpB,SAAS,KAAK;IACf;GACS;GACX;EACF,CAAC;CACL;;AAWD,MAAa,uBAAgC;CAC3C,IAAI;CACJ,YAAY,SAAS,OAAO,SAAS;CACrC,YAAY,MAAc,OAAO,sBAAsB;EACrD,MAAM,EACJ,SACA,GAAG,SACD;EAoBJ,MAAM,gBAAgB,kBAlBL,oBAAoB,KAAK,EAkBQ;GAChD,SAAS,CAjBsB;IAC/B,IAAI;IACJ,YAAY,iBACV,OAAO,iBAAiB,YACxB,OAAO,iBAAiB,YACxB,OAAO,iBAAiB,aACxB,CAAC;IACH,YAAY,cAAc,UACxB,mBAAmB;KACjB,GAAG;KACH,OAAO;KACP,UAAU;KACX,CAAC;IACL,CAI2B;GAC1B,eAAe,KAAK;GACpB,SAAS,EAAE;GACZ,CAAC;EAEF,MAAM,UAAU,eACd,mBAAmB;GACjB,GAAG;GACH,OAAO;GACP,iBAAiB;IACf,WAAW;IACX,OAAO;KACL,eAAe,KAAK;KACpB,SAAS,KAAK;KACd,GAAG;KACJ;IACD,gBAAgB;KACd,MAAM,EAAE,mBAAmB,aAAa;AACxC,YAAO,eAAe,MAAM,WAAW;;IAE1C;GACD,iBAAiB,EACf,UAAU,eACX;GACF,CAAC;EAEJ,MAAM,UAAU,QAAQ;AAExB,SAAO,IAAI,MAAM,SAAS,EACxB,IAAI,QAAQ,MAAM,UAAU;AAC1B,OAAI,SAAS,QACX,QAAO;AAET,OAAI,SAAS,WACX,QAAO;AAGT,OAAI,SAAS,MACX,SAAQ,eAAqB,OAAO,WAAW;AAGjD,UAAO,QAAQ,IAAI,QAAQ,MAAM,SAAS;KAE7C,CAAC;;CAEL;AAaD,MAAa,iBAA0B;CACrC,IAAI;CACJ,YAAY,SACV,OAAO,SAAS,YAAY,MAAM,aAAa,SAAS;CAC1D,YAAY,MAAuB,OAAO,sBAAsB;EAC9D,MAAM,aAAwB,CAC5B,GAAG,MAAM,SACT,EACE,MAAM,SAAS,UAChB,CACF;EAED,MAAM,WAAW,KAAK,SAAS;AAE/B,SAAO,kBAAkB,UAAU;GACjC,GAAG;GACH;GACA,SAAS;GACT,SAAS,CAAC,sBAAsB,GAAI,MAAM,WAAW,EAAE,CAAE;GAC1D,CAAC;;CAEL"}
+{"version":3,"file":"plugins.mjs","names":[],"sources":["../../src/plugins.ts"],"sourcesContent":["import {\n  compile,\n  type DeepTransformContent as DeepTransformContentCore,\n  getMarkdownMetadata,\n  type HTMLContent,\n  type IInterpreterPluginState as IInterpreterPluginStateCore,\n  type InsertionContent,\n  type MarkdownContent,\n  type Plugins,\n} from '@intlayer/core';\nimport {\n  type DeclaredLocales,\n  type KeyPath,\n  type LocalesValues,\n  NodeType,\n} from '@intlayer/types';\nimport { ContentSelectorWrapperComponent } from './editor';\nimport { htmlRuntime, useMarkdown } from './markdown/installIntlayerMarkdown';\nimport { renderIntlayerNode } from './renderIntlayerNode';\n\n/** ---------------------------------------------\n *  UTILS\n *  --------------------------------------------- */\n\nconst createRuntimeWithOverides = (baseRuntime: any, overrides: any) => ({\n  ...baseRuntime,\n  createElement: (tag: string, props: any, ...children: any[]) => {\n    const override = overrides?.[tag];\n\n    if (override) {\n      const newProps = { ...props, ...override };\n\n      // Merge class attributes intelligently\n      const originalClass = props?.class || props?.className;\n      const overrideClass = override.class || override.className;\n\n      if (originalClass && overrideClass) {\n        newProps.class = `${originalClass} ${overrideClass}`;\n        newProps.className = undefined;\n      }\n\n      return baseRuntime.createElement(tag, newProps, ...children);\n    }\n\n    return baseRuntime.createElement(tag, props, ...children);\n  },\n});\n\n/** ---------------------------------------------\n *  INTLAYER NODE PLUGIN\n *  --------------------------------------------- */\n\nexport type IntlayerNodeCond<T> = T extends number | string\n  ? IntlayerNode<T>\n  : never;\n\nexport interface IntlayerNode<T, P = {}> {\n  value: T;\n  children?: any;\n  additionalProps?: P;\n}\n\n/** Translation plugin. Replaces node with a locale string if nodeType = Translation. */\nexport const intlayerNodePlugins: Plugins = {\n  id: 'intlayer-node-plugin',\n  canHandle: (node) =>\n    typeof node === 'bigint' ||\n    typeof node === 'string' ||\n    typeof node === 'number',\n  transform: (_node, { children, ...rest }) =>\n    renderIntlayerNode({\n      ...rest,\n      value: children,\n      children: () => ({\n        component: ContentSelectorWrapperComponent,\n        props: {\n          dictionaryKey: rest.dictionaryKey,\n          keyPath: rest.keyPath,\n        },\n        children: children,\n      }),\n    }),\n};\n\n/**\n * MARKDOWN PLUGIN\n */\n\nexport type MarkdownStringCond<T> = T extends string\n  ? IntlayerNode<string, { metadata: DeepTransformContent<string> }>\n  : never;\n\n/** Markdown string plugin. Replaces string node with a component that render the markdown. */\nexport const markdownStringPlugin: Plugins = {\n  id: 'markdown-string-plugin',\n  canHandle: (node) => typeof node === 'string',\n  transform: (node: string, props, deepTransformNode) => {\n    const {\n      plugins, // Removed to avoid next error - Functions cannot be passed directly to Client Components\n      ...rest\n    } = props;\n\n    const metadata = getMarkdownMetadata(node);\n\n    const metadataPlugins: Plugins = {\n      id: 'markdown-metadata-plugin',\n      canHandle: (metadataNode) =>\n        typeof metadataNode === 'string' ||\n        typeof metadataNode === 'number' ||\n        typeof metadataNode === 'boolean' ||\n        !metadataNode,\n      transform: (metadataNode, props) =>\n        renderIntlayerNode({\n          ...props,\n          value: metadataNode,\n          children: node,\n        }),\n    };\n\n    // Transform metadata while keeping the same structure\n    const metadataNodes = deepTransformNode(metadata, {\n      plugins: [metadataPlugins],\n      dictionaryKey: rest.dictionaryKey,\n      keyPath: [],\n    });\n\n    const render = (components?: any) =>\n      renderIntlayerNode({\n        ...props,\n        value: node,\n        children: () => ({\n          component: ContentSelectorWrapperComponent,\n          props: {\n            dictionaryKey: rest.dictionaryKey,\n            keyPath: rest.keyPath,\n            ...components,\n          },\n          children: () => {\n            const { renderMarkdown } = useMarkdown();\n            return renderMarkdown(node, components);\n          },\n        }),\n        additionalProps: {\n          metadata: metadataNodes,\n        },\n      });\n\n    const createProxy = (element: any, components?: any) =>\n      new Proxy(element, {\n        get(target, prop, receiver) {\n          if (prop === 'value') {\n            return node;\n          }\n          if (prop === 'metadata') {\n            return metadataNodes;\n          }\n\n          if (prop === 'toString') {\n            return () => {\n              const runtime = components\n                ? createRuntimeWithOverides(htmlRuntime, components)\n                : htmlRuntime;\n              return compile(node, {\n                runtime,\n              }) as string;\n            };\n          }\n\n          if (prop === Symbol.toPrimitive) {\n            return () => {\n              const runtime = components\n                ? createRuntimeWithOverides(htmlRuntime, components)\n                : htmlRuntime;\n              return compile(node, {\n                runtime,\n              }) as string;\n            };\n          }\n\n          if (prop === 'use') {\n            return (newComponents?: any) => {\n              const mergedComponents = { ...components, ...newComponents };\n              return createProxy(render(mergedComponents), mergedComponents);\n            };\n          }\n\n          return Reflect.get(target, prop, receiver);\n        },\n      }) as any;\n\n    return createProxy(render() as any);\n  },\n};\n\nexport type MarkdownCond<T, _S, _L extends LocalesValues> = T extends {\n  nodeType: NodeType | string;\n  [NodeType.Markdown]: infer M;\n  tags?: infer U;\n  metadata?: infer V;\n}\n  ? IntlayerNode<\n      M,\n      {\n        use: (components?: Record<keyof U, any>) => any;\n        metadata: DeepTransformContent<V>;\n      }\n    >\n  : never;\n\nexport const markdownPlugin: Plugins = {\n  id: 'markdown-plugin',\n  canHandle: (node) =>\n    typeof node === 'object' && node?.nodeType === NodeType.Markdown,\n  transform: (node: MarkdownContent, props, deepTransformNode) => {\n    const newKeyPath: KeyPath[] = [\n      ...props.keyPath,\n      {\n        type: NodeType.Markdown,\n      },\n    ];\n\n    const children = node[NodeType.Markdown];\n\n    return deepTransformNode(children, {\n      ...props,\n      children,\n      keyPath: newKeyPath,\n      plugins: [markdownStringPlugin, ...(props.plugins ?? [])],\n    });\n  },\n};\n\n/** ---------------------------------------------\n *  HTML PLUGIN\n *  --------------------------------------------- */\n\n/**\n * HTML conditional type.\n *\n * This ensures type safety:\n * - `html('<div>Hello <CustomComponent /></div>').use({ CustomComponent: ... })` - optional but typed\n */\nexport type HTMLPluginCond<T, _S, _L> = T extends {\n  nodeType: NodeType | string;\n  [NodeType.HTML]: infer I;\n  tags?: infer U;\n}\n  ? IntlayerNode<\n      I,\n      {\n        use: (components?: Record<keyof U, any>) => any;\n      }\n    >\n  : never;\n\n/** HTML plugin. Replaces node with a function that takes components => IntlayerNode. */\nexport const htmlPlugin: Plugins = {\n  id: 'html-plugin',\n  canHandle: (node) =>\n    typeof node === 'object' && node?.nodeType === NodeType.HTML,\n\n  transform: (node: HTMLContent<string>, props) => {\n    const html = node[NodeType.HTML];\n    const { plugins, ...rest } = props;\n\n    // Type-safe render function that accepts properly typed components\n    const render = (userComponents?: any) =>\n      renderIntlayerNode({\n        ...rest,\n        value: html,\n        children: () => ({\n          component: ContentSelectorWrapperComponent,\n          props: {\n            dictionaryKey: rest.dictionaryKey,\n            keyPath: rest.keyPath,\n            ...userComponents,\n          },\n          children: html,\n        }),\n      });\n\n    const createProxy = (element: any, components?: any) =>\n      new Proxy(element, {\n        get(target, prop, receiver) {\n          if (prop === 'value') {\n            return html;\n          }\n\n          if (prop === 'toString') {\n            return () => {\n              if (\n                !components ||\n                (typeof components === 'object' &&\n                  Object.keys(components).length === 0)\n              ) {\n                return String(html);\n              }\n              const runtime = createRuntimeWithOverides(\n                htmlRuntime,\n                components\n              );\n              return compile(html, {\n                runtime,\n              }) as string;\n            };\n          }\n\n          if (prop === Symbol.toPrimitive) {\n            return () => {\n              if (\n                !components ||\n                (typeof components === 'object' &&\n                  Object.keys(components).length === 0)\n              ) {\n                return String(html);\n              }\n              const runtime = createRuntimeWithOverides(\n                htmlRuntime,\n                components\n              );\n              return compile(html, {\n                runtime,\n              }) as string;\n            };\n          }\n\n          if (prop === 'use') {\n            // Return a properly typed function based on custom components\n            return (userComponents?: any) => {\n              const mergedComponents = { ...components, ...userComponents };\n              return createProxy(render(mergedComponents), mergedComponents);\n            };\n          }\n\n          return Reflect.get(target, prop, receiver);\n        },\n      }) as any;\n\n    return createProxy(render() as any);\n  },\n};\n\n/** ---------------------------------------------\n *  INSERTION PLUGIN\n *  --------------------------------------------- */\n\n/**\n * Insertion conditional type.\n */\nexport type InsertionPluginCond<T> = T extends {\n  nodeType: NodeType | string;\n  [NodeType.Insertion]: infer _I;\n}\n  ? (args: Record<string, string | number>) => string\n  : never;\n\nexport const insertionPlugin: Plugins = {\n  id: 'insertion-plugin',\n  canHandle: (node) =>\n    typeof node === 'object' && node?.nodeType === NodeType.Insertion,\n  transform: (node: InsertionContent, props) => {\n    const { plugins, ...rest } = props;\n\n    // Return a function that performs the interpolation\n    const render = (args: Record<string, string | number> = {}) => {\n      let text = node.insertion as string;\n      if (args) {\n        Object.entries(args).forEach(([key, value]) => {\n          text = text.replace(\n            new RegExp(`{{\\\\s*${key}\\\\s*}}`, 'g'),\n            String(value)\n          );\n        });\n      }\n      return text;\n    };\n\n    return renderIntlayerNode({\n      ...rest,\n      value: render as any,\n      children: render,\n    });\n  },\n};\n\nexport interface IInterpreterPluginAngular<T, S, L extends LocalesValues> {\n  angularIntlayerNode: IntlayerNodeCond<T>;\n  angularMarkdown: MarkdownCond<T, S, L>;\n  angularHtml: HTMLPluginCond<T, S, L>;\n  angularInsertion: InsertionPluginCond<T>;\n}\n\n/**\n * Insert this type as param of `DeepTransformContent` to avoid `intlayer` package pollution.\n *\n * Otherwise the the `angular-intlayer` plugins will override the types of `intlayer` functions.\n */\nexport type IInterpreterPluginState = IInterpreterPluginStateCore & {\n  angularIntlayerNode: true;\n  angularMarkdown: true;\n  angularHtml: true;\n  angularInsertion: true;\n};\n\nexport type DeepTransformContent<\n  T,\n  L extends LocalesValues = DeclaredLocales,\n> = DeepTransformContentCore<T, IInterpreterPluginState, L>;\n"],"mappings":"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"}

package/dist/esm/renderIntlayerNode.mjs

@@ -5,11 +5,21 @@ const renderIntlayerNode = ({ children, value, additionalProps = {} }) => {
 		if (additionalProps && Object.keys(additionalProps).includes(prop)) return additionalProps[prop];
 		return Reflect.get(target, prop, receiver);
 	} });
-	return new Proxy(children, { get(target, prop, receiver) {
-		if (prop === "value") return value;
-		if (additionalProps && Object.keys(additionalProps).includes(prop)) return additionalProps[prop];
-		return Reflect.get(target, prop, receiver);
-	} });
+	return new Proxy(children, {
+		apply(target, thisArg, argumentsList) {
+			if (typeof value === "function") return Reflect.apply(value, thisArg, argumentsList);
+			return Reflect.apply(target, thisArg, argumentsList);
+		},
+		get(target, prop, receiver) {
+			if (prop === "value") return value;
+			if (prop === "toString") return () => {
+				return String(value);
+			};
+			if (prop === Symbol.toPrimitive) return () => value;
+			if (additionalProps && Object.keys(additionalProps).includes(prop)) return additionalProps[prop];
+			return Reflect.get(target, prop, receiver);
+		}
+	});
 };
 
 //#endregion

package/dist/esm/renderIntlayerNode.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"renderIntlayerNode.mjs","names":[],"sources":["../../src/renderIntlayerNode.ts"],"sourcesContent":["export type IntlayerNode<T = string, AdditionalProps = {}> = any & {\n  value: T;\n} & AdditionalProps;\n\ntype RenderIntlayerNodeProps<T> = {\n  value: T;\n  children: any;\n  additionalProps?: { [key: string]: any };\n};\n\nexport const renderIntlayerNode = <\n  T extends number | string | boolean | undefined | null,\n>({\n  children,\n  value,\n  additionalProps = {},\n}: RenderIntlayerNodeProps<T>): IntlayerNode<T> => {\n  // If children is null or undefined, return a simple object with the value\n  if (children == null) {\n    return new Proxy({} as any, {\n      get(target, prop, receiver) {\n        if (prop === 'value') {\n          return value;\n        }\n\n        if (\n          additionalProps &&\n          Object.keys(additionalProps).includes(prop as string)\n        ) {\n          return additionalProps[prop as keyof typeof additionalProps];\n        }\n\n        return Reflect.get(target, prop, receiver);\n      },\n    }) as IntlayerNode<T>;\n  }\n\n  // Return a Proxy that pretends to be the original content\n  // but also has a .value getter and additional props.\n  return new Proxy(children, {\n    get(target, prop, receiver) {\n      if (prop === 'value') {\n        return value;\n      }\n\n      if (\n        additionalProps &&\n        Object.keys(additionalProps).includes(prop as string)\n      ) {\n        return additionalProps[prop as keyof typeof additionalProps];\n      }\n\n      return Reflect.get(target, prop, receiver);\n    },\n  }) as IntlayerNode<T>;\n};\n"],"mappings":";AAUA,MAAa,sBAEX,EACA,UACA,OACA,kBAAkB,EAAE,OAC6B;AAEjD,KAAI,YAAY,KACd,QAAO,IAAI,MAAM,EAAE,EAAS,EAC1B,IAAI,QAAQ,MAAM,UAAU;AAC1B,MAAI,SAAS,QACX,QAAO;AAGT,MACE,mBACA,OAAO,KAAK,gBAAgB,CAAC,SAAS,KAAe,CAErD,QAAO,gBAAgB;AAGzB,SAAO,QAAQ,IAAI,QAAQ,MAAM,SAAS;IAE7C,CAAC;AAKJ,QAAO,IAAI,MAAM,UAAU,EACzB,IAAI,QAAQ,MAAM,UAAU;AAC1B,MAAI,SAAS,QACX,QAAO;AAGT,MACE,mBACA,OAAO,KAAK,gBAAgB,CAAC,SAAS,KAAe,CAErD,QAAO,gBAAgB;AAGzB,SAAO,QAAQ,IAAI,QAAQ,MAAM,SAAS;IAE7C,CAAC"}
+{"version":3,"file":"renderIntlayerNode.mjs","names":[],"sources":["../../src/renderIntlayerNode.ts"],"sourcesContent":["export type IntlayerNode<T = string, AdditionalProps = {}> = any & {\n  value: T;\n} & AdditionalProps;\n\ntype RenderIntlayerNodeProps<T> = {\n  value: T;\n  children: any;\n  additionalProps?: { [key: string]: any };\n};\n\nexport const renderIntlayerNode = <\n  T extends number | string | boolean | undefined | null,\n>({\n  children,\n  value,\n  additionalProps = {},\n}: RenderIntlayerNodeProps<T>): IntlayerNode<T> => {\n  // If children is null or undefined, return a simple object with the value\n  if (children == null) {\n    return new Proxy({} as any, {\n      get(target, prop, receiver) {\n        if (prop === 'value') {\n          return value;\n        }\n\n        if (\n          additionalProps &&\n          Object.keys(additionalProps).includes(prop as string)\n        ) {\n          return additionalProps[prop as keyof typeof additionalProps];\n        }\n\n        return Reflect.get(target, prop, receiver);\n      },\n    }) as IntlayerNode<T>;\n  }\n\n  // Return a Proxy that pretends to be the original content\n  // but also has a .value getter and additional props.\n  return new Proxy(children, {\n    apply(target, thisArg, argumentsList) {\n      if (typeof value === 'function') {\n        return Reflect.apply(value as Function, thisArg, argumentsList);\n      }\n      return Reflect.apply(target as Function, thisArg, argumentsList);\n    },\n    get(target, prop, receiver) {\n      if (prop === 'value') {\n        return value;\n      }\n\n      if (prop === 'toString') {\n        return () => {\n          // console.log('renderIntlayerNode toString called for:', value);\n          return String(value);\n        };\n      }\n\n      if (prop === Symbol.toPrimitive) {\n        return () => value;\n      }\n\n      if (\n        additionalProps &&\n        Object.keys(additionalProps).includes(prop as string)\n      ) {\n        return additionalProps[prop as keyof typeof additionalProps];\n      }\n\n      return Reflect.get(target, prop, receiver);\n    },\n  }) as IntlayerNode<T>;\n};\n"],"mappings":";AAUA,MAAa,sBAEX,EACA,UACA,OACA,kBAAkB,EAAE,OAC6B;AAEjD,KAAI,YAAY,KACd,QAAO,IAAI,MAAM,EAAE,EAAS,EAC1B,IAAI,QAAQ,MAAM,UAAU;AAC1B,MAAI,SAAS,QACX,QAAO;AAGT,MACE,mBACA,OAAO,KAAK,gBAAgB,CAAC,SAAS,KAAe,CAErD,QAAO,gBAAgB;AAGzB,SAAO,QAAQ,IAAI,QAAQ,MAAM,SAAS;IAE7C,CAAC;AAKJ,QAAO,IAAI,MAAM,UAAU;EACzB,MAAM,QAAQ,SAAS,eAAe;AACpC,OAAI,OAAO,UAAU,WACnB,QAAO,QAAQ,MAAM,OAAmB,SAAS,cAAc;AAEjE,UAAO,QAAQ,MAAM,QAAoB,SAAS,cAAc;;EAElE,IAAI,QAAQ,MAAM,UAAU;AAC1B,OAAI,SAAS,QACX,QAAO;AAGT,OAAI,SAAS,WACX,cAAa;AAEX,WAAO,OAAO,MAAM;;AAIxB,OAAI,SAAS,OAAO,YAClB,cAAa;AAGf,OACE,mBACA,OAAO,KAAK,gBAAgB,CAAC,SAAS,KAAe,CAErD,QAAO,gBAAgB;AAGzB,UAAO,QAAQ,IAAI,QAAQ,MAAM,SAAS;;EAE7C,CAAC"}

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

@@ -1,11 +1,11 @@
-import * as _angular_core0 from "@angular/core";
+import * as _angular_core1 from "@angular/core";
 import { InjectionToken, Signal } from "@angular/core";
 import { LocalesValues } from "@intlayer/types";
 
 //#region src/client/installIntlayer.d.ts
 declare const INTLAYER_TOKEN: InjectionToken<IntlayerProvider>;
 declare class IntlayerProvider {
-  isCookieEnabled: _angular_core0.WritableSignal<boolean>;
+  isCookieEnabled: _angular_core1.WritableSignal<boolean>;
   private _locale;
   readonly locale: Signal<LocalesValues>;
   setLocale: (locale: LocalesValues) => void;