@flogeez/angular-tiptap-editor 2.0.1 → 2.0.3

package/fesm2022/flogeez-angular-tiptap-editor.mjs

@@ -25,7 +25,6 @@ import { CommonModule } from '@angular/common';
 import tippy, { sticky } from 'tippy.js';
 import * as i1 from '@angular/forms';
 import { FormsModule, NG_VALUE_ACCESSOR, NgControl } from '@angular/forms';
-import { Plugin as Plugin$1, PluginKey as PluginKey$1 } from 'prosemirror-state';
 import { CellSelection } from '@tiptap/pm/tables';
 
 const ResizableImage = Node$1.create({
@@ -330,104 +329,104 @@ const UploadProgress = Extension.create({
                             // Créer un élément de progression
                             const uploadElement = document.createElement("div");
                             uploadElement.className = "upload-progress-widget";
-                            uploadElement.innerHTML = `
-                <div class="upload-skeleton">
-                  <div class="upload-content">
-                    <div class="upload-icon">
-                      <span class="material-symbols-outlined spinning">image</span>
-                    </div>
-                    <div class="upload-info">
-                      <div class="upload-message">${uploadMessage}</div>
-                      <div class="progress-bar">
-                        <div class="progress-fill" style="width: ${uploadProgress}%"></div>
-                      </div>
-                      <div class="progress-text">${uploadProgress}%</div>
-                    </div>
-                  </div>
-                </div>
+                            uploadElement.innerHTML = `
+                <div class="upload-skeleton">
+                  <div class="upload-content">
+                    <div class="upload-icon">
+                      <span class="material-symbols-outlined spinning">image</span>
+                    </div>
+                    <div class="upload-info">
+                      <div class="upload-message">${uploadMessage}</div>
+                      <div class="progress-bar">
+                        <div class="progress-fill" style="width: ${uploadProgress}%"></div>
+                      </div>
+                      <div class="progress-text">${uploadProgress}%</div>
+                    </div>
+                  </div>
+                </div>
               `;
                             // Ajouter les styles si pas déjà fait
                             if (!document.querySelector("#upload-progress-styles")) {
                                 const style = document.createElement("style");
                                 style.id = "upload-progress-styles";
-                                style.textContent = `
-                  .upload-progress-widget {
-                    display: block;
-                    margin: 8px 0;
-                    max-width: 400px;
-                  }
-                  .upload-skeleton {
-                    background: var(--ate-surface-secondary);
-                    border: 2px dashed var(--ate-border-color);
-                    border-radius: var(--ate-border-radius);
-                    padding: 16px;
-                    display: flex;
-                    align-items: center;
-                    justify-content: center;
-                    min-height: 120px;
-                    animation: pulse 2s infinite;
-                  }
-                  @keyframes pulse {
-                    0%, 100% { background-color: var(--ate-surface-secondary); }
-                    50% { background-color: var(--ate-surface-tertiary); }
-                  }
-                  .upload-content {
-                    display: flex;
-                    flex-direction: column;
-                    align-items: center;
-                    gap: 12px;
-                    text-align: center;
-                  }
-                  .upload-icon {
-                    display: flex;
-                    align-items: center;
-                    justify-content: center;
-                    width: 48px;
-                    height: 48px;
-                    background: var(--ate-primary-light);
-                    border-radius: 50%;
-                    color: var(--ate-primary);
-                  }
-                  .upload-icon .material-symbols-outlined {
-                    font-size: 24px;
-                  }
-                  .spinning {
-                    animation: spin 1s linear infinite;
-                  }
-                  @keyframes spin {
-                    from { transform: rotate(0deg); }
-                    to { transform: rotate(360deg); }
-                  }
-                  .upload-info {
-                    display: flex;
-                    flex-direction: column;
-                    gap: 8px;
-                    width: 100%;
-                    max-width: 200px;
-                  }
-                  .upload-message {
-                    font-size: 14px;
-                    color: var(--ate-text);
-                    font-weight: 500;
-                  }
-                  .progress-bar {
-                    width: 100%;
-                    height: 6px;
-                    background: var(--ate-border-color);
-                    border-radius: 3px;
-                    overflow: hidden;
-                  }
-                  .progress-fill {
-                    height: 100%;
-                    background: var(--ate-primary);
-                    border-radius: 3px;
-                    transition: width 0.3s ease;
-                  }
-                  .progress-text {
-                    font-size: 12px;
-                    color: var(--ate-text-secondary);
-                    font-weight: 500;
-                  }
+                                style.textContent = `
+                  .upload-progress-widget {
+                    display: block;
+                    margin: 8px 0;
+                    max-width: 400px;
+                  }
+                  .upload-skeleton {
+                    background: var(--ate-surface-secondary);
+                    border: 2px dashed var(--ate-border-color);
+                    border-radius: var(--ate-border-radius);
+                    padding: 16px;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    min-height: 120px;
+                    animation: pulse 2s infinite;
+                  }
+                  @keyframes pulse {
+                    0%, 100% { background-color: var(--ate-surface-secondary); }
+                    50% { background-color: var(--ate-surface-tertiary); }
+                  }
+                  .upload-content {
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+                    gap: 12px;
+                    text-align: center;
+                  }
+                  .upload-icon {
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    width: 48px;
+                    height: 48px;
+                    background: var(--ate-primary-light);
+                    border-radius: 50%;
+                    color: var(--ate-primary);
+                  }
+                  .upload-icon .material-symbols-outlined {
+                    font-size: 24px;
+                  }
+                  .spinning {
+                    animation: spin 1s linear infinite;
+                  }
+                  @keyframes spin {
+                    from { transform: rotate(0deg); }
+                    to { transform: rotate(360deg); }
+                  }
+                  .upload-info {
+                    display: flex;
+                    flex-direction: column;
+                    gap: 8px;
+                    width: 100%;
+                    max-width: 200px;
+                  }
+                  .upload-message {
+                    font-size: 14px;
+                    color: var(--ate-text);
+                    font-weight: 500;
+                  }
+                  .progress-bar {
+                    width: 100%;
+                    height: 6px;
+                    background: var(--ate-border-color);
+                    border-radius: 3px;
+                    overflow: hidden;
+                  }
+                  .progress-fill {
+                    height: 100%;
+                    background: var(--ate-primary);
+                    border-radius: 3px;
+                    transition: width 0.3s ease;
+                  }
+                  .progress-text {
+                    font-size: 12px;
+                    color: var(--ate-text-secondary);
+                    font-weight: 500;
+                  }
                 `;
                                 document.head.appendChild(style);
                             }
@@ -451,21 +450,21 @@ const UploadProgress = Extension.create({
                             // Mettre à jour le contenu de l'élément existant
                             const existingElement = document.querySelector(".upload-progress-widget");
                             if (existingElement) {
-                                existingElement.innerHTML = `
-                  <div class="upload-skeleton">
-                    <div class="upload-content">
-                      <div class="upload-icon">
-                        <span class="material-symbols-outlined spinning">image</span>
-                      </div>
-                      <div class="upload-info">
-                        <div class="upload-message">${uploadMessage}</div>
-                        <div class="progress-bar">
-                          <div class="progress-fill" style="width: ${uploadProgress}%"></div>
-                        </div>
-                        <div class="progress-text">${uploadProgress}%</div>
-                      </div>
-                    </div>
-                  </div>
+                                existingElement.innerHTML = `
+                  <div class="upload-skeleton">
+                    <div class="upload-content">
+                      <div class="upload-icon">
+                        <span class="material-symbols-outlined spinning">image</span>
+                      </div>
+                      <div class="upload-info">
+                        <div class="upload-message">${uploadMessage}</div>
+                        <div class="progress-bar">
+                          <div class="progress-fill" style="width: ${uploadProgress}%"></div>
+                        </div>
+                        <div class="progress-text">${uploadProgress}%</div>
+                      </div>
+                    </div>
+                  </div>
                 `;
                             }
                             return state; // Garder les décorations existantes
@@ -704,72 +703,72 @@ class TiptapButtonComponent {
         event.preventDefault();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapButtonComponent, isStandalone: true, selector: "tiptap-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, backgroundColor: { classPropertyName: "backgroundColor", publicName: "backgroundColor", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClick: "onClick" }, ngImport: i0, template: `
-    <button
-      class="tiptap-button"
-      [class.is-active]="active()"
-      [class.is-disabled]="disabled()"
-      [class.text-button]="variant() === 'text'"
-      [class.danger]="variant() === 'danger'"
-      [class.small]="size() === 'small'"
-      [class.medium]="size() === 'medium'"
-      [class.large]="size() === 'large'"
-      [class.has-custom-color]="!!color()"
-      [class.has-custom-bg]="!!backgroundColor()"
-      [disabled]="disabled()"
-      [style.color]="color()"
-      [style.background-color]="backgroundColor()"
-      [attr.title]="title()"
-      [attr.aria-label]="title()"
-      (mousedown)="onMouseDown($event)"
-      (click)="onClick.emit($event)"
-      type="button"
-    >
-      @if (icon()) {
-        <span
-          class="material-symbols-outlined"
-          [class.icon-small]="iconSize() === 'small'"
-          [class.icon-medium]="iconSize() === 'medium'"
-          [class.icon-large]="iconSize() === 'large'"
-          >{{ icon() }}</span>
-      }
-      <ng-content></ng-content>
-    </button>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapButtonComponent, isStandalone: true, selector: "tiptap-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, backgroundColor: { classPropertyName: "backgroundColor", publicName: "backgroundColor", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onClick: "onClick" }, ngImport: i0, template: `
+    <button
+      class="tiptap-button"
+      [class.is-active]="active()"
+      [class.is-disabled]="disabled()"
+      [class.text-button]="variant() === 'text'"
+      [class.danger]="variant() === 'danger'"
+      [class.small]="size() === 'small'"
+      [class.medium]="size() === 'medium'"
+      [class.large]="size() === 'large'"
+      [class.has-custom-color]="!!color()"
+      [class.has-custom-bg]="!!backgroundColor()"
+      [disabled]="disabled()"
+      [style.color]="color()"
+      [style.background-color]="backgroundColor()"
+      [attr.title]="title()"
+      [attr.aria-label]="title()"
+      (mousedown)="onMouseDown($event)"
+      (click)="onClick.emit($event)"
+      type="button"
+    >
+      @if (icon()) {
+        <span
+          class="material-symbols-outlined"
+          [class.icon-small]="iconSize() === 'small'"
+          [class.icon-medium]="iconSize() === 'medium'"
+          [class.icon-large]="iconSize() === 'large'"
+          >{{ icon() }}</span>
+      }
+      <ng-content></ng-content>
+    </button>
   `, isInline: true, styles: [".tiptap-button{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;border-radius:var(--ate-sub-border-radius, 8px);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);color:var(--ate-toolbar-button-color, var(--ate-text-secondary));position:relative;overflow:hidden}.tiptap-button:before{content:\"\";position:absolute;inset:0;background:var(--ate-primary);opacity:0;transition:opacity .2s ease;border-radius:var(--ate-sub-border-radius, 8px)}.tiptap-button:hover:not(.has-custom-color){color:var(--ate-toolbar-button-active-color, var(--ate-primary));background:var(--ate-toolbar-button-hover-background, transparent);transform:translateY(-1px)}.tiptap-button.has-custom-color:hover:not(.has-custom-bg){background:var(--ate-toolbar-button-hover-background, transparent);transform:translateY(-1px)}.tiptap-button.has-custom-bg:hover{transform:translateY(-1px);filter:brightness(.9)}.tiptap-button:hover:before{opacity:.1}.tiptap-button:active{transform:translateY(0)}.tiptap-button.is-active:not(.has-custom-color){color:var(--ate-toolbar-button-active-color, var(--ate-primary));background:var(--ate-toolbar-button-active-background, var(--ate-primary-light))}.tiptap-button.is-active.has-custom-color{background:var(--ate-toolbar-button-active-background, var(--ate-primary-light))}.tiptap-button:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.tiptap-button .material-symbols-outlined{font-size:20px;position:relative;z-index:1}.tiptap-button .material-symbols-outlined.icon-small{font-size:16px}.tiptap-button .material-symbols-outlined.icon-medium{font-size:20px}.tiptap-button .material-symbols-outlined.icon-large{font-size:24px}.tiptap-button.text-button{width:auto;padding:0 12px;font-size:14px;font-weight:500;gap:8px}.tiptap-button.color-button{width:28px;height:28px;border-radius:50%;border:2px solid transparent;transition:all .2s ease}.tiptap-button.color-button:hover{border-color:var(--ate-border);transform:scale(1.1)}.tiptap-button.color-button.is-active{border-color:var(--ate-primary);box-shadow:0 0 0 2px var(--ate-primary-light)}.tiptap-button.danger{color:var(--ate-error-color, #ef4444)}.tiptap-button.danger:hover{color:var(--ate-error-color, #ef4444);background:var(--ate-error-bg, rgba(239, 68, 68, .1))}.tiptap-button.danger:before{background:var(--ate-error-color, #ef4444)}.tiptap-button.small{width:24px;height:24px}.tiptap-button.medium{width:32px;height:32px}.tiptap-button.large{width:40px;height:40px}@keyframes pulse{0%,to{box-shadow:0 0 0 0 var(--ate-primary-light-alpha)}50%{box-shadow:0 0 0 4px transparent}}.tiptap-button.is-active.pulse{animation:pulse 2s infinite}@media (max-width: 768px){.tiptap-button{width:32px;height:32px}.tiptap-button .material-symbols-outlined{font-size:18px}.tiptap-button.text-button{padding:0 8px;font-size:13px}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: "tiptap-button", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
-    <button
-      class="tiptap-button"
-      [class.is-active]="active()"
-      [class.is-disabled]="disabled()"
-      [class.text-button]="variant() === 'text'"
-      [class.danger]="variant() === 'danger'"
-      [class.small]="size() === 'small'"
-      [class.medium]="size() === 'medium'"
-      [class.large]="size() === 'large'"
-      [class.has-custom-color]="!!color()"
-      [class.has-custom-bg]="!!backgroundColor()"
-      [disabled]="disabled()"
-      [style.color]="color()"
-      [style.background-color]="backgroundColor()"
-      [attr.title]="title()"
-      [attr.aria-label]="title()"
-      (mousedown)="onMouseDown($event)"
-      (click)="onClick.emit($event)"
-      type="button"
-    >
-      @if (icon()) {
-        <span
-          class="material-symbols-outlined"
-          [class.icon-small]="iconSize() === 'small'"
-          [class.icon-medium]="iconSize() === 'medium'"
-          [class.icon-large]="iconSize() === 'large'"
-          >{{ icon() }}</span>
-      }
-      <ng-content></ng-content>
-    </button>
+            args: [{ selector: "tiptap-button", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    <button
+      class="tiptap-button"
+      [class.is-active]="active()"
+      [class.is-disabled]="disabled()"
+      [class.text-button]="variant() === 'text'"
+      [class.danger]="variant() === 'danger'"
+      [class.small]="size() === 'small'"
+      [class.medium]="size() === 'medium'"
+      [class.large]="size() === 'large'"
+      [class.has-custom-color]="!!color()"
+      [class.has-custom-bg]="!!backgroundColor()"
+      [disabled]="disabled()"
+      [style.color]="color()"
+      [style.background-color]="backgroundColor()"
+      [attr.title]="title()"
+      [attr.aria-label]="title()"
+      (mousedown)="onMouseDown($event)"
+      (click)="onClick.emit($event)"
+      type="button"
+    >
+      @if (icon()) {
+        <span
+          class="material-symbols-outlined"
+          [class.icon-small]="iconSize() === 'small'"
+          [class.icon-medium]="iconSize() === 'medium'"
+          [class.icon-large]="iconSize() === 'large'"
+          >{{ icon() }}</span>
+      }
+      <ng-content></ng-content>
+    </button>
   `, styles: [".tiptap-button{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;border-radius:var(--ate-sub-border-radius, 8px);cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);color:var(--ate-toolbar-button-color, var(--ate-text-secondary));position:relative;overflow:hidden}.tiptap-button:before{content:\"\";position:absolute;inset:0;background:var(--ate-primary);opacity:0;transition:opacity .2s ease;border-radius:var(--ate-sub-border-radius, 8px)}.tiptap-button:hover:not(.has-custom-color){color:var(--ate-toolbar-button-active-color, var(--ate-primary));background:var(--ate-toolbar-button-hover-background, transparent);transform:translateY(-1px)}.tiptap-button.has-custom-color:hover:not(.has-custom-bg){background:var(--ate-toolbar-button-hover-background, transparent);transform:translateY(-1px)}.tiptap-button.has-custom-bg:hover{transform:translateY(-1px);filter:brightness(.9)}.tiptap-button:hover:before{opacity:.1}.tiptap-button:active{transform:translateY(0)}.tiptap-button.is-active:not(.has-custom-color){color:var(--ate-toolbar-button-active-color, var(--ate-primary));background:var(--ate-toolbar-button-active-background, var(--ate-primary-light))}.tiptap-button.is-active.has-custom-color{background:var(--ate-toolbar-button-active-background, var(--ate-primary-light))}.tiptap-button:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.tiptap-button .material-symbols-outlined{font-size:20px;position:relative;z-index:1}.tiptap-button .material-symbols-outlined.icon-small{font-size:16px}.tiptap-button .material-symbols-outlined.icon-medium{font-size:20px}.tiptap-button .material-symbols-outlined.icon-large{font-size:24px}.tiptap-button.text-button{width:auto;padding:0 12px;font-size:14px;font-weight:500;gap:8px}.tiptap-button.color-button{width:28px;height:28px;border-radius:50%;border:2px solid transparent;transition:all .2s ease}.tiptap-button.color-button:hover{border-color:var(--ate-border);transform:scale(1.1)}.tiptap-button.color-button.is-active{border-color:var(--ate-primary);box-shadow:0 0 0 2px var(--ate-primary-light)}.tiptap-button.danger{color:var(--ate-error-color, #ef4444)}.tiptap-button.danger:hover{color:var(--ate-error-color, #ef4444);background:var(--ate-error-bg, rgba(239, 68, 68, .1))}.tiptap-button.danger:before{background:var(--ate-error-color, #ef4444)}.tiptap-button.small{width:24px;height:24px}.tiptap-button.medium{width:32px;height:32px}.tiptap-button.large{width:40px;height:40px}@keyframes pulse{0%,to{box-shadow:0 0 0 0 var(--ate-primary-light-alpha)}50%{box-shadow:0 0 0 4px transparent}}.tiptap-button.is-active.pulse{animation:pulse 2s infinite}@media (max-width: 768px){.tiptap-button{width:32px;height:32px}.tiptap-button .material-symbols-outlined{font-size:18px}.tiptap-button.text-button{padding:0 8px;font-size:13px}}\n"] }]
         }] });
 
@@ -779,28 +778,28 @@ class TiptapSeparatorComponent {
         this.size = input("medium");
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapSeparatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.0", type: TiptapSeparatorComponent, isStandalone: true, selector: "tiptap-separator", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
-    <div
-      class="tiptap-separator"
-      [class.vertical]="orientation() === 'vertical'"
-      [class.horizontal]="orientation() === 'horizontal'"
-      [class.small]="size() === 'small'"
-      [class.medium]="size() === 'medium'"
-      [class.large]="size() === 'large'"
-    ></div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.0", type: TiptapSeparatorComponent, isStandalone: true, selector: "tiptap-separator", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <div
+      class="tiptap-separator"
+      [class.vertical]="orientation() === 'vertical'"
+      [class.horizontal]="orientation() === 'horizontal'"
+      [class.small]="size() === 'small'"
+      [class.medium]="size() === 'medium'"
+      [class.large]="size() === 'large'"
+    ></div>
   `, isInline: true, styles: [".tiptap-separator{background-color:var(--ate-border, #e2e8f0);margin:0}.tiptap-separator.vertical{width:1px;height:24px;margin:0 8px}.tiptap-separator.horizontal{height:1px;width:100%;margin:8px 0}.tiptap-separator.small.vertical{height:16px;margin:0 4px}.tiptap-separator.small.horizontal{margin:4px 0}.tiptap-separator.medium.vertical{height:24px;margin:0 8px}.tiptap-separator.medium.horizontal{margin:8px 0}.tiptap-separator.large.vertical{height:32px;margin:0 12px}.tiptap-separator.large.horizontal{margin:12px 0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapSeparatorComponent, decorators: [{
             type: Component,
-            args: [{ selector: "tiptap-separator", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
-    <div
-      class="tiptap-separator"
-      [class.vertical]="orientation() === 'vertical'"
-      [class.horizontal]="orientation() === 'horizontal'"
-      [class.small]="size() === 'small'"
-      [class.medium]="size() === 'medium'"
-      [class.large]="size() === 'large'"
-    ></div>
+            args: [{ selector: "tiptap-separator", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    <div
+      class="tiptap-separator"
+      [class.vertical]="orientation() === 'vertical'"
+      [class.horizontal]="orientation() === 'horizontal'"
+      [class.small]="size() === 'small'"
+      [class.medium]="size() === 'medium'"
+      [class.large]="size() === 'large'"
+    ></div>
   `, styles: [".tiptap-separator{background-color:var(--ate-border, #e2e8f0);margin:0}.tiptap-separator.vertical{width:1px;height:24px;margin:0 8px}.tiptap-separator.horizontal{height:1px;width:100%;margin:8px 0}.tiptap-separator.small.vertical{height:16px;margin:0 4px}.tiptap-separator.small.horizontal{margin:4px 0}.tiptap-separator.medium.vertical{height:24px;margin:0 8px}.tiptap-separator.medium.horizontal{margin:8px 0}.tiptap-separator.large.vertical{height:32px;margin:0 12px}.tiptap-separator.large.horizontal{margin:12px 0}\n"] }]
         }] });
 
