@flogeez/angular-tiptap-editor 3.0.0 → 3.0.2

package/index.d.ts

@@ -138,11 +138,15 @@ interface AteTranslations {
         invalidFileType: string;
         dragDropText: string;
         changeImage: string;
+        downloadImage: string;
         deleteImage: string;
         resizeSmall: string;
         resizeMedium: string;
         resizeLarge: string;
         resizeOriginal: string;
+        alignLeft: string;
+        alignCenter: string;
+        alignRight: string;
         resizing: string;
         compressing: string;
         compressionError: string;
@@ -312,11 +316,15 @@ declare class AteI18nService {
         invalidFileType: string;
         dragDropText: string;
         changeImage: string;
+        downloadImage: string;
         deleteImage: string;
         resizeSmall: string;
         resizeMedium: string;
         resizeLarge: string;
         resizeOriginal: string;
+        alignLeft: string;
+        alignCenter: string;
+        alignRight: string;
         resizing: string;
         compressing: string;
         compressionError: string;
@@ -690,6 +698,7 @@ declare class AteEditorCommandsService {
     insertContent(editor: Editor, content: string): void;
     insertImage(editor: Editor, options?: AteImageUploadOptions): Promise<void>;
     uploadImage(editor: Editor, file: File, options?: AteImageUploadOptions): Promise<void>;
+    downloadImage(editor: Editor): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<AteEditorCommandsService, never>;
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<AteEditorCommandsService>;
 }
@@ -768,7 +777,7 @@ interface AteCustomBubbleMenuItem {
 /**
  * Clés des options du menu bulle d'image
  */
-declare const ATE_IMAGE_BUBBLE_MENU_KEYS: readonly ["changeImage", "resizeSmall", "resizeMedium", "resizeLarge", "resizeOriginal", "deleteImage", "separator"];
+declare const ATE_IMAGE_BUBBLE_MENU_KEYS: readonly ["changeImage", "downloadImage", "resizeSmall", "resizeMedium", "resizeLarge", "resizeOriginal", "alignLeft", "alignCenter", "alignRight", "deleteImage", "separator"];
 type AteImageBubbleMenuKey = (typeof ATE_IMAGE_BUBBLE_MENU_KEYS)[number];
 type AteImageBubbleMenuConfig = Partial<Record<AteImageBubbleMenuKey, boolean>>;
 /**
@@ -974,6 +983,8 @@ interface AteEditorConfig {
     showTableMenu?: boolean;
     /** Show or hide the cell menu */
     showCellMenu?: boolean;
+    /** Whether to allow image downloading from bubble menu */
+    downloadImage?: boolean;
     /** Enable or disable slash commands (/) */
     enableSlashCommands?: boolean;
     /** Maximum number of characters allowed */
@@ -1063,7 +1074,7 @@ declare class AngularTiptapEditorComponent implements AfterViewInit, OnDestroy {
     showBubbleMenu: _angular_core.InputSignal<boolean | undefined>;
     bubbleMenu: _angular_core.InputSignal<Partial<AteBubbleMenuConfig> | undefined>;
     showImageBubbleMenu: _angular_core.InputSignal<boolean | undefined>;
-    imageBubbleMenu: _angular_core.InputSignal<Partial<Partial<Record<"separator" | "changeImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage", boolean>>> | undefined>;
+    imageBubbleMenu: _angular_core.InputSignal<Partial<Partial<Record<"separator" | "alignLeft" | "alignCenter" | "alignRight" | "changeImage" | "downloadImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage", boolean>>> | undefined>;
     toolbar: _angular_core.InputSignal<Partial<AteToolbarConfig> | undefined>;
     showTableBubbleMenu: _angular_core.InputSignal<boolean | undefined>;
     tableBubbleMenu: _angular_core.InputSignal<Partial<Partial<Record<"addColumnBefore" | "addColumnAfter" | "deleteColumn" | "addRowBefore" | "addRowAfter" | "deleteRow" | "deleteTable" | "toggleHeaderColumn" | "toggleHeaderRow" | "separator", boolean>>> | undefined>;
@@ -1125,43 +1136,50 @@ declare class AngularTiptapEditorComponent implements AfterViewInit, OnDestroy {
     readonly editorFullyInitialized: _angular_core.Signal<boolean>;
     private _isFormControlDisabled;
     readonly isFormControlDisabled: _angular_core.Signal<boolean>;
-    readonly mergedDisabled: _angular_core.Signal<any>;
+    readonly mergedDisabled: _angular_core.Signal<boolean>;
     isEditorReady: _angular_core.Signal<boolean>;
     readonly finalSeamless: _angular_core.Signal<boolean>;
-    readonly finalEditable: _angular_core.Signal<any>;
-    readonly finalPlaceholder: _angular_core.Signal<any>;
-    readonly finalFillContainer: _angular_core.Signal<any>;
-    readonly finalShowFooter: _angular_core.Signal<any>;
-    readonly finalShowEditToggle: _angular_core.Signal<any>;
-    readonly finalHeight: _angular_core.Signal<any>;
-    readonly finalMinHeight: _angular_core.Signal<any>;
-    readonly finalMaxHeight: _angular_core.Signal<any>;
-    readonly finalSpellcheck: _angular_core.Signal<any>;
-    readonly finalEnableOfficePaste: _angular_core.Signal<any>;
-    readonly finalShowToolbar: _angular_core.Signal<any>;
-    readonly finalToolbarConfig: _angular_core.Signal<any>;
-    readonly finalFloatingToolbar: _angular_core.Signal<any>;
-    readonly finalShowBubbleMenu: _angular_core.Signal<any>;
-    readonly finalBubbleMenuConfig: _angular_core.Signal<any>;
-    readonly finalShowImageBubbleMenu: _angular_core.Signal<any>;
-    readonly finalImageBubbleMenuConfig: _angular_core.Signal<any>;
-    readonly finalShowTableBubbleMenu: _angular_core.Signal<any>;
-    readonly finalTableBubbleMenuConfig: _angular_core.Signal<any>;
-    readonly finalShowCellBubbleMenu: _angular_core.Signal<any>;
-    readonly finalCellBubbleMenuConfig: _angular_core.Signal<any>;
-    readonly finalEnableSlashCommands: _angular_core.Signal<any>;
-    readonly finalSlashCommandsConfig: _angular_core.Signal<any>;
-    readonly finalAutofocus: _angular_core.Signal<any>;
-    readonly finalMaxCharacters: _angular_core.Signal<any>;
-    readonly finalShowCharacterCount: _angular_core.Signal<any>;
-    readonly finalShowWordCount: _angular_core.Signal<any>;
+    readonly finalEditable: _angular_core.Signal<boolean>;
+    readonly finalPlaceholder: _angular_core.Signal<string>;
+    readonly finalFillContainer: _angular_core.Signal<boolean | undefined>;
+    readonly finalShowFooter: _angular_core.Signal<boolean>;
+    readonly finalShowEditToggle: _angular_core.Signal<boolean>;
+    readonly finalHeight: _angular_core.Signal<string | undefined>;
+    readonly finalMinHeight: _angular_core.Signal<string | undefined>;
+    readonly finalMaxHeight: _angular_core.Signal<string | undefined>;
+    readonly finalSpellcheck: _angular_core.Signal<boolean>;
+    readonly finalEnableOfficePaste: _angular_core.Signal<boolean>;
+    readonly finalShowToolbar: _angular_core.Signal<boolean>;
+    readonly finalToolbarConfig: _angular_core.Signal<AteToolbarConfig>;
+    readonly finalFloatingToolbar: _angular_core.Signal<boolean>;
+    readonly finalShowBubbleMenu: _angular_core.Signal<boolean>;
+    readonly finalBubbleMenuConfig: _angular_core.Signal<AteBubbleMenuConfig>;
+    readonly finalShowImageBubbleMenu: _angular_core.Signal<boolean>;
+    readonly finalImageBubbleMenuConfig: _angular_core.Signal<Partial<Record<"separator" | "alignLeft" | "alignCenter" | "alignRight" | "changeImage" | "downloadImage" | "resizeSmall" | "resizeMedium" | "resizeLarge" | "resizeOriginal" | "deleteImage", boolean>>>;
+    readonly finalShowTableBubbleMenu: _angular_core.Signal<boolean>;
+    readonly finalTableBubbleMenuConfig: _angular_core.Signal<Partial<Record<"addColumnBefore" | "addColumnAfter" | "deleteColumn" | "addRowBefore" | "addRowAfter" | "deleteRow" | "deleteTable" | "toggleHeaderColumn" | "toggleHeaderRow" | "separator", boolean>>>;
+    readonly finalShowCellBubbleMenu: _angular_core.Signal<boolean>;
+    readonly finalCellBubbleMenuConfig: _angular_core.Signal<Partial<Record<"mergeCells" | "splitCell", boolean>>>;
+    readonly finalEnableSlashCommands: _angular_core.Signal<boolean>;
+    readonly finalSlashCommandsConfig: _angular_core.Signal<AteCustomSlashCommands>;
+    readonly finalAutofocus: _angular_core.Signal<number | boolean | "start" | "end" | "all" | undefined>;
+    readonly finalMaxCharacters: _angular_core.Signal<number | undefined>;
+    readonly finalShowCharacterCount: _angular_core.Signal<boolean>;
+    readonly finalShowWordCount: _angular_core.Signal<boolean>;
     readonly finalLocale: _angular_core.Signal<SupportedLocale>;
-    readonly finalTiptapExtensions: _angular_core.Signal<any>;
-    readonly finalTiptapOptions: _angular_core.Signal<any>;
-    readonly finalStateCalculators: _angular_core.Signal<any>;
-    readonly finalAngularNodesConfig: _angular_core.Signal<any>;
-    readonly finalImageUploadConfig: _angular_core.Signal<any>;
-    readonly finalImageUploadHandler: _angular_core.Signal<any>;
+    readonly finalTiptapExtensions: _angular_core.Signal<(Mark<any, any> | Node$2<any, any> | Extension<any, any>)[]>;
+    readonly finalTiptapOptions: _angular_core.Signal<Partial<EditorOptions>>;
+    readonly finalStateCalculators: _angular_core.Signal<AteStateCalculator[]>;
+    readonly finalAngularNodesConfig: _angular_core.Signal<AteAngularNode[]>;
+    readonly finalImageUploadConfig: _angular_core.Signal<{
+        maxSize: number;
+        quality?: number;
+        maxWidth?: number;
+        maxHeight?: number;
+        allowedTypes?: string[];
+        handler?: AteImageUploadHandler;
+    }>;
+    readonly finalImageUploadHandler: _angular_core.Signal<AteImageUploadHandler | undefined>;
     readonly currentTranslations: _angular_core.Signal<_flogeez_angular_tiptap_editor.AteTranslations>;
     private _destroyRef;
     private ngControl;
@@ -1174,7 +1192,46 @@ declare class AngularTiptapEditorComponent implements AfterViewInit, OnDestroy {
      * Final merged configuration.
      * Priority: Input [config] > Global config via provideAteEditor()
      */
-    readonly effectiveConfig: _angular_core.Signal<any>;
+    readonly effectiveConfig: _angular_core.Signal<{
+        theme?: "light" | "dark" | "auto";
+        mode?: "classic" | "seamless";
+        height?: string | number;
+        autofocus?: "start" | "end" | "all" | boolean | number;
+        placeholder?: string;
+        editable?: boolean;
+        minHeight?: string | number;
+        maxHeight?: string | number;
+        fillContainer?: boolean;
+        disabled?: boolean;
+        locale?: string;
+        spellcheck?: boolean;
+        enableOfficePaste?: boolean;
+        showToolbar?: boolean;
+        showFooter?: boolean;
+        showCharacterCount?: boolean;
+        showWordCount?: boolean;
+        showEditToggle?: boolean;
+        showBubbleMenu?: boolean;
+        showImageBubbleMenu?: boolean;
+        showTableMenu?: boolean;
+        showCellMenu?: boolean;
+        downloadImage?: boolean;
+        enableSlashCommands?: boolean;
+        maxCharacters?: number;
+        toolbar?: AteToolbarConfig;
+        bubbleMenu?: AteBubbleMenuConfig;
+        imageBubbleMenu?: AteImageBubbleMenuConfig;
+        tableBubbleMenu?: AteTableBubbleMenuConfig;
+        cellBubbleMenu?: AteCellBubbleMenuConfig;
+        slashCommands?: AteSlashCommandsConfig;
+        floatingToolbar?: boolean;
+        imageUpload?: _flogeez_angular_tiptap_editor.AteImageUploadConfig;
+        angularNodes?: AteAngularNode[];
+        tiptapExtensions?: (Extension | Node$2 | Mark)[];
+        tiptapOptions?: Partial<EditorOptions>;
+        stateCalculators?: AteStateCalculator[];
+        customSlashCommands?: AteCustomSlashCommands;
+    }>;
     constructor();
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
@@ -1257,6 +1314,8 @@ declare class AteImageService {
     } | null;
     /** Remove the selected image */
     deleteImage(editor: Editor): void;
+    /** Download the current image */
+    downloadImage(editor: Editor): void;
     private updateSelectedImage;
     /** Validate file type and size */
     validateImage(file: File, options?: {
@@ -1414,6 +1473,8 @@ declare const ATE_DEFAULT_BUBBLE_MENU_CONFIG: AteBubbleMenuConfig;
 declare const ATE_DEFAULT_IMAGE_BUBBLE_MENU_CONFIG: AteImageBubbleMenuConfig;
 declare const ATE_DEFAULT_TABLE_MENU_CONFIG: AteTableBubbleMenuConfig;
 declare const ATE_DEFAULT_CELL_MENU_CONFIG: AteCellBubbleMenuConfig;
+declare const ATE_DEFAULT_IMAGE_UPLOAD_CONFIG: AteImageUploadConfig;
+
 /**
  * Ultimate default configuration for the Angular Tiptap Editor.
  * This serves as the 'Level 4' fallback in the configuration hierarchy:
@@ -1422,7 +1483,7 @@ declare const ATE_DEFAULT_CELL_MENU_CONFIG: AteCellBubbleMenuConfig;
  * 3. Global provideAteEditor() (Le Duc)
  * 4. ATE_DEFAULT_CONFIG (Le Peuple)
  */
-declare const ATE_DEFAULT_CONFIG: any;
+declare const ATE_DEFAULT_CONFIG: AteEditorConfig;
 
 /**
  * Injection Token for global editor configuration.
@@ -1600,5 +1661,5 @@ declare function createAngularComponentExtension<T = unknown>(injector: Injector
  */
 declare function registerAngularComponent<T = unknown>(injectorOrOptions: Injector | RegisterAngularComponentOptions<T>, maybeOptions?: RegisterAngularComponentOptions<T>): Node$2;
 
-export { ATE_BUBBLE_MENU_KEYS, ATE_CELL_BUBBLE_MENU_KEYS, ATE_DEFAULT_BUBBLE_MENU_CONFIG, ATE_DEFAULT_CELL_MENU_CONFIG, ATE_DEFAULT_CONFIG, ATE_DEFAULT_IMAGE_BUBBLE_MENU_CONFIG, ATE_DEFAULT_SLASH_COMMANDS_CONFIG, ATE_DEFAULT_TABLE_MENU_CONFIG, ATE_DEFAULT_TOOLBAR_CONFIG, ATE_GLOBAL_CONFIG, ATE_IMAGE_BUBBLE_MENU_KEYS, ATE_INITIAL_EDITOR_STATE, ATE_SLASH_COMMAND_KEYS, ATE_TABLE_BUBBLE_MENU_KEYS, ATE_TOOLBAR_KEYS, AngularTiptapEditorComponent, AteAngularNodeView, AteColorPickerService, AteDiscoveryCalculator, AteEditorCommandsService, AteI18nService, AteImageCalculator, AteImageService, AteLinkService, AteMarksCalculator, AteNodeViewRenderer, AteNoopValueAccessorDirective, AteSelectionCalculator, AteStructureCalculator, AteTableCalculator, createAngularComponentExtension, createDefaultSlashCommands, filterSlashCommands, provideAteEditor, registerAngularComponent };
+export { ATE_BUBBLE_MENU_KEYS, ATE_CELL_BUBBLE_MENU_KEYS, ATE_DEFAULT_BUBBLE_MENU_CONFIG, ATE_DEFAULT_CELL_MENU_CONFIG, ATE_DEFAULT_CONFIG, ATE_DEFAULT_IMAGE_BUBBLE_MENU_CONFIG, ATE_DEFAULT_IMAGE_UPLOAD_CONFIG, ATE_DEFAULT_SLASH_COMMANDS_CONFIG, ATE_DEFAULT_TABLE_MENU_CONFIG, ATE_DEFAULT_TOOLBAR_CONFIG, ATE_GLOBAL_CONFIG, ATE_IMAGE_BUBBLE_MENU_KEYS, ATE_INITIAL_EDITOR_STATE, ATE_SLASH_COMMAND_KEYS, ATE_TABLE_BUBBLE_MENU_KEYS, ATE_TOOLBAR_KEYS, AngularTiptapEditorComponent, AteAngularNodeView, AteColorPickerService, AteDiscoveryCalculator, AteEditorCommandsService, AteI18nService, AteImageCalculator, AteImageService, AteLinkService, AteMarksCalculator, AteNodeViewRenderer, AteNoopValueAccessorDirective, AteSelectionCalculator, AteStructureCalculator, AteTableCalculator, createAngularComponentExtension, createDefaultSlashCommands, filterSlashCommands, provideAteEditor, registerAngularComponent };
 export type { AteAngularNode, AteBubbleMenuConfig, AteBubbleMenuKey, AteCellBubbleMenuConfig, AteCellBubbleMenuKey, AteColorEditMode, AteColorPickerSelection, AteComponentRenderOptions, AteCustomBubbleMenuItem, AteCustomSlashCommands, AteCustomToolbarItem, AteEditorConfig, AteEditorStateSnapshot, AteImageBubbleMenuConfig, AteImageBubbleMenuKey, AteImageData, AteImageUploadConfig, AteImageUploadContext, AteImageUploadHandler, AteImageUploadHandlerResult, AteImageUploadOptions, AteImageUploadResult, AteResizeOptions, AteSlashCommandItem, AteSlashCommandKey, AteSlashCommandsConfig, AteStateCalculator, AteTableBubbleMenuConfig, AteTableBubbleMenuKey, AteToolbarConfig, AteToolbarKey, AteTranslations, RegisterAngularComponentOptions, SupportedLocale };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flogeez/angular-tiptap-editor",
-  "version": "3.0.0",
+  "version": "3.0.2",
   "description": "A modern, customizable rich-text editor for Angular (18+), built with Tiptap and featuring complete internationalization support",
   "keywords": [
     "angular",

package/src/lib/styles/ate-bubble-menu.global.css

@@ -14,11 +14,11 @@
 .tippy-box .bubble-menu {
   display: flex !important;
   align-items: center;
-  gap: 6px;
+  gap: var(--ate-menu-gap, 2px);
   background: var(--ate-menu-bg, rgb(255, 255, 255)) !important;
   border: 1px solid var(--ate-menu-border, rgba(0, 0, 0, 0.1));
   border-radius: var(--ate-menu-border-radius, 12px);
-  padding: var(--ate-menu-padding, 6px);
+  padding: var(--ate-menu-padding, 4px);
   box-shadow: var(--ate-menu-shadow, 0 8px 32px rgba(0, 0, 0, 0.12));
   z-index: 1000;
   animation: slideUp 0.18s cubic-bezier(0, 0, 0.2, 1);
@@ -32,13 +32,6 @@
   pointer-events: none !important;
 }
 
-.bubble-menu .ate-separator {
-  width: 1px;
-  height: 28px;
-  background: color-mix(in srgb, var(--ate-menu-border), transparent 50%);
-  margin: 0 4px;
-}
-
 @keyframes slideUp {
   from {
     opacity: 0;

package/src/lib/styles/index.css

@@ -1,20 +1,20 @@
 @import "./ate-bubble-menu.global.css";
 @import "./material-symbols.css";
 
-/* Styles pour les liens */
+/* Styles for links */
 .ate-link {
-  color: var(--ate-primary, #1d4ed8);
+  color: var(--ate-primary, #2563eb);
   text-decoration: underline;
   cursor: pointer;
   transition: color 0.2s ease;
 }
 
 .ate-link:hover {
-  color: var(--ate-primary-light-alpha, #1d4ed8);
+  color: var(--ate-primary-hover, #153ca9);
   text-decoration: underline;
 }
 
-/* Styles pour la surbrillance */
+/* Styles for highlight */
 .ate-highlight {
   background-color: var(--ate-highlight-bg, #fef08a);
   padding: 0.1em 0.2em;
@@ -22,7 +22,7 @@
   color: var(--ate-highlight-color, #854d0e);
 }
 
-/* Styles pour les alignements de texte - Tiptap utilise des classes */
+/* Styles for text alignment - Tiptap uses classes */
 .ProseMirror .has-text-align-left {
   text-align: left;
 }