@flogeez/angular-tiptap-editor 3.4.7 → 3.5.1

package/lib/ate-editor.provider.d.ts

@@ -1,5 +1,6 @@
 import { EnvironmentProviders } from "@angular/core";
 import { AteEditorConfig } from "./models/ate-editor-config.model";
+import { AteIcons } from "./services/ate-icon-registry.service";
 /**
  * Provides the necessary configuration and initialization for the Angular TipTap Editor.
  * This should be called in your app.config.ts (for standalone) or main.ts.
@@ -19,3 +20,31 @@ import { AteEditorConfig } from "./models/ate-editor-config.model";
  * ```
  */
 export declare function provideAteEditor(config?: AteEditorConfig): EnvironmentProviders;
+/**
+ * Registers SVG icons, to override the library icons or to add icons for custom
+ * toolbar items, bubble menus and slash commands. Can be called several times.
+ *
+ * Must be provided at application bootstrap (`app.config.ts` or `main.ts`) because
+ * `AteIconRegistry` is root-scoped (`providedIn: 'root'`); for lazy routes or
+ * runtime changes, inject `AteIconRegistry` and call `register()`.
+ *
+ * Values are a full `<svg>` element, used as-is with its own `fill` and `stroke`,
+ * or only its inner markup, drawn in the Material Symbols viewBox (`0 -960 960 960`)
+ * and filled with `currentColor`. Unregistered names fall back to
+ * the Material Symbols font, when it is loaded.
+ * @example
+ * ```ts
+ * bootstrapApplication(AppComponent, {
+ *   providers: [
+ *     provideAteEditor(),
+ *     provideAteIcons({
+ *       // full <svg>: keeps its own fill and stroke (here a stroke icon, Lucide style)
+ *       bold: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="…"/></svg>',
+ *       // inner markup: Material Symbols viewBox, filled with currentColor
+ *       rocket: '<path d="…"/>',
+ *     })
+ *   ]
+ * });
+ * ```
+ */
+export declare function provideAteIcons(icons: AteIcons): EnvironmentProviders;

package/lib/components/bubble-menus/image/ate-image-bubble-menu.component.d.ts

@@ -34,9 +34,9 @@ export declare class AteImageBubbleMenuComponent extends AteBaseBubbleMenu {
         selectionCancelled: string;
     }>;
     private readonly imageService;
-    config: import("@angular/core").InputSignal<Partial<Record<"separator" | "alignLeft" | "alignCenter" | "alignRight" | "changeImage" | "downloadImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage", boolean>>>;
+    config: import("@angular/core").InputSignal<Partial<Record<"alignLeft" | "alignCenter" | "alignRight" | "changeImage" | "downloadImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage" | "separator", boolean>>>;
     imageUpload: import("@angular/core").InputSignal<AteImageUploadOptions>;
-    imageBubbleMenuConfig: import("@angular/core").Signal<Required<Partial<Record<"separator" | "alignLeft" | "alignCenter" | "alignRight" | "changeImage" | "downloadImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage", boolean>>>>;
+    imageBubbleMenuConfig: import("@angular/core").Signal<Required<Partial<Record<"alignLeft" | "alignCenter" | "alignRight" | "changeImage" | "downloadImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage" | "separator", boolean>>>>;
     hasAlignmentButtons: import("@angular/core").Signal<boolean>;
     hasResizeButtons: import("@angular/core").Signal<boolean>;
     shouldShow(): boolean;

package/lib/components/bubble-menus/text/ate-bubble-menu.component.d.ts

@@ -40,9 +40,9 @@ export declare class AteBubbleMenuComponent extends AteBaseBubbleMenu implements
         superscript?: boolean | undefined;
         subscript?: boolean | undefined;
         highlight?: boolean | undefined;
+        textColor?: boolean | undefined;
         separator?: boolean | undefined;
         highlightPicker?: boolean | undefined;
-        textColor?: boolean | undefined;
     }>;
     shouldShow(): boolean;
     getSelectionRect(): DOMRect;

package/lib/components/color-picker/ate-color-picker.component.d.ts