@@ -956,6 +955,8 @@ const ENGLISH_TRANSLATIONS = {
         linkPrompt: "Enter link URL",
         linkUrlPrompt: "Enter URL",
         confirmDelete: "Are you sure you want to delete this?",
+        toggleEdit: "Switch to Edit Mode",
+        viewMode: "Switch to View Mode",
     },
     common: {
         cancel: "Cancel",
@@ -1130,6 +1131,8 @@ const FRENCH_TRANSLATIONS = {
         linkPrompt: "Entrez l'URL du lien",
         linkUrlPrompt: "Entrez l'URL",
         confirmDelete: "Êtes-vous sûr de vouloir supprimer ceci ?",
+        toggleEdit: "Passer en mode édition",
+        viewMode: "Passer en mode affichage",
     },
     common: {
         cancel: "Annuler",
@@ -2369,60 +2372,60 @@ class TiptapColorPickerComponent {
         this.colorPickerSvc.close();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapColorPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapColorPickerComponent, isStandalone: true, selector: "tiptap-color-picker", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, anchorToText: { classPropertyName: "anchorToText", publicName: "anchorToText", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
-    <div class="color-picker-wrapper">
-      <div class="color-picker-container" [class.is-highlight]="mode() === 'highlight'">
-        <tiptap-button
-          [icon]="buttonIcon()"
-          [title]="mode() === 'text' ? t().textColor : t().highlight"
-          [color]="buttonTextColor()"
-          [backgroundColor]="buttonBgColor()"
-          [disabled]="disabled() || !state().isEditable"
-          (onClick)="onToggle($event)"
-        />
-
-        @if (hasColorApplied()) {
-        <button
-          class="btn-clear-badge"
-          type="button"
-          [title]="t().clear"
-          [attr.aria-label]="t().clear"
-          (click)="onClear($event)"
-        >
-          <span class="material-symbols-outlined">close</span>
-        </button>
-        }
-      </div>
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapColorPickerComponent, isStandalone: true, selector: "tiptap-color-picker", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, anchorToText: { classPropertyName: "anchorToText", publicName: "anchorToText", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <div class="color-picker-wrapper">
+      <div class="color-picker-container" [class.is-highlight]="mode() === 'highlight'">
+        <tiptap-button
+          [icon]="buttonIcon()"
+          [title]="mode() === 'text' ? t().textColor : t().highlight"
+          [color]="buttonTextColor()"
+          [backgroundColor]="buttonBgColor()"
+          [disabled]="disabled() || !state().isEditable"
+          (onClick)="onToggle($event)"
+        />
+
+        @if (hasColorApplied()) {
+        <button
+          class="btn-clear-badge"
+          type="button"
+          [title]="t().clear"
+          [attr.aria-label]="t().clear"
+          (click)="onClear($event)"
+        >
+          <span class="material-symbols-outlined">close</span>
+        </button>
+        }
+      </div>
+    </div>
   `, isInline: true, styles: [".color-picker-wrapper{position:relative;display:inline-block}.color-picker-container{position:relative;display:inline-flex;align-items:center}.btn-clear-badge{position:absolute;top:-4px;right:-4px;width:14px;height:14px;padding:0;border:none;border-radius:999px;background:#0f172abf;color:#fff;display:flex;align-items:center;justify-content:center;z-index:10;opacity:0;pointer-events:none;transition:opacity .12s ease}.color-picker-container:hover .btn-clear-badge{opacity:1;pointer-events:auto}.btn-clear-badge .material-symbols-outlined{font-size:10px;line-height:1}\n"], dependencies: [{ kind: "component", type: TiptapButtonComponent, selector: "tiptap-button", inputs: ["icon", "title", "active", "disabled", "color", "backgroundColor", "variant", "size", "iconSize"], outputs: ["onClick"] }, { kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapColorPickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: "tiptap-color-picker", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [TiptapButtonComponent, CommonModule], template: `
-    <div class="color-picker-wrapper">
-      <div class="color-picker-container" [class.is-highlight]="mode() === 'highlight'">
-        <tiptap-button
-          [icon]="buttonIcon()"
-          [title]="mode() === 'text' ? t().textColor : t().highlight"
-          [color]="buttonTextColor()"
-          [backgroundColor]="buttonBgColor()"
-          [disabled]="disabled() || !state().isEditable"
-          (onClick)="onToggle($event)"
-        />
-
-        @if (hasColorApplied()) {
-        <button
-          class="btn-clear-badge"
-          type="button"
-          [title]="t().clear"
-          [attr.aria-label]="t().clear"
-          (click)="onClear($event)"
-        >
-          <span class="material-symbols-outlined">close</span>
-        </button>
-        }
-      </div>
-    </div>
+            args: [{ selector: "tiptap-color-picker", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [TiptapButtonComponent, CommonModule], template: `
+    <div class="color-picker-wrapper">
+      <div class="color-picker-container" [class.is-highlight]="mode() === 'highlight'">
+        <tiptap-button
+          [icon]="buttonIcon()"
+          [title]="mode() === 'text' ? t().textColor : t().highlight"
+          [color]="buttonTextColor()"
+          [backgroundColor]="buttonBgColor()"
+          [disabled]="disabled() || !state().isEditable"
+          (onClick)="onToggle($event)"
+        />
+
+        @if (hasColorApplied()) {
+        <button
+          class="btn-clear-badge"
+          type="button"
+          [title]="t().clear"
+          [attr.aria-label]="t().clear"
+          (click)="onClear($event)"
+        >
+          <span class="material-symbols-outlined">close</span>
+        </button>
+        }
+      </div>
+    </div>
   `, styles: [".color-picker-wrapper{position:relative;display:inline-block}.color-picker-container{position:relative;display:inline-flex;align-items:center}.btn-clear-badge{position:absolute;top:-4px;right:-4px;width:14px;height:14px;padding:0;border:none;border-radius:999px;background:#0f172abf;color:#fff;display:flex;align-items:center;justify-content:center;z-index:10;opacity:0;pointer-events:none;transition:opacity .12s ease}.color-picker-container:hover .btn-clear-badge{opacity:1;pointer-events:auto}.btn-clear-badge .material-symbols-outlined{font-size:10px;line-height:1}\n"] }]
         }] });
 
@@ -2444,241 +2447,241 @@ class TiptapToolbarComponent {
         this.editorCommands.execute(editor, command, ...args);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapToolbarComponent, isStandalone: true, selector: "tiptap-toolbar", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, imageUpload: { classPropertyName: "imageUpload", publicName: "imageUpload", isSignal: true, isRequired: false, transformFunction: null }, floating: { classPropertyName: "floating", publicName: "floating", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
-    <div class="tiptap-toolbar" [class.floating]="floating()">
-      @if (config().bold) {
-      <tiptap-button
-        icon="format_bold"
-        [title]="t().bold"
-        [active]="state().marks.bold"
-        [disabled]="!state().can.toggleBold"
-        (onClick)="onCommand('toggleBold')"
-      />
-      } @if (config().italic) {
-      <tiptap-button
-        icon="format_italic"
-        [title]="t().italic"
-        [active]="state().marks.italic"
-        [disabled]="!state().can.toggleItalic"
-        (onClick)="onCommand('toggleItalic')"
-      />
-      } @if (config().underline) {
-      <tiptap-button
-        icon="format_underlined"
-        [title]="t().underline"
-        [active]="state().marks.underline"
-        [disabled]="!state().can.toggleUnderline"
-        (onClick)="onCommand('toggleUnderline')"
-      />
-      } @if (config().strike) {
-      <tiptap-button
-        icon="strikethrough_s"
-        [title]="t().strike"
-        [active]="state().marks.strike"
-        [disabled]="!state().can.toggleStrike"
-        (onClick)="onCommand('toggleStrike')"
-      />
-      } @if (config().code) {
-      <tiptap-button
-        icon="code"
-        [title]="t().code"
-        [active]="state().marks.code"
-        [disabled]="!state().can.toggleCode"
-        (onClick)="onCommand('toggleCode')"
-      />
-      } @if (config().codeBlock) {
-      <tiptap-button
-        icon="terminal"
-        [title]="t().codeBlock"
-        [active]="state().nodes.isCodeBlock"
-        [disabled]="!state().can.toggleCodeBlock"
-        (onClick)="onCommand('toggleCodeBlock')"
-      />
-      } @if (config().superscript) {
-      <tiptap-button
-        icon="superscript"
-        [title]="t().superscript"
-        [active]="state().marks.superscript"
-        [disabled]="!state().can.toggleSuperscript"
-        (onClick)="onCommand('toggleSuperscript')"
-      />
-      } @if (config().subscript) {
-      <tiptap-button
-        icon="subscript"
-        [title]="t().subscript"
-        [active]="state().marks.subscript"
-        [disabled]="!state().can.toggleSubscript"
-        (onClick)="onCommand('toggleSubscript')"
-      />
-      } @if (config().highlight) {
-      <tiptap-button
-        icon="highlight"
-        [title]="t().highlight"
-        [active]="state().marks.highlight"
-        [disabled]="!state().can.toggleHighlight"
-        (onClick)="onCommand('toggleHighlight')"
-      />
-      } @if (config().highlightPicker) {
-      <tiptap-color-picker 
-        mode="highlight" 
-        [editor]="editor()" 
-        [disabled]="!state().can.setHighlight"
-      />
-      } @if (config().textColor) {
-      <tiptap-color-picker 
-        mode="text" 
-        [editor]="editor()" 
-        [disabled]="!state().can.setColor"
-      />
-      }
-      
-      @if (config().separator && (config().heading1 || config().heading2 || config().heading3)) {
-      <tiptap-separator />
-      } @if (config().heading1) {
-      <tiptap-button
-        icon="format_h1"
-        [title]="t().heading1"
-        [active]="state().nodes.h1"
-        [disabled]="!state().can.toggleHeading1"
-        (onClick)="onCommand('toggleHeading', 1)"
-      />
-      } @if (config().heading2) {
-      <tiptap-button
-        icon="format_h2"
-        [title]="t().heading2"
-        [active]="state().nodes.h2"
-        [disabled]="!state().can.toggleHeading2"
-        (onClick)="onCommand('toggleHeading', 2)"
-      />
-      } @if (config().heading3) {
-      <tiptap-button
-        icon="format_h3"
-        [title]="t().heading3"
-        [active]="state().nodes.h3"
-        [disabled]="!state().can.toggleHeading3"
-        (onClick)="onCommand('toggleHeading', 3)"
-      />
-      } @if (config().separator && (config().bulletList || config().orderedList || config().blockquote)) {
-      <tiptap-separator />
-      } @if (config().bulletList) {
-      <tiptap-button
-        icon="format_list_bulleted"
-        [title]="t().bulletList"
-        [active]="state().nodes.isBulletList"
-        [disabled]="!state().can.toggleBulletList"
-        (onClick)="onCommand('toggleBulletList')"
-      />
-      } @if (config().orderedList) {
-      <tiptap-button
-        icon="format_list_numbered"
-        [title]="t().orderedList"
-        [active]="state().nodes.isOrderedList"
-        [disabled]="!state().can.toggleOrderedList"
-        (onClick)="onCommand('toggleOrderedList')"
-      />
-      } @if (config().blockquote) {
-      <tiptap-button
-        icon="format_quote"
-        [title]="t().blockquote"
-        [active]="state().nodes.isBlockquote"
-        [disabled]="!state().can.toggleBlockquote"
-        (onClick)="onCommand('toggleBlockquote')"
-      />
-      } @if (config().separator && (config().alignLeft || config().alignCenter || config().alignRight || config().alignJustify)) {
-      <tiptap-separator />
-      } @if (config().alignLeft) {
-      <tiptap-button
-        icon="format_align_left"
-        [title]="t().alignLeft"
-        [active]="state().nodes.alignLeft"
-        [disabled]="!state().can.setTextAlignLeft"
-        (onClick)="onCommand('setTextAlign', 'left')"
-      />
-      } @if (config().alignCenter) {
-      <tiptap-button
-        icon="format_align_center"
-        [title]="t().alignCenter"
-        [active]="state().nodes.alignCenter"
-        [disabled]="!state().can.setTextAlignCenter"
-        (onClick)="onCommand('setTextAlign', 'center')"
-      />
-      } @if (config().alignRight) {
-      <tiptap-button
-        icon="format_align_right"
-        [title]="t().alignRight"
-        [active]="state().nodes.alignRight"
-        [disabled]="!state().can.setTextAlignRight"
-        (onClick)="onCommand('setTextAlign', 'right')"
-      />
-      } @if (config().alignJustify) {
-      <tiptap-button
-        icon="format_align_justify"
-        [title]="t().alignJustify"
-        [active]="state().nodes.alignJustify"
-        [disabled]="!state().can.setTextAlignJustify"
-        (onClick)="onCommand('setTextAlign', 'justify')"
-      />
-      } @if (config().separator && (config().link || config().horizontalRule)) {
-      <tiptap-separator />
-      } @if (config().link) {
-      <tiptap-button
-        icon="link"
-        [title]="t().link"
-        [active]="state().marks.link"
-        [disabled]="!state().can.toggleLink"
-        (onClick)="onCommand('toggleLink', $event)"
-      />
-      } @if (config().horizontalRule) {
-      <tiptap-button
-        icon="horizontal_rule"
-        [title]="t().horizontalRule"
-        [disabled]="!state().can.insertHorizontalRule"
-        (onClick)="onCommand('insertHorizontalRule')"
-      />
-      } @if (config().table) {
-      <tiptap-button
-        icon="table_view"
-        [title]="t().table"
-        [disabled]="!state().can.insertTable"
-        (onClick)="onCommand('insertTable')"
-      />
-      } @if (config().separator && config().image) {
-      <tiptap-separator />
-      } @if (config().image) {
-      <tiptap-button
-        icon="image"
-        [title]="t().image"
-        [disabled]="!state().can.insertImage"
-        (onClick)="onCommand('insertImage', imageUpload())"
-      />
-      } @if (config().separator && (config().undo || config().redo)) {
-      <tiptap-separator />
-      } @if (config().undo) {
-      <tiptap-button
-        icon="undo"
-        [title]="t().undo"
-        [disabled]="!state().can.undo"
-        (onClick)="onCommand('undo')"
-      />
-      } @if (config().redo) {
-      <tiptap-button
-        icon="redo"
-        [title]="t().redo"
-        [disabled]="!state().can.redo"
-        (onClick)="onCommand('redo')"
-      />
-      } @if (config().separator && config().clear) {
-      <tiptap-separator />
-      } @if (config().clear) {
-      <tiptap-button
-        icon="delete"
-        [title]="t().clear"
-        [disabled]="!state().isEditable"
-        (onClick)="onCommand('clearContent')"
-      />
-      }
-    </div>
-  `, isInline: true, styles: [":host{display:block;transition:opacity .3s ease}:host-context(.floating-toolbar){position:sticky;top:3rem;left:0;right:0;z-index:100;display:flex;height:0;overflow:visible;pointer-events:none;opacity:0}:host-context(.floating-toolbar:focus-within),:host-context(.floating-toolbar:hover){opacity:1}.tiptap-toolbar{display:flex;align-items:center;gap:4px;padding:var(--ate-toolbar-padding);background:var(--ate-toolbar-background);border-bottom:1px solid var(--ate-toolbar-border-color);flex-wrap:wrap;min-height:32px;position:relative;z-index:50;border-top-left-radius:calc(var(--ate-menu-border-radius, 8px) - var(--ate-border-width, 2px));border-top-right-radius:calc(var(--ate-menu-border-radius, 8px) - var(--ate-border-width, 2px))}.tiptap-toolbar.floating{pointer-events:auto;border-radius:var(--ate-menu-border-radius, 8px);border:1px solid var(--ate-menu-border)!important;box-shadow:var(--ate-menu-shadow)!important;background:var(--ate-menu-bg)!important;padding:var(--ate-menu-padding)!important;flex-wrap:nowrap;overflow-x:auto;max-width:95vw;scrollbar-width:none;transform:translateY(0);transition:transform .3s cubic-bezier(.4,0,.2,1)}.tiptap-toolbar.floating::-webkit-scrollbar{display:none}:host-context(.floating-toolbar:focus-within) .tiptap-toolbar.floating,:host-context(.floating-toolbar:hover) .tiptap-toolbar.floating{transform:translateY(-2rem)}@media (max-width: 768px){.tiptap-toolbar{padding:6px 8px;gap:2px}}@keyframes toolbarSlideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.tiptap-toolbar{animation:toolbarSlideIn .3s cubic-bezier(.4,0,.2,1)}\n"], dependencies: [{ kind: "component", type: TiptapButtonComponent, selector: "tiptap-button", inputs: ["icon", "title", "active", "disabled", "color", "backgroundColor", "variant", "size", "iconSize"], outputs: ["onClick"] }, { kind: "component", type: TiptapSeparatorComponent, selector: "tiptap-separator", inputs: ["orientation", "size"] }, { kind: "component", type: TiptapColorPickerComponent, selector: "tiptap-color-picker", inputs: ["editor", "mode", "disabled", "anchorToText"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapToolbarComponent, isStandalone: true, selector: "tiptap-toolbar", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null }, imageUpload: { classPropertyName: "imageUpload", publicName: "imageUpload", isSignal: true, isRequired: false, transformFunction: null }, floating: { classPropertyName: "floating", publicName: "floating", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <div class="tiptap-toolbar" [class.floating]="floating()">
+      @if (config().bold) {
+      <tiptap-button
+        icon="format_bold"
+        [title]="t().bold"
+        [active]="state().marks.bold"
+        [disabled]="!state().can.toggleBold"
+        (onClick)="onCommand('toggleBold')"
+      />
+      } @if (config().italic) {
+      <tiptap-button
+        icon="format_italic"
+        [title]="t().italic"
+        [active]="state().marks.italic"
+        [disabled]="!state().can.toggleItalic"
+        (onClick)="onCommand('toggleItalic')"
+      />
+      } @if (config().underline) {
+      <tiptap-button
+        icon="format_underlined"
+        [title]="t().underline"
+        [active]="state().marks.underline"
+        [disabled]="!state().can.toggleUnderline"
+        (onClick)="onCommand('toggleUnderline')"
+      />
+      } @if (config().strike) {
+      <tiptap-button
+        icon="strikethrough_s"
+        [title]="t().strike"
+        [active]="state().marks.strike"
+        [disabled]="!state().can.toggleStrike"
+        (onClick)="onCommand('toggleStrike')"
+      />
+      } @if (config().code) {
+      <tiptap-button
+        icon="code"
+        [title]="t().code"
+        [active]="state().marks.code"
+        [disabled]="!state().can.toggleCode"
+        (onClick)="onCommand('toggleCode')"
+      />
+      } @if (config().codeBlock) {
+      <tiptap-button
+        icon="terminal"
+        [title]="t().codeBlock"
+        [active]="state().nodes.isCodeBlock"
+        [disabled]="!state().can.toggleCodeBlock"
+        (onClick)="onCommand('toggleCodeBlock')"
+      />
+      } @if (config().superscript) {
+      <tiptap-button
+        icon="superscript"
+        [title]="t().superscript"
+        [active]="state().marks.superscript"
+        [disabled]="!state().can.toggleSuperscript"
+        (onClick)="onCommand('toggleSuperscript')"
+      />
+      } @if (config().subscript) {
+      <tiptap-button
+        icon="subscript"
+        [title]="t().subscript"
+        [active]="state().marks.subscript"
+        [disabled]="!state().can.toggleSubscript"
+        (onClick)="onCommand('toggleSubscript')"
+      />
+      } @if (config().highlight) {
+      <tiptap-button
+        icon="highlight"
+        [title]="t().highlight"
+        [active]="state().marks.highlight"
+        [disabled]="!state().can.toggleHighlight"
+        (onClick)="onCommand('toggleHighlight')"
+      />
+      } @if (config().highlightPicker) {
+      <tiptap-color-picker 
+        mode="highlight" 
+        [editor]="editor()" 
+        [disabled]="!state().can.setHighlight"
+      />
+      } @if (config().textColor) {
+      <tiptap-color-picker 
+        mode="text" 
+        [editor]="editor()" 
+        [disabled]="!state().can.setColor"
+      />
+      }
+      
+      @if (config().separator && (config().heading1 || config().heading2 || config().heading3)) {
+      <tiptap-separator />
+      } @if (config().heading1) {
+      <tiptap-button
+        icon="format_h1"
+        [title]="t().heading1"
+        [active]="state().nodes.h1"
+        [disabled]="!state().can.toggleHeading1"
+        (onClick)="onCommand('toggleHeading', 1)"
+      />
+      } @if (config().heading2) {
+      <tiptap-button
+        icon="format_h2"
+        [title]="t().heading2"
+        [active]="state().nodes.h2"
+        [disabled]="!state().can.toggleHeading2"
+        (onClick)="onCommand('toggleHeading', 2)"
+      />
+      } @if (config().heading3) {
+      <tiptap-button
+        icon="format_h3"
+        [title]="t().heading3"
+        [active]="state().nodes.h3"
+        [disabled]="!state().can.toggleHeading3"
+        (onClick)="onCommand('toggleHeading', 3)"
+      />
+      } @if (config().separator && (config().bulletList || config().orderedList || config().blockquote)) {
+      <tiptap-separator />
+      } @if (config().bulletList) {
+      <tiptap-button
+        icon="format_list_bulleted"
+        [title]="t().bulletList"
+        [active]="state().nodes.isBulletList"
+        [disabled]="!state().can.toggleBulletList"
+        (onClick)="onCommand('toggleBulletList')"
+      />
+      } @if (config().orderedList) {
+      <tiptap-button
+        icon="format_list_numbered"
+        [title]="t().orderedList"
+        [active]="state().nodes.isOrderedList"
+        [disabled]="!state().can.toggleOrderedList"
+        (onClick)="onCommand('toggleOrderedList')"
+      />
+      } @if (config().blockquote) {
+      <tiptap-button
+        icon="format_quote"
+        [title]="t().blockquote"
+        [active]="state().nodes.isBlockquote"
+        [disabled]="!state().can.toggleBlockquote"
+        (onClick)="onCommand('toggleBlockquote')"
+      />
+      } @if (config().separator && (config().alignLeft || config().alignCenter || config().alignRight || config().alignJustify)) {
+      <tiptap-separator />
+      } @if (config().alignLeft) {
+      <tiptap-button
+        icon="format_align_left"
+        [title]="t().alignLeft"
+        [active]="state().nodes.alignLeft"
+        [disabled]="!state().can.setTextAlignLeft"
+        (onClick)="onCommand('setTextAlign', 'left')"
+      />
+      } @if (config().alignCenter) {
+      <tiptap-button
+        icon="format_align_center"
+        [title]="t().alignCenter"
+        [active]="state().nodes.alignCenter"
+        [disabled]="!state().can.setTextAlignCenter"
+        (onClick)="onCommand('setTextAlign', 'center')"
+      />
+      } @if (config().alignRight) {
+      <tiptap-button
+        icon="format_align_right"
+        [title]="t().alignRight"
+        [active]="state().nodes.alignRight"
+        [disabled]="!state().can.setTextAlignRight"
+        (onClick)="onCommand('setTextAlign', 'right')"
+      />
+      } @if (config().alignJustify) {
+      <tiptap-button
+        icon="format_align_justify"
+        [title]="t().alignJustify"
+        [active]="state().nodes.alignJustify"
+        [disabled]="!state().can.setTextAlignJustify"
+        (onClick)="onCommand('setTextAlign', 'justify')"
+      />
+      } @if (config().separator && (config().link || config().horizontalRule)) {
+      <tiptap-separator />
+      } @if (config().link) {
+      <tiptap-button
+        icon="link"
+        [title]="t().link"
+        [active]="state().marks.link"
+        [disabled]="!state().can.toggleLink"
+        (onClick)="onCommand('toggleLink', $event)"
+      />
+      } @if (config().horizontalRule) {
+      <tiptap-button
+        icon="horizontal_rule"
+        [title]="t().horizontalRule"
+        [disabled]="!state().can.insertHorizontalRule"
+        (onClick)="onCommand('insertHorizontalRule')"
+      />
+      } @if (config().table) {
+      <tiptap-button
+        icon="table_view"
+        [title]="t().table"
+        [disabled]="!state().can.insertTable"
+        (onClick)="onCommand('insertTable')"
+      />
+      } @if (config().separator && config().image) {
+      <tiptap-separator />
+      } @if (config().image) {
+      <tiptap-button
+        icon="image"
+        [title]="t().image"
+        [disabled]="!state().can.insertImage"
+        (onClick)="onCommand('insertImage', imageUpload())"
+      />
+      } @if (config().separator && (config().undo || config().redo)) {
+      <tiptap-separator />
+      } @if (config().undo) {
+      <tiptap-button
+        icon="undo"
+        [title]="t().undo"
+        [disabled]="!state().can.undo"
+        (onClick)="onCommand('undo')"
+      />
+      } @if (config().redo) {
+      <tiptap-button
+        icon="redo"
+        [title]="t().redo"
+        [disabled]="!state().can.redo"
+        (onClick)="onCommand('redo')"
+      />
+      } @if (config().separator && config().clear) {
+      <tiptap-separator />
+      } @if (config().clear) {
+      <tiptap-button
+        icon="delete"
+        [title]="t().clear"
+        [disabled]="!state().isEditable"
+        (onClick)="onCommand('clearContent')"
+      />
+      }
+    </div>
+  `, isInline: true, styles: [":host{display:block;transition:opacity .3s ease}:host-context(.floating-toolbar){position:sticky;top:3rem;left:0;right:0;z-index:100;display:flex;height:0;overflow:visible;pointer-events:none;opacity:0}:host-context(.floating-toolbar:focus-within),:host-context(.floating-toolbar:hover){opacity:1}.tiptap-toolbar{display:flex;align-items:center;gap:4px;padding:var(--ate-toolbar-padding);background:var(--ate-toolbar-background);border-bottom:1px solid var(--ate-toolbar-border-color);flex-wrap:wrap;min-height:32px;position:relative;z-index:50;border-top-left-radius:calc(var(--ate-menu-border-radius, 12px) - var(--ate-border-width, 2px));border-top-right-radius:calc(var(--ate-menu-border-radius, 12px) - var(--ate-border-width, 2px))}.tiptap-toolbar.floating{pointer-events:auto;border-radius:var(--ate-menu-border-radius, 12px);border:1px solid var(--ate-menu-border)!important;box-shadow:var(--ate-menu-shadow)!important;background:var(--ate-menu-bg)!important;padding:var(--ate-menu-padding)!important;flex-wrap:nowrap;overflow-x:auto;max-width:95vw;scrollbar-width:none;transform:translateY(0);transition:transform .3s cubic-bezier(.4,0,.2,1)}.tiptap-toolbar.floating::-webkit-scrollbar{display:none}:host-context(.floating-toolbar:focus-within) .tiptap-toolbar.floating,:host-context(.floating-toolbar:hover) .tiptap-toolbar.floating{transform:translateY(-2rem)}@media (max-width: 768px){.tiptap-toolbar{padding:6px 8px;gap:2px}}@keyframes toolbarSlideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.tiptap-toolbar{animation:toolbarSlideIn .3s cubic-bezier(.4,0,.2,1)}\n"], dependencies: [{ kind: "component", type: TiptapButtonComponent, selector: "tiptap-button", inputs: ["icon", "title", "active", "disabled", "color", "backgroundColor", "variant", "size", "iconSize"], outputs: ["onClick"] }, { kind: "component", type: TiptapSeparatorComponent, selector: "tiptap-separator", inputs: ["orientation", "size"] }, { kind: "component", type: TiptapColorPickerComponent, selector: "tiptap-color-picker", inputs: ["editor", "mode", "disabled", "anchorToText"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapToolbarComponent, decorators: [{
             type: Component,
@@ -2686,241 +2689,241 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImpor
                         TiptapButtonComponent,
                         TiptapSeparatorComponent,
                         TiptapColorPickerComponent,
-                    ], template: `
-    <div class="tiptap-toolbar" [class.floating]="floating()">
-      @if (config().bold) {
-      <tiptap-button
-        icon="format_bold"
-        [title]="t().bold"
-        [active]="state().marks.bold"
-        [disabled]="!state().can.toggleBold"
-        (onClick)="onCommand('toggleBold')"
-      />
-      } @if (config().italic) {
-      <tiptap-button
-        icon="format_italic"
-        [title]="t().italic"
-        [active]="state().marks.italic"
-        [disabled]="!state().can.toggleItalic"
-        (onClick)="onCommand('toggleItalic')"
-      />
-      } @if (config().underline) {
-      <tiptap-button
-        icon="format_underlined"
-        [title]="t().underline"
-        [active]="state().marks.underline"
-        [disabled]="!state().can.toggleUnderline"
-        (onClick)="onCommand('toggleUnderline')"
-      />
-      } @if (config().strike) {
-      <tiptap-button
-        icon="strikethrough_s"
-        [title]="t().strike"
-        [active]="state().marks.strike"
-        [disabled]="!state().can.toggleStrike"
-        (onClick)="onCommand('toggleStrike')"
-      />
-      } @if (config().code) {
-      <tiptap-button
-        icon="code"
-        [title]="t().code"
-        [active]="state().marks.code"
-        [disabled]="!state().can.toggleCode"
-        (onClick)="onCommand('toggleCode')"
-      />
-      } @if (config().codeBlock) {
-      <tiptap-button
-        icon="terminal"
-        [title]="t().codeBlock"
-        [active]="state().nodes.isCodeBlock"
-        [disabled]="!state().can.toggleCodeBlock"
-        (onClick)="onCommand('toggleCodeBlock')"
-      />
-      } @if (config().superscript) {
-      <tiptap-button
-        icon="superscript"
-        [title]="t().superscript"
-        [active]="state().marks.superscript"
-        [disabled]="!state().can.toggleSuperscript"
-        (onClick)="onCommand('toggleSuperscript')"
-      />
-      } @if (config().subscript) {
-      <tiptap-button
-        icon="subscript"
-        [title]="t().subscript"
-        [active]="state().marks.subscript"
-        [disabled]="!state().can.toggleSubscript"
-        (onClick)="onCommand('toggleSubscript')"
-      />
-      } @if (config().highlight) {
-      <tiptap-button
-        icon="highlight"
-        [title]="t().highlight"
-        [active]="state().marks.highlight"
-        [disabled]="!state().can.toggleHighlight"
-        (onClick)="onCommand('toggleHighlight')"
-      />
-      } @if (config().highlightPicker) {
-      <tiptap-color-picker 
-        mode="highlight" 
-        [editor]="editor()" 
-        [disabled]="!state().can.setHighlight"
-      />
-      } @if (config().textColor) {
-      <tiptap-color-picker 
-        mode="text" 
-        [editor]="editor()" 
-        [disabled]="!state().can.setColor"
-      />
-      }
-      
-      @if (config().separator && (config().heading1 || config().heading2 || config().heading3)) {
-      <tiptap-separator />
-      } @if (config().heading1) {
-      <tiptap-button
-        icon="format_h1"
-        [title]="t().heading1"
-        [active]="state().nodes.h1"
-        [disabled]="!state().can.toggleHeading1"
-        (onClick)="onCommand('toggleHeading', 1)"
-      />
-      } @if (config().heading2) {
-      <tiptap-button
-        icon="format_h2"
-        [title]="t().heading2"
-        [active]="state().nodes.h2"
-        [disabled]="!state().can.toggleHeading2"
-        (onClick)="onCommand('toggleHeading', 2)"
-      />
-      } @if (config().heading3) {
-      <tiptap-button
-        icon="format_h3"
-        [title]="t().heading3"
-        [active]="state().nodes.h3"
-        [disabled]="!state().can.toggleHeading3"
-        (onClick)="onCommand('toggleHeading', 3)"
-      />
-      } @if (config().separator && (config().bulletList || config().orderedList || config().blockquote)) {
-      <tiptap-separator />
-      } @if (config().bulletList) {
-      <tiptap-button
-        icon="format_list_bulleted"
-        [title]="t().bulletList"
-        [active]="state().nodes.isBulletList"
-        [disabled]="!state().can.toggleBulletList"
-        (onClick)="onCommand('toggleBulletList')"
-      />
-      } @if (config().orderedList) {
-      <tiptap-button
-        icon="format_list_numbered"
-        [title]="t().orderedList"
-        [active]="state().nodes.isOrderedList"
-        [disabled]="!state().can.toggleOrderedList"
-        (onClick)="onCommand('toggleOrderedList')"
-      />
-      } @if (config().blockquote) {
-      <tiptap-button
-        icon="format_quote"
-        [title]="t().blockquote"
-        [active]="state().nodes.isBlockquote"
-        [disabled]="!state().can.toggleBlockquote"
-        (onClick)="onCommand('toggleBlockquote')"
-      />
-      } @if (config().separator && (config().alignLeft || config().alignCenter || config().alignRight || config().alignJustify)) {
-      <tiptap-separator />
-      } @if (config().alignLeft) {
-      <tiptap-button
-        icon="format_align_left"
-        [title]="t().alignLeft"
-        [active]="state().nodes.alignLeft"
-        [disabled]="!state().can.setTextAlignLeft"
-        (onClick)="onCommand('setTextAlign', 'left')"
-      />
-      } @if (config().alignCenter) {
-      <tiptap-button
-        icon="format_align_center"
-        [title]="t().alignCenter"
-        [active]="state().nodes.alignCenter"
-        [disabled]="!state().can.setTextAlignCenter"
-        (onClick)="onCommand('setTextAlign', 'center')"
-      />
-      } @if (config().alignRight) {
-      <tiptap-button
-        icon="format_align_right"
-        [title]="t().alignRight"
-        [active]="state().nodes.alignRight"
-        [disabled]="!state().can.setTextAlignRight"
-        (onClick)="onCommand('setTextAlign', 'right')"
-      />
-      } @if (config().alignJustify) {
-      <tiptap-button
-        icon="format_align_justify"
-        [title]="t().alignJustify"
-        [active]="state().nodes.alignJustify"
-        [disabled]="!state().can.setTextAlignJustify"
-        (onClick)="onCommand('setTextAlign', 'justify')"
-      />
-      } @if (config().separator && (config().link || config().horizontalRule)) {
-      <tiptap-separator />
-      } @if (config().link) {
-      <tiptap-button
-        icon="link"
-        [title]="t().link"
-        [active]="state().marks.link"
-        [disabled]="!state().can.toggleLink"
-        (onClick)="onCommand('toggleLink', $event)"
-      />
-      } @if (config().horizontalRule) {
-      <tiptap-button
-        icon="horizontal_rule"
-        [title]="t().horizontalRule"
-        [disabled]="!state().can.insertHorizontalRule"
-        (onClick)="onCommand('insertHorizontalRule')"
-      />
-      } @if (config().table) {
-      <tiptap-button
-        icon="table_view"
-        [title]="t().table"
-        [disabled]="!state().can.insertTable"
-        (onClick)="onCommand('insertTable')"
-      />
-      } @if (config().separator && config().image) {
-      <tiptap-separator />
-      } @if (config().image) {
-      <tiptap-button
-        icon="image"
-        [title]="t().image"
-        [disabled]="!state().can.insertImage"
-        (onClick)="onCommand('insertImage', imageUpload())"
-      />
-      } @if (config().separator && (config().undo || config().redo)) {
-      <tiptap-separator />
-      } @if (config().undo) {
-      <tiptap-button
-        icon="undo"
-        [title]="t().undo"
-        [disabled]="!state().can.undo"
-        (onClick)="onCommand('undo')"
-      />
-      } @if (config().redo) {
-      <tiptap-button
-        icon="redo"
-        [title]="t().redo"
-        [disabled]="!state().can.redo"
-        (onClick)="onCommand('redo')"
-      />
-      } @if (config().separator && config().clear) {
-      <tiptap-separator />
-      } @if (config().clear) {
-      <tiptap-button
-        icon="delete"
-        [title]="t().clear"
-        [disabled]="!state().isEditable"
-        (onClick)="onCommand('clearContent')"
-      />
-      }
-    </div>
-  `, styles: [":host{display:block;transition:opacity .3s ease}:host-context(.floating-toolbar){position:sticky;top:3rem;left:0;right:0;z-index:100;display:flex;height:0;overflow:visible;pointer-events:none;opacity:0}:host-context(.floating-toolbar:focus-within),:host-context(.floating-toolbar:hover){opacity:1}.tiptap-toolbar{display:flex;align-items:center;gap:4px;padding:var(--ate-toolbar-padding);background:var(--ate-toolbar-background);border-bottom:1px solid var(--ate-toolbar-border-color);flex-wrap:wrap;min-height:32px;position:relative;z-index:50;border-top-left-radius:calc(var(--ate-menu-border-radius, 8px) - var(--ate-border-width, 2px));border-top-right-radius:calc(var(--ate-menu-border-radius, 8px) - var(--ate-border-width, 2px))}.tiptap-toolbar.floating{pointer-events:auto;border-radius:var(--ate-menu-border-radius, 8px);border:1px solid var(--ate-menu-border)!important;box-shadow:var(--ate-menu-shadow)!important;background:var(--ate-menu-bg)!important;padding:var(--ate-menu-padding)!important;flex-wrap:nowrap;overflow-x:auto;max-width:95vw;scrollbar-width:none;transform:translateY(0);transition:transform .3s cubic-bezier(.4,0,.2,1)}.tiptap-toolbar.floating::-webkit-scrollbar{display:none}:host-context(.floating-toolbar:focus-within) .tiptap-toolbar.floating,:host-context(.floating-toolbar:hover) .tiptap-toolbar.floating{transform:translateY(-2rem)}@media (max-width: 768px){.tiptap-toolbar{padding:6px 8px;gap:2px}}@keyframes toolbarSlideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.tiptap-toolbar{animation:toolbarSlideIn .3s cubic-bezier(.4,0,.2,1)}\n"] }]
+                    ], template: `
+    <div class="tiptap-toolbar" [class.floating]="floating()">
+      @if (config().bold) {
+      <tiptap-button
+        icon="format_bold"
+        [title]="t().bold"
+        [active]="state().marks.bold"
+        [disabled]="!state().can.toggleBold"
+        (onClick)="onCommand('toggleBold')"
+      />
+      } @if (config().italic) {
+      <tiptap-button
+        icon="format_italic"
+        [title]="t().italic"
+        [active]="state().marks.italic"
+        [disabled]="!state().can.toggleItalic"
+        (onClick)="onCommand('toggleItalic')"
+      />
+      } @if (config().underline) {
+      <tiptap-button
+        icon="format_underlined"
+        [title]="t().underline"
+        [active]="state().marks.underline"
+        [disabled]="!state().can.toggleUnderline"
+        (onClick)="onCommand('toggleUnderline')"
+      />
+      } @if (config().strike) {
+      <tiptap-button
+        icon="strikethrough_s"
+        [title]="t().strike"
+        [active]="state().marks.strike"
+        [disabled]="!state().can.toggleStrike"
+        (onClick)="onCommand('toggleStrike')"
+      />
+      } @if (config().code) {
+      <tiptap-button
+        icon="code"
+        [title]="t().code"
+        [active]="state().marks.code"
+        [disabled]="!state().can.toggleCode"
+        (onClick)="onCommand('toggleCode')"
+      />
+      } @if (config().codeBlock) {
+      <tiptap-button
+        icon="terminal"
+        [title]="t().codeBlock"
+        [active]="state().nodes.isCodeBlock"
+        [disabled]="!state().can.toggleCodeBlock"
+        (onClick)="onCommand('toggleCodeBlock')"
+      />
+      } @if (config().superscript) {
+      <tiptap-button
+        icon="superscript"
+        [title]="t().superscript"
+        [active]="state().marks.superscript"
+        [disabled]="!state().can.toggleSuperscript"
+        (onClick)="onCommand('toggleSuperscript')"
+      />
+      } @if (config().subscript) {
+      <tiptap-button
+        icon="subscript"
+        [title]="t().subscript"
+        [active]="state().marks.subscript"
+        [disabled]="!state().can.toggleSubscript"
+        (onClick)="onCommand('toggleSubscript')"
+      />
+      } @if (config().highlight) {
+      <tiptap-button
+        icon="highlight"
+        [title]="t().highlight"
+        [active]="state().marks.highlight"
+        [disabled]="!state().can.toggleHighlight"
+        (onClick)="onCommand('toggleHighlight')"
+      />
+      } @if (config().highlightPicker) {
+      <tiptap-color-picker 
+        mode="highlight" 
+        [editor]="editor()" 
+        [disabled]="!state().can.setHighlight"
+      />
+      } @if (config().textColor) {
+      <tiptap-color-picker 
+        mode="text" 
+        [editor]="editor()" 
+        [disabled]="!state().can.setColor"
+      />
+      }
+      
+      @if (config().separator && (config().heading1 || config().heading2 || config().heading3)) {
+      <tiptap-separator />
+      } @if (config().heading1) {
+      <tiptap-button
+        icon="format_h1"
+        [title]="t().heading1"
+        [active]="state().nodes.h1"
+        [disabled]="!state().can.toggleHeading1"
+        (onClick)="onCommand('toggleHeading', 1)"
+      />
+      } @if (config().heading2) {
+      <tiptap-button
+        icon="format_h2"
+        [title]="t().heading2"
+        [active]="state().nodes.h2"
+        [disabled]="!state().can.toggleHeading2"
+        (onClick)="onCommand('toggleHeading', 2)"
+      />
+      } @if (config().heading3) {
+      <tiptap-button
+        icon="format_h3"
+        [title]="t().heading3"
+        [active]="state().nodes.h3"
+        [disabled]="!state().can.toggleHeading3"
+        (onClick)="onCommand('toggleHeading', 3)"
+      />
+      } @if (config().separator && (config().bulletList || config().orderedList || config().blockquote)) {
+      <tiptap-separator />
+      } @if (config().bulletList) {
+      <tiptap-button
+        icon="format_list_bulleted"
+        [title]="t().bulletList"
+        [active]="state().nodes.isBulletList"
+        [disabled]="!state().can.toggleBulletList"
+        (onClick)="onCommand('toggleBulletList')"
+      />
+      } @if (config().orderedList) {
+      <tiptap-button
+        icon="format_list_numbered"
+        [title]="t().orderedList"
+        [active]="state().nodes.isOrderedList"
+        [disabled]="!state().can.toggleOrderedList"
+        (onClick)="onCommand('toggleOrderedList')"
+      />
+      } @if (config().blockquote) {
+      <tiptap-button
+        icon="format_quote"
+        [title]="t().blockquote"
+        [active]="state().nodes.isBlockquote"
+        [disabled]="!state().can.toggleBlockquote"
+        (onClick)="onCommand('toggleBlockquote')"
+      />
+      } @if (config().separator && (config().alignLeft || config().alignCenter || config().alignRight || config().alignJustify)) {
+      <tiptap-separator />
+      } @if (config().alignLeft) {
+      <tiptap-button
+        icon="format_align_left"
+        [title]="t().alignLeft"
+        [active]="state().nodes.alignLeft"
+        [disabled]="!state().can.setTextAlignLeft"
+        (onClick)="onCommand('setTextAlign', 'left')"
+      />
+      } @if (config().alignCenter) {
+      <tiptap-button
+        icon="format_align_center"
+        [title]="t().alignCenter"
+        [active]="state().nodes.alignCenter"
+        [disabled]="!state().can.setTextAlignCenter"
+        (onClick)="onCommand('setTextAlign', 'center')"
+      />
+      } @if (config().alignRight) {
+      <tiptap-button
+        icon="format_align_right"
+        [title]="t().alignRight"
+        [active]="state().nodes.alignRight"
+        [disabled]="!state().can.setTextAlignRight"
+        (onClick)="onCommand('setTextAlign', 'right')"
+      />
+      } @if (config().alignJustify) {
+      <tiptap-button
+        icon="format_align_justify"
+        [title]="t().alignJustify"
+        [active]="state().nodes.alignJustify"
+        [disabled]="!state().can.setTextAlignJustify"
+        (onClick)="onCommand('setTextAlign', 'justify')"
+      />
+      } @if (config().separator && (config().link || config().horizontalRule)) {
+      <tiptap-separator />
+      } @if (config().link) {
+      <tiptap-button
+        icon="link"
+        [title]="t().link"
+        [active]="state().marks.link"
+        [disabled]="!state().can.toggleLink"
+        (onClick)="onCommand('toggleLink', $event)"
+      />
+      } @if (config().horizontalRule) {
+      <tiptap-button
+        icon="horizontal_rule"
+        [title]="t().horizontalRule"
+        [disabled]="!state().can.insertHorizontalRule"
+        (onClick)="onCommand('insertHorizontalRule')"
+      />
+      } @if (config().table) {
+      <tiptap-button
+        icon="table_view"
+        [title]="t().table"
+        [disabled]="!state().can.insertTable"
+        (onClick)="onCommand('insertTable')"
+      />
+      } @if (config().separator && config().image) {
+      <tiptap-separator />
+      } @if (config().image) {
+      <tiptap-button
+        icon="image"
+        [title]="t().image"
+        [disabled]="!state().can.insertImage"
+        (onClick)="onCommand('insertImage', imageUpload())"
+      />
+      } @if (config().separator && (config().undo || config().redo)) {
+      <tiptap-separator />
+      } @if (config().undo) {
+      <tiptap-button
+        icon="undo"
+        [title]="t().undo"
+        [disabled]="!state().can.undo"
+        (onClick)="onCommand('undo')"
+      />
+      } @if (config().redo) {
+      <tiptap-button
+        icon="redo"
+        [title]="t().redo"
+        [disabled]="!state().can.redo"
+        (onClick)="onCommand('redo')"
+      />
+      } @if (config().separator && config().clear) {
+      <tiptap-separator />
+      } @if (config().clear) {
+      <tiptap-button
+        icon="delete"
+        [title]="t().clear"
+        [disabled]="!state().isEditable"
+        (onClick)="onCommand('clearContent')"
+      />
+      }
+    </div>
+  `, styles: [":host{display:block;transition:opacity .3s ease}:host-context(.floating-toolbar){position:sticky;top:3rem;left:0;right:0;z-index:100;display:flex;height:0;overflow:visible;pointer-events:none;opacity:0}:host-context(.floating-toolbar:focus-within),:host-context(.floating-toolbar:hover){opacity:1}.tiptap-toolbar{display:flex;align-items:center;gap:4px;padding:var(--ate-toolbar-padding);background:var(--ate-toolbar-background);border-bottom:1px solid var(--ate-toolbar-border-color);flex-wrap:wrap;min-height:32px;position:relative;z-index:50;border-top-left-radius:calc(var(--ate-menu-border-radius, 12px) - var(--ate-border-width, 2px));border-top-right-radius:calc(var(--ate-menu-border-radius, 12px) - var(--ate-border-width, 2px))}.tiptap-toolbar.floating{pointer-events:auto;border-radius:var(--ate-menu-border-radius, 12px);border:1px solid var(--ate-menu-border)!important;box-shadow:var(--ate-menu-shadow)!important;background:var(--ate-menu-bg)!important;padding:var(--ate-menu-padding)!important;flex-wrap:nowrap;overflow-x:auto;max-width:95vw;scrollbar-width:none;transform:translateY(0);transition:transform .3s cubic-bezier(.4,0,.2,1)}.tiptap-toolbar.floating::-webkit-scrollbar{display:none}:host-context(.floating-toolbar:focus-within) .tiptap-toolbar.floating,:host-context(.floating-toolbar:hover) .tiptap-toolbar.floating{transform:translateY(-2rem)}@media (max-width: 768px){.tiptap-toolbar{padding:6px 8px;gap:2px}}@keyframes toolbarSlideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.tiptap-toolbar{animation:toolbarSlideIn .3s cubic-bezier(.4,0,.2,1)}\n"] }]
         }] });
 
 /**
@@ -3203,96 +3206,96 @@ class TiptapBubbleMenuComponent extends TiptapBaseBubbleMenu {
         // premature closing when clicking between 'sibling' menu instances.
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapBubbleMenuComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapBubbleMenuComponent, isStandalone: true, selector: "tiptap-bubble-menu", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
-    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
-      @if (bubbleMenuConfig().bold) {
-      <tiptap-button
-        icon="format_bold"
-        [title]="t().bold"
-        [active]="state().marks.bold"
-        [disabled]="!state().can.toggleBold"
-        (onClick)="onCommand('toggleBold', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().italic) {
-      <tiptap-button
-        icon="format_italic"
-        [title]="t().italic"
-        [active]="state().marks.italic"
-        [disabled]="!state().can.toggleItalic"
-        (onClick)="onCommand('toggleItalic', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().underline) {
-      <tiptap-button
-        icon="format_underlined"
-        [title]="t().underline"
-        [active]="state().marks.underline"
-        [disabled]="!state().can.toggleUnderline"
-        (onClick)="onCommand('toggleUnderline', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().strike) {
-      <tiptap-button
-        icon="strikethrough_s"
-        [title]="t().strike"
-        [active]="state().marks.strike"
-        [disabled]="!state().can.toggleStrike"
-        (onClick)="onCommand('toggleStrike', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().code) {
-      <tiptap-button
-        icon="code"
-        [title]="t().code"
-        [active]="state().marks.code"
-        [disabled]="!state().can.toggleCode"
-        (onClick)="onCommand('toggleCode', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().superscript) {
-      <tiptap-button
-        icon="superscript"
-        [title]="t().superscript"
-        [active]="state().marks.superscript"
-        [disabled]="!state().can.toggleSuperscript"
-        (onClick)="onCommand('toggleSuperscript', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().subscript) {
-      <tiptap-button
-        icon="subscript"
-        [title]="t().subscript"
-        [active]="state().marks.subscript"
-        [disabled]="!state().can.toggleSubscript"
-        (onClick)="onCommand('toggleSubscript', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().highlight) {
-      <tiptap-button
-        icon="highlight"
-        [title]="t().highlight"
-        [active]="state().marks.highlight"
-        [disabled]="!state().can.toggleHighlight"
-        (onClick)="onCommand('toggleHighlight', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().highlightPicker) {
-      <tiptap-color-picker
-        mode="highlight"
-        [editor]="editor()"
-        [disabled]="!state().can.setHighlight"
-        [anchorToText]="true"
-      />
-      } @if (bubbleMenuConfig().textColor) {
-      <tiptap-color-picker
-        mode="text"
-        [editor]="editor()"
-        [disabled]="!state().can.setColor"
-        [anchorToText]="true"
-      />
-      } @if (bubbleMenuConfig().link) {
-      <tiptap-button
-        icon="link"
-        [title]="t().link"
-        [active]="state().marks.link"
-        [disabled]="!state().can.toggleLink"
-        (onClick)="onCommand('toggleLink', $event)"
-      ></tiptap-button>
-      }
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapBubbleMenuComponent, isStandalone: true, selector: "tiptap-bubble-menu", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
+      @if (bubbleMenuConfig().bold) {
+      <tiptap-button
+        icon="format_bold"
+        [title]="t().bold"
+        [active]="state().marks.bold"
+        [disabled]="!state().can.toggleBold"
+        (onClick)="onCommand('toggleBold', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().italic) {
+      <tiptap-button
+        icon="format_italic"
+        [title]="t().italic"
+        [active]="state().marks.italic"
+        [disabled]="!state().can.toggleItalic"
+        (onClick)="onCommand('toggleItalic', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().underline) {
+      <tiptap-button
+        icon="format_underlined"
+        [title]="t().underline"
+        [active]="state().marks.underline"
+        [disabled]="!state().can.toggleUnderline"
+        (onClick)="onCommand('toggleUnderline', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().strike) {
+      <tiptap-button
+        icon="strikethrough_s"
+        [title]="t().strike"
+        [active]="state().marks.strike"
+        [disabled]="!state().can.toggleStrike"
+        (onClick)="onCommand('toggleStrike', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().code) {
+      <tiptap-button
+        icon="code"
+        [title]="t().code"
+        [active]="state().marks.code"
+        [disabled]="!state().can.toggleCode"
+        (onClick)="onCommand('toggleCode', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().superscript) {
+      <tiptap-button
+        icon="superscript"
+        [title]="t().superscript"
+        [active]="state().marks.superscript"
+        [disabled]="!state().can.toggleSuperscript"
+        (onClick)="onCommand('toggleSuperscript', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().subscript) {
+      <tiptap-button
+        icon="subscript"
+        [title]="t().subscript"
+        [active]="state().marks.subscript"
+        [disabled]="!state().can.toggleSubscript"
+        (onClick)="onCommand('toggleSubscript', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().highlight) {
+      <tiptap-button
+        icon="highlight"
+        [title]="t().highlight"
+        [active]="state().marks.highlight"
+        [disabled]="!state().can.toggleHighlight"
+        (onClick)="onCommand('toggleHighlight', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().highlightPicker) {
+      <tiptap-color-picker
+        mode="highlight"
+        [editor]="editor()"
+        [disabled]="!state().can.setHighlight"
+        [anchorToText]="true"
+      />
+      } @if (bubbleMenuConfig().textColor) {
+      <tiptap-color-picker
+        mode="text"
+        [editor]="editor()"
+        [disabled]="!state().can.setColor"
+        [anchorToText]="true"
+      />
+      } @if (bubbleMenuConfig().link) {
+      <tiptap-button
+        icon="link"
+        [title]="t().link"
+        [active]="state().marks.link"
+        [disabled]="!state().can.toggleLink"
+        (onClick)="onCommand('toggleLink', $event)"
+      ></tiptap-button>
+      }
+    </div>
   `, isInline: true, dependencies: [{ kind: "component", type: TiptapButtonComponent, selector: "tiptap-button", inputs: ["icon", "title", "active", "disabled", "color", "backgroundColor", "variant", "size", "iconSize"], outputs: ["onClick"] }, { kind: "component", type: TiptapColorPickerComponent, selector: "tiptap-color-picker", inputs: ["editor", "mode", "disabled", "anchorToText"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapBubbleMenuComponent, decorators: [{
@@ -3305,96 +3308,96 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImpor
                         TiptapButtonComponent,
                         TiptapColorPickerComponent,
                     ],
-                    template: `
-    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
-      @if (bubbleMenuConfig().bold) {
-      <tiptap-button
-        icon="format_bold"
-        [title]="t().bold"
-        [active]="state().marks.bold"
-        [disabled]="!state().can.toggleBold"
-        (onClick)="onCommand('toggleBold', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().italic) {
-      <tiptap-button
-        icon="format_italic"
-        [title]="t().italic"
-        [active]="state().marks.italic"
-        [disabled]="!state().can.toggleItalic"
-        (onClick)="onCommand('toggleItalic', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().underline) {
-      <tiptap-button
-        icon="format_underlined"
-        [title]="t().underline"
-        [active]="state().marks.underline"
-        [disabled]="!state().can.toggleUnderline"
-        (onClick)="onCommand('toggleUnderline', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().strike) {
-      <tiptap-button
-        icon="strikethrough_s"
-        [title]="t().strike"
-        [active]="state().marks.strike"
-        [disabled]="!state().can.toggleStrike"
-        (onClick)="onCommand('toggleStrike', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().code) {
-      <tiptap-button
-        icon="code"
-        [title]="t().code"
-        [active]="state().marks.code"
-        [disabled]="!state().can.toggleCode"
-        (onClick)="onCommand('toggleCode', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().superscript) {
-      <tiptap-button
-        icon="superscript"
-        [title]="t().superscript"
-        [active]="state().marks.superscript"
-        [disabled]="!state().can.toggleSuperscript"
-        (onClick)="onCommand('toggleSuperscript', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().subscript) {
-      <tiptap-button
-        icon="subscript"
-        [title]="t().subscript"
-        [active]="state().marks.subscript"
-        [disabled]="!state().can.toggleSubscript"
-        (onClick)="onCommand('toggleSubscript', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().highlight) {
-      <tiptap-button
-        icon="highlight"
-        [title]="t().highlight"
-        [active]="state().marks.highlight"
-        [disabled]="!state().can.toggleHighlight"
-        (onClick)="onCommand('toggleHighlight', $event)"
-      ></tiptap-button>
-      } @if (bubbleMenuConfig().highlightPicker) {
-      <tiptap-color-picker
-        mode="highlight"
-        [editor]="editor()"
-        [disabled]="!state().can.setHighlight"
-        [anchorToText]="true"
-      />
-      } @if (bubbleMenuConfig().textColor) {
-      <tiptap-color-picker
-        mode="text"
-        [editor]="editor()"
-        [disabled]="!state().can.setColor"
-        [anchorToText]="true"
-      />
-      } @if (bubbleMenuConfig().link) {
-      <tiptap-button
-        icon="link"
-        [title]="t().link"
-        [active]="state().marks.link"
-        [disabled]="!state().can.toggleLink"
-        (onClick)="onCommand('toggleLink', $event)"
-      ></tiptap-button>
-      }
-    </div>
+                    template: `
+    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
+      @if (bubbleMenuConfig().bold) {
+      <tiptap-button
+        icon="format_bold"
+        [title]="t().bold"
+        [active]="state().marks.bold"
+        [disabled]="!state().can.toggleBold"
+        (onClick)="onCommand('toggleBold', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().italic) {
+      <tiptap-button
+        icon="format_italic"
+        [title]="t().italic"
+        [active]="state().marks.italic"
+        [disabled]="!state().can.toggleItalic"
+        (onClick)="onCommand('toggleItalic', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().underline) {
+      <tiptap-button
+        icon="format_underlined"
+        [title]="t().underline"
+        [active]="state().marks.underline"
+        [disabled]="!state().can.toggleUnderline"
+        (onClick)="onCommand('toggleUnderline', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().strike) {
+      <tiptap-button
+        icon="strikethrough_s"
+        [title]="t().strike"
+        [active]="state().marks.strike"
+        [disabled]="!state().can.toggleStrike"
+        (onClick)="onCommand('toggleStrike', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().code) {
+      <tiptap-button
+        icon="code"
+        [title]="t().code"
+        [active]="state().marks.code"
+        [disabled]="!state().can.toggleCode"
+        (onClick)="onCommand('toggleCode', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().superscript) {
+      <tiptap-button
+        icon="superscript"
+        [title]="t().superscript"
+        [active]="state().marks.superscript"
+        [disabled]="!state().can.toggleSuperscript"
+        (onClick)="onCommand('toggleSuperscript', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().subscript) {
+      <tiptap-button
+        icon="subscript"
+        [title]="t().subscript"
+        [active]="state().marks.subscript"
+        [disabled]="!state().can.toggleSubscript"
+        (onClick)="onCommand('toggleSubscript', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().highlight) {
+      <tiptap-button
+        icon="highlight"
+        [title]="t().highlight"
+        [active]="state().marks.highlight"
+        [disabled]="!state().can.toggleHighlight"
+        (onClick)="onCommand('toggleHighlight', $event)"
+      ></tiptap-button>
+      } @if (bubbleMenuConfig().highlightPicker) {
+      <tiptap-color-picker
+        mode="highlight"
+        [editor]="editor()"
+        [disabled]="!state().can.setHighlight"
+        [anchorToText]="true"
+      />
+      } @if (bubbleMenuConfig().textColor) {
+      <tiptap-color-picker
+        mode="text"
+        [editor]="editor()"
+        [disabled]="!state().can.setColor"
+        [anchorToText]="true"
+      />
+      } @if (bubbleMenuConfig().link) {
+      <tiptap-button
+        icon="link"
+        [title]="t().link"
+        [active]="state().marks.link"
+        [disabled]="!state().can.toggleLink"
+        (onClick)="onCommand('toggleLink', $event)"
+      ></tiptap-button>
+      }
+    </div>
   `,
                 }]
         }] });
@@ -3512,55 +3515,55 @@ class TiptapImageBubbleMenuComponent extends TiptapBaseBubbleMenu {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapImageBubbleMenuComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapImageBubbleMenuComponent, isStandalone: true, selector: "tiptap-image-bubble-menu", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
-    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
-      @if (imageBubbleMenuConfig().changeImage) {
-      <tiptap-button
-        icon="drive_file_rename_outline"
-        [title]="t().changeImage"
-        (onClick)="onCommand('changeImage', $event)"
-      ></tiptap-button>
-      } @if (imageBubbleMenuConfig().separator && hasResizeButtons()) {
-      <tiptap-separator />
-      } @if (imageBubbleMenuConfig().resizeSmall) {
-      <tiptap-button
-        icon="crop_square"
-        iconSize="small"
-        [title]="t().resizeSmall"
-        (onClick)="onCommand('resizeSmall', $event)"
-      ></tiptap-button>
-      } @if (imageBubbleMenuConfig().resizeMedium) {
-      <tiptap-button
-        icon="crop_square"
-        iconSize="medium"
-        [title]="t().resizeMedium"
-        (onClick)="onCommand('resizeMedium', $event)"
-      ></tiptap-button>
-      } @if (imageBubbleMenuConfig().resizeLarge) {
-      <tiptap-button
-        icon="crop_square"
-        iconSize="large"
-        [title]="t().resizeLarge"
-        (onClick)="onCommand('resizeLarge', $event)"
-      ></tiptap-button>
-      } @if (imageBubbleMenuConfig().resizeOriginal) {
-      <tiptap-button
-        icon="photo_size_select_actual"
-        [title]="t().resizeOriginal"
-        (onClick)="onCommand('resizeOriginal', $event)"
-      ></tiptap-button>
-      } @if (imageBubbleMenuConfig().separator &&
-      imageBubbleMenuConfig().deleteImage) {
-      <tiptap-separator />
-      } @if (imageBubbleMenuConfig().deleteImage) {
-      <tiptap-button
-        icon="delete"
-        [title]="t().deleteImage"
-        variant="danger"
-        (onClick)="onCommand('deleteImage', $event)"
-      ></tiptap-button>
-      }
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapImageBubbleMenuComponent, isStandalone: true, selector: "tiptap-image-bubble-menu", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
+      @if (imageBubbleMenuConfig().changeImage) {
+      <tiptap-button
+        icon="drive_file_rename_outline"
+        [title]="t().changeImage"
+        (onClick)="onCommand('changeImage', $event)"
+      ></tiptap-button>
+      } @if (imageBubbleMenuConfig().separator && hasResizeButtons()) {
+      <tiptap-separator />
+      } @if (imageBubbleMenuConfig().resizeSmall) {
+      <tiptap-button
+        icon="crop_square"
+        iconSize="small"
+        [title]="t().resizeSmall"
+        (onClick)="onCommand('resizeSmall', $event)"
+      ></tiptap-button>
+      } @if (imageBubbleMenuConfig().resizeMedium) {
+      <tiptap-button
+        icon="crop_square"
+        iconSize="medium"
+        [title]="t().resizeMedium"
+        (onClick)="onCommand('resizeMedium', $event)"
+      ></tiptap-button>
+      } @if (imageBubbleMenuConfig().resizeLarge) {
+      <tiptap-button
+        icon="crop_square"
+        iconSize="large"
+        [title]="t().resizeLarge"
+        (onClick)="onCommand('resizeLarge', $event)"
+      ></tiptap-button>
+      } @if (imageBubbleMenuConfig().resizeOriginal) {
+      <tiptap-button
+        icon="photo_size_select_actual"
+        [title]="t().resizeOriginal"
+        (onClick)="onCommand('resizeOriginal', $event)"
+      ></tiptap-button>
+      } @if (imageBubbleMenuConfig().separator &&
+      imageBubbleMenuConfig().deleteImage) {
+      <tiptap-separator />
+      } @if (imageBubbleMenuConfig().deleteImage) {
+      <tiptap-button
+        icon="delete"
+        [title]="t().deleteImage"
+        variant="danger"
+        (onClick)="onCommand('deleteImage', $event)"
+      ></tiptap-button>
+      }
+    </div>
   `, isInline: true, dependencies: [{ kind: "component", type: TiptapButtonComponent, selector: "tiptap-button", inputs: ["icon", "title", "active", "disabled", "color", "backgroundColor", "variant", "size", "iconSize"], outputs: ["onClick"] }, { kind: "component", type: TiptapSeparatorComponent, selector: "tiptap-separator", inputs: ["orientation", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapImageBubbleMenuComponent, decorators: [{
@@ -3570,55 +3573,55 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImpor
                     standalone: true,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     imports: [TiptapButtonComponent, TiptapSeparatorComponent],
-                    template: `
-    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
-      @if (imageBubbleMenuConfig().changeImage) {
-      <tiptap-button
-        icon="drive_file_rename_outline"
-        [title]="t().changeImage"
-        (onClick)="onCommand('changeImage', $event)"
-      ></tiptap-button>
-      } @if (imageBubbleMenuConfig().separator && hasResizeButtons()) {
-      <tiptap-separator />
-      } @if (imageBubbleMenuConfig().resizeSmall) {
-      <tiptap-button
-        icon="crop_square"
-        iconSize="small"
-        [title]="t().resizeSmall"
-        (onClick)="onCommand('resizeSmall', $event)"
-      ></tiptap-button>
-      } @if (imageBubbleMenuConfig().resizeMedium) {
-      <tiptap-button
-        icon="crop_square"
-        iconSize="medium"
-        [title]="t().resizeMedium"
-        (onClick)="onCommand('resizeMedium', $event)"
-      ></tiptap-button>
-      } @if (imageBubbleMenuConfig().resizeLarge) {
-      <tiptap-button
-        icon="crop_square"
-        iconSize="large"
-        [title]="t().resizeLarge"
-        (onClick)="onCommand('resizeLarge', $event)"
-      ></tiptap-button>
-      } @if (imageBubbleMenuConfig().resizeOriginal) {
-      <tiptap-button
-        icon="photo_size_select_actual"
-        [title]="t().resizeOriginal"
-        (onClick)="onCommand('resizeOriginal', $event)"
-      ></tiptap-button>
-      } @if (imageBubbleMenuConfig().separator &&
-      imageBubbleMenuConfig().deleteImage) {
-      <tiptap-separator />
-      } @if (imageBubbleMenuConfig().deleteImage) {
-      <tiptap-button
-        icon="delete"
-        [title]="t().deleteImage"
-        variant="danger"
-        (onClick)="onCommand('deleteImage', $event)"
-      ></tiptap-button>
-      }
-    </div>
+                    template: `
+    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
+      @if (imageBubbleMenuConfig().changeImage) {
+      <tiptap-button
+        icon="drive_file_rename_outline"
+        [title]="t().changeImage"
+        (onClick)="onCommand('changeImage', $event)"
+      ></tiptap-button>
+      } @if (imageBubbleMenuConfig().separator && hasResizeButtons()) {
+      <tiptap-separator />
+      } @if (imageBubbleMenuConfig().resizeSmall) {
+      <tiptap-button
+        icon="crop_square"
+        iconSize="small"
+        [title]="t().resizeSmall"
+        (onClick)="onCommand('resizeSmall', $event)"
+      ></tiptap-button>
+      } @if (imageBubbleMenuConfig().resizeMedium) {
+      <tiptap-button
+        icon="crop_square"
+        iconSize="medium"
+        [title]="t().resizeMedium"
+        (onClick)="onCommand('resizeMedium', $event)"
+      ></tiptap-button>
+      } @if (imageBubbleMenuConfig().resizeLarge) {
+      <tiptap-button
+        icon="crop_square"
+        iconSize="large"
+        [title]="t().resizeLarge"
+        (onClick)="onCommand('resizeLarge', $event)"
+      ></tiptap-button>
+      } @if (imageBubbleMenuConfig().resizeOriginal) {
+      <tiptap-button
+        icon="photo_size_select_actual"
+        [title]="t().resizeOriginal"
+        (onClick)="onCommand('resizeOriginal', $event)"
+      ></tiptap-button>
+      } @if (imageBubbleMenuConfig().separator &&
+      imageBubbleMenuConfig().deleteImage) {
+      <tiptap-separator />
+      } @if (imageBubbleMenuConfig().deleteImage) {
+      <tiptap-button
+        icon="delete"
+        [title]="t().deleteImage"
+        variant="danger"
+        (onClick)="onCommand('deleteImage', $event)"
+      ></tiptap-button>
+      }
+    </div>
   `,
                 }]
         }] });
@@ -3696,94 +3699,94 @@ class TiptapTableBubbleMenuComponent extends TiptapBaseBubbleMenu {
         this.editorCommands.execute(editor, command);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapTableBubbleMenuComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapTableBubbleMenuComponent, isStandalone: true, selector: "tiptap-table-bubble-menu", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
-    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
-      <!-- Row actions -->
-      @if (config().addRowBefore !== false) {
-      <tiptap-button
-        icon="add_row_above"
-        [title]="t().addRowBefore"
-        [disabled]="!state().can.addRowBefore"
-        (onClick)="onCommand('addRowBefore', $event)"
-      ></tiptap-button>
-      } @if (config().addRowAfter !== false) {
-      <tiptap-button
-        icon="add_row_below"
-        [title]="t().addRowAfter"
-        [disabled]="!state().can.addRowAfter"
-        (onClick)="onCommand('addRowAfter', $event)"
-      ></tiptap-button>
-      } @if (config().deleteRow !== false) {
-      <tiptap-button
-        icon="delete"
-        [title]="t().deleteRow"
-        variant="danger"
-        [disabled]="!state().can.deleteRow"
-        (onClick)="onCommand('deleteRow', $event)"
-      ></tiptap-button>
-      } @if (config().separator !== false) {
-      <tiptap-separator />
-      }
-
-      <!-- Column actions -->
-      @if (config().addColumnBefore !== false) {
-      <tiptap-button
-        icon="add_column_left"
-        [title]="t().addColumnBefore"
-        [disabled]="!state().can.addColumnBefore"
-        (onClick)="onCommand('addColumnBefore', $event)"
-      ></tiptap-button>
-      } @if (config().addColumnAfter !== false) {
-      <tiptap-button
-        icon="add_column_right"
-        [title]="t().addColumnAfter"
-        [disabled]="!state().can.addColumnAfter"
-        (onClick)="onCommand('addColumnAfter', $event)"
-      ></tiptap-button>
-      } @if (config().deleteColumn !== false) {
-      <tiptap-button
-        icon="delete"
-        [title]="t().deleteColumn"
-        variant="danger"
-        [disabled]="!state().can.deleteColumn"
-        (onClick)="onCommand('deleteColumn', $event)"
-      ></tiptap-button>
-      } @if (config().separator !== false) {
-      <tiptap-separator />
-      }
-
-      <!-- Cell actions -->
-      @if (config().toggleHeaderRow !== false) {
-      <tiptap-button
-        icon="toolbar"
-        [title]="t().toggleHeaderRow"
-        [active]="state().nodes.isTableHeaderRow"
-        [disabled]="!state().can.toggleHeaderRow"
-        (onClick)="onCommand('toggleHeaderRow', $event)"
-      ></tiptap-button>
-      } @if (config().toggleHeaderColumn !== false) {
-      <tiptap-button
-        icon="dock_to_right"
-        [title]="t().toggleHeaderColumn"
-        [active]="state().nodes.isTableHeaderColumn"
-        [disabled]="!state().can.toggleHeaderColumn"
-        (onClick)="onCommand('toggleHeaderColumn', $event)"
-      ></tiptap-button>
-      } @if (config().separator !== false && config().deleteTable !== false) {
-      <tiptap-separator />
-      }
-
-      <!-- Table actions -->
-      @if (config().deleteTable !== false) {
-      <tiptap-button
-        icon="delete_forever"
-        [title]="t().deleteTable"
-        variant="danger"
-        [disabled]="!state().can.deleteTable"
-        (onClick)="onCommand('deleteTable', $event)"
-      ></tiptap-button>
-      }
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapTableBubbleMenuComponent, isStandalone: true, selector: "tiptap-table-bubble-menu", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
+      <!-- Row actions -->
+      @if (config().addRowBefore !== false) {
+      <tiptap-button
+        icon="add_row_above"
+        [title]="t().addRowBefore"
+        [disabled]="!state().can.addRowBefore"
+        (onClick)="onCommand('addRowBefore', $event)"
+      ></tiptap-button>
+      } @if (config().addRowAfter !== false) {
+      <tiptap-button
+        icon="add_row_below"
+        [title]="t().addRowAfter"
+        [disabled]="!state().can.addRowAfter"
+        (onClick)="onCommand('addRowAfter', $event)"
+      ></tiptap-button>
+      } @if (config().deleteRow !== false) {
+      <tiptap-button
+        icon="delete"
+        [title]="t().deleteRow"
+        variant="danger"
+        [disabled]="!state().can.deleteRow"
+        (onClick)="onCommand('deleteRow', $event)"
+      ></tiptap-button>
+      } @if (config().separator !== false) {
+      <tiptap-separator />
+      }
+
+      <!-- Column actions -->
+      @if (config().addColumnBefore !== false) {
+      <tiptap-button
+        icon="add_column_left"
+        [title]="t().addColumnBefore"
+        [disabled]="!state().can.addColumnBefore"
+        (onClick)="onCommand('addColumnBefore', $event)"
+      ></tiptap-button>
+      } @if (config().addColumnAfter !== false) {
+      <tiptap-button
+        icon="add_column_right"
+        [title]="t().addColumnAfter"
+        [disabled]="!state().can.addColumnAfter"
+        (onClick)="onCommand('addColumnAfter', $event)"
+      ></tiptap-button>
+      } @if (config().deleteColumn !== false) {
+      <tiptap-button
+        icon="delete"
+        [title]="t().deleteColumn"
+        variant="danger"
+        [disabled]="!state().can.deleteColumn"
+        (onClick)="onCommand('deleteColumn', $event)"
+      ></tiptap-button>
+      } @if (config().separator !== false) {
+      <tiptap-separator />
+      }
+
+      <!-- Cell actions -->
+      @if (config().toggleHeaderRow !== false) {
+      <tiptap-button
+        icon="toolbar"
+        [title]="t().toggleHeaderRow"
+        [active]="state().nodes.isTableHeaderRow"
+        [disabled]="!state().can.toggleHeaderRow"
+        (onClick)="onCommand('toggleHeaderRow', $event)"
+      ></tiptap-button>
+      } @if (config().toggleHeaderColumn !== false) {
+      <tiptap-button
+        icon="dock_to_right"
+        [title]="t().toggleHeaderColumn"
+        [active]="state().nodes.isTableHeaderColumn"
+        [disabled]="!state().can.toggleHeaderColumn"
+        (onClick)="onCommand('toggleHeaderColumn', $event)"
+      ></tiptap-button>
+      } @if (config().separator !== false && config().deleteTable !== false) {
+      <tiptap-separator />
+      }
+
+      <!-- Table actions -->
+      @if (config().deleteTable !== false) {
+      <tiptap-button
+        icon="delete_forever"
+        [title]="t().deleteTable"
+        variant="danger"
+        [disabled]="!state().can.deleteTable"
+        (onClick)="onCommand('deleteTable', $event)"
+      ></tiptap-button>
+      }
+    </div>
   `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: TiptapButtonComponent, selector: "tiptap-button", inputs: ["icon", "title", "active", "disabled", "color", "backgroundColor", "variant", "size", "iconSize"], outputs: ["onClick"] }, { kind: "component", type: TiptapSeparatorComponent, selector: "tiptap-separator", inputs: ["orientation", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapTableBubbleMenuComponent, decorators: [{
@@ -3793,94 +3796,94 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImpor
                     standalone: true,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     imports: [CommonModule, TiptapButtonComponent, TiptapSeparatorComponent],
-                    template: `
-    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
-      <!-- Row actions -->
-      @if (config().addRowBefore !== false) {
-      <tiptap-button
-        icon="add_row_above"
-        [title]="t().addRowBefore"
-        [disabled]="!state().can.addRowBefore"
-        (onClick)="onCommand('addRowBefore', $event)"
-      ></tiptap-button>
-      } @if (config().addRowAfter !== false) {
-      <tiptap-button
-        icon="add_row_below"
-        [title]="t().addRowAfter"
-        [disabled]="!state().can.addRowAfter"
-        (onClick)="onCommand('addRowAfter', $event)"
-      ></tiptap-button>
-      } @if (config().deleteRow !== false) {
-      <tiptap-button
-        icon="delete"
-        [title]="t().deleteRow"
-        variant="danger"
-        [disabled]="!state().can.deleteRow"
-        (onClick)="onCommand('deleteRow', $event)"
-      ></tiptap-button>
-      } @if (config().separator !== false) {
-      <tiptap-separator />
-      }
-
-      <!-- Column actions -->
-      @if (config().addColumnBefore !== false) {
-      <tiptap-button
-        icon="add_column_left"
-        [title]="t().addColumnBefore"
-        [disabled]="!state().can.addColumnBefore"
-        (onClick)="onCommand('addColumnBefore', $event)"
-      ></tiptap-button>
-      } @if (config().addColumnAfter !== false) {
-      <tiptap-button
-        icon="add_column_right"
-        [title]="t().addColumnAfter"
-        [disabled]="!state().can.addColumnAfter"
-        (onClick)="onCommand('addColumnAfter', $event)"
-      ></tiptap-button>
-      } @if (config().deleteColumn !== false) {
-      <tiptap-button
-        icon="delete"
-        [title]="t().deleteColumn"
-        variant="danger"
-        [disabled]="!state().can.deleteColumn"
-        (onClick)="onCommand('deleteColumn', $event)"
-      ></tiptap-button>
-      } @if (config().separator !== false) {
-      <tiptap-separator />
-      }
-
-      <!-- Cell actions -->
-      @if (config().toggleHeaderRow !== false) {
-      <tiptap-button
-        icon="toolbar"
-        [title]="t().toggleHeaderRow"
-        [active]="state().nodes.isTableHeaderRow"
-        [disabled]="!state().can.toggleHeaderRow"
-        (onClick)="onCommand('toggleHeaderRow', $event)"
-      ></tiptap-button>
-      } @if (config().toggleHeaderColumn !== false) {
-      <tiptap-button
-        icon="dock_to_right"
-        [title]="t().toggleHeaderColumn"
-        [active]="state().nodes.isTableHeaderColumn"
-        [disabled]="!state().can.toggleHeaderColumn"
-        (onClick)="onCommand('toggleHeaderColumn', $event)"
-      ></tiptap-button>
-      } @if (config().separator !== false && config().deleteTable !== false) {
-      <tiptap-separator />
-      }
-
-      <!-- Table actions -->
-      @if (config().deleteTable !== false) {
-      <tiptap-button
-        icon="delete_forever"
-        [title]="t().deleteTable"
-        variant="danger"
-        [disabled]="!state().can.deleteTable"
-        (onClick)="onCommand('deleteTable', $event)"
-      ></tiptap-button>
-      }
-    </div>
+                    template: `
+    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
+      <!-- Row actions -->
+      @if (config().addRowBefore !== false) {
+      <tiptap-button
+        icon="add_row_above"
+        [title]="t().addRowBefore"
+        [disabled]="!state().can.addRowBefore"
+        (onClick)="onCommand('addRowBefore', $event)"
+      ></tiptap-button>
+      } @if (config().addRowAfter !== false) {
+      <tiptap-button
+        icon="add_row_below"
+        [title]="t().addRowAfter"
+        [disabled]="!state().can.addRowAfter"
+        (onClick)="onCommand('addRowAfter', $event)"
+      ></tiptap-button>
+      } @if (config().deleteRow !== false) {
+      <tiptap-button
+        icon="delete"
+        [title]="t().deleteRow"
+        variant="danger"
+        [disabled]="!state().can.deleteRow"
+        (onClick)="onCommand('deleteRow', $event)"
+      ></tiptap-button>
+      } @if (config().separator !== false) {
+      <tiptap-separator />
+      }
+
+      <!-- Column actions -->
+      @if (config().addColumnBefore !== false) {
+      <tiptap-button
+        icon="add_column_left"
+        [title]="t().addColumnBefore"
+        [disabled]="!state().can.addColumnBefore"
+        (onClick)="onCommand('addColumnBefore', $event)"
+      ></tiptap-button>
+      } @if (config().addColumnAfter !== false) {
+      <tiptap-button
+        icon="add_column_right"
+        [title]="t().addColumnAfter"
+        [disabled]="!state().can.addColumnAfter"
+        (onClick)="onCommand('addColumnAfter', $event)"
+      ></tiptap-button>
+      } @if (config().deleteColumn !== false) {
+      <tiptap-button
+        icon="delete"
+        [title]="t().deleteColumn"
+        variant="danger"
+        [disabled]="!state().can.deleteColumn"
+        (onClick)="onCommand('deleteColumn', $event)"
+      ></tiptap-button>
+      } @if (config().separator !== false) {
+      <tiptap-separator />
+      }
+
+      <!-- Cell actions -->
+      @if (config().toggleHeaderRow !== false) {
+      <tiptap-button
+        icon="toolbar"
+        [title]="t().toggleHeaderRow"
+        [active]="state().nodes.isTableHeaderRow"
+        [disabled]="!state().can.toggleHeaderRow"
+        (onClick)="onCommand('toggleHeaderRow', $event)"
+      ></tiptap-button>
+      } @if (config().toggleHeaderColumn !== false) {
+      <tiptap-button
+        icon="dock_to_right"
+        [title]="t().toggleHeaderColumn"
+        [active]="state().nodes.isTableHeaderColumn"
+        [disabled]="!state().can.toggleHeaderColumn"
+        (onClick)="onCommand('toggleHeaderColumn', $event)"
+      ></tiptap-button>
+      } @if (config().separator !== false && config().deleteTable !== false) {
+      <tiptap-separator />
+      }
+
+      <!-- Table actions -->
+      @if (config().deleteTable !== false) {
+      <tiptap-button
+        icon="delete_forever"
+        [title]="t().deleteTable"
+        variant="danger"
+        [disabled]="!state().can.deleteTable"
+        (onClick)="onCommand('deleteTable', $event)"
+      ></tiptap-button>
+      }
+    </div>
   `,
                 }]
         }] });
@@ -3953,25 +3956,25 @@ class TiptapCellBubbleMenuComponent extends TiptapBaseBubbleMenu {
         this.editorCommands.execute(editor, command);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapCellBubbleMenuComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapCellBubbleMenuComponent, isStandalone: true, selector: "tiptap-cell-bubble-menu", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
-    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
-      <!-- Cell specific actions -->
-      @if (config().mergeCells !== false && !state().selection.isSingleCell) {
-      <tiptap-button
-        icon="cell_merge"
-        [title]="i18n().table().mergeCells"
-        [disabled]="!state().can.mergeCells"
-        (onClick)="onCommand('mergeCells', $event)"
-      ></tiptap-button>
-      } @if (config().splitCell !== false && state().selection.isSingleCell) {
-      <tiptap-button
-        icon="split_scene"
-        [title]="i18n().table().splitCell"
-        [disabled]="!state().can.splitCell"
-        (onClick)="onCommand('splitCell', $event)"
-      ></tiptap-button>
-      }
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapCellBubbleMenuComponent, isStandalone: true, selector: "tiptap-cell-bubble-menu", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `
+    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
+      <!-- Cell specific actions -->
+      @if (config().mergeCells !== false && !state().selection.isSingleCell) {
+      <tiptap-button
+        icon="cell_merge"
+        [title]="i18n().table().mergeCells"
+        [disabled]="!state().can.mergeCells"
+        (onClick)="onCommand('mergeCells', $event)"
+      ></tiptap-button>
+      } @if (config().splitCell !== false && state().selection.isSingleCell) {
+      <tiptap-button
+        icon="split_scene"
+        [title]="i18n().table().splitCell"
+        [disabled]="!state().can.splitCell"
+        (onClick)="onCommand('splitCell', $event)"
+      ></tiptap-button>
+      }
+    </div>
   `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: TiptapButtonComponent, selector: "tiptap-button", inputs: ["icon", "title", "active", "disabled", "color", "backgroundColor", "variant", "size", "iconSize"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapCellBubbleMenuComponent, decorators: [{
@@ -3981,25 +3984,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImpor
                     standalone: true,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     imports: [CommonModule, TiptapButtonComponent],
-                    template: `
-    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
-      <!-- Cell specific actions -->
-      @if (config().mergeCells !== false && !state().selection.isSingleCell) {
-      <tiptap-button
-        icon="cell_merge"
-        [title]="i18n().table().mergeCells"
-        [disabled]="!state().can.mergeCells"
-        (onClick)="onCommand('mergeCells', $event)"
-      ></tiptap-button>
-      } @if (config().splitCell !== false && state().selection.isSingleCell) {
-      <tiptap-button
-        icon="split_scene"
-        [title]="i18n().table().splitCell"
-        [disabled]="!state().can.splitCell"
-        (onClick)="onCommand('splitCell', $event)"
-      ></tiptap-button>
-      }
-    </div>
+                    template: `
+    <div #menuRef class="bubble-menu" (mousedown)="$event.preventDefault()">
+      <!-- Cell specific actions -->
+      @if (config().mergeCells !== false && !state().selection.isSingleCell) {
+      <tiptap-button
+        icon="cell_merge"
+        [title]="i18n().table().mergeCells"
+        [disabled]="!state().can.mergeCells"
+        (onClick)="onCommand('mergeCells', $event)"
+      ></tiptap-button>
+      } @if (config().splitCell !== false && state().selection.isSingleCell) {
+      <tiptap-button
+        icon="split_scene"
+        [title]="i18n().table().splitCell"
+        [disabled]="!state().can.splitCell"
+        (onClick)="onCommand('splitCell', $event)"
+      ></tiptap-button>
+      }
+    </div>
   `,
                 }]
         }] });
@@ -4215,108 +4218,108 @@ class TiptapLinkBubbleMenuComponent {
         this.hideTippy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapLinkBubbleMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.0", type: TiptapLinkBubbleMenuComponent, isStandalone: true, selector: "tiptap-link-bubble-menu", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "linkInput", first: true, predicate: ["linkInput"], descendants: true }, { propertyName: "menuRef", first: true, predicate: ["menuRef"], descendants: true }], ngImport: i0, template: `
-    <div 
-      #menuRef 
-      class="bubble-menu"
-      (mousedown)="onMouseDown($event)"
-      (click)="$event.stopPropagation()"
-    >
-      <div class="link-input-row">
-        <div class="url-input-container">
-          <span class="material-symbols-outlined icon-link">link</span>
-          <input
-            #linkInput
-            type="text"
-            class="url-field"
-            [placeholder]="t().linkUrl"
-            [ngModel]="editUrl()"
-            (ngModelChange)="editUrl.set($event)"
-            (focus)="onFocus()"
-            (blur)="onBlur()"
-            (keydown.enter)="onApply($event)"
-            (keydown.escape)="onCancel($event)"
-          />
-        </div>
-
-        <div class="action-buttons">
-          <tiptap-button
-            icon="check"
-            [title]="common().apply"
-            color="var(--ate-primary)"
-            [disabled]="!editUrl().trim()"
-            (onClick)="onApply($event)"
-          ></tiptap-button>
-          <tiptap-button
-            icon="open_in_new"
-            [title]="t().openLink"
-            [disabled]="!currentUrl()"
-            (onClick)="onOpenLink($event)"
-          ></tiptap-button>
-          <tiptap-separator />
-          <tiptap-button
-            icon="link_off"
-            [title]="t().removeLink"
-            variant="danger"
-            [disabled]="!currentUrl()"
-            (onClick)="onRemove($event)"
-          ></tiptap-button>
-        </div>
-      </div>
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.0", type: TiptapLinkBubbleMenuComponent, isStandalone: true, selector: "tiptap-link-bubble-menu", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "linkInput", first: true, predicate: ["linkInput"], descendants: true }, { propertyName: "menuRef", first: true, predicate: ["menuRef"], descendants: true }], ngImport: i0, template: `
+    <div 
+      #menuRef 
+      class="bubble-menu"
+      (mousedown)="onMouseDown($event)"
+      (click)="$event.stopPropagation()"
+    >
+      <div class="link-input-row">
+        <div class="url-input-container">
+          <span class="material-symbols-outlined icon-link">link</span>
+          <input
+            #linkInput
+            type="text"
+            class="url-field"
+            [placeholder]="t().linkUrl"
+            [ngModel]="editUrl()"
+            (ngModelChange)="editUrl.set($event)"
+            (focus)="onFocus()"
+            (blur)="onBlur()"
+            (keydown.enter)="onApply($event)"
+            (keydown.escape)="onCancel($event)"
+          />
+        </div>
+
+        <div class="action-buttons">
+          <tiptap-button
+            icon="check"
+            [title]="common().apply"
+            color="var(--ate-primary)"
+            [disabled]="!editUrl().trim()"
+            (onClick)="onApply($event)"
+          ></tiptap-button>
+          <tiptap-button
+            icon="open_in_new"
+            [title]="t().openLink"
+            [disabled]="!currentUrl()"
+            (onClick)="onOpenLink($event)"
+          ></tiptap-button>
+          <tiptap-separator />
+          <tiptap-button
+            icon="link_off"
+            [title]="t().removeLink"
+            variant="danger"
+            [disabled]="!currentUrl()"
+            (onClick)="onRemove($event)"
+          ></tiptap-button>
+        </div>
+      </div>
+    </div>
   `, isInline: true, styles: [".link-input-row{display:flex;align-items:center;gap:6px}.url-input-container{flex:1;display:flex;align-items:center;background:var(--ate-surface-secondary, #f8fafc);border:1px solid var(--ate-border, #e2e8f0);border-radius:8px;padding:0 10px;height:32px;transition:all .15s ease}.url-input-container:focus-within{border-color:var(--ate-primary, #3b82f6);background:var(--ate-surface, #ffffff);box-shadow:0 0 0 2px var(--ate-primary-light, rgba(59, 130, 246, .1))}.icon-link{font-size:16px;color:var(--ate-text-muted, #94a3b8);margin-right:6px}.url-field{background:transparent;border:none;outline:none;color:var(--ate-text, #1e293b);font-size:13px;width:100%;font-family:inherit}.action-buttons{display:flex;align-items:center;gap:2px}\n"], dependencies: [{ kind: "component", type: TiptapButtonComponent, selector: "tiptap-button", inputs: ["icon", "title", "active", "disabled", "color", "backgroundColor", "variant", "size", "iconSize"], outputs: ["onClick"] }, { kind: "component", type: TiptapSeparatorComponent, selector: "tiptap-separator", inputs: ["orientation", "size"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapLinkBubbleMenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: "tiptap-link-bubble-menu", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [TiptapButtonComponent, TiptapSeparatorComponent, FormsModule], template: `
-    <div 
-      #menuRef 
-      class="bubble-menu"
-      (mousedown)="onMouseDown($event)"
-      (click)="$event.stopPropagation()"
-    >
-      <div class="link-input-row">
-        <div class="url-input-container">
-          <span class="material-symbols-outlined icon-link">link</span>
-          <input
-            #linkInput
-            type="text"
-            class="url-field"
-            [placeholder]="t().linkUrl"
-            [ngModel]="editUrl()"
-            (ngModelChange)="editUrl.set($event)"
-            (focus)="onFocus()"
-            (blur)="onBlur()"
-            (keydown.enter)="onApply($event)"
-            (keydown.escape)="onCancel($event)"
-          />
-        </div>
-
-        <div class="action-buttons">
-          <tiptap-button
-            icon="check"
-            [title]="common().apply"
-            color="var(--ate-primary)"
-            [disabled]="!editUrl().trim()"
-            (onClick)="onApply($event)"
-          ></tiptap-button>
-          <tiptap-button
-            icon="open_in_new"
-            [title]="t().openLink"
-            [disabled]="!currentUrl()"
-            (onClick)="onOpenLink($event)"
-          ></tiptap-button>
-          <tiptap-separator />
-          <tiptap-button
-            icon="link_off"
-            [title]="t().removeLink"
-            variant="danger"
-            [disabled]="!currentUrl()"
-            (onClick)="onRemove($event)"
-          ></tiptap-button>
-        </div>
-      </div>
-    </div>
+            args: [{ selector: "tiptap-link-bubble-menu", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [TiptapButtonComponent, TiptapSeparatorComponent, FormsModule], template: `
+    <div 
+      #menuRef 
+      class="bubble-menu"
+      (mousedown)="onMouseDown($event)"
+      (click)="$event.stopPropagation()"
+    >
+      <div class="link-input-row">
+        <div class="url-input-container">
+          <span class="material-symbols-outlined icon-link">link</span>
+          <input
+            #linkInput
+            type="text"
+            class="url-field"
+            [placeholder]="t().linkUrl"
+            [ngModel]="editUrl()"
+            (ngModelChange)="editUrl.set($event)"
+            (focus)="onFocus()"
+            (blur)="onBlur()"
+            (keydown.enter)="onApply($event)"
+            (keydown.escape)="onCancel($event)"
+          />
+        </div>
+
+        <div class="action-buttons">
+          <tiptap-button
+            icon="check"
+            [title]="common().apply"
+            color="var(--ate-primary)"
+            [disabled]="!editUrl().trim()"
+            (onClick)="onApply($event)"
+          ></tiptap-button>
+          <tiptap-button
+            icon="open_in_new"
+            [title]="t().openLink"
+            [disabled]="!currentUrl()"
+            (onClick)="onOpenLink($event)"
+          ></tiptap-button>
+          <tiptap-separator />
+          <tiptap-button
+            icon="link_off"
+            [title]="t().removeLink"
+            variant="danger"
+            [disabled]="!currentUrl()"
+            (onClick)="onRemove($event)"
+          ></tiptap-button>
+        </div>
+      </div>
+    </div>
   `, styles: [".link-input-row{display:flex;align-items:center;gap:6px}.url-input-container{flex:1;display:flex;align-items:center;background:var(--ate-surface-secondary, #f8fafc);border:1px solid var(--ate-border, #e2e8f0);border-radius:8px;padding:0 10px;height:32px;transition:all .15s ease}.url-input-container:focus-within{border-color:var(--ate-primary, #3b82f6);background:var(--ate-surface, #ffffff);box-shadow:0 0 0 2px var(--ate-primary-light, rgba(59, 130, 246, .1))}.icon-link{font-size:16px;color:var(--ate-text-muted, #94a3b8);margin-right:6px}.url-field{background:transparent;border:none;outline:none;color:var(--ate-text, #1e293b);font-size:13px;width:100%;font-family:inherit}.action-buttons{display:flex;align-items:center;gap:2px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { linkInput: [{
                 type: ViewChild,
@@ -4577,174 +4580,174 @@ class TiptapColorBubbleMenuComponent {
         }, 150);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapColorBubbleMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapColorBubbleMenuComponent, isStandalone: true, selector: "tiptap-color-bubble-menu", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "colorInputRef", first: true, predicate: ["colorInput"], descendants: true, isSignal: true }, { propertyName: "menuRef", first: true, predicate: ["menuRef"], descendants: true }], ngImport: i0, template: `
-    <div 
-      #menuRef 
-      class="bubble-menu color-bubble-menu"
-      (mousedown)="onMouseDown($event)"
-      (click)="$event.stopPropagation()"
-    >
-      <div class="color-picker-container">
-        <div class="dropdown-row presets">
-          <div class="color-grid">
-            @for (color of presets; track color) {
-              <tiptap-button 
-                class="color-swatch-btn" 
-                size="small"
-                [title]="color"
-                [active]="isColorActive(color)"
-                [backgroundColor]="color"
-                (onClick)="applyColor(color, true, $event)"
-              ></tiptap-button>
-            }
-          </div>
-        </div>
-
-        <div class="dropdown-row controls">
-          <div class="hex-input-wrapper">
-            <span class="hex-hash">#</span>
-            <input 
-              #hexInput
-              type="text" 
-              class="hex-input" 
-              [value]="hexValue()"
-              [attr.aria-label]="t().customColor"
-              (input)="onHexInput($event)"
-              (change)="onHexChange($event)"
-              (keydown.enter)="onApply($event)"
-              (focus)="onFocus()"
-              (blur)="onBlur()"
-              maxlength="6"
-              placeholder="000000"
-            />
-          </div>
-          
-          <div class="native-trigger-wrapper">
-            <tiptap-button 
-              class="btn-native-picker-trigger" 
-              icon="colorize"
-              [title]="t().customColor"
-              [backgroundColor]="currentColor()"
-              (onClick)="triggerNativePicker($event)" 
-            ></tiptap-button>
-            <input
-              #colorInput
-              type="color"
-              class="hidden-native-input"
-              [value]="currentColor()"
-              [attr.aria-label]="t().customColor"
-              (input)="onNativeInput($event)"
-              (change)="onNativeChange($event)"
-              (focus)="onFocus()"
-              (blur)="onBlur()"
-            />
-          </div>
-
-          <tiptap-button 
-            icon="check"
-            [title]="common().apply"
-            color="var(--ate-primary)"
-            (onClick)="onApply($event)"
-          ></tiptap-button>
-
-          <tiptap-separator />
-
-          <tiptap-button 
-            icon="format_color_reset"
-            [title]="t().clear"
-            variant="danger"
-            (onClick)="onClearColor($event)" 
-          ></tiptap-button>
-        </div>
-
-      </div>
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapColorBubbleMenuComponent, isStandalone: true, selector: "tiptap-color-bubble-menu", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "colorInputRef", first: true, predicate: ["colorInput"], descendants: true, isSignal: true }, { propertyName: "menuRef", first: true, predicate: ["menuRef"], descendants: true }], ngImport: i0, template: `
+    <div 
+      #menuRef 
+      class="bubble-menu color-bubble-menu"
+      (mousedown)="onMouseDown($event)"
+      (click)="$event.stopPropagation()"
+    >
+      <div class="color-picker-container">
+        <div class="dropdown-row presets">
+          <div class="color-grid">
+            @for (color of presets; track color) {
+              <tiptap-button 
+                class="color-swatch-btn" 
+                size="small"
+                [title]="color"
+                [active]="isColorActive(color)"
+                [backgroundColor]="color"
+                (onClick)="applyColor(color, true, $event)"
+              ></tiptap-button>
+            }
+          </div>
+        </div>
+
+        <div class="dropdown-row controls">
+          <div class="hex-input-wrapper">
+            <span class="hex-hash">#</span>
+            <input 
+              #hexInput
+              type="text" 
+              class="hex-input" 
+              [value]="hexValue()"
+              [attr.aria-label]="t().customColor"
+              (input)="onHexInput($event)"
+              (change)="onHexChange($event)"
+              (keydown.enter)="onApply($event)"
+              (focus)="onFocus()"
+              (blur)="onBlur()"
+              maxlength="6"
+              placeholder="000000"
+            />
+          </div>
+          
+          <div class="native-trigger-wrapper">
+            <tiptap-button 
+              class="btn-native-picker-trigger" 
+              icon="colorize"
+              [title]="t().customColor"
+              [backgroundColor]="currentColor()"
+              (onClick)="triggerNativePicker($event)" 
+            ></tiptap-button>
+            <input
+              #colorInput
+              type="color"
+              class="hidden-native-input"
+              [value]="currentColor()"
+              [attr.aria-label]="t().customColor"
+              (input)="onNativeInput($event)"
+              (change)="onNativeChange($event)"
+              (focus)="onFocus()"
+              (blur)="onBlur()"
+            />
+          </div>
+
+          <tiptap-button 
+            icon="check"
+            [title]="common().apply"
+            color="var(--ate-primary)"
+            (onClick)="onApply($event)"
+          ></tiptap-button>
+
+          <tiptap-separator />
+
+          <tiptap-button 
+            icon="format_color_reset"
+            [title]="t().clear"
+            variant="danger"
+            (onClick)="onClearColor($event)" 
+          ></tiptap-button>
+        </div>
+
+      </div>
+    </div>
   `, isInline: true, styles: [".color-picker-container{display:flex;flex-direction:column;gap:8px}.dropdown-row{display:flex;align-items:center;width:100%}.dropdown-row.presets{justify-content:center}.dropdown-row.controls{gap:8px;justify-content:space-between;padding-top:4px;border-top:1px solid var(--ate-border, #e2e8f0)}.color-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;width:100%}:host ::ng-deep .color-swatch-btn .tiptap-button{width:100%;aspect-ratio:1;height:auto;border-radius:4px;border:1px solid rgba(0,0,0,.1);padding:0}:host ::ng-deep .color-swatch-btn .tiptap-button.is-active{border-color:var(--ate-primary, #3b82f6);box-shadow:0 0 0 2px #3b82f64d}:host ::ng-deep .btn-native-picker-trigger .tiptap-button{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.2)}.divider-v{width:1px;height:24px;background:var(--ate-border, #e2e8f0)}.hex-input-wrapper{flex:1;display:flex;align-items:center;background:var(--ate-surface-secondary, #f8fafc);border:1px solid var(--ate-border, #e2e8f0);border-radius:8px;padding:0 10px;height:32px;transition:border-color .15s ease}.hex-input-wrapper:focus-within{border-color:var(--ate-primary, #3b82f6);background:var(--ate-menu-bg, #ffffff)}.hex-hash{color:var(--ate-text-muted, #94a3b8);font-family:monospace;font-size:.875rem}.hex-input{background:transparent;border:none;outline:none;color:var(--ate-text, #1e293b);font-family:monospace;font-size:.875rem;width:100%;padding-left:4px}.native-trigger-wrapper{position:relative;width:32px;height:32px}.hidden-native-input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: TiptapButtonComponent, selector: "tiptap-button", inputs: ["icon", "title", "active", "disabled", "color", "backgroundColor", "variant", "size", "iconSize"], outputs: ["onClick"] }, { kind: "component", type: TiptapSeparatorComponent, selector: "tiptap-separator", inputs: ["orientation", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapColorBubbleMenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: "tiptap-color-bubble-menu", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, FormsModule, TiptapButtonComponent, TiptapSeparatorComponent], template: `
-    <div 
-      #menuRef 
-      class="bubble-menu color-bubble-menu"
-      (mousedown)="onMouseDown($event)"
-      (click)="$event.stopPropagation()"
-    >
-      <div class="color-picker-container">
-        <div class="dropdown-row presets">
-          <div class="color-grid">
-            @for (color of presets; track color) {
-              <tiptap-button 
-                class="color-swatch-btn" 
-                size="small"
-                [title]="color"
-                [active]="isColorActive(color)"
-                [backgroundColor]="color"
-                (onClick)="applyColor(color, true, $event)"
-              ></tiptap-button>
-            }
-          </div>
-        </div>
-
-        <div class="dropdown-row controls">
-          <div class="hex-input-wrapper">
-            <span class="hex-hash">#</span>
-            <input 
-              #hexInput
-              type="text" 
-              class="hex-input" 
-              [value]="hexValue()"
-              [attr.aria-label]="t().customColor"
-              (input)="onHexInput($event)"
-              (change)="onHexChange($event)"
-              (keydown.enter)="onApply($event)"
-              (focus)="onFocus()"
-              (blur)="onBlur()"
-              maxlength="6"
-              placeholder="000000"
-            />
-          </div>
-          
-          <div class="native-trigger-wrapper">
-            <tiptap-button 
-              class="btn-native-picker-trigger" 
-              icon="colorize"
-              [title]="t().customColor"
-              [backgroundColor]="currentColor()"
-              (onClick)="triggerNativePicker($event)" 
-            ></tiptap-button>
-            <input
-              #colorInput
-              type="color"
-              class="hidden-native-input"
-              [value]="currentColor()"
-              [attr.aria-label]="t().customColor"
-              (input)="onNativeInput($event)"
-              (change)="onNativeChange($event)"
-              (focus)="onFocus()"
-              (blur)="onBlur()"
-            />
-          </div>
-
-          <tiptap-button 
-            icon="check"
-            [title]="common().apply"
-            color="var(--ate-primary)"
-            (onClick)="onApply($event)"
-          ></tiptap-button>
-
-          <tiptap-separator />
-
-          <tiptap-button 
-            icon="format_color_reset"
-            [title]="t().clear"
-            variant="danger"
-            (onClick)="onClearColor($event)" 
-          ></tiptap-button>
-        </div>
-
-      </div>
-    </div>
+            args: [{ selector: "tiptap-color-bubble-menu", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, FormsModule, TiptapButtonComponent, TiptapSeparatorComponent], template: `
+    <div 
+      #menuRef 
+      class="bubble-menu color-bubble-menu"
+      (mousedown)="onMouseDown($event)"
+      (click)="$event.stopPropagation()"
+    >
+      <div class="color-picker-container">
+        <div class="dropdown-row presets">
+          <div class="color-grid">
+            @for (color of presets; track color) {
+              <tiptap-button 
+                class="color-swatch-btn" 
+                size="small"
+                [title]="color"
+                [active]="isColorActive(color)"
+                [backgroundColor]="color"
+                (onClick)="applyColor(color, true, $event)"
+              ></tiptap-button>
+            }
+          </div>
+        </div>
+
+        <div class="dropdown-row controls">
+          <div class="hex-input-wrapper">
+            <span class="hex-hash">#</span>
+            <input 
+              #hexInput
+              type="text" 
+              class="hex-input" 
+              [value]="hexValue()"
+              [attr.aria-label]="t().customColor"
+              (input)="onHexInput($event)"
+              (change)="onHexChange($event)"
+              (keydown.enter)="onApply($event)"
+              (focus)="onFocus()"
+              (blur)="onBlur()"
+              maxlength="6"
+              placeholder="000000"
+            />
+          </div>
+          
+          <div class="native-trigger-wrapper">
+            <tiptap-button 
+              class="btn-native-picker-trigger" 
+              icon="colorize"
+              [title]="t().customColor"
+              [backgroundColor]="currentColor()"
+              (onClick)="triggerNativePicker($event)" 
+            ></tiptap-button>
+            <input
+              #colorInput
+              type="color"
+              class="hidden-native-input"
+              [value]="currentColor()"
+              [attr.aria-label]="t().customColor"
+              (input)="onNativeInput($event)"
+              (change)="onNativeChange($event)"
+              (focus)="onFocus()"
+              (blur)="onBlur()"
+            />
+          </div>
+
+          <tiptap-button 
+            icon="check"
+            [title]="common().apply"
+            color="var(--ate-primary)"
+            (onClick)="onApply($event)"
+          ></tiptap-button>
+
+          <tiptap-separator />
+
+          <tiptap-button 
+            icon="format_color_reset"
+            [title]="t().clear"
+            variant="danger"
+            (onClick)="onClearColor($event)" 
+          ></tiptap-button>
+        </div>
+
+      </div>
+    </div>
   `, styles: [".color-picker-container{display:flex;flex-direction:column;gap:8px}.dropdown-row{display:flex;align-items:center;width:100%}.dropdown-row.presets{justify-content:center}.dropdown-row.controls{gap:8px;justify-content:space-between;padding-top:4px;border-top:1px solid var(--ate-border, #e2e8f0)}.color-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;width:100%}:host ::ng-deep .color-swatch-btn .tiptap-button{width:100%;aspect-ratio:1;height:auto;border-radius:4px;border:1px solid rgba(0,0,0,.1);padding:0}:host ::ng-deep .color-swatch-btn .tiptap-button.is-active{border-color:var(--ate-primary, #3b82f6);box-shadow:0 0 0 2px #3b82f64d}:host ::ng-deep .btn-native-picker-trigger .tiptap-button{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.2)}.divider-v{width:1px;height:24px;background:var(--ate-border, #e2e8f0)}.hex-input-wrapper{flex:1;display:flex;align-items:center;background:var(--ate-surface-secondary, #f8fafc);border:1px solid var(--ate-border, #e2e8f0);border-radius:8px;padding:0 10px;height:32px;transition:border-color .15s ease}.hex-input-wrapper:focus-within{border-color:var(--ate-primary, #3b82f6);background:var(--ate-menu-bg, #ffffff)}.hex-hash{color:var(--ate-text-muted, #94a3b8);font-family:monospace;font-size:.875rem}.hex-input{background:transparent;border:none;outline:none;color:var(--ate-text, #1e293b);font-family:monospace;font-size:.875rem;width:100%;padding-left:4px}.native-trigger-wrapper{position:relative;width:32px;height:32px}.hidden-native-input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}\n"] }]
         }], ctorParameters: () => [], propDecorators: { menuRef: [{
                 type: ViewChild,
@@ -5144,8 +5147,8 @@ class TiptapSlashCommandsComponent {
     }
     addKeyboardPlugin(ed) {
         // Add a ProseMirror plugin to intercept keyboard events
-        const keyboardPlugin = new Plugin$1({
-            key: new PluginKey$1("slash-commands-keyboard"),
+        const keyboardPlugin = new Plugin({
+            key: new PluginKey("slash-commands-keyboard"),
             props: {
                 handleKeyDown: (view, event) => {
                     // Only handle if menu is active
@@ -5196,54 +5199,94 @@ class TiptapSlashCommandsComponent {
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapSlashCommandsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapSlashCommandsComponent, isStandalone: true, selector: "tiptap-slash-commands", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "menuRef", first: true, predicate: ["menuRef"], descendants: true }], ngImport: i0, template: `
-    <div #menuRef class="slash-commands-menu">
-      @for (command of filteredCommands(); track command.title) {
-      <div
-        class="slash-command-item"
-        [class.selected]="$index === selectedIndex()"
-        (mousedown)="executeCommand(command); $event.preventDefault(); $event.stopPropagation()"
-        (mouseenter)="selectedIndex.set($index)"
-      >
-        <div class="slash-command-icon">
-          <span class="material-symbols-outlined">{{ command.icon }}</span>
-        </div>
-        <div class="slash-command-content">
-          <div class="slash-command-title">{{ command.title }}</div>
-          <div class="slash-command-description">{{ command.description }}</div>
-        </div>
-      </div>
-      }
-    </div>
-  `, isInline: true, styles: [".slash-commands-menu{background:var(--ate-menu-bg);border:1px solid var(--ate-menu-border);border-radius:var(--ate-border-radius, 12px);box-shadow:var(--ate-menu-shadow);padding:var(--ate-menu-padding);max-height:320px;overflow-y:auto;min-width:280px;outline:none;animation:slashMenuFadeIn .2s cubic-bezier(0,0,.2,1);scrollbar-width:thin;scrollbar-color:var(--ate-scrollbar-thumb) var(--ate-scrollbar-track)}.slash-commands-menu::-webkit-scrollbar{width:var(--ate-scrollbar-width)}.slash-commands-menu::-webkit-scrollbar-track{background:var(--ate-scrollbar-track)}.slash-commands-menu::-webkit-scrollbar-thumb{background:var(--ate-scrollbar-thumb);border:3px solid transparent;background-clip:content-box;border-radius:10px}.slash-commands-menu::-webkit-scrollbar-thumb:hover{background:var(--ate-scrollbar-thumb-hover);background-clip:content-box}@keyframes slashMenuFadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.slash-command-item{display:flex;align-items:center;gap:12px;padding:var(--ate-menu-padding);border-radius:var(--ate-border-radius, 8px);cursor:pointer;transition:all .15s ease;border:var(--ate-border-width, 1px) solid transparent;outline:none;margin-bottom:2px}.slash-command-item:last-child{margin-bottom:0}.slash-command-item:hover{background:var(--ate-surface-secondary)}.slash-command-item.selected{background:var(--ate-primary-light);border-color:var(--ate-primary-light-alpha)}.slash-command-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--ate-surface-tertiary);border-radius:var(--ate-sub-border-radius, 8px);color:var(--ate-primary);flex-shrink:0;transition:all .15s ease}.slash-command-item.selected .slash-command-icon{background:var(--ate-primary);color:var(--ate-primary-contrast, #ffffff)}.slash-command-icon .material-symbols-outlined{font-size:18px}.slash-command-content{flex:1;min-width:0}.slash-command-title{font-weight:500;color:var(--ate-text);font-size:14px;margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slash-command-description{color:var(--ate-text-secondary);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: TiptapSlashCommandsComponent, isStandalone: true, selector: "tiptap-slash-commands", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "menuRef", first: true, predicate: ["menuRef"], descendants: true }], ngImport: i0, template: `
+    <div #menuRef class="slash-commands-menu">
+      @for (command of filteredCommands(); track command.title) {
+      <div
+        class="slash-command-item"
+        [class.selected]="$index === selectedIndex()"
+        (mousedown)="executeCommand(command); $event.preventDefault(); $event.stopPropagation()"
+        (mouseenter)="selectedIndex.set($index)"
+      >
+        <div class="slash-command-icon">
+          <span class="material-symbols-outlined">{{ command.icon }}</span>
+        </div>
+        <div class="slash-command-content">
+          <div class="slash-command-title">{{ command.title }}</div>
+          <div class="slash-command-description">{{ command.description }}</div>
+        </div>
+      </div>
+      }
+    </div>
+  `, isInline: true, styles: [".slash-commands-menu{background:var(--ate-menu-bg);border:1px solid var(--ate-menu-border);border-radius:var(--ate-menu-border-radius, 12px);box-shadow:var(--ate-menu-shadow);padding:var(--ate-menu-padding);max-height:320px;overflow-y:auto;min-width:280px;outline:none;animation:slashMenuFadeIn .2s cubic-bezier(0,0,.2,1);scrollbar-width:thin;scrollbar-color:var(--ate-scrollbar-thumb) var(--ate-scrollbar-track)}.slash-commands-menu::-webkit-scrollbar{width:var(--ate-scrollbar-width)}.slash-commands-menu::-webkit-scrollbar-track{background:var(--ate-scrollbar-track)}.slash-commands-menu::-webkit-scrollbar-thumb{background:var(--ate-scrollbar-thumb);border:3px solid transparent;background-clip:content-box;border-radius:10px}.slash-commands-menu::-webkit-scrollbar-thumb:hover{background:var(--ate-scrollbar-thumb-hover);background-clip:content-box}@keyframes slashMenuFadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.slash-command-item{display:flex;align-items:center;gap:12px;padding:var(--ate-menu-padding);border-radius:var(--ate-menu-border-radius, 8px);cursor:pointer;transition:all .15s ease;border:var(--ate-border-width, 1px) solid transparent;outline:none;margin-bottom:2px}.slash-command-item:last-child{margin-bottom:0}.slash-command-item:hover{background:var(--ate-surface-secondary)}.slash-command-item.selected{background:var(--ate-primary-light);border-color:var(--ate-primary-light-alpha)}.slash-command-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--ate-surface-tertiary);border-radius:var(--ate-sub-border-radius, 8px);color:var(--ate-primary);flex-shrink:0;transition:all .15s ease}.slash-command-item.selected .slash-command-icon{background:var(--ate-primary);color:var(--ate-primary-contrast, #ffffff)}.slash-command-icon .material-symbols-outlined{font-size:18px}.slash-command-content{flex:1;min-width:0}.slash-command-title{font-weight:500;color:var(--ate-text);font-size:14px;margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slash-command-description{color:var(--ate-text-secondary);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapSlashCommandsComponent, decorators: [{
             type: Component,
-            args: [{ selector: "tiptap-slash-commands", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
-    <div #menuRef class="slash-commands-menu">
-      @for (command of filteredCommands(); track command.title) {
-      <div
-        class="slash-command-item"
-        [class.selected]="$index === selectedIndex()"
-        (mousedown)="executeCommand(command); $event.preventDefault(); $event.stopPropagation()"
-        (mouseenter)="selectedIndex.set($index)"
-      >
-        <div class="slash-command-icon">
-          <span class="material-symbols-outlined">{{ command.icon }}</span>
-        </div>
-        <div class="slash-command-content">
-          <div class="slash-command-title">{{ command.title }}</div>
-          <div class="slash-command-description">{{ command.description }}</div>
-        </div>
-      </div>
-      }
-    </div>
-  `, styles: [".slash-commands-menu{background:var(--ate-menu-bg);border:1px solid var(--ate-menu-border);border-radius:var(--ate-border-radius, 12px);box-shadow:var(--ate-menu-shadow);padding:var(--ate-menu-padding);max-height:320px;overflow-y:auto;min-width:280px;outline:none;animation:slashMenuFadeIn .2s cubic-bezier(0,0,.2,1);scrollbar-width:thin;scrollbar-color:var(--ate-scrollbar-thumb) var(--ate-scrollbar-track)}.slash-commands-menu::-webkit-scrollbar{width:var(--ate-scrollbar-width)}.slash-commands-menu::-webkit-scrollbar-track{background:var(--ate-scrollbar-track)}.slash-commands-menu::-webkit-scrollbar-thumb{background:var(--ate-scrollbar-thumb);border:3px solid transparent;background-clip:content-box;border-radius:10px}.slash-commands-menu::-webkit-scrollbar-thumb:hover{background:var(--ate-scrollbar-thumb-hover);background-clip:content-box}@keyframes slashMenuFadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.slash-command-item{display:flex;align-items:center;gap:12px;padding:var(--ate-menu-padding);border-radius:var(--ate-border-radius, 8px);cursor:pointer;transition:all .15s ease;border:var(--ate-border-width, 1px) solid transparent;outline:none;margin-bottom:2px}.slash-command-item:last-child{margin-bottom:0}.slash-command-item:hover{background:var(--ate-surface-secondary)}.slash-command-item.selected{background:var(--ate-primary-light);border-color:var(--ate-primary-light-alpha)}.slash-command-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--ate-surface-tertiary);border-radius:var(--ate-sub-border-radius, 8px);color:var(--ate-primary);flex-shrink:0;transition:all .15s ease}.slash-command-item.selected .slash-command-icon{background:var(--ate-primary);color:var(--ate-primary-contrast, #ffffff)}.slash-command-icon .material-symbols-outlined{font-size:18px}.slash-command-content{flex:1;min-width:0}.slash-command-title{font-weight:500;color:var(--ate-text);font-size:14px;margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slash-command-description{color:var(--ate-text-secondary);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"] }]
+            args: [{ selector: "tiptap-slash-commands", standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    <div #menuRef class="slash-commands-menu">
+      @for (command of filteredCommands(); track command.title) {
+      <div
+        class="slash-command-item"
+        [class.selected]="$index === selectedIndex()"
+        (mousedown)="executeCommand(command); $event.preventDefault(); $event.stopPropagation()"
+        (mouseenter)="selectedIndex.set($index)"
+      >
+        <div class="slash-command-icon">
+          <span class="material-symbols-outlined">{{ command.icon }}</span>
+        </div>
+        <div class="slash-command-content">
+          <div class="slash-command-title">{{ command.title }}</div>
+          <div class="slash-command-description">{{ command.description }}</div>
+        </div>
+      </div>
+      }
+    </div>
+  `, styles: [".slash-commands-menu{background:var(--ate-menu-bg);border:1px solid var(--ate-menu-border);border-radius:var(--ate-menu-border-radius, 12px);box-shadow:var(--ate-menu-shadow);padding:var(--ate-menu-padding);max-height:320px;overflow-y:auto;min-width:280px;outline:none;animation:slashMenuFadeIn .2s cubic-bezier(0,0,.2,1);scrollbar-width:thin;scrollbar-color:var(--ate-scrollbar-thumb) var(--ate-scrollbar-track)}.slash-commands-menu::-webkit-scrollbar{width:var(--ate-scrollbar-width)}.slash-commands-menu::-webkit-scrollbar-track{background:var(--ate-scrollbar-track)}.slash-commands-menu::-webkit-scrollbar-thumb{background:var(--ate-scrollbar-thumb);border:3px solid transparent;background-clip:content-box;border-radius:10px}.slash-commands-menu::-webkit-scrollbar-thumb:hover{background:var(--ate-scrollbar-thumb-hover);background-clip:content-box}@keyframes slashMenuFadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.slash-command-item{display:flex;align-items:center;gap:12px;padding:var(--ate-menu-padding);border-radius:var(--ate-menu-border-radius, 8px);cursor:pointer;transition:all .15s ease;border:var(--ate-border-width, 1px) solid transparent;outline:none;margin-bottom:2px}.slash-command-item:last-child{margin-bottom:0}.slash-command-item:hover{background:var(--ate-surface-secondary)}.slash-command-item.selected{background:var(--ate-primary-light);border-color:var(--ate-primary-light-alpha)}.slash-command-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--ate-surface-tertiary);border-radius:var(--ate-sub-border-radius, 8px);color:var(--ate-primary);flex-shrink:0;transition:all .15s ease}.slash-command-item.selected .slash-command-icon{background:var(--ate-primary);color:var(--ate-primary-contrast, #ffffff)}.slash-command-icon .material-symbols-outlined{font-size:18px}.slash-command-content{flex:1;min-width:0}.slash-command-title{font-weight:500;color:var(--ate-text);font-size:14px;margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slash-command-description{color:var(--ate-text-secondary);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"] }]
         }], ctorParameters: () => [], propDecorators: { menuRef: [{
                 type: ViewChild,
                 args: ["menuRef", { static: false }]
             }] } });
 
+/**
+ * Edit Toggle Component
+ * Allows switching between editable and readonly modes
+ */
+class TiptapEditToggleComponent {
+    constructor() {
+        this.editable = input.required();
+        this.translations = input.required();
+        this.toggle = output();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapEditToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.0", type: TiptapEditToggleComponent, isStandalone: true, selector: "tiptap-edit-toggle", inputs: { editable: { classPropertyName: "editable", publicName: "editable", isSignal: true, isRequired: true, transformFunction: null }, translations: { classPropertyName: "translations", publicName: "translations", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { toggle: "toggle" }, ngImport: i0, template: `
+    <div class="ate-edit-toggle-container" [class.is-editable]="editable()">
+      <tiptap-button
+        [icon]="editable() ? 'visibility' : 'edit'"
+        [title]="editable() ? translations().editor.viewMode : translations().editor.toggleEdit"
+        (onClick)="toggle.emit($event)"
+        size="medium"
+        iconSize="small"
+        backgroundColor="var(--ate-primary-lighter)"
+      />
+    </div>
+  `, isInline: true, styles: [".ate-edit-toggle-container{position:absolute;margin-top:16px;right:16px;z-index:50}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: TiptapButtonComponent, selector: "tiptap-button", inputs: ["icon", "title", "active", "disabled", "color", "backgroundColor", "variant", "size", "iconSize"], outputs: ["onClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: TiptapEditToggleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "tiptap-edit-toggle", standalone: true, imports: [CommonModule, TiptapButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    <div class="ate-edit-toggle-container" [class.is-editable]="editable()">
+      <tiptap-button
+        [icon]="editable() ? 'visibility' : 'edit'"
+        [title]="editable() ? translations().editor.viewMode : translations().editor.toggleEdit"
+        (onClick)="toggle.emit($event)"
+        size="medium"
+        iconSize="small"
+        backgroundColor="var(--ate-primary-lighter)"
+      />
+    </div>
+  `, styles: [".ate-edit-toggle-container{position:absolute;margin-top:16px;right:16px;z-index:50}\n"] }]
+        }] });
+
 class NoopValueAccessorDirective {
     writeValue(obj) { }
     registerOnChange(fn) { }
@@ -5622,6 +5665,7 @@ class AngularTiptapEditorComponent {
         this.autofocus = input(false);
         this.seamless = input(false);
         this.floatingToolbar = input(false);
+        this.showEditToggle = input(false);
         this.tiptapExtensions = input([]);
         this.tiptapOptions = input({});
         // Nouveaux inputs pour les bubble menus
@@ -5668,6 +5712,7 @@ class AngularTiptapEditorComponent {
         this.editorUpdate = output();
         this.editorFocus = output();
         this.editorBlur = output();
+        this.editableChange = output();
         // ViewChild with signal
         this.editorElement = viewChild.required("editorElement");
         // Private signals for internal state
@@ -5959,6 +6004,12 @@ class AngularTiptapEditorComponent {
         // Stocker la référence de l'éditeur immédiatement
         this._editor.set(newEditor);
     }
+    toggleEditMode(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        const newEditable = !this.editable();
+        this.editableChange.emit(newEditable);
+    }
     updateCharacterCount(editor) {
         if ((this.showCharacterCount() || this.showWordCount()) && editor.storage["characterCount"]) {
             const storage = editor.storage["characterCount"];
@@ -6078,119 +6129,127 @@ class AngularTiptapEditorComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: AngularTiptapEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: AngularTiptapEditorComponent, isStandalone: true, selector: "angular-tiptap-editor", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, editable: { classPropertyName: "editable", publicName: "editable", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, fillContainer: { classPropertyName: "fillContainer", publicName: "fillContainer", isSignal: true, isRequired: false, transformFunction: null }, showToolbar: { classPropertyName: "showToolbar", publicName: "showToolbar", isSignal: true, isRequired: false, transformFunction: null }, showFooter: { classPropertyName: "showFooter", publicName: "showFooter", isSignal: true, isRequired: false, transformFunction: null }, showCharacterCount: { classPropertyName: "showCharacterCount", publicName: "showCharacterCount", isSignal: true, isRequired: false, transformFunction: null }, showWordCount: { classPropertyName: "showWordCount", publicName: "showWordCount", isSignal: true, isRequired: false, transformFunction: null }, maxCharacters: { classPropertyName: "maxCharacters", publicName: "maxCharacters", isSignal: true, isRequired: false, transformFunction: null }, enableOfficePaste: { classPropertyName: "enableOfficePaste", publicName: "enableOfficePaste", isSignal: true, isRequired: false, transformFunction: null }, enableSlashCommands: { classPropertyName: "enableSlashCommands", publicName: "enableSlashCommands", isSignal: true, isRequired: false, transformFunction: null }, slashCommands: { classPropertyName: "slashCommands", publicName: "slashCommands", isSignal: true, isRequired: false, transformFunction: null }, customSlashCommands: { classPropertyName: "customSlashCommands", publicName: "customSlashCommands", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, autofocus: { classPropertyName: "autofocus", publicName: "autofocus", isSignal: true, isRequired: false, transformFunction: null }, seamless: { classPropertyName: "seamless", publicName: "seamless", isSignal: true, isRequired: false, transformFunction: null }, floatingToolbar: { classPropertyName: "floatingToolbar", publicName: "floatingToolbar", isSignal: true, isRequired: false, transformFunction: null }, tiptapExtensions: { classPropertyName: "tiptapExtensions", publicName: "tiptapExtensions", isSignal: true, isRequired: false, transformFunction: null }, tiptapOptions: { classPropertyName: "tiptapOptions", publicName: "tiptapOptions", isSignal: true, isRequired: false, transformFunction: null }, showBubbleMenu: { classPropertyName: "showBubbleMenu", publicName: "showBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, bubbleMenu: { classPropertyName: "bubbleMenu", publicName: "bubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, showImageBubbleMenu: { classPropertyName: "showImageBubbleMenu", publicName: "showImageBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, imageBubbleMenu: { classPropertyName: "imageBubbleMenu", publicName: "imageBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, toolbar: { classPropertyName: "toolbar", publicName: "toolbar", isSignal: true, isRequired: false, transformFunction: null }, showTableBubbleMenu: { classPropertyName: "showTableBubbleMenu", publicName: "showTableBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, tableBubbleMenu: { classPropertyName: "tableBubbleMenu", publicName: "tableBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, showCellBubbleMenu: { classPropertyName: "showCellBubbleMenu", publicName: "showCellBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, cellBubbleMenu: { classPropertyName: "cellBubbleMenu", publicName: "cellBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, stateCalculators: { classPropertyName: "stateCalculators", publicName: "stateCalculators", isSignal: true, isRequired: false, transformFunction: null }, imageUpload: { classPropertyName: "imageUpload", publicName: "imageUpload", isSignal: true, isRequired: false, transformFunction: null }, imageUploadHandler: { classPropertyName: "imageUploadHandler", publicName: "imageUploadHandler", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { contentChange: "contentChange", editorCreated: "editorCreated", editorUpdate: "editorUpdate", editorFocus: "editorFocus", editorBlur: "editorBlur" }, host: { properties: { "class.fill-container": "fillContainer()", "class.floating-toolbar": "floatingToolbar()", "class.is-readonly": "!editable() && !mergedDisabled()", "class.is-disabled": "mergedDisabled()", "style.--ate-border-width": "seamless() || mergedDisabled() ? '0' : null", "style.--ate-background": "seamless() ? 'transparent' : (mergedDisabled() ? 'var(--ate-surface-tertiary)' : null)", "style.--ate-toolbar-border-color": "seamless() ? 'transparent' : null", "style.--ate-counter-background": "seamless() ? 'transparent' : null", "style.--ate-counter-border-color": "seamless() ? 'transparent' : null" } }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.0", type: AngularTiptapEditorComponent, isStandalone: true, selector: "angular-tiptap-editor", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, editable: { classPropertyName: "editable", publicName: "editable", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, fillContainer: { classPropertyName: "fillContainer", publicName: "fillContainer", isSignal: true, isRequired: false, transformFunction: null }, showToolbar: { classPropertyName: "showToolbar", publicName: "showToolbar", isSignal: true, isRequired: false, transformFunction: null }, showFooter: { classPropertyName: "showFooter", publicName: "showFooter", isSignal: true, isRequired: false, transformFunction: null }, showCharacterCount: { classPropertyName: "showCharacterCount", publicName: "showCharacterCount", isSignal: true, isRequired: false, transformFunction: null }, showWordCount: { classPropertyName: "showWordCount", publicName: "showWordCount", isSignal: true, isRequired: false, transformFunction: null }, maxCharacters: { classPropertyName: "maxCharacters", publicName: "maxCharacters", isSignal: true, isRequired: false, transformFunction: null }, enableOfficePaste: { classPropertyName: "enableOfficePaste", publicName: "enableOfficePaste", isSignal: true, isRequired: false, transformFunction: null }, enableSlashCommands: { classPropertyName: "enableSlashCommands", publicName: "enableSlashCommands", isSignal: true, isRequired: false, transformFunction: null }, slashCommands: { classPropertyName: "slashCommands", publicName: "slashCommands", isSignal: true, isRequired: false, transformFunction: null }, customSlashCommands: { classPropertyName: "customSlashCommands", publicName: "customSlashCommands", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, autofocus: { classPropertyName: "autofocus", publicName: "autofocus", isSignal: true, isRequired: false, transformFunction: null }, seamless: { classPropertyName: "seamless", publicName: "seamless", isSignal: true, isRequired: false, transformFunction: null }, floatingToolbar: { classPropertyName: "floatingToolbar", publicName: "floatingToolbar", isSignal: true, isRequired: false, transformFunction: null }, showEditToggle: { classPropertyName: "showEditToggle", publicName: "showEditToggle", isSignal: true, isRequired: false, transformFunction: null }, tiptapExtensions: { classPropertyName: "tiptapExtensions", publicName: "tiptapExtensions", isSignal: true, isRequired: false, transformFunction: null }, tiptapOptions: { classPropertyName: "tiptapOptions", publicName: "tiptapOptions", isSignal: true, isRequired: false, transformFunction: null }, showBubbleMenu: { classPropertyName: "showBubbleMenu", publicName: "showBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, bubbleMenu: { classPropertyName: "bubbleMenu", publicName: "bubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, showImageBubbleMenu: { classPropertyName: "showImageBubbleMenu", publicName: "showImageBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, imageBubbleMenu: { classPropertyName: "imageBubbleMenu", publicName: "imageBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, toolbar: { classPropertyName: "toolbar", publicName: "toolbar", isSignal: true, isRequired: false, transformFunction: null }, showTableBubbleMenu: { classPropertyName: "showTableBubbleMenu", publicName: "showTableBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, tableBubbleMenu: { classPropertyName: "tableBubbleMenu", publicName: "tableBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, showCellBubbleMenu: { classPropertyName: "showCellBubbleMenu", publicName: "showCellBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, cellBubbleMenu: { classPropertyName: "cellBubbleMenu", publicName: "cellBubbleMenu", isSignal: true, isRequired: false, transformFunction: null }, stateCalculators: { classPropertyName: "stateCalculators", publicName: "stateCalculators", isSignal: true, isRequired: false, transformFunction: null }, imageUpload: { classPropertyName: "imageUpload", publicName: "imageUpload", isSignal: true, isRequired: false, transformFunction: null }, imageUploadHandler: { classPropertyName: "imageUploadHandler", publicName: "imageUploadHandler", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { contentChange: "contentChange", editorCreated: "editorCreated", editorUpdate: "editorUpdate", editorFocus: "editorFocus", editorBlur: "editorBlur", editableChange: "editableChange" }, host: { properties: { "class.fill-container": "fillContainer()", "class.floating-toolbar": "floatingToolbar()", "class.is-readonly": "!editable() && !mergedDisabled()", "class.is-disabled": "mergedDisabled()", "style.--ate-border-width": "seamless() || mergedDisabled() ? '0' : null", "style.--ate-background": "seamless() ? 'transparent' : (mergedDisabled() ? 'var(--ate-surface-tertiary)' : null)", "style.--ate-toolbar-border-color": "seamless() ? 'transparent' : null", "style.--ate-counter-background": "seamless() ? 'transparent' : null", "style.--ate-counter-border-color": "seamless() ? 'transparent' : null" } }, providers: [
             EditorCommandsService,
             ImageService,
             ColorPickerService,
             LinkService,
-        ], viewQueries: [{ propertyName: "editorElement", first: true, predicate: ["editorElement"], descendants: true, isSignal: true }], hostDirectives: [{ directive: NoopValueAccessorDirective }], ngImport: i0, template: `
-    <div class="tiptap-editor">
-      <!-- Toolbar -->
-      @if (editable() && !mergedDisabled() && showToolbar() && editor()) {
-      <tiptap-toolbar 
-        [editor]="editor()!" 
-        [config]="toolbarConfig()"
-        [imageUpload]="imageUploadConfig()"
-        [floating]="floatingToolbar()"
-        (mouseenter)="hideBubbleMenus()"
-        (mouseleave)="showBubbleMenus()"
-      />
-      }
-
-      <!-- Editor Content -->
-      <div
-        #editorElement
-        class="tiptap-content"
-        [class.drag-over]="isDragOver()"
-        (dragover)="onDragOver($event)"
-        (drop)="onDrop($event)"
-        (click)="onEditorClick($event)"
-      ></div>
-
-      <!-- Text Bubble Menu -->
-      @if (editable() && showBubbleMenu() && editor()) {
-      <tiptap-bubble-menu
-        [editor]="editor()!"
-        [config]="bubbleMenuConfig()"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-bubble-menu>
-      }
-
-      <!-- Image Bubble Menu -->
-      @if (editable() && showImageBubbleMenu() && editor()) {
-      <tiptap-image-bubble-menu
-        [editor]="editor()!"
-        [config]="imageBubbleMenuConfig()"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-image-bubble-menu>
-      }
-
-      <!-- Link Bubble Menu -->
-      @if (editable() && editor()) {
-      <tiptap-link-bubble-menu
-        [editor]="editor()!"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-link-bubble-menu>
-      }
-
-      <!-- Color Bubble Menu -->
-      @if (editable() && editor()) {
-      <tiptap-color-bubble-menu
-        [editor]="editor()!"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-color-bubble-menu>
-      }
-
-      <!-- Slash Commands -->
-      @if (editable() && enableSlashCommands() && editor()) {
-      <tiptap-slash-commands
-        [editor]="editor()!"
-        [config]="slashCommandsConfigComputed()"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-slash-commands>
-      }
-
-      <!-- Table Menu -->
-      @if (editable() && editor()) {
-      <tiptap-table-bubble-menu
-        [editor]="editor()!"
-        [config]="tableBubbleMenuConfig()"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-table-bubble-menu>
-      }
-
-      <!-- Cell Menu -->
-      @if (editable() && editor()) {
-      <tiptap-cell-bubble-menu
-        [editor]="editor()!"
-        [config]="cellBubbleMenuConfig()"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-cell-bubble-menu>
-      }
-
-      <!-- Counters -->
-      @if (editable() && !mergedDisabled() && showFooter() && (showCharacterCount() || showWordCount())) {
-      <div class="character-count" [class.limit-reached]="maxCharacters() && characterCount() >= maxCharacters()!">
-        @if (showCharacterCount()) {
-          {{ characterCount() }}
-          {{ currentTranslations().editor.character }}{{ characterCount() > 1 ? "s" : "" }}
-          @if (maxCharacters()) {
-            / {{ maxCharacters() }}
-          }
-        }
-        
-        @if (showCharacterCount() && showWordCount()) {
-          , 
-        }
-
-        @if (showWordCount()) {
-          {{ wordCount() }}
-          {{ currentTranslations().editor.word }}{{ wordCount() > 1 ? "s" : "" }}
-        }
-      </div>
-      }
-    </div>
-  `, isInline: true, styles: [":host{--ate-primary: #2563eb;--ate-primary-contrast: #ffffff;--ate-primary-light: color-mix(in srgb, var(--ate-primary), transparent 90%);--ate-primary-lighter: color-mix(in srgb, var(--ate-primary), transparent 95%);--ate-primary-light-alpha: color-mix(in srgb, var(--ate-primary), transparent 85%);--ate-surface: #ffffff;--ate-surface-secondary: #f8f9fa;--ate-surface-tertiary: #f1f5f9;--ate-text: #2d3748;--ate-text-secondary: #64748b;--ate-text-muted: #a0aec0;--ate-border: #e2e8f0;--ate-highlight-bg: #fef08a;--ate-highlight-color: #854d0e;--ate-button-hover: #f1f5f9;--ate-button-active: #e2e8f0;--ate-error-color: #c53030;--ate-error-bg: #fed7d7;--ate-error-border: #feb2b2;--ate-border-color: var(--ate-border);--ate-border-width: 2px;--ate-border-radius: 12px;--ate-focus-color: var(--ate-primary);--ate-background: var(--ate-surface);--ate-sub-border-radius: 8px;--ate-text-color: var(--ate-text);--ate-placeholder-color: var(--ate-text-muted);--ate-line-height: 1.6;--ate-content-padding: 16px;--ate-menu-bg: var(--ate-surface-secondary);--ate-menu-border: var(--ate-border);--ate-menu-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--ate-menu-padding: 6px;--ate-toolbar-padding: var(--ate-menu-padding);--ate-toolbar-background: var(--ate-surface-secondary);--ate-toolbar-border-color: var(--ate-border);--ate-toolbar-button-color: var(--ate-text-secondary);--ate-toolbar-button-hover-background: transparent;--ate-toolbar-button-active-background: var(--ate-primary-light);--ate-toolbar-button-active-color: var(--ate-primary);--ate-counter-color: var(--ate-text-secondary);--ate-counter-background: var(--ate-surface-secondary);--ate-counter-border-color: var(--ate-border);--ate-drag-background: #f0f8ff;--ate-drag-border-color: var(--ate-primary);--ate-blockquote-border-color: var(--ate-border);--ate-blockquote-background: var(--ate-surface-secondary);--ate-code-background: var(--ate-surface-secondary);--ate-code-color: var(--ate-text-secondary);--ate-code-border-color: var(--ate-border);--ate-code-block-background: #0f172a;--ate-code-block-color: #e2e8f0;--ate-code-block-border-color: var(--ate-border);--ate-image-border-radius: var(--ate-sub-border-radius);--ate-image-selected-color: var(--ate-primary);--ate-scrollbar-width: 10px;--ate-scrollbar-thumb: var(--ate-border);--ate-scrollbar-thumb-hover: var(--ate-text-muted);--ate-scrollbar-track: transparent;--ate-table-border-color: var(--ate-border);--ate-table-header-background: var(--ate-surface-secondary);--ate-table-header-color: var(--ate-text);--ate-table-cell-background: var(--ate-surface);--ate-table-cell-selected-background: var(--ate-primary-light);--ate-table-resize-handle-color: var(--ate-primary);--ate-table-row-hover-background: var(--ate-primary-lighter)}:host(.dark),:host([data-theme=\"dark\"]){--ate-primary: #3b82f6;--ate-primary-contrast: #ffffff;--ate-primary-light: color-mix(in srgb, var(--ate-primary), transparent 85%);--ate-primary-lighter: color-mix(in srgb, var(--ate-primary), transparent 92%);--ate-primary-light-alpha: color-mix(in srgb, var(--ate-primary), transparent 80%);--ate-surface: #020617;--ate-surface-secondary: #0f172a;--ate-surface-tertiary: #1e293b;--ate-text: #f8fafc;--ate-text-secondary: #94a3b8;--ate-text-muted: #64748b;--ate-border: #1e293b;--ate-highlight-bg: #854d0e;--ate-highlight-color: #fef08a;--ate-button-hover: #1e293b;--ate-button-active: #0f172a;--ate-menu-border: rgba(255, 255, 255, .1);--ate-menu-shadow: 0 20px 25px -5px rgba(0, 0, 0, .3), 0 10px 10px -5px rgba(0, 0, 0, .2);--ate-error-color: #f87171;--ate-error-bg: #450a0a;--ate-error-border: #7f1d1d;--ate-drag-background: var(--ate-surface-tertiary);--ate-drag-border-color: var(--ate-primary);--ate-blockquote-border-color: var(--ate-primary);--ate-toolbar-button-active-background: var(--ate-primary-light);--ate-toolbar-button-active-color: var(--ate-primary);--ate-button-hover: var(--ate-surface-tertiary);--ate-button-active: var(--ate-surface-secondary);--ate-scrollbar-thumb: var(--ate-surface-tertiary);--ate-scrollbar-thumb-hover: var(--ate-text-muted)}:host(.fill-container){display:block;height:100%}.tiptap-editor{border:var(--ate-border-width) solid var(--ate-border-color);border-radius:var(--ate-border-radius);background:var(--ate-background);overflow:hidden;transition:border-color .2s ease;position:relative}:host(.floating-toolbar) .tiptap-editor{overflow:visible}:host(.fill-container) .tiptap-editor{display:flex;flex-direction:column;height:100%}:host(.fill-container) .tiptap-content{flex:1;min-height:0;overflow-y:auto}.tiptap-editor:focus-within{border-color:var(--ate-focus-color)}.tiptap-content{min-height:var(--editor-min-height, 200px);height:var(--editor-height, auto);max-height:var(--editor-max-height, none);overflow-y:var(--editor-overflow, visible);outline:none;position:relative;scrollbar-width:thin;scrollbar-color:var(--ate-scrollbar-thumb) var(--ate-scrollbar-track)}:host(.is-disabled) .tiptap-content{cursor:not-allowed;opacity:.7;-webkit-user-select:none;user-select:none;pointer-events:none;background-color:var(--ate-surface-tertiary)}:host(.is-readonly) .tiptap-content{cursor:default;-webkit-user-select:text;user-select:text}:host(.is-readonly) .tiptap-content ::ng-deep .tiptap-link{cursor:pointer;pointer-events:auto}.tiptap-content::-webkit-scrollbar{width:var(--ate-scrollbar-width);height:var(--ate-scrollbar-width)}.tiptap-content::-webkit-scrollbar-track{background:var(--ate-scrollbar-track)}.tiptap-content::-webkit-scrollbar-thumb{background:var(--ate-scrollbar-thumb);border:3px solid transparent;background-clip:content-box;border-radius:10px}.tiptap-content::-webkit-scrollbar-thumb:hover{background:var(--ate-scrollbar-thumb-hover);background-clip:content-box}.tiptap-content.drag-over{background:var(--ate-drag-background);border:2px dashed var(--ate-drag-border-color)}.character-count{padding:8px var(--ate-content-padding);font-size:12px;color:var(--ate-counter-color);text-align:right;border-top:1px solid var(--ate-counter-border-color);background:var(--ate-counter-background);transition:color .2s ease;border-bottom-left-radius:calc(var(--ate-border-radius) - var(--ate-border-width));border-bottom-right-radius:calc(var(--ate-border-radius) - var(--ate-border-width))}.character-count.limit-reached{color:var(--ate-error-color, #ef4444);font-weight:600}:host ::ng-deep .ProseMirror{padding:var(--ate-content-padding);outline:none;line-height:var(--ate-line-height);color:var(--ate-text-color);min-height:100%;height:100%;word-wrap:break-word;overflow-wrap:break-word}:host ::ng-deep .ProseMirror h1{font-size:2em;font-weight:700;margin-top:0;margin-bottom:.5em}:host ::ng-deep .ProseMirror h2{font-size:1.5em;font-weight:700;margin-top:1em;margin-bottom:.5em}:host ::ng-deep .ProseMirror h3{font-size:1.25em;font-weight:700;margin-top:1em;margin-bottom:.5em}:host ::ng-deep .ProseMirror p{margin:.5em 0}:host ::ng-deep .ProseMirror ul,:host ::ng-deep .ProseMirror ol{padding-left:2em;margin:.5em 0}:host ::ng-deep .ProseMirror blockquote{border-left:4px solid var(--ate-blockquote-border-color);margin:1em 0;background:var(--ate-blockquote-background);padding:.5em 1em;border-radius:0 4px 4px 0}:host ::ng-deep .ProseMirror code{background:var(--ate-code-background);color:var(--ate-code-color);border:1px solid var(--ate-code-border-color);padding:.15em .4em;border-radius:4px;font-family:JetBrains Mono,Fira Code,Monaco,Consolas,monospace;font-size:.85em;font-weight:500}:host ::ng-deep .ProseMirror pre{background:var(--ate-code-block-background);color:var(--ate-code-block-color);border:1px solid var(--ate-code-block-border-color);padding:1em;border-radius:var(--ate-border-radius);overflow-x:auto;margin:1em 0}:host ::ng-deep .ProseMirror pre code{background:none;color:inherit;border:none;padding:0}:host ::ng-deep .ProseMirror p.is-editor-empty:first-child:before{content:attr(data-placeholder);color:var(--ate-placeholder-color);pointer-events:none;float:left;height:0}:host ::ng-deep .ProseMirror[contenteditable=false]{pointer-events:none}:host ::ng-deep .ProseMirror[contenteditable=false] img{cursor:default;pointer-events:none}:host ::ng-deep .ProseMirror[contenteditable=false] img:hover{transform:none;box-shadow:0 2px 8px #0000001a}:host ::ng-deep .ProseMirror[contenteditable=false] img.ProseMirror-selectednode{outline:none}:host ::ng-deep .ProseMirror img{position:relative;display:inline-block;max-width:100%;height:auto;cursor:pointer;transition:all .2s ease;border:2px solid transparent;border-radius:var(--ate-image-border-radius)}:host ::ng-deep .ProseMirror img:hover{border-color:var(--ate-border-color);box-shadow:0 2px 4px #0000001a}:host ::ng-deep .ProseMirror img.ProseMirror-selectednode{border-color:var(--ate-image-selected-color);box-shadow:0 0 0 3px var(--ate-primary-light-alpha);transition:all .2s ease}:host ::ng-deep .ProseMirror .tiptap-image{max-width:100%;height:auto;border-radius:16px;box-shadow:0 4px 20px #00000014;margin:.5em 0;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:block;filter:brightness(1) contrast(1)}:host ::ng-deep .ProseMirror .tiptap-image:hover{box-shadow:0 8px 30px #0000001f;filter:brightness(1.02) contrast(1.02)}:host ::ng-deep .ProseMirror .tiptap-image.ProseMirror-selectednode{outline:2px solid var(--ate-primary);outline-offset:2px;border-radius:16px;box-shadow:0 0 0 4px var(--ate-primary-light-alpha)}:host ::ng-deep .image-container{margin:.5em 0;text-align:center;border-radius:16px;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}:host ::ng-deep .image-container.image-align-left{text-align:left}:host ::ng-deep .image-container.image-align-center{text-align:center}:host ::ng-deep .image-container.image-align-right{text-align:right}:host ::ng-deep .image-container img{display:inline-block;max-width:100%;height:auto;border-radius:16px}:host ::ng-deep .resizable-image-container{position:relative;display:inline-block;margin:.5em 0}:host ::ng-deep .resize-controls{position:absolute;inset:0;pointer-events:none;z-index:1000}:host ::ng-deep .resize-handle{position:absolute;width:12px;height:12px;background:var(--ate-primary);border:2px solid var(--ate-surface);border-radius:50%;pointer-events:all;cursor:pointer;z-index:1001;transition:all .15s ease;box-shadow:0 2px 6px #0003}:host ::ng-deep .resize-handle:hover{background:var(--ate-primary);box-shadow:0 3px 8px #0000004d}:host ::ng-deep .resize-handle:active{background:var(--ate-primary)}:host ::ng-deep .resize-handle-n:hover,:host ::ng-deep .resize-handle-s:hover{transform:translate(-50%) scale(1.2)}:host ::ng-deep .resize-handle-w:hover,:host ::ng-deep .resize-handle-e:hover{transform:translateY(-50%) scale(1.2)}:host ::ng-deep .resize-handle-n:active,:host ::ng-deep .resize-handle-s:active{transform:translate(-50%) scale(.9)}:host ::ng-deep .resize-handle-w:active,:host ::ng-deep .resize-handle-e:active{transform:translateY(-50%) scale(.9)}:host ::ng-deep .resize-handle-nw:hover,:host ::ng-deep .resize-handle-ne:hover,:host ::ng-deep .resize-handle-sw:hover,:host ::ng-deep .resize-handle-se:hover{transform:scale(1.2)}:host ::ng-deep .resize-handle-nw:active,:host ::ng-deep .resize-handle-ne:active,:host ::ng-deep .resize-handle-sw:active,:host ::ng-deep .resize-handle-se:active{transform:scale(.9)}:host ::ng-deep .resize-handle-nw{top:0;left:-6px;cursor:nw-resize}:host ::ng-deep .resize-handle-n{top:0;left:50%;transform:translate(-50%);cursor:n-resize}:host ::ng-deep .resize-handle-ne{top:0;right:-6px;cursor:ne-resize}:host ::ng-deep .resize-handle-w{top:50%;left:-6px;transform:translateY(-50%);cursor:w-resize}:host ::ng-deep .resize-handle-e{top:50%;right:-6px;transform:translateY(-50%);cursor:e-resize}:host ::ng-deep .resize-handle-sw{bottom:0;left:-6px;cursor:sw-resize}:host ::ng-deep .resize-handle-s{bottom:0;left:50%;transform:translate(-50%);cursor:s-resize}:host ::ng-deep .resize-handle-se{bottom:0;right:-6px;cursor:se-resize}:host ::ng-deep body.resizing{-webkit-user-select:none;user-select:none;cursor:crosshair}:host ::ng-deep body.resizing .ProseMirror{pointer-events:none}:host ::ng-deep body.resizing .ProseMirror .tiptap-image{pointer-events:none}:host ::ng-deep .image-size-info{position:absolute;bottom:-20px;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:2px 6px;border-radius:3px;font-size:11px;white-space:nowrap;opacity:0;transition:opacity .2s ease}:host ::ng-deep .image-container:hover .image-size-info{opacity:1}:host ::ng-deep .ProseMirror table{border-collapse:separate;border-spacing:0;margin:0;table-layout:fixed;width:100%;border-radius:8px;overflow:hidden}:host ::ng-deep .ProseMirror table td,:host ::ng-deep .ProseMirror table th{border:none;border-right:1px solid var(--ate-table-border-color);border-bottom:1px solid var(--ate-table-border-color);box-sizing:border-box;min-width:1em;padding:8px 12px;position:relative;vertical-align:top;text-align:left}:host ::ng-deep .ProseMirror table td{background:var(--ate-table-cell-background)}:host ::ng-deep .ProseMirror table td:first-child,:host ::ng-deep .ProseMirror table th:first-child{border-left:1px solid var(--ate-table-border-color)}:host ::ng-deep .ProseMirror table tr:first-child td,:host ::ng-deep .ProseMirror table tr:first-child th{border-top:1px solid var(--ate-table-border-color)}:host ::ng-deep .ProseMirror table tr:first-child th:first-child{border-top-left-radius:8px}:host ::ng-deep .ProseMirror table tr:first-child th:last-child{border-top-right-radius:8px}:host ::ng-deep .ProseMirror table tr:last-child td:first-child{border-bottom-left-radius:8px}:host ::ng-deep .ProseMirror table tr:last-child td:last-child{border-bottom-right-radius:8px}:host ::ng-deep .ProseMirror table th{background:var(--ate-table-header-background);font-weight:600;color:var(--ate-table-header-color)}:host ::ng-deep .ProseMirror table .selectedCell:after{background:var(--ate-table-cell-selected-background);content:\"\";inset:0;pointer-events:none;position:absolute;z-index:2}:host ::ng-deep .ProseMirror table .column-resize-handle{position:absolute;right:-2px;top:0;bottom:0;width:4px;background-color:var(--ate-table-resize-handle-color);opacity:0;transition:opacity .2s ease}:host ::ng-deep .ProseMirror table:hover .column-resize-handle{opacity:1}:host ::ng-deep .ProseMirror table .column-resize-handle:hover{background-color:var(--ate-focus-color)}:host ::ng-deep .ProseMirror .tableWrapper{overflow-x:auto;margin:1em 0;border-radius:8px}:host ::ng-deep .ProseMirror .tableWrapper table{margin:0;border-radius:8px;min-width:600px;overflow:hidden}:host ::ng-deep .ProseMirror table p{margin:0}:host ::ng-deep .ProseMirror table tbody tr:hover td{background-color:var(--ate-table-row-hover-background)}\n"], dependencies: [{ kind: "component", type: TiptapToolbarComponent, selector: "tiptap-toolbar", inputs: ["editor", "config", "imageUpload", "floating"] }, { kind: "component", type: TiptapBubbleMenuComponent, selector: "tiptap-bubble-menu", inputs: ["config"] }, { kind: "component", type: TiptapImageBubbleMenuComponent, selector: "tiptap-image-bubble-menu", inputs: ["config"] }, { kind: "component", type: TiptapTableBubbleMenuComponent, selector: "tiptap-table-bubble-menu", inputs: ["config"] }, { kind: "component", type: TiptapCellBubbleMenuComponent, selector: "tiptap-cell-bubble-menu", inputs: ["config"] }, { kind: "component", type: TiptapSlashCommandsComponent, selector: "tiptap-slash-commands", inputs: ["editor", "config"] }, { kind: "component", type: TiptapLinkBubbleMenuComponent, selector: "tiptap-link-bubble-menu", inputs: ["editor"] }, { kind: "component", type: TiptapColorBubbleMenuComponent, selector: "tiptap-color-bubble-menu", inputs: ["editor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "editorElement", first: true, predicate: ["editorElement"], descendants: true, isSignal: true }], hostDirectives: [{ directive: NoopValueAccessorDirective }], ngImport: i0, template: `
+    <div class="tiptap-editor">
+      <!-- Toolbar -->
+      @if (editable() && !mergedDisabled() && showToolbar() && editor()) {
+      <tiptap-toolbar 
+        [editor]="editor()!" 
+        [config]="toolbarConfig()"
+        [imageUpload]="imageUploadConfig()"
+        [floating]="floatingToolbar()"
+        (mouseenter)="hideBubbleMenus()"
+        (mouseleave)="showBubbleMenus()"
+      />
+      }
+
+      @if (showEditToggle() && !mergedDisabled()) {
+      <tiptap-edit-toggle 
+        [editable]="editable()" 
+        [translations]="currentTranslations()"
+        (toggle)="toggleEditMode($event)"
+      />
+      }
+
+      <!-- Editor Content -->
+      <div
+        #editorElement
+        class="tiptap-content"
+        [class.drag-over]="isDragOver()"
+        (dragover)="onDragOver($event)"
+        (drop)="onDrop($event)"
+        (click)="onEditorClick($event)"
+      ></div>
+
+      <!-- Text Bubble Menu -->
+      @if (editable() && showBubbleMenu() && editor()) {
+      <tiptap-bubble-menu
+        [editor]="editor()!"
+        [config]="bubbleMenuConfig()"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-bubble-menu>
+      }
+
+      <!-- Image Bubble Menu -->
+      @if (editable() && showImageBubbleMenu() && editor()) {
+      <tiptap-image-bubble-menu
+        [editor]="editor()!"
+        [config]="imageBubbleMenuConfig()"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-image-bubble-menu>
+      }
+
+      <!-- Link Bubble Menu -->
+      @if (editable() && editor()) {
+      <tiptap-link-bubble-menu
+        [editor]="editor()!"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-link-bubble-menu>
+      }
+
+      <!-- Color Bubble Menu -->
+      @if (editable() && editor()) {
+      <tiptap-color-bubble-menu
+        [editor]="editor()!"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-color-bubble-menu>
+      }
+
+      <!-- Slash Commands -->
+      @if (editable() && enableSlashCommands() && editor()) {
+      <tiptap-slash-commands
+        [editor]="editor()!"
+        [config]="slashCommandsConfigComputed()"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-slash-commands>
+      }
+
+      <!-- Table Menu -->
+      @if (editable() && editor()) {
+      <tiptap-table-bubble-menu
+        [editor]="editor()!"
+        [config]="tableBubbleMenuConfig()"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-table-bubble-menu>
+      }
+
+      <!-- Cell Menu -->
+      @if (editable() && editor()) {
+      <tiptap-cell-bubble-menu
+        [editor]="editor()!"
+        [config]="cellBubbleMenuConfig()"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-cell-bubble-menu>
+      }
+
+      <!-- Counters -->
+      @if (editable() && !mergedDisabled() && showFooter() && (showCharacterCount() || showWordCount())) {
+      <div class="character-count" [class.limit-reached]="maxCharacters() && characterCount() >= maxCharacters()!">
+        @if (showCharacterCount()) {
+          {{ characterCount() }}
+          {{ currentTranslations().editor.character }}{{ characterCount() > 1 ? "s" : "" }}
+          @if (maxCharacters()) {
+            / {{ maxCharacters() }}
+          }
+        }
+        
+        @if (showCharacterCount() && showWordCount()) {
+          , 
+        }
+
+        @if (showWordCount()) {
+          {{ wordCount() }}
+          {{ currentTranslations().editor.word }}{{ wordCount() > 1 ? "s" : "" }}
+        }
+      </div>
+      }
+    </div>
+  `, isInline: true, styles: [":host{--ate-primary: #2563eb;--ate-primary-contrast: #ffffff;--ate-primary-light: color-mix(in srgb, var(--ate-primary), transparent 90%);--ate-primary-lighter: color-mix(in srgb, var(--ate-primary), transparent 95%);--ate-primary-light-alpha: color-mix(in srgb, var(--ate-primary), transparent 85%);--ate-surface: #ffffff;--ate-surface-secondary: #f8f9fa;--ate-surface-tertiary: #f1f5f9;--ate-text: #2d3748;--ate-text-secondary: #64748b;--ate-text-muted: #a0aec0;--ate-border: #e2e8f0;--ate-highlight-bg: #fef08a;--ate-highlight-color: #854d0e;--ate-button-hover: #f1f5f9;--ate-button-active: #e2e8f0;--ate-error-color: #c53030;--ate-error-bg: #fed7d7;--ate-error-border: #feb2b2;--ate-border-color: var(--ate-border);--ate-border-width: 2px;--ate-border-radius: 12px;--ate-focus-color: var(--ate-primary);--ate-background: var(--ate-surface);--ate-sub-border-radius: 8px;--ate-text-color: var(--ate-text);--ate-placeholder-color: var(--ate-text-muted);--ate-line-height: 1.6;--ate-content-padding: 16px;--ate-menu-bg: var(--ate-surface);--ate-menu-border-radius: var(--ate-border-radius);--ate-menu-border: var(--ate-border);--ate-menu-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--ate-menu-padding: 6px;--ate-toolbar-padding: var(--ate-menu-padding);--ate-toolbar-background: var(--ate-surface-secondary);--ate-toolbar-border-color: var(--ate-border);--ate-toolbar-button-color: var(--ate-text-secondary);--ate-toolbar-button-hover-background: transparent;--ate-toolbar-button-active-background: var(--ate-primary-light);--ate-toolbar-button-active-color: var(--ate-primary);--ate-counter-color: var(--ate-text-secondary);--ate-counter-background: var(--ate-surface-secondary);--ate-counter-border-color: var(--ate-border);--ate-drag-background: #f0f8ff;--ate-drag-border-color: var(--ate-primary);--ate-blockquote-border-color: var(--ate-border);--ate-blockquote-background: var(--ate-surface-secondary);--ate-code-background: var(--ate-surface-secondary);--ate-code-color: var(--ate-text-secondary);--ate-code-border-color: var(--ate-border);--ate-code-block-background: #0f172a;--ate-code-block-color: #e2e8f0;--ate-code-block-border-color: var(--ate-border);--ate-image-border-radius: 16px;--ate-image-selected-color: var(--ate-primary);--ate-scrollbar-width: 10px;--ate-scrollbar-thumb: var(--ate-border);--ate-scrollbar-thumb-hover: var(--ate-text-muted);--ate-scrollbar-track: transparent;--ate-table-border-color: var(--ate-border);--ate-table-header-background: var(--ate-surface-secondary);--ate-table-header-color: var(--ate-text);--ate-table-cell-background: var(--ate-surface);--ate-table-cell-selected-background: var(--ate-primary-light);--ate-table-resize-handle-color: var(--ate-primary);--ate-table-row-hover-background: var(--ate-primary-lighter)}:host(.dark),:host([data-theme=\"dark\"]){--ate-primary: #3b82f6;--ate-primary-contrast: #ffffff;--ate-primary-light: color-mix(in srgb, var(--ate-primary), transparent 85%);--ate-primary-lighter: color-mix(in srgb, var(--ate-primary), transparent 92%);--ate-primary-light-alpha: color-mix(in srgb, var(--ate-primary), transparent 80%);--ate-surface: #020617;--ate-surface-secondary: #0f172a;--ate-surface-tertiary: #1e293b;--ate-text: #f8fafc;--ate-text-secondary: #94a3b8;--ate-text-muted: #64748b;--ate-border: #1e293b;--ate-highlight-bg: #854d0e;--ate-highlight-color: #fef08a;--ate-button-hover: #1e293b;--ate-button-active: #0f172a;--ate-menu-border: rgba(255, 255, 255, .1);--ate-menu-shadow: 0 20px 25px -5px rgba(0, 0, 0, .3), 0 10px 10px -5px rgba(0, 0, 0, .2);--ate-error-color: #f87171;--ate-error-bg: #450a0a;--ate-error-border: #7f1d1d;--ate-drag-background: var(--ate-surface-tertiary);--ate-drag-border-color: var(--ate-primary);--ate-blockquote-border-color: var(--ate-primary);--ate-toolbar-button-active-background: var(--ate-primary-light);--ate-toolbar-button-active-color: var(--ate-primary);--ate-button-hover: var(--ate-surface-tertiary);--ate-button-active: var(--ate-surface-secondary);--ate-scrollbar-thumb: var(--ate-surface-tertiary);--ate-scrollbar-thumb-hover: var(--ate-text-muted)}:host(.fill-container){display:block;height:100%}.tiptap-editor{border:var(--ate-border-width) solid var(--ate-border-color);border-radius:var(--ate-border-radius);background:var(--ate-background);overflow:hidden;transition:border-color .2s ease;position:relative}:host(.floating-toolbar) .tiptap-editor{overflow:visible}:host(.fill-container) .tiptap-editor{display:flex;flex-direction:column;height:100%}:host(.fill-container) .tiptap-content-wrapper{flex:1;min-height:0}:host(.fill-container) .tiptap-content{flex:1;min-height:0;overflow-y:auto}.tiptap-editor:focus-within{border-color:var(--ate-focus-color)}.tiptap-content{min-height:var(--editor-min-height, 200px);height:var(--editor-height, auto);max-height:var(--editor-max-height, none);overflow-y:var(--editor-overflow, visible);outline:none;position:relative;scrollbar-width:thin;scrollbar-color:var(--ate-scrollbar-thumb) var(--ate-scrollbar-track)}:host(.is-disabled) .tiptap-content{cursor:not-allowed;opacity:.7;-webkit-user-select:none;user-select:none;pointer-events:none;background-color:var(--ate-surface-tertiary)}:host(.is-readonly) .tiptap-content{cursor:default;-webkit-user-select:text;user-select:text}:host(.is-readonly) .tiptap-content ::ng-deep .tiptap-link{cursor:pointer;pointer-events:auto}.tiptap-content::-webkit-scrollbar{width:var(--ate-scrollbar-width)}.tiptap-content-wrapper{position:relative;display:flex;flex-direction:column;min-height:0}.tiptap-content-wrapper .tiptap-content{flex:1}.tiptap-content::-webkit-scrollbar-track{background:var(--ate-scrollbar-track)}.tiptap-content::-webkit-scrollbar-thumb{background:var(--ate-scrollbar-thumb);border:3px solid transparent;background-clip:content-box;border-radius:10px}.tiptap-content::-webkit-scrollbar-thumb:hover{background:var(--ate-scrollbar-thumb-hover);background-clip:content-box}.tiptap-content.drag-over{background:var(--ate-drag-background);border:2px dashed var(--ate-drag-border-color)}.character-count{padding:8px var(--ate-content-padding);font-size:12px;color:var(--ate-counter-color);text-align:right;border-top:1px solid var(--ate-counter-border-color);background:var(--ate-counter-background);transition:color .2s ease;border-bottom-left-radius:calc(var(--ate-border-radius) - var(--ate-border-width));border-bottom-right-radius:calc(var(--ate-border-radius) - var(--ate-border-width))}.character-count.limit-reached{color:var(--ate-error-color, #ef4444);font-weight:600}:host ::ng-deep .ProseMirror{padding:var(--ate-content-padding);outline:none;line-height:var(--ate-line-height);color:var(--ate-text-color);min-height:100%;height:100%;word-wrap:break-word;overflow-wrap:break-word}:host ::ng-deep .ProseMirror h1{font-size:2em;font-weight:700;margin-top:0;margin-bottom:.5em}:host ::ng-deep .ProseMirror h2{font-size:1.5em;font-weight:700;margin-top:1em;margin-bottom:.5em}:host ::ng-deep .ProseMirror h3{font-size:1.25em;font-weight:700;margin-top:1em;margin-bottom:.5em}:host ::ng-deep .ProseMirror p{margin:.5em 0}:host ::ng-deep .ProseMirror ul,:host ::ng-deep .ProseMirror ol{padding-left:2em;margin:.5em 0}:host ::ng-deep .ProseMirror blockquote{border-left:4px solid var(--ate-blockquote-border-color);margin:1em 0;background:var(--ate-blockquote-background);padding:.5em 1em;border-radius:0 4px 4px 0}:host ::ng-deep .ProseMirror code{background:var(--ate-code-background);color:var(--ate-code-color);border:1px solid var(--ate-code-border-color);padding:.15em .4em;border-radius:4px;font-family:JetBrains Mono,Fira Code,Monaco,Consolas,monospace;font-size:.85em;font-weight:500}:host ::ng-deep .ProseMirror pre{background:var(--ate-code-block-background);color:var(--ate-code-block-color);border:1px solid var(--ate-code-block-border-color);padding:1em;border-radius:var(--ate-border-radius);overflow-x:auto;margin:1em 0}:host ::ng-deep .ProseMirror pre code{background:none;color:inherit;border:none;padding:0}:host ::ng-deep .ProseMirror p.is-editor-empty:first-child:before{content:attr(data-placeholder);color:var(--ate-placeholder-color);pointer-events:none;float:left;height:0}:host ::ng-deep .ProseMirror[contenteditable=false]{pointer-events:none}:host ::ng-deep .ProseMirror[contenteditable=false] img{cursor:default;pointer-events:none}:host ::ng-deep .ProseMirror[contenteditable=false] img:hover{transform:none;box-shadow:0 2px 8px #0000001a}:host ::ng-deep .ProseMirror[contenteditable=false] img.ProseMirror-selectednode{outline:none}:host ::ng-deep .ProseMirror img{position:relative;display:inline-block;max-width:100%;height:auto;cursor:pointer;transition:all .2s ease;border:2px solid transparent;border-radius:var(--ate-image-border-radius)}:host ::ng-deep .ProseMirror img:hover{border-color:var(--ate-border-color);box-shadow:0 2px 4px #0000001a}:host ::ng-deep .ProseMirror img.ProseMirror-selectednode{border-color:var(--ate-image-selected-color);box-shadow:0 0 0 3px var(--ate-primary-light-alpha);transition:all .2s ease}:host ::ng-deep .ProseMirror .tiptap-image{max-width:100%;height:auto;border-radius:var(--ate-image-border-radius);box-shadow:0 4px 20px #00000014;margin:.5em 0;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:block;filter:brightness(1) contrast(1)}:host ::ng-deep .ProseMirror .tiptap-image:hover{box-shadow:0 8px 30px #0000001f;filter:brightness(1.02) contrast(1.02)}:host ::ng-deep .ProseMirror .tiptap-image.ProseMirror-selectednode{outline:2px solid var(--ate-primary);outline-offset:2px;border-radius:var(--ate-image-border-radius);box-shadow:0 0 0 4px var(--ate-primary-light-alpha)}:host ::ng-deep .image-container{margin:.5em 0;text-align:center;border-radius:16px;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}:host ::ng-deep .image-container.image-align-left{text-align:left}:host ::ng-deep .image-container.image-align-center{text-align:center}:host ::ng-deep .image-container.image-align-right{text-align:right}:host ::ng-deep .image-container img{display:inline-block;max-width:100%;height:auto;border-radius:16px}:host ::ng-deep .resizable-image-container{position:relative;display:inline-block;margin:.5em 0}:host ::ng-deep .resize-controls{position:absolute;inset:0;pointer-events:none;z-index:1000}:host ::ng-deep .resize-handle{position:absolute;width:12px;height:12px;background:var(--ate-primary);border:2px solid var(--ate-surface);border-radius:50%;pointer-events:all;cursor:pointer;z-index:1001;transition:all .15s ease;box-shadow:0 2px 6px #0003}:host ::ng-deep .resize-handle:hover{background:var(--ate-primary);box-shadow:0 3px 8px #0000004d}:host ::ng-deep .resize-handle:active{background:var(--ate-primary)}:host ::ng-deep .resize-handle-n:hover,:host ::ng-deep .resize-handle-s:hover{transform:translate(-50%) scale(1.2)}:host ::ng-deep .resize-handle-w:hover,:host ::ng-deep .resize-handle-e:hover{transform:translateY(-50%) scale(1.2)}:host ::ng-deep .resize-handle-n:active,:host ::ng-deep .resize-handle-s:active{transform:translate(-50%) scale(.9)}:host ::ng-deep .resize-handle-w:active,:host ::ng-deep .resize-handle-e:active{transform:translateY(-50%) scale(.9)}:host ::ng-deep .resize-handle-nw:hover,:host ::ng-deep .resize-handle-ne:hover,:host ::ng-deep .resize-handle-sw:hover,:host ::ng-deep .resize-handle-se:hover{transform:scale(1.2)}:host ::ng-deep .resize-handle-nw:active,:host ::ng-deep .resize-handle-ne:active,:host ::ng-deep .resize-handle-sw:active,:host ::ng-deep .resize-handle-se:active{transform:scale(.9)}:host ::ng-deep .resize-handle-nw{top:0;left:-6px;cursor:nw-resize}:host ::ng-deep .resize-handle-n{top:0;left:50%;transform:translate(-50%);cursor:n-resize}:host ::ng-deep .resize-handle-ne{top:0;right:-6px;cursor:ne-resize}:host ::ng-deep .resize-handle-w{top:50%;left:-6px;transform:translateY(-50%);cursor:w-resize}:host ::ng-deep .resize-handle-e{top:50%;right:-6px;transform:translateY(-50%);cursor:e-resize}:host ::ng-deep .resize-handle-sw{bottom:0;left:-6px;cursor:sw-resize}:host ::ng-deep .resize-handle-s{bottom:0;left:50%;transform:translate(-50%);cursor:s-resize}:host ::ng-deep .resize-handle-se{bottom:0;right:-6px;cursor:se-resize}:host ::ng-deep body.resizing{-webkit-user-select:none;user-select:none;cursor:crosshair}:host ::ng-deep body.resizing .ProseMirror{pointer-events:none}:host ::ng-deep body.resizing .ProseMirror .tiptap-image{pointer-events:none}:host ::ng-deep .image-size-info{position:absolute;bottom:-20px;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:2px 6px;border-radius:3px;font-size:11px;white-space:nowrap;opacity:0;transition:opacity .2s ease}:host ::ng-deep .image-container:hover .image-size-info{opacity:1}:host ::ng-deep .ProseMirror table{border-collapse:separate;border-spacing:0;margin:0;table-layout:fixed;width:100%;border-radius:8px;overflow:hidden}:host ::ng-deep .ProseMirror table td,:host ::ng-deep .ProseMirror table th{border:none;border-right:1px solid var(--ate-table-border-color);border-bottom:1px solid var(--ate-table-border-color);box-sizing:border-box;min-width:1em;padding:8px 12px;position:relative;vertical-align:top;text-align:left}:host ::ng-deep .ProseMirror table td{background:var(--ate-table-cell-background)}:host ::ng-deep .ProseMirror table td:first-child,:host ::ng-deep .ProseMirror table th:first-child{border-left:1px solid var(--ate-table-border-color)}:host ::ng-deep .ProseMirror table tr:first-child td,:host ::ng-deep .ProseMirror table tr:first-child th{border-top:1px solid var(--ate-table-border-color)}:host ::ng-deep .ProseMirror table tr:first-child th:first-child{border-top-left-radius:8px}:host ::ng-deep .ProseMirror table tr:first-child th:last-child{border-top-right-radius:8px}:host ::ng-deep .ProseMirror table tr:last-child td:first-child{border-bottom-left-radius:8px}:host ::ng-deep .ProseMirror table tr:last-child td:last-child{border-bottom-right-radius:8px}:host ::ng-deep .ProseMirror table th{background:var(--ate-table-header-background);font-weight:600;color:var(--ate-table-header-color)}:host ::ng-deep .ProseMirror table .selectedCell:after{background:var(--ate-table-cell-selected-background);content:\"\";inset:0;pointer-events:none;position:absolute;z-index:2}:host ::ng-deep .ProseMirror table .column-resize-handle{position:absolute;right:-2px;top:0;bottom:0;width:4px;background-color:var(--ate-table-resize-handle-color);opacity:0;transition:opacity .2s ease}:host ::ng-deep .ProseMirror table:hover .column-resize-handle{opacity:1}:host ::ng-deep .ProseMirror table .column-resize-handle:hover{background-color:var(--ate-focus-color)}:host ::ng-deep .ProseMirror .tableWrapper{overflow-x:auto;margin:1em 0;border-radius:8px}:host ::ng-deep .ProseMirror .tableWrapper table{margin:0;border-radius:8px;min-width:600px;overflow:hidden}:host ::ng-deep .ProseMirror table p{margin:0}:host ::ng-deep .ProseMirror table tbody tr:hover td{background-color:var(--ate-table-row-hover-background)}\n"], dependencies: [{ kind: "component", type: TiptapToolbarComponent, selector: "tiptap-toolbar", inputs: ["editor", "config", "imageUpload", "floating"] }, { kind: "component", type: TiptapBubbleMenuComponent, selector: "tiptap-bubble-menu", inputs: ["config"] }, { kind: "component", type: TiptapImageBubbleMenuComponent, selector: "tiptap-image-bubble-menu", inputs: ["config"] }, { kind: "component", type: TiptapTableBubbleMenuComponent, selector: "tiptap-table-bubble-menu", inputs: ["config"] }, { kind: "component", type: TiptapCellBubbleMenuComponent, selector: "tiptap-cell-bubble-menu", inputs: ["config"] }, { kind: "component", type: TiptapSlashCommandsComponent, selector: "tiptap-slash-commands", inputs: ["editor", "config"] }, { kind: "component", type: TiptapLinkBubbleMenuComponent, selector: "tiptap-link-bubble-menu", inputs: ["editor"] }, { kind: "component", type: TiptapColorBubbleMenuComponent, selector: "tiptap-color-bubble-menu", inputs: ["editor"] }, { kind: "component", type: TiptapEditToggleComponent, selector: "tiptap-edit-toggle", inputs: ["editable", "translations"], outputs: ["toggle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImport: i0, type: AngularTiptapEditorComponent, decorators: [{
             type: Component,
@@ -6213,119 +6272,128 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.0", ngImpor
                         TiptapSlashCommandsComponent,
                         TiptapLinkBubbleMenuComponent,
                         TiptapColorBubbleMenuComponent,
+                        TiptapEditToggleComponent,
                     ], providers: [
                         EditorCommandsService,
                         ImageService,
                         ColorPickerService,
                         LinkService,
-                    ], template: `
-    <div class="tiptap-editor">
-      <!-- Toolbar -->
-      @if (editable() && !mergedDisabled() && showToolbar() && editor()) {
-      <tiptap-toolbar 
-        [editor]="editor()!" 
-        [config]="toolbarConfig()"
-        [imageUpload]="imageUploadConfig()"
-        [floating]="floatingToolbar()"
-        (mouseenter)="hideBubbleMenus()"
-        (mouseleave)="showBubbleMenus()"
-      />
-      }
-
-      <!-- Editor Content -->
-      <div
-        #editorElement
-        class="tiptap-content"
-        [class.drag-over]="isDragOver()"
-        (dragover)="onDragOver($event)"
-        (drop)="onDrop($event)"
-        (click)="onEditorClick($event)"
-      ></div>
-
-      <!-- Text Bubble Menu -->
-      @if (editable() && showBubbleMenu() && editor()) {
-      <tiptap-bubble-menu
-        [editor]="editor()!"
-        [config]="bubbleMenuConfig()"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-bubble-menu>
-      }
-
-      <!-- Image Bubble Menu -->
-      @if (editable() && showImageBubbleMenu() && editor()) {
-      <tiptap-image-bubble-menu
-        [editor]="editor()!"
-        [config]="imageBubbleMenuConfig()"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-image-bubble-menu>
-      }
-
-      <!-- Link Bubble Menu -->
-      @if (editable() && editor()) {
-      <tiptap-link-bubble-menu
-        [editor]="editor()!"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-link-bubble-menu>
-      }
-
-      <!-- Color Bubble Menu -->
-      @if (editable() && editor()) {
-      <tiptap-color-bubble-menu
-        [editor]="editor()!"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-color-bubble-menu>
-      }
-
-      <!-- Slash Commands -->
-      @if (editable() && enableSlashCommands() && editor()) {
-      <tiptap-slash-commands
-        [editor]="editor()!"
-        [config]="slashCommandsConfigComputed()"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-slash-commands>
-      }
-
-      <!-- Table Menu -->
-      @if (editable() && editor()) {
-      <tiptap-table-bubble-menu
-        [editor]="editor()!"
-        [config]="tableBubbleMenuConfig()"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-table-bubble-menu>
-      }
-
-      <!-- Cell Menu -->
-      @if (editable() && editor()) {
-      <tiptap-cell-bubble-menu
-        [editor]="editor()!"
-        [config]="cellBubbleMenuConfig()"
-        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
-      ></tiptap-cell-bubble-menu>
-      }
-
-      <!-- Counters -->
-      @if (editable() && !mergedDisabled() && showFooter() && (showCharacterCount() || showWordCount())) {
-      <div class="character-count" [class.limit-reached]="maxCharacters() && characterCount() >= maxCharacters()!">
-        @if (showCharacterCount()) {
-          {{ characterCount() }}
-          {{ currentTranslations().editor.character }}{{ characterCount() > 1 ? "s" : "" }}
-          @if (maxCharacters()) {
-            / {{ maxCharacters() }}
-          }
-        }
-        
-        @if (showCharacterCount() && showWordCount()) {
-          , 
-        }
-
-        @if (showWordCount()) {
-          {{ wordCount() }}
-          {{ currentTranslations().editor.word }}{{ wordCount() > 1 ? "s" : "" }}
-        }
-      </div>
-      }
-    </div>
-  `, styles: [":host{--ate-primary: #2563eb;--ate-primary-contrast: #ffffff;--ate-primary-light: color-mix(in srgb, var(--ate-primary), transparent 90%);--ate-primary-lighter: color-mix(in srgb, var(--ate-primary), transparent 95%);--ate-primary-light-alpha: color-mix(in srgb, var(--ate-primary), transparent 85%);--ate-surface: #ffffff;--ate-surface-secondary: #f8f9fa;--ate-surface-tertiary: #f1f5f9;--ate-text: #2d3748;--ate-text-secondary: #64748b;--ate-text-muted: #a0aec0;--ate-border: #e2e8f0;--ate-highlight-bg: #fef08a;--ate-highlight-color: #854d0e;--ate-button-hover: #f1f5f9;--ate-button-active: #e2e8f0;--ate-error-color: #c53030;--ate-error-bg: #fed7d7;--ate-error-border: #feb2b2;--ate-border-color: var(--ate-border);--ate-border-width: 2px;--ate-border-radius: 12px;--ate-focus-color: var(--ate-primary);--ate-background: var(--ate-surface);--ate-sub-border-radius: 8px;--ate-text-color: var(--ate-text);--ate-placeholder-color: var(--ate-text-muted);--ate-line-height: 1.6;--ate-content-padding: 16px;--ate-menu-bg: var(--ate-surface-secondary);--ate-menu-border: var(--ate-border);--ate-menu-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--ate-menu-padding: 6px;--ate-toolbar-padding: var(--ate-menu-padding);--ate-toolbar-background: var(--ate-surface-secondary);--ate-toolbar-border-color: var(--ate-border);--ate-toolbar-button-color: var(--ate-text-secondary);--ate-toolbar-button-hover-background: transparent;--ate-toolbar-button-active-background: var(--ate-primary-light);--ate-toolbar-button-active-color: var(--ate-primary);--ate-counter-color: var(--ate-text-secondary);--ate-counter-background: var(--ate-surface-secondary);--ate-counter-border-color: var(--ate-border);--ate-drag-background: #f0f8ff;--ate-drag-border-color: var(--ate-primary);--ate-blockquote-border-color: var(--ate-border);--ate-blockquote-background: var(--ate-surface-secondary);--ate-code-background: var(--ate-surface-secondary);--ate-code-color: var(--ate-text-secondary);--ate-code-border-color: var(--ate-border);--ate-code-block-background: #0f172a;--ate-code-block-color: #e2e8f0;--ate-code-block-border-color: var(--ate-border);--ate-image-border-radius: var(--ate-sub-border-radius);--ate-image-selected-color: var(--ate-primary);--ate-scrollbar-width: 10px;--ate-scrollbar-thumb: var(--ate-border);--ate-scrollbar-thumb-hover: var(--ate-text-muted);--ate-scrollbar-track: transparent;--ate-table-border-color: var(--ate-border);--ate-table-header-background: var(--ate-surface-secondary);--ate-table-header-color: var(--ate-text);--ate-table-cell-background: var(--ate-surface);--ate-table-cell-selected-background: var(--ate-primary-light);--ate-table-resize-handle-color: var(--ate-primary);--ate-table-row-hover-background: var(--ate-primary-lighter)}:host(.dark),:host([data-theme=\"dark\"]){--ate-primary: #3b82f6;--ate-primary-contrast: #ffffff;--ate-primary-light: color-mix(in srgb, var(--ate-primary), transparent 85%);--ate-primary-lighter: color-mix(in srgb, var(--ate-primary), transparent 92%);--ate-primary-light-alpha: color-mix(in srgb, var(--ate-primary), transparent 80%);--ate-surface: #020617;--ate-surface-secondary: #0f172a;--ate-surface-tertiary: #1e293b;--ate-text: #f8fafc;--ate-text-secondary: #94a3b8;--ate-text-muted: #64748b;--ate-border: #1e293b;--ate-highlight-bg: #854d0e;--ate-highlight-color: #fef08a;--ate-button-hover: #1e293b;--ate-button-active: #0f172a;--ate-menu-border: rgba(255, 255, 255, .1);--ate-menu-shadow: 0 20px 25px -5px rgba(0, 0, 0, .3), 0 10px 10px -5px rgba(0, 0, 0, .2);--ate-error-color: #f87171;--ate-error-bg: #450a0a;--ate-error-border: #7f1d1d;--ate-drag-background: var(--ate-surface-tertiary);--ate-drag-border-color: var(--ate-primary);--ate-blockquote-border-color: var(--ate-primary);--ate-toolbar-button-active-background: var(--ate-primary-light);--ate-toolbar-button-active-color: var(--ate-primary);--ate-button-hover: var(--ate-surface-tertiary);--ate-button-active: var(--ate-surface-secondary);--ate-scrollbar-thumb: var(--ate-surface-tertiary);--ate-scrollbar-thumb-hover: var(--ate-text-muted)}:host(.fill-container){display:block;height:100%}.tiptap-editor{border:var(--ate-border-width) solid var(--ate-border-color);border-radius:var(--ate-border-radius);background:var(--ate-background);overflow:hidden;transition:border-color .2s ease;position:relative}:host(.floating-toolbar) .tiptap-editor{overflow:visible}:host(.fill-container) .tiptap-editor{display:flex;flex-direction:column;height:100%}:host(.fill-container) .tiptap-content{flex:1;min-height:0;overflow-y:auto}.tiptap-editor:focus-within{border-color:var(--ate-focus-color)}.tiptap-content{min-height:var(--editor-min-height, 200px);height:var(--editor-height, auto);max-height:var(--editor-max-height, none);overflow-y:var(--editor-overflow, visible);outline:none;position:relative;scrollbar-width:thin;scrollbar-color:var(--ate-scrollbar-thumb) var(--ate-scrollbar-track)}:host(.is-disabled) .tiptap-content{cursor:not-allowed;opacity:.7;-webkit-user-select:none;user-select:none;pointer-events:none;background-color:var(--ate-surface-tertiary)}:host(.is-readonly) .tiptap-content{cursor:default;-webkit-user-select:text;user-select:text}:host(.is-readonly) .tiptap-content ::ng-deep .tiptap-link{cursor:pointer;pointer-events:auto}.tiptap-content::-webkit-scrollbar{width:var(--ate-scrollbar-width);height:var(--ate-scrollbar-width)}.tiptap-content::-webkit-scrollbar-track{background:var(--ate-scrollbar-track)}.tiptap-content::-webkit-scrollbar-thumb{background:var(--ate-scrollbar-thumb);border:3px solid transparent;background-clip:content-box;border-radius:10px}.tiptap-content::-webkit-scrollbar-thumb:hover{background:var(--ate-scrollbar-thumb-hover);background-clip:content-box}.tiptap-content.drag-over{background:var(--ate-drag-background);border:2px dashed var(--ate-drag-border-color)}.character-count{padding:8px var(--ate-content-padding);font-size:12px;color:var(--ate-counter-color);text-align:right;border-top:1px solid var(--ate-counter-border-color);background:var(--ate-counter-background);transition:color .2s ease;border-bottom-left-radius:calc(var(--ate-border-radius) - var(--ate-border-width));border-bottom-right-radius:calc(var(--ate-border-radius) - var(--ate-border-width))}.character-count.limit-reached{color:var(--ate-error-color, #ef4444);font-weight:600}:host ::ng-deep .ProseMirror{padding:var(--ate-content-padding);outline:none;line-height:var(--ate-line-height);color:var(--ate-text-color);min-height:100%;height:100%;word-wrap:break-word;overflow-wrap:break-word}:host ::ng-deep .ProseMirror h1{font-size:2em;font-weight:700;margin-top:0;margin-bottom:.5em}:host ::ng-deep .ProseMirror h2{font-size:1.5em;font-weight:700;margin-top:1em;margin-bottom:.5em}:host ::ng-deep .ProseMirror h3{font-size:1.25em;font-weight:700;margin-top:1em;margin-bottom:.5em}:host ::ng-deep .ProseMirror p{margin:.5em 0}:host ::ng-deep .ProseMirror ul,:host ::ng-deep .ProseMirror ol{padding-left:2em;margin:.5em 0}:host ::ng-deep .ProseMirror blockquote{border-left:4px solid var(--ate-blockquote-border-color);margin:1em 0;background:var(--ate-blockquote-background);padding:.5em 1em;border-radius:0 4px 4px 0}:host ::ng-deep .ProseMirror code{background:var(--ate-code-background);color:var(--ate-code-color);border:1px solid var(--ate-code-border-color);padding:.15em .4em;border-radius:4px;font-family:JetBrains Mono,Fira Code,Monaco,Consolas,monospace;font-size:.85em;font-weight:500}:host ::ng-deep .ProseMirror pre{background:var(--ate-code-block-background);color:var(--ate-code-block-color);border:1px solid var(--ate-code-block-border-color);padding:1em;border-radius:var(--ate-border-radius);overflow-x:auto;margin:1em 0}:host ::ng-deep .ProseMirror pre code{background:none;color:inherit;border:none;padding:0}:host ::ng-deep .ProseMirror p.is-editor-empty:first-child:before{content:attr(data-placeholder);color:var(--ate-placeholder-color);pointer-events:none;float:left;height:0}:host ::ng-deep .ProseMirror[contenteditable=false]{pointer-events:none}:host ::ng-deep .ProseMirror[contenteditable=false] img{cursor:default;pointer-events:none}:host ::ng-deep .ProseMirror[contenteditable=false] img:hover{transform:none;box-shadow:0 2px 8px #0000001a}:host ::ng-deep .ProseMirror[contenteditable=false] img.ProseMirror-selectednode{outline:none}:host ::ng-deep .ProseMirror img{position:relative;display:inline-block;max-width:100%;height:auto;cursor:pointer;transition:all .2s ease;border:2px solid transparent;border-radius:var(--ate-image-border-radius)}:host ::ng-deep .ProseMirror img:hover{border-color:var(--ate-border-color);box-shadow:0 2px 4px #0000001a}:host ::ng-deep .ProseMirror img.ProseMirror-selectednode{border-color:var(--ate-image-selected-color);box-shadow:0 0 0 3px var(--ate-primary-light-alpha);transition:all .2s ease}:host ::ng-deep .ProseMirror .tiptap-image{max-width:100%;height:auto;border-radius:16px;box-shadow:0 4px 20px #00000014;margin:.5em 0;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:block;filter:brightness(1) contrast(1)}:host ::ng-deep .ProseMirror .tiptap-image:hover{box-shadow:0 8px 30px #0000001f;filter:brightness(1.02) contrast(1.02)}:host ::ng-deep .ProseMirror .tiptap-image.ProseMirror-selectednode{outline:2px solid var(--ate-primary);outline-offset:2px;border-radius:16px;box-shadow:0 0 0 4px var(--ate-primary-light-alpha)}:host ::ng-deep .image-container{margin:.5em 0;text-align:center;border-radius:16px;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}:host ::ng-deep .image-container.image-align-left{text-align:left}:host ::ng-deep .image-container.image-align-center{text-align:center}:host ::ng-deep .image-container.image-align-right{text-align:right}:host ::ng-deep .image-container img{display:inline-block;max-width:100%;height:auto;border-radius:16px}:host ::ng-deep .resizable-image-container{position:relative;display:inline-block;margin:.5em 0}:host ::ng-deep .resize-controls{position:absolute;inset:0;pointer-events:none;z-index:1000}:host ::ng-deep .resize-handle{position:absolute;width:12px;height:12px;background:var(--ate-primary);border:2px solid var(--ate-surface);border-radius:50%;pointer-events:all;cursor:pointer;z-index:1001;transition:all .15s ease;box-shadow:0 2px 6px #0003}:host ::ng-deep .resize-handle:hover{background:var(--ate-primary);box-shadow:0 3px 8px #0000004d}:host ::ng-deep .resize-handle:active{background:var(--ate-primary)}:host ::ng-deep .resize-handle-n:hover,:host ::ng-deep .resize-handle-s:hover{transform:translate(-50%) scale(1.2)}:host ::ng-deep .resize-handle-w:hover,:host ::ng-deep .resize-handle-e:hover{transform:translateY(-50%) scale(1.2)}:host ::ng-deep .resize-handle-n:active,:host ::ng-deep .resize-handle-s:active{transform:translate(-50%) scale(.9)}:host ::ng-deep .resize-handle-w:active,:host ::ng-deep .resize-handle-e:active{transform:translateY(-50%) scale(.9)}:host ::ng-deep .resize-handle-nw:hover,:host ::ng-deep .resize-handle-ne:hover,:host ::ng-deep .resize-handle-sw:hover,:host ::ng-deep .resize-handle-se:hover{transform:scale(1.2)}:host ::ng-deep .resize-handle-nw:active,:host ::ng-deep .resize-handle-ne:active,:host ::ng-deep .resize-handle-sw:active,:host ::ng-deep .resize-handle-se:active{transform:scale(.9)}:host ::ng-deep .resize-handle-nw{top:0;left:-6px;cursor:nw-resize}:host ::ng-deep .resize-handle-n{top:0;left:50%;transform:translate(-50%);cursor:n-resize}:host ::ng-deep .resize-handle-ne{top:0;right:-6px;cursor:ne-resize}:host ::ng-deep .resize-handle-w{top:50%;left:-6px;transform:translateY(-50%);cursor:w-resize}:host ::ng-deep .resize-handle-e{top:50%;right:-6px;transform:translateY(-50%);cursor:e-resize}:host ::ng-deep .resize-handle-sw{bottom:0;left:-6px;cursor:sw-resize}:host ::ng-deep .resize-handle-s{bottom:0;left:50%;transform:translate(-50%);cursor:s-resize}:host ::ng-deep .resize-handle-se{bottom:0;right:-6px;cursor:se-resize}:host ::ng-deep body.resizing{-webkit-user-select:none;user-select:none;cursor:crosshair}:host ::ng-deep body.resizing .ProseMirror{pointer-events:none}:host ::ng-deep body.resizing .ProseMirror .tiptap-image{pointer-events:none}:host ::ng-deep .image-size-info{position:absolute;bottom:-20px;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:2px 6px;border-radius:3px;font-size:11px;white-space:nowrap;opacity:0;transition:opacity .2s ease}:host ::ng-deep .image-container:hover .image-size-info{opacity:1}:host ::ng-deep .ProseMirror table{border-collapse:separate;border-spacing:0;margin:0;table-layout:fixed;width:100%;border-radius:8px;overflow:hidden}:host ::ng-deep .ProseMirror table td,:host ::ng-deep .ProseMirror table th{border:none;border-right:1px solid var(--ate-table-border-color);border-bottom:1px solid var(--ate-table-border-color);box-sizing:border-box;min-width:1em;padding:8px 12px;position:relative;vertical-align:top;text-align:left}:host ::ng-deep .ProseMirror table td{background:var(--ate-table-cell-background)}:host ::ng-deep .ProseMirror table td:first-child,:host ::ng-deep .ProseMirror table th:first-child{border-left:1px solid var(--ate-table-border-color)}:host ::ng-deep .ProseMirror table tr:first-child td,:host ::ng-deep .ProseMirror table tr:first-child th{border-top:1px solid var(--ate-table-border-color)}:host ::ng-deep .ProseMirror table tr:first-child th:first-child{border-top-left-radius:8px}:host ::ng-deep .ProseMirror table tr:first-child th:last-child{border-top-right-radius:8px}:host ::ng-deep .ProseMirror table tr:last-child td:first-child{border-bottom-left-radius:8px}:host ::ng-deep .ProseMirror table tr:last-child td:last-child{border-bottom-right-radius:8px}:host ::ng-deep .ProseMirror table th{background:var(--ate-table-header-background);font-weight:600;color:var(--ate-table-header-color)}:host ::ng-deep .ProseMirror table .selectedCell:after{background:var(--ate-table-cell-selected-background);content:\"\";inset:0;pointer-events:none;position:absolute;z-index:2}:host ::ng-deep .ProseMirror table .column-resize-handle{position:absolute;right:-2px;top:0;bottom:0;width:4px;background-color:var(--ate-table-resize-handle-color);opacity:0;transition:opacity .2s ease}:host ::ng-deep .ProseMirror table:hover .column-resize-handle{opacity:1}:host ::ng-deep .ProseMirror table .column-resize-handle:hover{background-color:var(--ate-focus-color)}:host ::ng-deep .ProseMirror .tableWrapper{overflow-x:auto;margin:1em 0;border-radius:8px}:host ::ng-deep .ProseMirror .tableWrapper table{margin:0;border-radius:8px;min-width:600px;overflow:hidden}:host ::ng-deep .ProseMirror table p{margin:0}:host ::ng-deep .ProseMirror table tbody tr:hover td{background-color:var(--ate-table-row-hover-background)}\n"] }]
+                    ], template: `
+    <div class="tiptap-editor">
+      <!-- Toolbar -->
+      @if (editable() && !mergedDisabled() && showToolbar() && editor()) {
+      <tiptap-toolbar 
+        [editor]="editor()!" 
+        [config]="toolbarConfig()"
+        [imageUpload]="imageUploadConfig()"
+        [floating]="floatingToolbar()"
+        (mouseenter)="hideBubbleMenus()"
+        (mouseleave)="showBubbleMenus()"
+      />
+      }
+
+      @if (showEditToggle() && !mergedDisabled()) {
+      <tiptap-edit-toggle 
+        [editable]="editable()" 
+        [translations]="currentTranslations()"
+        (toggle)="toggleEditMode($event)"
+      />
+      }
+
+      <!-- Editor Content -->
+      <div
+        #editorElement
+        class="tiptap-content"
+        [class.drag-over]="isDragOver()"
+        (dragover)="onDragOver($event)"
+        (drop)="onDrop($event)"
+        (click)="onEditorClick($event)"
+      ></div>
+
+      <!-- Text Bubble Menu -->
+      @if (editable() && showBubbleMenu() && editor()) {
+      <tiptap-bubble-menu
+        [editor]="editor()!"
+        [config]="bubbleMenuConfig()"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-bubble-menu>
+      }
+
+      <!-- Image Bubble Menu -->
+      @if (editable() && showImageBubbleMenu() && editor()) {
+      <tiptap-image-bubble-menu
+        [editor]="editor()!"
+        [config]="imageBubbleMenuConfig()"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-image-bubble-menu>
+      }
+
+      <!-- Link Bubble Menu -->
+      @if (editable() && editor()) {
+      <tiptap-link-bubble-menu
+        [editor]="editor()!"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-link-bubble-menu>
+      }
+
+      <!-- Color Bubble Menu -->
+      @if (editable() && editor()) {
+      <tiptap-color-bubble-menu
+        [editor]="editor()!"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-color-bubble-menu>
+      }
+
+      <!-- Slash Commands -->
+      @if (editable() && enableSlashCommands() && editor()) {
+      <tiptap-slash-commands
+        [editor]="editor()!"
+        [config]="slashCommandsConfigComputed()"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-slash-commands>
+      }
+
+      <!-- Table Menu -->
+      @if (editable() && editor()) {
+      <tiptap-table-bubble-menu
+        [editor]="editor()!"
+        [config]="tableBubbleMenuConfig()"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-table-bubble-menu>
+      }
+
+      <!-- Cell Menu -->
+      @if (editable() && editor()) {
+      <tiptap-cell-bubble-menu
+        [editor]="editor()!"
+        [config]="cellBubbleMenuConfig()"
+        [style.display]="editorFullyInitialized() ? 'block' : 'none'"
+      ></tiptap-cell-bubble-menu>
+      }
+
+      <!-- Counters -->
+      @if (editable() && !mergedDisabled() && showFooter() && (showCharacterCount() || showWordCount())) {
+      <div class="character-count" [class.limit-reached]="maxCharacters() && characterCount() >= maxCharacters()!">
+        @if (showCharacterCount()) {
+          {{ characterCount() }}
+          {{ currentTranslations().editor.character }}{{ characterCount() > 1 ? "s" : "" }}
+          @if (maxCharacters()) {
+            / {{ maxCharacters() }}
+          }
+        }
+        
+        @if (showCharacterCount() && showWordCount()) {
+          , 
+        }
+
+        @if (showWordCount()) {
+          {{ wordCount() }}
+          {{ currentTranslations().editor.word }}{{ wordCount() > 1 ? "s" : "" }}
+        }
+      </div>
+      }
+    </div>
+  `, styles: [":host{--ate-primary: #2563eb;--ate-primary-contrast: #ffffff;--ate-primary-light: color-mix(in srgb, var(--ate-primary), transparent 90%);--ate-primary-lighter: color-mix(in srgb, var(--ate-primary), transparent 95%);--ate-primary-light-alpha: color-mix(in srgb, var(--ate-primary), transparent 85%);--ate-surface: #ffffff;--ate-surface-secondary: #f8f9fa;--ate-surface-tertiary: #f1f5f9;--ate-text: #2d3748;--ate-text-secondary: #64748b;--ate-text-muted: #a0aec0;--ate-border: #e2e8f0;--ate-highlight-bg: #fef08a;--ate-highlight-color: #854d0e;--ate-button-hover: #f1f5f9;--ate-button-active: #e2e8f0;--ate-error-color: #c53030;--ate-error-bg: #fed7d7;--ate-error-border: #feb2b2;--ate-border-color: var(--ate-border);--ate-border-width: 2px;--ate-border-radius: 12px;--ate-focus-color: var(--ate-primary);--ate-background: var(--ate-surface);--ate-sub-border-radius: 8px;--ate-text-color: var(--ate-text);--ate-placeholder-color: var(--ate-text-muted);--ate-line-height: 1.6;--ate-content-padding: 16px;--ate-menu-bg: var(--ate-surface);--ate-menu-border-radius: var(--ate-border-radius);--ate-menu-border: var(--ate-border);--ate-menu-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--ate-menu-padding: 6px;--ate-toolbar-padding: var(--ate-menu-padding);--ate-toolbar-background: var(--ate-surface-secondary);--ate-toolbar-border-color: var(--ate-border);--ate-toolbar-button-color: var(--ate-text-secondary);--ate-toolbar-button-hover-background: transparent;--ate-toolbar-button-active-background: var(--ate-primary-light);--ate-toolbar-button-active-color: var(--ate-primary);--ate-counter-color: var(--ate-text-secondary);--ate-counter-background: var(--ate-surface-secondary);--ate-counter-border-color: var(--ate-border);--ate-drag-background: #f0f8ff;--ate-drag-border-color: var(--ate-primary);--ate-blockquote-border-color: var(--ate-border);--ate-blockquote-background: var(--ate-surface-secondary);--ate-code-background: var(--ate-surface-secondary);--ate-code-color: var(--ate-text-secondary);--ate-code-border-color: var(--ate-border);--ate-code-block-background: #0f172a;--ate-code-block-color: #e2e8f0;--ate-code-block-border-color: var(--ate-border);--ate-image-border-radius: 16px;--ate-image-selected-color: var(--ate-primary);--ate-scrollbar-width: 10px;--ate-scrollbar-thumb: var(--ate-border);--ate-scrollbar-thumb-hover: var(--ate-text-muted);--ate-scrollbar-track: transparent;--ate-table-border-color: var(--ate-border);--ate-table-header-background: var(--ate-surface-secondary);--ate-table-header-color: var(--ate-text);--ate-table-cell-background: var(--ate-surface);--ate-table-cell-selected-background: var(--ate-primary-light);--ate-table-resize-handle-color: var(--ate-primary);--ate-table-row-hover-background: var(--ate-primary-lighter)}:host(.dark),:host([data-theme=\"dark\"]){--ate-primary: #3b82f6;--ate-primary-contrast: #ffffff;--ate-primary-light: color-mix(in srgb, var(--ate-primary), transparent 85%);--ate-primary-lighter: color-mix(in srgb, var(--ate-primary), transparent 92%);--ate-primary-light-alpha: color-mix(in srgb, var(--ate-primary), transparent 80%);--ate-surface: #020617;--ate-surface-secondary: #0f172a;--ate-surface-tertiary: #1e293b;--ate-text: #f8fafc;--ate-text-secondary: #94a3b8;--ate-text-muted: #64748b;--ate-border: #1e293b;--ate-highlight-bg: #854d0e;--ate-highlight-color: #fef08a;--ate-button-hover: #1e293b;--ate-button-active: #0f172a;--ate-menu-border: rgba(255, 255, 255, .1);--ate-menu-shadow: 0 20px 25px -5px rgba(0, 0, 0, .3), 0 10px 10px -5px rgba(0, 0, 0, .2);--ate-error-color: #f87171;--ate-error-bg: #450a0a;--ate-error-border: #7f1d1d;--ate-drag-background: var(--ate-surface-tertiary);--ate-drag-border-color: var(--ate-primary);--ate-blockquote-border-color: var(--ate-primary);--ate-toolbar-button-active-background: var(--ate-primary-light);--ate-toolbar-button-active-color: var(--ate-primary);--ate-button-hover: var(--ate-surface-tertiary);--ate-button-active: var(--ate-surface-secondary);--ate-scrollbar-thumb: var(--ate-surface-tertiary);--ate-scrollbar-thumb-hover: var(--ate-text-muted)}:host(.fill-container){display:block;height:100%}.tiptap-editor{border:var(--ate-border-width) solid var(--ate-border-color);border-radius:var(--ate-border-radius);background:var(--ate-background);overflow:hidden;transition:border-color .2s ease;position:relative}:host(.floating-toolbar) .tiptap-editor{overflow:visible}:host(.fill-container) .tiptap-editor{display:flex;flex-direction:column;height:100%}:host(.fill-container) .tiptap-content-wrapper{flex:1;min-height:0}:host(.fill-container) .tiptap-content{flex:1;min-height:0;overflow-y:auto}.tiptap-editor:focus-within{border-color:var(--ate-focus-color)}.tiptap-content{min-height:var(--editor-min-height, 200px);height:var(--editor-height, auto);max-height:var(--editor-max-height, none);overflow-y:var(--editor-overflow, visible);outline:none;position:relative;scrollbar-width:thin;scrollbar-color:var(--ate-scrollbar-thumb) var(--ate-scrollbar-track)}:host(.is-disabled) .tiptap-content{cursor:not-allowed;opacity:.7;-webkit-user-select:none;user-select:none;pointer-events:none;background-color:var(--ate-surface-tertiary)}:host(.is-readonly) .tiptap-content{cursor:default;-webkit-user-select:text;user-select:text}:host(.is-readonly) .tiptap-content ::ng-deep .tiptap-link{cursor:pointer;pointer-events:auto}.tiptap-content::-webkit-scrollbar{width:var(--ate-scrollbar-width)}.tiptap-content-wrapper{position:relative;display:flex;flex-direction:column;min-height:0}.tiptap-content-wrapper .tiptap-content{flex:1}.tiptap-content::-webkit-scrollbar-track{background:var(--ate-scrollbar-track)}.tiptap-content::-webkit-scrollbar-thumb{background:var(--ate-scrollbar-thumb);border:3px solid transparent;background-clip:content-box;border-radius:10px}.tiptap-content::-webkit-scrollbar-thumb:hover{background:var(--ate-scrollbar-thumb-hover);background-clip:content-box}.tiptap-content.drag-over{background:var(--ate-drag-background);border:2px dashed var(--ate-drag-border-color)}.character-count{padding:8px var(--ate-content-padding);font-size:12px;color:var(--ate-counter-color);text-align:right;border-top:1px solid var(--ate-counter-border-color);background:var(--ate-counter-background);transition:color .2s ease;border-bottom-left-radius:calc(var(--ate-border-radius) - var(--ate-border-width));border-bottom-right-radius:calc(var(--ate-border-radius) - var(--ate-border-width))}.character-count.limit-reached{color:var(--ate-error-color, #ef4444);font-weight:600}:host ::ng-deep .ProseMirror{padding:var(--ate-content-padding);outline:none;line-height:var(--ate-line-height);color:var(--ate-text-color);min-height:100%;height:100%;word-wrap:break-word;overflow-wrap:break-word}:host ::ng-deep .ProseMirror h1{font-size:2em;font-weight:700;margin-top:0;margin-bottom:.5em}:host ::ng-deep .ProseMirror h2{font-size:1.5em;font-weight:700;margin-top:1em;margin-bottom:.5em}:host ::ng-deep .ProseMirror h3{font-size:1.25em;font-weight:700;margin-top:1em;margin-bottom:.5em}:host ::ng-deep .ProseMirror p{margin:.5em 0}:host ::ng-deep .ProseMirror ul,:host ::ng-deep .ProseMirror ol{padding-left:2em;margin:.5em 0}:host ::ng-deep .ProseMirror blockquote{border-left:4px solid var(--ate-blockquote-border-color);margin:1em 0;background:var(--ate-blockquote-background);padding:.5em 1em;border-radius:0 4px 4px 0}:host ::ng-deep .ProseMirror code{background:var(--ate-code-background);color:var(--ate-code-color);border:1px solid var(--ate-code-border-color);padding:.15em .4em;border-radius:4px;font-family:JetBrains Mono,Fira Code,Monaco,Consolas,monospace;font-size:.85em;font-weight:500}:host ::ng-deep .ProseMirror pre{background:var(--ate-code-block-background);color:var(--ate-code-block-color);border:1px solid var(--ate-code-block-border-color);padding:1em;border-radius:var(--ate-border-radius);overflow-x:auto;margin:1em 0}:host ::ng-deep .ProseMirror pre code{background:none;color:inherit;border:none;padding:0}:host ::ng-deep .ProseMirror p.is-editor-empty:first-child:before{content:attr(data-placeholder);color:var(--ate-placeholder-color);pointer-events:none;float:left;height:0}:host ::ng-deep .ProseMirror[contenteditable=false]{pointer-events:none}:host ::ng-deep .ProseMirror[contenteditable=false] img{cursor:default;pointer-events:none}:host ::ng-deep .ProseMirror[contenteditable=false] img:hover{transform:none;box-shadow:0 2px 8px #0000001a}:host ::ng-deep .ProseMirror[contenteditable=false] img.ProseMirror-selectednode{outline:none}:host ::ng-deep .ProseMirror img{position:relative;display:inline-block;max-width:100%;height:auto;cursor:pointer;transition:all .2s ease;border:2px solid transparent;border-radius:var(--ate-image-border-radius)}:host ::ng-deep .ProseMirror img:hover{border-color:var(--ate-border-color);box-shadow:0 2px 4px #0000001a}:host ::ng-deep .ProseMirror img.ProseMirror-selectednode{border-color:var(--ate-image-selected-color);box-shadow:0 0 0 3px var(--ate-primary-light-alpha);transition:all .2s ease}:host ::ng-deep .ProseMirror .tiptap-image{max-width:100%;height:auto;border-radius:var(--ate-image-border-radius);box-shadow:0 4px 20px #00000014;margin:.5em 0;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:block;filter:brightness(1) contrast(1)}:host ::ng-deep .ProseMirror .tiptap-image:hover{box-shadow:0 8px 30px #0000001f;filter:brightness(1.02) contrast(1.02)}:host ::ng-deep .ProseMirror .tiptap-image.ProseMirror-selectednode{outline:2px solid var(--ate-primary);outline-offset:2px;border-radius:var(--ate-image-border-radius);box-shadow:0 0 0 4px var(--ate-primary-light-alpha)}:host ::ng-deep .image-container{margin:.5em 0;text-align:center;border-radius:16px;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}:host ::ng-deep .image-container.image-align-left{text-align:left}:host ::ng-deep .image-container.image-align-center{text-align:center}:host ::ng-deep .image-container.image-align-right{text-align:right}:host ::ng-deep .image-container img{display:inline-block;max-width:100%;height:auto;border-radius:16px}:host ::ng-deep .resizable-image-container{position:relative;display:inline-block;margin:.5em 0}:host ::ng-deep .resize-controls{position:absolute;inset:0;pointer-events:none;z-index:1000}:host ::ng-deep .resize-handle{position:absolute;width:12px;height:12px;background:var(--ate-primary);border:2px solid var(--ate-surface);border-radius:50%;pointer-events:all;cursor:pointer;z-index:1001;transition:all .15s ease;box-shadow:0 2px 6px #0003}:host ::ng-deep .resize-handle:hover{background:var(--ate-primary);box-shadow:0 3px 8px #0000004d}:host ::ng-deep .resize-handle:active{background:var(--ate-primary)}:host ::ng-deep .resize-handle-n:hover,:host ::ng-deep .resize-handle-s:hover{transform:translate(-50%) scale(1.2)}:host ::ng-deep .resize-handle-w:hover,:host ::ng-deep .resize-handle-e:hover{transform:translateY(-50%) scale(1.2)}:host ::ng-deep .resize-handle-n:active,:host ::ng-deep .resize-handle-s:active{transform:translate(-50%) scale(.9)}:host ::ng-deep .resize-handle-w:active,:host ::ng-deep .resize-handle-e:active{transform:translateY(-50%) scale(.9)}:host ::ng-deep .resize-handle-nw:hover,:host ::ng-deep .resize-handle-ne:hover,:host ::ng-deep .resize-handle-sw:hover,:host ::ng-deep .resize-handle-se:hover{transform:scale(1.2)}:host ::ng-deep .resize-handle-nw:active,:host ::ng-deep .resize-handle-ne:active,:host ::ng-deep .resize-handle-sw:active,:host ::ng-deep .resize-handle-se:active{transform:scale(.9)}:host ::ng-deep .resize-handle-nw{top:0;left:-6px;cursor:nw-resize}:host ::ng-deep .resize-handle-n{top:0;left:50%;transform:translate(-50%);cursor:n-resize}:host ::ng-deep .resize-handle-ne{top:0;right:-6px;cursor:ne-resize}:host ::ng-deep .resize-handle-w{top:50%;left:-6px;transform:translateY(-50%);cursor:w-resize}:host ::ng-deep .resize-handle-e{top:50%;right:-6px;transform:translateY(-50%);cursor:e-resize}:host ::ng-deep .resize-handle-sw{bottom:0;left:-6px;cursor:sw-resize}:host ::ng-deep .resize-handle-s{bottom:0;left:50%;transform:translate(-50%);cursor:s-resize}:host ::ng-deep .resize-handle-se{bottom:0;right:-6px;cursor:se-resize}:host ::ng-deep body.resizing{-webkit-user-select:none;user-select:none;cursor:crosshair}:host ::ng-deep body.resizing .ProseMirror{pointer-events:none}:host ::ng-deep body.resizing .ProseMirror .tiptap-image{pointer-events:none}:host ::ng-deep .image-size-info{position:absolute;bottom:-20px;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:2px 6px;border-radius:3px;font-size:11px;white-space:nowrap;opacity:0;transition:opacity .2s ease}:host ::ng-deep .image-container:hover .image-size-info{opacity:1}:host ::ng-deep .ProseMirror table{border-collapse:separate;border-spacing:0;margin:0;table-layout:fixed;width:100%;border-radius:8px;overflow:hidden}:host ::ng-deep .ProseMirror table td,:host ::ng-deep .ProseMirror table th{border:none;border-right:1px solid var(--ate-table-border-color);border-bottom:1px solid var(--ate-table-border-color);box-sizing:border-box;min-width:1em;padding:8px 12px;position:relative;vertical-align:top;text-align:left}:host ::ng-deep .ProseMirror table td{background:var(--ate-table-cell-background)}:host ::ng-deep .ProseMirror table td:first-child,:host ::ng-deep .ProseMirror table th:first-child{border-left:1px solid var(--ate-table-border-color)}:host ::ng-deep .ProseMirror table tr:first-child td,:host ::ng-deep .ProseMirror table tr:first-child th{border-top:1px solid var(--ate-table-border-color)}:host ::ng-deep .ProseMirror table tr:first-child th:first-child{border-top-left-radius:8px}:host ::ng-deep .ProseMirror table tr:first-child th:last-child{border-top-right-radius:8px}:host ::ng-deep .ProseMirror table tr:last-child td:first-child{border-bottom-left-radius:8px}:host ::ng-deep .ProseMirror table tr:last-child td:last-child{border-bottom-right-radius:8px}:host ::ng-deep .ProseMirror table th{background:var(--ate-table-header-background);font-weight:600;color:var(--ate-table-header-color)}:host ::ng-deep .ProseMirror table .selectedCell:after{background:var(--ate-table-cell-selected-background);content:\"\";inset:0;pointer-events:none;position:absolute;z-index:2}:host ::ng-deep .ProseMirror table .column-resize-handle{position:absolute;right:-2px;top:0;bottom:0;width:4px;background-color:var(--ate-table-resize-handle-color);opacity:0;transition:opacity .2s ease}:host ::ng-deep .ProseMirror table:hover .column-resize-handle{opacity:1}:host ::ng-deep .ProseMirror table .column-resize-handle:hover{background-color:var(--ate-focus-color)}:host ::ng-deep .ProseMirror .tableWrapper{overflow-x:auto;margin:1em 0;border-radius:8px}:host ::ng-deep .ProseMirror .tableWrapper table{margin:0;border-radius:8px;min-width:600px;overflow:hidden}:host ::ng-deep .ProseMirror table p{margin:0}:host ::ng-deep .ProseMirror table tbody tr:hover td{background-color:var(--ate-table-row-hover-background)}\n"] }]
         }], ctorParameters: () => [] });
 
 /*