@@ -44,7 +44,7 @@ export declare class AteColorPickerComponent {
     readonly state: import("@angular/core").Signal<import("@flogeez/angular-tiptap-editor").AteEditorStateSnapshot>;
     readonly currentColor: import("@angular/core").Signal<string>;
     readonly hasColorApplied: import("@angular/core").Signal<boolean>;
-    readonly buttonIcon: import("@angular/core").Signal<"format_color_text" | "format_color_fill">;
+    readonly buttonIcon: import("@angular/core").Signal<"textColor" | "highlightColor">;
     readonly buttonBgColor: import("@angular/core").Signal<string>;
     readonly buttonTextColor: import("@angular/core").Signal<string>;
     onToggle(event: Event): void;

package/lib/components/editor/angular-tiptap-editor.component.d.ts

@@ -54,7 +54,7 @@ export declare class AngularTiptapEditorComponent implements AfterViewInit, OnDe
     showBubbleMenu: import("@angular/core").InputSignalWithTransform<boolean | undefined, unknown>;
     bubbleMenu: import("@angular/core").InputSignal<Partial<AteBubbleMenuConfig> | undefined>;
     showImageBubbleMenu: import("@angular/core").InputSignalWithTransform<boolean | undefined, unknown>;
-    imageBubbleMenu: import("@angular/core").InputSignal<Partial<Partial<Record<"separator" | "alignLeft" | "alignCenter" | "alignRight" | "changeImage" | "downloadImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage", boolean>>> | undefined>;
+    imageBubbleMenu: import("@angular/core").InputSignal<Partial<Partial<Record<"alignLeft" | "alignCenter" | "alignRight" | "changeImage" | "downloadImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage" | "separator", boolean>>> | undefined>;
     toolbar: import("@angular/core").InputSignal<Partial<AteToolbarConfig> | undefined>;
     showTableBubbleMenu: import("@angular/core").InputSignalWithTransform<boolean | undefined, unknown>;
     tableBubbleMenu: import("@angular/core").InputSignal<Partial<Partial<Record<"addColumnBefore" | "addColumnAfter" | "deleteColumn" | "addRowBefore" | "addRowAfter" | "deleteRow" | "deleteTable" | "toggleHeaderColumn" | "toggleHeaderRow" | "separator", boolean>>> | undefined>;
@@ -147,7 +147,7 @@ export declare class AngularTiptapEditorComponent implements AfterViewInit, OnDe
     readonly finalShowBubbleMenu: import("@angular/core").Signal<boolean>;
     readonly finalBubbleMenuConfig: import("@angular/core").Signal<AteBubbleMenuConfig>;
     readonly finalShowImageBubbleMenu: import("@angular/core").Signal<boolean>;
-    readonly finalImageBubbleMenuConfig: import("@angular/core").Signal<Partial<Record<"separator" | "alignLeft" | "alignCenter" | "alignRight" | "changeImage" | "downloadImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage", boolean>>>;
+    readonly finalImageBubbleMenuConfig: import("@angular/core").Signal<Partial<Record<"alignLeft" | "alignCenter" | "alignRight" | "changeImage" | "downloadImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage" | "separator", boolean>>>;
     readonly finalShowTableBubbleMenu: import("@angular/core").Signal<boolean>;
     readonly finalTableBubbleMenuConfig: import("@angular/core").Signal<Partial<Record<"addColumnBefore" | "addColumnAfter" | "deleteColumn" | "addRowBefore" | "addRowAfter" | "deleteRow" | "deleteTable" | "toggleHeaderColumn" | "toggleHeaderRow" | "separator", boolean>>>;
     readonly finalShowCellBubbleMenu: import("@angular/core").Signal<boolean>;
@@ -180,6 +180,7 @@ export declare class AngularTiptapEditorComponent implements AfterViewInit, OnDe
     readonly editorCommandsService: AteEditorCommandsService;
     readonly editorState: import("@angular/core").Signal<import("../../models/ate-editor-state.model").AteEditorStateSnapshot>;
     private editorRegistry;
+    private iconRegistry;
     private _registeredId;
     readonly registeredId: import("@angular/core").Signal<string | null>;
     private injector;
@@ -217,7 +218,7 @@ export declare class AngularTiptapEditorComponent implements AfterViewInit, OnDe
         blockControls?: AteBlockControlsMode | undefined;
         toolbar?: AteToolbarConfig | undefined;
         bubbleMenu?: AteBubbleMenuConfig | undefined;
-        imageBubbleMenu?: Partial<Record<"separator" | "alignLeft" | "alignCenter" | "alignRight" | "changeImage" | "downloadImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage", boolean>> | undefined;
+        imageBubbleMenu?: Partial<Record<"alignLeft" | "alignCenter" | "alignRight" | "changeImage" | "downloadImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage" | "separator", boolean>> | undefined;
         tableBubbleMenu?: Partial<Record<"addColumnBefore" | "addColumnAfter" | "deleteColumn" | "addRowBefore" | "addRowAfter" | "deleteRow" | "deleteTable" | "toggleHeaderColumn" | "toggleHeaderRow" | "separator", boolean>> | undefined;
         cellBubbleMenu?: Partial<Record<"mergeCells" | "splitCell", boolean>> | undefined;
         slashCommands?: AteSlashCommandsConfig | undefined;

package/lib/components/ui/ate-button.component.d.ts

@@ -1,6 +1,7 @@
+import { AteIconKey } from "../../services/ate-icon-registry.service";
 import * as i0 from "@angular/core";
 export interface AteButtonConfig {
-    icon: string;
+    icon: AteIconKey;
     title: string;
     active?: boolean;
     disabled?: boolean;
@@ -9,7 +10,7 @@ export interface AteButtonConfig {
     iconSize?: "small" | "medium" | "large";
 }
 export declare class AteButtonComponent {
-    icon: import("@angular/core").InputSignal<string>;
+    icon: import("@angular/core").InputSignal<AteIconKey>;
     title: import("@angular/core").InputSignal<string>;
     active: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
     disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;

package/lib/components/ui/ate-icon.component.d.ts

@@ -0,0 +1,17 @@
+import { AteIconKey } from "../../services/ate-icon-registry.service";
+import * as i0 from "@angular/core";
+/**
+ * Renders an icon from the AteIconRegistry as inline SVG,
+ * or with the Material Symbols font when the name is not registered.
+ * Its size follows the `font-size` (1em). Library icons are filled with `currentColor`;
+ * a full custom `<svg>` keeps its own `fill` and `stroke` attributes.
+ */
+export declare class AteIconComponent {
+    private readonly registry;
+    private readonly sanitizer;
+    /** Library icon, icon registered with provideAteIcons, or Material Symbols name (font) */
+    name: import("@angular/core").InputSignal<AteIconKey>;
+    readonly content: import("@angular/core").Signal<import("@angular/platform-browser").SafeHtml>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AteIconComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AteIconComponent, "ate-icon", never, { "name": { "alias": "name"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/lib/extensions/ate-upload-progress.extension.d.ts

@@ -3,5 +3,7 @@ export interface AteUploadProgressOptions {
     isUploading: () => boolean;
     uploadProgress: () => number;
     uploadMessage: () => string;
+    /** HTML of the icon shown while uploading */
+    iconHtml: () => string;
 }
 export declare const AteUploadProgress: Extension<AteUploadProgressOptions, any>;

package/lib/icons/ate-default-icons.d.ts

@@ -0,0 +1,65 @@
+/** ViewBox shared by every Material Symbols SVG */
+export declare const ATE_MATERIAL_SYMBOLS_VIEWBOX = "0 -960 960 960";
+/** Inner SVG markup of the library icons, keyed by what they do */
+export declare const ATE_DEFAULT_ICONS: {
+    readonly bold: "<path d=\"M272-200v-560h221q65 0 120 40t55 111q0 51-23 78.5T602-491q25 11 55.5 41t30.5 90q0 89-65 124.5T501-200H272Zm121-112h104q48 0 58.5-24.5T566-372q0-11-10.5-35.5T494-432H393v120Zm0-228h93q33 0 48-17t15-38q0-24-17-39t-44-15h-95v109Z\"/>";
+    readonly italic: "<path d=\"M200-200v-100h160l120-360H320v-100h400v100H580L460-300h140v100H200Z\"/>";
+    readonly underline: "<path d=\"M200-120v-80h560v80H200Zm123-223q-56-63-56-167v-330h103v336q0 56 28 91t82 35q54 0 82-35t28-91v-336h103v330q0 104-56 167t-157 63q-101 0-157-63Z\"/>";
+    readonly strike: "<path d=\"M486-160q-76 0-135-45t-85-123l88-38q14 48 48.5 79t85.5 31q42 0 76-20t34-64q0-18-7-33t-19-27h112q5 14 7.5 28.5T694-340q0 86-61.5 133T486-160ZM80-480v-80h800v80H80Zm402-326q66 0 115.5 32.5T674-674l-88 39q-9-29-33.5-52T484-710q-41 0-68 18.5T386-640h-96q2-69 54.5-117.5T482-806Z\"/>";
+    readonly code: "<path d=\"M320-240 80-480l240-240 57 57-184 184 183 183-56 56Zm320 0-57-57 184-184-183-183 56-56 240 240-240 240Z\"/>";
+    readonly superscript: "<path d=\"M760-600v-80q0-17 11.5-28.5T800-720h80v-40H760v-40h120q17 0 28.5 11.5T920-760v40q0 17-11.5 28.5T880-680h-80v40h120v40H760ZM235-160l185-291-172-269h106l124 200h4l123-200h107L539-451l186 291H618L482-377h-4L342-160H235Z\"/>";
+    readonly subscript: "<path d=\"M760-160v-80q0-17 11.5-28.5T800-280h80v-40H760v-40h120q17 0 28.5 11.5T920-320v40q0 17-11.5 28.5T880-240h-80v40h120v40H760Zm-525-80 185-291-172-269h106l124 200h4l123-200h107L539-531l186 291H618L482-457h-4L342-240H235Z\"/>";
+    readonly highlight: "<path d=\"m226-640-86-84 56-58 86 86-56 56Zm214-120v-120h80v120h-80Zm296 120-58-56 86-84 56 56-84 84ZM360-80v-200L240-400v-200h480v200L600-280v200H360Zm80-80h80v-153l120-120v-87H320v87l120 120v153Zm40-180Z\"/>";
+    readonly link: "<path d=\"M440-280H280q-83 0-141.5-58.5T80-480q0-83 58.5-141.5T280-680h160v80H280q-50 0-85 35t-35 85q0 50 35 85t85 35h160v80ZM320-440v-80h320v80H320Zm200 160v-80h160q50 0 85-35t35-85q0-50-35-85t-85-35H520v-80h160q83 0 141.5 58.5T880-480q0 83-58.5 141.5T680-280H520Z\"/>";
+    readonly heading1: "<path d=\"M200-280v-400h80v160h160v-160h80v400h-80v-160H280v160h-80Zm480 0v-320h-80v-80h160v400h-80Z\"/>";
+    readonly heading2: "<path d=\"M120-280v-400h80v160h160v-160h80v400h-80v-160H200v160h-80Zm400 0v-160q0-33 23.5-56.5T600-520h160v-80H520v-80h240q33 0 56.5 23.5T840-600v80q0 33-23.5 56.5T760-440H600v80h240v80H520Z\"/>";
+    readonly heading3: "<path d=\"M120-280v-400h80v160h160v-160h80v400h-80v-160H200v160h-80Zm400 0v-80h240v-80H600v-80h160v-80H520v-80h240q33 0 56.5 23.5T840-600v240q0 33-23.5 56.5T760-280H520Z\"/>";
+    readonly bulletList: "<path d=\"M360-200v-80h480v80H360Zm0-240v-80h480v80H360Zm0-240v-80h480v80H360ZM200-160q-33 0-56.5-23.5T120-240q0-33 23.5-56.5T200-320q33 0 56.5 23.5T280-240q0 33-23.5 56.5T200-160Zm0-240q-33 0-56.5-23.5T120-480q0-33 23.5-56.5T200-560q33 0 56.5 23.5T280-480q0 33-23.5 56.5T200-400Zm-56.5-263.5Q120-687 120-720t23.5-56.5Q167-800 200-800t56.5 23.5Q280-753 280-720t-23.5 56.5Q233-640 200-640t-56.5-23.5Z\"/>";
+    readonly orderedList: "<path d=\"M120-80v-60h100v-30h-60v-60h60v-30H120v-60h120q17 0 28.5 11.5T280-280v40q0 17-11.5 28.5T240-200q17 0 28.5 11.5T280-160v40q0 17-11.5 28.5T240-80H120Zm0-280v-110q0-17 11.5-28.5T160-510h60v-30H120v-60h120q17 0 28.5 11.5T280-560v70q0 17-11.5 28.5T240-450h-60v30h100v60H120Zm60-280v-180h-60v-60h120v240h-60Zm180 440v-80h480v80H360Zm0-240v-80h480v80H360Zm0-240v-80h480v80H360Z\"/>";
+    readonly blockquote: "<path d=\"m228-240 92-160q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 23-5.5 42.5T458-480L320-240h-92Zm360 0 92-160q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 23-5.5 42.5T818-480L680-240h-92ZM362.5-517.5Q380-535 380-560t-17.5-42.5Q345-620 320-620t-42.5 17.5Q260-585 260-560t17.5 42.5Q295-500 320-500t42.5-17.5Zm360 0Q740-535 740-560t-17.5-42.5Q705-620 680-620t-42.5 17.5Q620-585 620-560t17.5 42.5Q655-500 680-500t42.5-17.5ZM680-560Zm-360 0Z\"/>";
+    readonly codeBlock: "<path d=\"M160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160Zm0-80h640v-400H160v400Zm140-40-56-56 103-104-104-104 57-56 160 160-160 160Zm180 0v-80h240v80H480Z\"/>";
+    readonly horizontalRule: "<path d=\"M160-440v-80h640v80H160Z\"/>";
+    readonly image: "<path d=\"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm40-80h480L570-480 450-320l-90-120-120 160Zm-40 80v-560 560Z\"/>";
+    readonly table: "<path d=\"M320-80q-33 0-56.5-23.5T240-160v-480q0-33 23.5-56.5T320-720h480q33 0 56.5 23.5T880-640v480q0 33-23.5 56.5T800-80H320Zm0-80h200v-120H320v120Zm280 0h200v-120H600v120ZM80-240v-560q0-33 23.5-56.5T160-880h560v80H160v560H80Zm240-120h200v-120H320v120Zm280 0h200v-120H600v120ZM320-560h480v-80H320v80Z\"/>";
+    readonly tableOfContents: "<path d=\"M360-200v-80h480v80H360Zm0-240v-80h480v80H360Zm0-240v-80h480v80H360ZM200-160q-33 0-56.5-23.5T120-240q0-33 23.5-56.5T200-320q33 0 56.5 23.5T280-240q0 33-23.5 56.5T200-160Zm0-240q-33 0-56.5-23.5T120-480q0-33 23.5-56.5T200-560q33 0 56.5 23.5T280-480q0 33-23.5 56.5T200-400Zm-56.5-263.5Q120-687 120-720t23.5-56.5Q167-800 200-800t56.5 23.5Q280-753 280-720t-23.5 56.5Q233-640 200-640t-56.5-23.5Z\"/>";
+    readonly alignLeft: "<path d=\"M120-120v-80h720v80H120Zm0-160v-80h480v80H120Zm0-160v-80h720v80H120Zm0-160v-80h480v80H120Zm0-160v-80h720v80H120Z\"/>";
+    readonly alignCenter: "<path d=\"M120-120v-80h720v80H120Zm160-160v-80h400v80H280ZM120-440v-80h720v80H120Zm160-160v-80h400v80H280ZM120-760v-80h720v80H120Z\"/>";
+    readonly alignRight: "<path d=\"M120-760v-80h720v80H120Zm240 160v-80h480v80H360ZM120-440v-80h720v80H120Zm240 160v-80h480v80H360ZM120-120v-80h720v80H120Z\"/>";
+    readonly alignJustify: "<path d=\"M120-120v-80h720v80H120Zm0-160v-80h720v80H120Zm0-160v-80h720v80H120Zm0-160v-80h720v80H120Zm0-160v-80h720v80H120Z\"/>";
+    readonly textColor: "<path d=\"M80 0v-160h800V0H80Zm140-280 210-560h100l210 560h-96l-50-144H368l-52 144h-96Zm176-224h168l-82-232h-4l-82 232Z\"/>";
+    readonly highlightColor: "<path d=\"m247-904 57-56 343 343q23 23 23 57t-23 57L457-313q-23 23-57 23t-57-23L153-503q-23-23-23-57t23-57l190-191-96-96Zm153 153L209-560h382L400-751Zm303.5 447.5Q680-327 680-360q0-21 12.5-45t27.5-45q9-12 19-25t21-25q11 12 21 25t19 25q15 21 27.5 45t12.5 45q0 33-23.5 56.5T760-280q-33 0-56.5-23.5ZM80 0v-160h800V0H80Z\"/>";
+    readonly customColor: "<path d=\"M120-120v-190l358-358-58-56 58-56 76 76 124-124q5-5 12.5-8t15.5-3q8 0 15 3t13 8l94 94q5 6 8 13t3 15q0 8-3 15.5t-8 12.5L705-555l76 78-57 57-56-58-358 358H120Zm80-80h78l332-334-76-76-334 332v78Zm447-410 96-96-37-37-96 96 37 37Zm0 0-37-37 37 37Z\"/>";
+    readonly unsetColor: "<path d=\"M800-436q0 36-8 69t-22 63l-62-60q6-17 9-34.5t3-37.5q0-47-17.5-89T650-600L480-768l-88 86-56-56 144-142 226 222q44 42 69 99.5T800-436Zm-8 380L668-180q-41 29-88 44.5T480-120q-133 0-226.5-92.5T160-436q0-51 16-98t48-90L56-792l56-56 736 736-56 56ZM480-200q36 0 68.5-10t61.5-28L280-566q-21 32-30.5 64t-9.5 66q0 98 70 167t170 69Zm-37-204Zm110-116Z\"/>";
+    readonly openLink: "<path d=\"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h280v80H200v560h560v-280h80v280q0 33-23.5 56.5T760-120H200Zm188-212-56-56 372-372H560v-80h280v280h-80v-144L388-332Z\"/>";
+    readonly unsetLink: "<path d=\"m770-302-60-62q40-11 65-42.5t25-73.5q0-50-35-85t-85-35H520v-80h160q83 0 141.5 58.5T880-480q0 57-29.5 105T770-302ZM634-440l-80-80h86v80h-6ZM792-56 56-792l56-56 736 736-56 56ZM440-280H280q-83 0-141.5-58.5T80-480q0-69 42-123t108-71l74 74h-24q-50 0-85 35t-35 85q0 50 35 85t85 35h160v80ZM320-440v-80h65l79 80H320Z\"/>";
+    readonly changeImage: "<path d=\"m400-120 160-160h320v160H400Zm-240-80h57l391-391-57-57-391 391v57Zm-80 80v-170l528-527q12-11 26.5-17t30.5-6q16 0 31 6t26 18l55 56q12 11 17.5 26t5.5 30q0 16-5.5 30.5T777-647L250-120H80Zm640-584-56-56 56 56Zm-141 85-28-29 57 57-29-28Z\"/>";
+    readonly downloadImage: "<path d=\"M480-320 280-520l56-58 104 104v-326h80v326l104-104 56 58-200 200ZM240-160q-33 0-56.5-23.5T160-240v-120h80v120h480v-120h80v120q0 33-23.5 56.5T720-160H240Z\"/>";
+    readonly resizeSmall: "<path d=\"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm0 0v-560 560Z\"/>";
+    readonly resizeMedium: "<path d=\"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm0 0v-560 560Z\"/>";
+    readonly resizeLarge: "<path d=\"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm0 0v-560 560Z\"/>";
+    readonly resizeOriginal: "<path d=\"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm40-80h480L570-480 450-320l-90-120-120 160Zm-40 80v-560 560Z\"/>";
+    readonly deleteImage: "<path d=\"M280-120q-33 0-56.5-23.5T200-200v-520h-40v-80h200v-40h240v40h200v80h-40v520q0 33-23.5 56.5T680-120H280Zm400-600H280v520h400v-520ZM360-280h80v-360h-80v360Zm160 0h80v-360h-80v360ZM280-720v520-520Z\"/>";
+    readonly imageUpload: "<path d=\"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm40-80h480L570-480 450-320l-90-120-120 160Zm-40 80v-560 560Z\"/>";
+    readonly addRowBefore: "<path d=\"M200-160h560v-240H200v240Zm640 80H120v-720h160v80h-80v240h560v-240h-80v-80h160v720ZM480-480Zm0 80v-80 80Zm0 0Zm-40-240v-80h-80v-80h80v-80h80v80h80v80h-80v80h-80Z\"/>";
+    readonly addRowAfter: "<path d=\"M200-560h560v-240H200v240Zm-80 400v-720h720v720H680v-80h80v-240H200v240h80v80H120Zm360-320Zm0-80v80-80Zm0 0ZM440-80v-80h-80v-80h80v-80h80v80h80v80h-80v80h-80Z\"/>";
+    readonly deleteRow: "<path d=\"M280-120q-33 0-56.5-23.5T200-200v-520h-40v-80h200v-40h240v40h200v80h-40v520q0 33-23.5 56.5T680-120H280Zm400-600H280v520h400v-520ZM360-280h80v-360h-80v360Zm160 0h80v-360h-80v360ZM280-720v520-520Z\"/>";
+    readonly addColumnBefore: "<path d=\"M800-200v-560H560v560h240Zm-640 80v-160h80v80h240v-560H240v80h-80v-160h720v720H160Zm320-360Zm80 0h-80 80Zm0 0ZM160-360v-80H80v-80h80v-80h80v80h80v80h-80v80h-80Z\"/>";
+    readonly addColumnAfter: "<path d=\"M160-760v560h240v-560H160ZM80-120v-720h720v160h-80v-80H480v560h240v-80h80v160H80Zm400-360Zm-80 0h80-80Zm0 0Zm320 120v-80h-80v-80h80v-80h80v80h80v80h-80v80h-80Z\"/>";
+    readonly deleteColumn: "<path d=\"M280-120q-33 0-56.5-23.5T200-200v-520h-40v-80h200v-40h240v40h200v80h-40v520q0 33-23.5 56.5T680-120H280Zm400-600H280v520h400v-520ZM360-280h80v-360h-80v360Zm160 0h80v-360h-80v360ZM280-720v520-520Z\"/>";
+    readonly toggleHeaderRow: "<path d=\"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-520h560v-120H200v120Zm560 80H200v360h560v-360Zm-560-80v80-80Zm0 0v-120 120Zm0 80v360-360Z\"/>";
+    readonly toggleHeaderColumn: "<path d=\"M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm120-80v-560H200v560h120Zm80 0h360v-560H400v560Zm-80 0H200h120Z\"/>";
+    readonly deleteTable: "<path d=\"m376-300 104-104 104 104 56-56-104-104 104-104-56-56-104 104-104-104-56 56 104 104-104 104 56 56Zm-96 180q-33 0-56.5-23.5T200-200v-520h-40v-80h200v-40h240v40h200v80h-40v520q0 33-23.5 56.5T680-120H280Zm400-600H280v520h400v-520Zm-400 0v520-520Z\"/>";
+    readonly mergeCells: "<path d=\"M120-120v-240h80v160h160v80H120Zm480 0v-80h160v-160h80v240H600ZM287-327l-57-56 57-57H80v-80h207l-57-57 57-56 153 153-153 153Zm386 0L520-480l153-153 57 56-57 57h207v80H673l57 57-57 56ZM120-600v-240h240v80H200v160h-80Zm640 0v-160H600v-80h240v240h-80Z\"/>";
+    readonly splitCell: "<path d=\"M200-160q-33 0-56.5-23.5T120-240v-480q0-33 23.5-56.5T200-800h160v80H200v480h160v80H200Zm240 80v-800h80v80h240q33 0 56.5 23.5T840-720v480q0 33-23.5 56.5T760-160H520v80h-80Zm80-160h240v-480H520v480Zm-320 0v-480 480Zm560 0v-480 480Z\"/>";
+    readonly undo: "<path d=\"M280-200v-80h284q63 0 109.5-40T720-420q0-60-46.5-100T564-560H312l104 104-56 56-200-200 200-200 56 56-104 104h252q97 0 166.5 63T800-420q0 94-69.5 157T564-200H280Z\"/>";
+    readonly redo: "<path d=\"M396-200q-97 0-166.5-63T160-420q0-94 69.5-157T396-640h252L544-744l56-56 200 200-200 200-56-56 104-104H396q-63 0-109.5 40T240-420q0 60 46.5 100T396-280h284v80H396Z\"/>";
+    readonly clearContent: "<path d=\"M280-120q-33 0-56.5-23.5T200-200v-520h-40v-80h200v-40h240v40h200v80h-40v520q0 33-23.5 56.5T680-120H280Zm400-600H280v520h400v-520ZM360-280h80v-360h-80v360Zm160 0h80v-360h-80v360ZM280-720v520-520Z\"/>";
+    readonly blockAdd: "<path d=\"M440-440H200v-80h240v-240h80v240h240v80H520v240h-80v-240Z\"/>";
+    readonly blockDrag: "<path d=\"M360-160q-33 0-56.5-23.5T280-240q0-33 23.5-56.5T360-320q33 0 56.5 23.5T440-240q0 33-23.5 56.5T360-160Zm240 0q-33 0-56.5-23.5T520-240q0-33 23.5-56.5T600-320q33 0 56.5 23.5T680-240q0 33-23.5 56.5T600-160ZM360-400q-33 0-56.5-23.5T280-480q0-33 23.5-56.5T360-560q33 0 56.5 23.5T440-480q0 33-23.5 56.5T360-400Zm240 0q-33 0-56.5-23.5T520-480q0-33 23.5-56.5T600-560q33 0 56.5 23.5T680-480q0 33-23.5 56.5T600-400ZM360-640q-33 0-56.5-23.5T280-720q0-33 23.5-56.5T360-800q33 0 56.5 23.5T440-720q0 33-23.5 56.5T360-640Zm240 0q-33 0-56.5-23.5T520-720q0-33 23.5-56.5T600-800q33 0 56.5 23.5T680-720q0 33-23.5 56.5T600-640Z\"/>";
+    readonly edit: "<path d=\"M200-200h57l391-391-57-57-391 391v57Zm-80 80v-170l528-527q12-11 26.5-17t30.5-6q16 0 31 6t26 18l55 56q12 11 17.5 26t5.5 30q0 16-5.5 30.5T817-647L290-120H120Zm640-584-56-56 56 56Zm-141 85-28-29 57 57-29-28Z\"/>";
+    readonly preview: "<path d=\"M607.5-372.5Q660-425 660-500t-52.5-127.5Q555-680 480-680t-127.5 52.5Q300-575 300-500t52.5 127.5Q405-320 480-320t127.5-52.5Zm-204-51Q372-455 372-500t31.5-76.5Q435-608 480-608t76.5 31.5Q588-545 588-500t-31.5 76.5Q525-392 480-392t-76.5-31.5ZM214-281.5Q94-363 40-500q54-137 174-218.5T480-800q146 0 266 81.5T920-500q-54 137-174 218.5T480-200q-146 0-266-81.5ZM480-500Zm207.5 160.5Q782-399 832-500q-50-101-144.5-160.5T480-720q-113 0-207.5 59.5T128-500q50 101 144.5 160.5T480-280q113 0 207.5-59.5Z\"/>";
+    readonly apply: "<path d=\"M382-240 154-468l57-57 171 171 367-367 57 57-424 424Z\"/>";
+    readonly clear: "<path d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\"/>";
+};
+/** Name of an icon used by the library */
+export type AteIconName = keyof typeof ATE_DEFAULT_ICONS;

package/lib/icons/ate-stroke-icons.d.ts

@@ -0,0 +1,2 @@
+import type { AteIcons } from "../services/ate-icon-registry.service";
+export declare const ATE_STROKE_ICONS: AteIcons;

package/lib/models/ate-bubble-menu.model.d.ts

@@ -1,4 +1,5 @@
 import { Editor } from "@tiptap/core";
+import { AteIconKey } from "../services/ate-icon-registry.service";
 /**
  * Clés des options du menu bulle de texte
  */
@@ -10,7 +11,7 @@ export interface AteBubbleMenuConfig extends Partial<Record<AteBubbleMenuKey, bo
 export interface AteCustomBubbleMenuItem {
     key: string;
     label: string;
-    icon: string;
+    icon: AteIconKey;
     command: (editor: Editor) => void | Promise<void>;
 }
 /**

package/lib/models/ate-slash-command.model.d.ts

@@ -1,11 +1,12 @@
 import { Editor } from "@tiptap/core";
+import { AteIconKey } from "../services/ate-icon-registry.service";
 /**
  * Interface representing a single item in the slash commands menu.
  */
 export interface AteSlashCommandItem {
     title: string;
     description: string;
-    icon: string;
+    icon: AteIconKey;
     keywords: string[];
     command: (editor: Editor) => void;
 }

package/lib/models/ate-toolbar.model.d.ts

@@ -1,4 +1,5 @@
 import { Editor } from "@tiptap/core";
+import { AteIconKey } from "../services/ate-icon-registry.service";
 /**
  * Clés des boutons de la barre d'outils native
  */
@@ -13,6 +14,6 @@ export interface AteToolbarConfig extends Partial<Record<AteToolbarKey, boolean>
 export interface AteCustomToolbarItem {
     key: string;
     label: string;
-    icon: string;
+    icon: AteIconKey;
     command: (editor: Editor) => void | Promise<void>;
 }

package/lib/services/ate-icon-registry.service.d.ts

@@ -0,0 +1,52 @@
+import { InjectionToken } from "@angular/core";
+import { AteIconName } from "../icons/ate-default-icons";
+import * as i0 from "@angular/core";
+/**
+ * An icon name: a library icon (autocompleted), a custom registered icon,
+ * or any Material Symbols name rendered with the font.
+ */
+export type AteIconKey = AteIconName | (string & {});
+/**
+ * Icons keyed by name. Library icons are keyed by what they do (`bold`, `addRowBefore`…).
+ * Each value is SVG markup:
+ * - a full `<svg>` element (any viewBox), used as-is: it keeps its own `fill` and `stroke`
+ *   (use `currentColor` in them to follow the text color, e.g. stroke icons like Lucide);
+ * - or only its inner markup (`<path d="…"/>`), drawn in the Material Symbols viewBox
+ *   (`0 -960 960 960`) and filled with `currentColor`.
+ *
+ * Icons are sized with `1em`.
+ */
+export type AteIcons = Partial<Record<AteIconName, string>> & Record<string, string>;
+/**
+ * Injection Token for the icons registered with `provideAteIcons()`.
+ */
+export declare const ATE_ICONS: InjectionToken<AteIcons[]>;
+/**
+ * A root-level registry resolving icon names to SVG markup.
+ *
+ * The library ships the SVG of every icon it uses, so the Material Symbols font is not required.
+ * Names that are not registered fall back to the Material Symbols font ligature: load the font
+ * to use any Material Symbols name in custom toolbar items, bubble menus or slash commands.
+ */
+export declare class AteIconRegistry {
+    private readonly _icons;
+    /**
+     * Register or override icons at runtime.
+     */
+    register(icons: AteIcons): void;
+    /**
+     * Full SVG markup of an icon, or null when it is not registered.
+     * Reactive when called inside a computed or an effect.
+     */
+    svg(name: AteIconKey): string | null;
+    /**
+     * Markup drawing an icon: its SVG, or the Material Symbols font ligature when it is not registered.
+     */
+    markup(name: AteIconKey): string;
+    /**
+     * HTML of an icon for contexts outside Angular templates (ProseMirror widgets, raw HTML).
+     */
+    html(name: AteIconKey, className?: string): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AteIconRegistry, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<AteIconRegistry>;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flogeez/angular-tiptap-editor",
-  "version": "3.4.7",
+  "version": "3.5.1",
   "description": "A modern, customizable rich-text editor for Angular (18+), built with Tiptap and featuring complete internationalization support",
   "keywords": [
     "angular",
@@ -49,6 +49,11 @@
     "*.css",
     "**/*.css"
   ],
+  "peerDependenciesMeta": {
+    "@fontsource/material-symbols-outlined": {
+      "optional": true
+    }
+  },
   "module": "fesm2022/flogeez-angular-tiptap-editor.mjs",
   "typings": "index.d.ts",
   "exports": {

package/public-api.d.ts

@@ -2,6 +2,9 @@ export * from "./lib/components/editor/angular-tiptap-editor.component";
 export { AteTableOfContentsComponent } from "./lib/components/table-of-contents/ate-table-of-contents.component";
 export { AteTocNodeComponent, AteTocNodeOptions, getAteTocNodeExtension, } from "./lib/components/table-of-contents/ate-toc-node.component";
 export * from "./lib/ate-editor.provider";
+export { AteIconComponent } from "./lib/components/ui/ate-icon.component";
+export { ATE_DEFAULT_ICONS, ATE_MATERIAL_SYMBOLS_VIEWBOX, type AteIconName, } from "./lib/icons/ate-default-icons";
+export { ATE_STROKE_ICONS } from "./lib/icons/ate-stroke-icons";
 export * from "./lib/directives/ate-noop-value-accessor.directive";
 export * from "./lib/directives/ate-tooltip.directive";
 export * from "./lib/services/ate-i18n.service";
@@ -11,6 +14,7 @@ export * from "./lib/services/ate-color-picker.service";
 export * from "./lib/services/ate-link.service";
 export * from "./lib/services/ate-export.service";
 export * from "./lib/services/ate-editor-registry.service";
+export * from "./lib/services/ate-icon-registry.service";
 export * from "./lib/models/ate-editor-ref";
 export * from "./lib/models/ate-editor-state.model";
 export * from "./lib/extensions/calculators/ate-discovery.calculator";