@shival99/z-ui 2.1.32 → 2.2.0

package/fesm2022/shival99-z-ui-components-z-dropdown-menu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"shival99-z-ui-components-z-dropdown-menu.mjs","sources":["../../../../libs/core-ui/components/z-dropdown-menu/z-dropdown-menu.component.ts","../../../../libs/core-ui/components/z-dropdown-menu/z-dropdown-menu.component.html","../../../../libs/core-ui/components/z-dropdown-menu/shival99-z-ui-components-z-dropdown-menu.ts"],"sourcesContent":["import {\n  AfterContentInit,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  ElementRef,\n  input,\n  output,\n  signal,\n  viewChild,\n} from '@angular/core';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZButtonComponent, ZButtonVariants } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { type ZIcon } from '@shival99/z-ui/components/z-icon';\nimport { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';\nimport { type ZPopoverPosition } from '@shival99/z-ui/components/z-popover';\nimport { ZTooltipDirective } from '@shival99/z-ui/components/z-tooltip';\nimport { zTransform } from '@shival99/z-ui/utils';\nimport { ZDropdownMenuItem } from './z-dropdown-menu.types';\n\n@Component({\n  selector: 'z-dropdown-menu',\n  imports: [ZPopoverDirective, ZButtonComponent, ZIconComponent, ZTooltipDirective, TranslatePipe],\n  standalone: true,\n  templateUrl: './z-dropdown-menu.component.html',\n  styleUrl: './z-dropdown-menu.component.scss',\n  providers: [TranslatePipe],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ZDropdownMenuComponent implements AfterContentInit {\n  protected readonly contentWrapper = viewChild<ElementRef<HTMLElement>>('contentWrapper');\n\n  public readonly zOnItemClick = output<ZDropdownMenuItem>();\n\n  public readonly zItems = input.required<ZDropdownMenuItem[]>();\n  public readonly zLabel = input<string>();\n  public readonly zIcon = input<ZIcon>('lucideMenu');\n  public readonly zButtonType = input<'primary' | 'secondary' | 'outline' | 'ghost'>('outline');\n  public readonly zPosition = input<ZPopoverPosition>('bottom-right');\n  public readonly zButtonSize = input<ZButtonVariants['zSize']>('default');\n  public readonly zOffset = input<number>(4);\n  public readonly zMinWidth = input<number>(224);\n  public readonly zMaxWidth = input<number>(320);\n  public readonly zDisabled = input<boolean>(false);\n  public readonly zWave = input(true, { transform: zTransform });\n\n  protected readonly hasContent = signal(false);\n  protected readonly popoverControl = signal<{ close: () => void; closeImmediate: () => void } | null>(null);\n\n  protected readonly visibleItems = computed(() => this.zItems().filter(item => !item.hidden));\n\n  ngAfterContentInit(): void {\n    const wrapper = this.contentWrapper();\n    if (wrapper) {\n      const hasProjectedContent = wrapper.nativeElement.children.length > 0;\n      this.hasContent.set(hasProjectedContent);\n    }\n  }\n\n  protected onItemClick(item: ZDropdownMenuItem): void {\n    if (item.disabled || item.loading) {\n      return;\n    }\n\n    item.onClick?.();\n    this.zOnItemClick.emit(item);\n    this.popoverControl()?.closeImmediate();\n  }\n\n  protected onControl(control: { close: () => void; closeImmediate: () => void }): void {\n    this.popoverControl.set(control);\n  }\n}\n","<!-- Custom trigger via ng-content -->\n<div\n  #contentWrapper\n  z-popover\n  [zPopoverContent]=\"menuContent\"\n  zTrigger=\"click\"\n  [zPosition]=\"zPosition()\"\n  [zOffset]=\"zOffset()\"\n  [zDisabled]=\"zDisabled()\"\n  (zControl)=\"onControl($event)\"\n  [class.hidden]=\"!hasContent()\">\n  <ng-content />\n</div>\n\n<!-- Default button trigger -->\n@if (!hasContent()) {\n  <button\n    type=\"button\"\n    z-button\n    [zType]=\"zButtonType()\"\n    [zSize]=\"zButtonSize()\"\n    [zDisabled]=\"zDisabled()\"\n    [zWave]=\"zWave()\"\n    z-popover\n    [zPopoverContent]=\"menuContent\"\n    zTrigger=\"click\"\n    [zPosition]=\"zPosition()\"\n    [zOffset]=\"zOffset()\"\n    [zTypeIcon]=\"zIcon()!\"\n    (zControl)=\"onControl($event)\">\n    @if (zLabel()) {\n      {{ zLabel() | translate }}\n    }\n  </button>\n}\n\n<!-- Menu content template -->\n<ng-template #menuContent let-close=\"close\">\n  <div class=\"z-dropdown-menu-content p-1\" [style.min-width.px]=\"zMinWidth()\" [style.max-width.px]=\"zMaxWidth()\">\n    @for (item of visibleItems(); track $index) {\n      @if (item.divide === 'before' && $index > 0) {\n        <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n      }\n\n      <!-- Menu item - check if has submenu -->\n      @if (item.submenu && item.submenu.length > 0) {\n        <!-- Menu item with nested submenu -->\n        <button\n          type=\"button\"\n          z-popover\n          [zPopoverContent]=\"submenuTemplate\"\n          [zPosition]=\"item.submenuPosition || 'right'\"\n          zTrigger=\"hover\"\n          [zShowDelay]=\"200\"\n          [zHideDelay]=\"100\"\n          [zOffset]=\"6\"\n          [disabled]=\"item.disabled || item.loading\"\n          [class]=\"item.class\"\n          class=\"hover:bg-accent data-[state=open]:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\">\n          @if (item.loading) {\n            <z-icon\n              zType=\"lucideLoader\"\n              [zSize]=\"item.iconSize || '14'\"\n              class=\"text-muted-foreground shrink-0 animate-spin\" />\n          } @else if (item.icon) {\n            <z-icon [zType]=\"item.icon\" [zSize]=\"item.iconSize || '14'\" class=\"text-muted-foreground shrink-0\" />\n          }\n          <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n            {{ item.label | translate }}\n          </span>\n          @if (item.shortcut) {\n            <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n              {{ item.shortcut | translate }}\n            </span>\n          }\n          <z-icon zType=\"lucideChevronRight\" zSize=\"14\" class=\"ml-auto shrink-0\" />\n        </button>\n\n        <!-- Submenu template -->\n        <ng-template #submenuTemplate>\n          <div\n            class=\"p-1\"\n            [style.min-width.px]=\"item.subMinWidth || zMinWidth()\"\n            [style.max-width.px]=\"item.subMaxWidth || zMaxWidth()\">\n            @for (subItem of item.submenu; track subItem.label) {\n              <!-- Nested divider before -->\n              @if (subItem.divide === 'before') {\n                <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n              }\n\n              <button\n                type=\"button\"\n                [disabled]=\"subItem.disabled || subItem.loading\"\n                [class]=\"subItem.class\"\n                class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n                (click)=\"onItemClick(subItem)\">\n                @if (subItem.loading) {\n                  <z-icon\n                    zType=\"lucideLoader\"\n                    [zSize]=\"subItem.iconSize || '14'\"\n                    class=\"text-muted-foreground shrink-0 animate-spin\" />\n                } @else if (subItem.icon) {\n                  <z-icon\n                    [zType]=\"subItem.icon\"\n                    [zSize]=\"subItem.iconSize || '14'\"\n                    class=\"text-muted-foreground shrink-0\" />\n                }\n                <span\n                  class=\"truncate\"\n                  z-tooltip\n                  [zContent]=\"subItem.label\"\n                  [zShowDelay]=\"200\"\n                  zTrigger=\"hover\"\n                  zPosition=\"top\">\n                  {{ subItem.label | translate }}\n                </span>\n                @if (subItem.shortcut) {\n                  <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n                    {{ subItem.shortcut | translate }}\n                  </span>\n                }\n              </button>\n\n              <!-- Nested divider after -->\n              @if (subItem.divide === 'after') {\n                <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n              }\n            }\n          </div>\n        </ng-template>\n      } @else {\n        <!-- Regular menu item (no submenu) -->\n        <button\n          type=\"button\"\n          [disabled]=\"item.disabled || item.loading\"\n          [class]=\"item.class\"\n          class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n          (click)=\"onItemClick(item)\">\n          @if (item.loading) {\n            <z-icon\n              zType=\"lucideLoader\"\n              [zSize]=\"item.iconSize || '14'\"\n              class=\"text-muted-foreground shrink-0 animate-spin\" />\n          } @else if (item.icon) {\n            <z-icon [zType]=\"item.icon\" [zSize]=\"item.iconSize || '14'\" class=\"text-muted-foreground shrink-0\" />\n          }\n          <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n            {{ item.label | translate }}\n          </span>\n          @if (item.shortcut) {\n            <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n              {{ item.shortcut | translate }}\n            </span>\n          }\n        </button>\n      }\n\n      <!-- Divider after -->\n      @if (item.divide === 'after' && $index < visibleItems().length - 1) {\n        <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n      }\n    }\n  </div>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"shival99-z-ui-components-z-dropdown-menu.mjs","sources":["../../../../libs/core-ui/components/z-dropdown-menu/z-dropdown-menu.component.ts","../../../../libs/core-ui/components/z-dropdown-menu/z-dropdown-menu.component.html","../../../../libs/core-ui/components/z-dropdown-menu/shival99-z-ui-components-z-dropdown-menu.ts"],"sourcesContent":["import {\n  AfterContentInit,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  ElementRef,\n  input,\n  output,\n  signal,\n  viewChild,\n} from '@angular/core';\nimport { TranslatePipe } from '@ngx-translate/core';\nimport { ZButtonComponent, ZButtonVariants } from '@shival99/z-ui/components/z-button';\nimport { ZIconComponent } from '@shival99/z-ui/components/z-icon';\nimport { type ZIcon } from '@shival99/z-ui/components/z-icon';\nimport { ZPopoverDirective } from '@shival99/z-ui/components/z-popover';\nimport { type ZPopoverPosition } from '@shival99/z-ui/components/z-popover';\nimport { ZTooltipDirective } from '@shival99/z-ui/components/z-tooltip';\nimport { zTransform } from '@shival99/z-ui/utils';\nimport { ZDropdownMenuItem } from './z-dropdown-menu.types';\n\n@Component({\n  selector: 'z-dropdown-menu',\n  imports: [ZPopoverDirective, ZButtonComponent, ZIconComponent, ZTooltipDirective, TranslatePipe],\n  standalone: true,\n  templateUrl: './z-dropdown-menu.component.html',\n  styleUrl: './z-dropdown-menu.component.scss',\n  providers: [TranslatePipe],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ZDropdownMenuComponent implements AfterContentInit {\n  protected readonly contentWrapper = viewChild<ElementRef<HTMLElement>>('contentWrapper');\n\n  public readonly zOnItemClick = output<ZDropdownMenuItem>();\n\n  public readonly zItems = input.required<ZDropdownMenuItem[]>();\n  public readonly zLabel = input<string>();\n  public readonly zIcon = input<ZIcon>('lucideMenu');\n  public readonly zButtonType = input<'primary' | 'secondary' | 'outline' | 'ghost'>('outline');\n  public readonly zPosition = input<ZPopoverPosition>('bottom-right');\n  public readonly zButtonSize = input<ZButtonVariants['zSize']>('default');\n  public readonly zOffset = input<number>(4);\n  public readonly zMinWidth = input<number>(224);\n  public readonly zMaxWidth = input<number>(320);\n  public readonly zDisabled = input<boolean>(false);\n  public readonly zWave = input(true, { transform: zTransform });\n\n  protected readonly hasContent = signal(false);\n  protected readonly popoverControl = signal<{ close: () => void; closeImmediate: () => void } | null>(null);\n\n  protected readonly visibleItems = computed(() => this.zItems().filter(item => !item.hidden));\n\n  ngAfterContentInit(): void {\n    const wrapper = this.contentWrapper();\n    if (wrapper) {\n      const hasProjectedContent = wrapper.nativeElement.children.length > 0;\n      this.hasContent.set(hasProjectedContent);\n    }\n  }\n\n  protected onItemClick(item: ZDropdownMenuItem): void {\n    if (item.disabled || item.loading) {\n      return;\n    }\n\n    item.onClick?.();\n    this.zOnItemClick.emit(item);\n    this.popoverControl()?.closeImmediate();\n  }\n\n  protected onControl(control: { close: () => void; closeImmediate: () => void }): void {\n    this.popoverControl.set(control);\n  }\n}\n","<!-- Custom trigger via ng-content -->\n<div\n  #contentWrapper\n  z-popover\n  [zPopoverContent]=\"menuContent\"\n  zTrigger=\"click\"\n  [zPosition]=\"zPosition()\"\n  [zOffset]=\"zOffset()\"\n  [zDisabled]=\"zDisabled()\"\n  (zControl)=\"onControl($event)\"\n  [class.hidden]=\"!hasContent()\">\n  <ng-content />\n</div>\n\n<!-- Default button trigger -->\n@if (!hasContent()) {\n  <button\n    type=\"button\"\n    z-button\n    [zType]=\"zButtonType()\"\n    [zSize]=\"zButtonSize()\"\n    [zDisabled]=\"zDisabled()\"\n    [zWave]=\"zWave()\"\n    z-popover\n    [zPopoverContent]=\"menuContent\"\n    zTrigger=\"click\"\n    [zPosition]=\"zPosition()\"\n    [zOffset]=\"zOffset()\"\n    [zTypeIcon]=\"zIcon()!\"\n    (zControl)=\"onControl($event)\">\n    @if (zLabel()) {\n      {{ zLabel() | translate }}\n    }\n  </button>\n}\n\n<!-- Menu content template -->\n<ng-template #menuContent let-close=\"close\">\n  <div class=\"z-dropdown-menu-content p-1\" [style.min-width.px]=\"zMinWidth()\" [style.max-width.px]=\"zMaxWidth()\">\n    @for (item of visibleItems(); track $index) {\n      @if (item.divide === 'before' && $index > 0) {\n        <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n      }\n\n      <!-- Menu item - check if has submenu -->\n      @if (item.submenu && item.submenu.length > 0) {\n        <!-- Menu item with nested submenu -->\n        <button\n          type=\"button\"\n          z-popover\n          [zPopoverContent]=\"submenuTemplate\"\n          [zPosition]=\"item.submenuPosition || 'right'\"\n          zTrigger=\"hover\"\n          [zShowDelay]=\"200\"\n          [zHideDelay]=\"100\"\n          [zOffset]=\"6\"\n          [disabled]=\"item.disabled || item.loading\"\n          [class]=\"item.class\"\n          class=\"hover:bg-accent data-[state=open]:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\">\n          @if (item.loading) {\n            <z-icon\n              zType=\"lucideLoader\"\n              [zSize]=\"item.iconSize || '14'\"\n              class=\"text-muted-foreground shrink-0 animate-spin\" />\n          } @else if (item.icon) {\n            <z-icon [zType]=\"item.icon\" [zSize]=\"item.iconSize || '14'\" class=\"text-muted-foreground shrink-0\" />\n          }\n          <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n            {{ item.label | translate }}\n          </span>\n          @if (item.shortcut) {\n            <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n              {{ item.shortcut | translate }}\n            </span>\n          }\n          <z-icon zType=\"lucideChevronRight\" zSize=\"14\" class=\"ml-auto shrink-0\" />\n        </button>\n\n        <!-- Submenu template -->\n        <ng-template #submenuTemplate>\n          <div\n            class=\"p-1\"\n            [style.min-width.px]=\"item.subMinWidth || zMinWidth()\"\n            [style.max-width.px]=\"item.subMaxWidth || zMaxWidth()\">\n            @for (subItem of item.submenu; track subItem.label) {\n              <!-- Nested divider before -->\n              @if (subItem.divide === 'before') {\n                <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n              }\n\n              <button\n                type=\"button\"\n                [disabled]=\"subItem.disabled || subItem.loading\"\n                [class]=\"subItem.class\"\n                class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n                (click)=\"onItemClick(subItem)\">\n                @if (subItem.loading) {\n                  <z-icon\n                    zType=\"lucideLoader\"\n                    [zSize]=\"subItem.iconSize || '14'\"\n                    class=\"text-muted-foreground shrink-0 animate-spin\" />\n                } @else if (subItem.icon) {\n                  <z-icon\n                    [zType]=\"subItem.icon\"\n                    [zSize]=\"subItem.iconSize || '14'\"\n                    class=\"text-muted-foreground shrink-0\" />\n                }\n                <span\n                  class=\"truncate\"\n                  z-tooltip\n                  [zContent]=\"subItem.label\"\n                  [zShowDelay]=\"200\"\n                  zTrigger=\"hover\"\n                  zPosition=\"top\">\n                  {{ subItem.label | translate }}\n                </span>\n                @if (subItem.shortcut) {\n                  <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n                    {{ subItem.shortcut | translate }}\n                  </span>\n                }\n              </button>\n\n              <!-- Nested divider after -->\n              @if (subItem.divide === 'after') {\n                <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n              }\n            }\n          </div>\n        </ng-template>\n      } @else {\n        <!-- Regular menu item (no submenu) -->\n        <button\n          type=\"button\"\n          [disabled]=\"item.disabled || item.loading\"\n          [class]=\"item.class\"\n          class=\"hover:bg-accent focus:bg-accent flex w-full cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm transition-colors outline-none disabled:pointer-events-none disabled:opacity-50\"\n          (click)=\"onItemClick(item)\">\n          @if (item.loading) {\n            <z-icon\n              zType=\"lucideLoader\"\n              [zSize]=\"item.iconSize || '14'\"\n              class=\"text-muted-foreground shrink-0 animate-spin\" />\n          } @else if (item.icon) {\n            <z-icon [zType]=\"item.icon\" [zSize]=\"item.iconSize || '14'\" class=\"text-muted-foreground shrink-0\" />\n          }\n          <span class=\"truncate\" z-tooltip [zContent]=\"item.label\" [zShowDelay]=\"500\" zTrigger=\"hover\" zPosition=\"top\">\n            {{ item.label | translate }}\n          </span>\n          @if (item.shortcut) {\n            <span class=\"text-muted-foreground ml-auto shrink-0 text-xs tracking-widest\">\n              {{ item.shortcut | translate }}\n            </span>\n          }\n        </button>\n      }\n\n      <!-- Divider after -->\n      @if (item.divide === 'after' && $index < visibleItems().length - 1) {\n        <div class=\"bg-border -mx-1 my-1 h-px\"></div>\n      }\n    }\n  </div>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/shival99-z-ui-components-z-editor.mjs

@@ -259,37 +259,58 @@ class ZEditorComponent {
     _injector = inject(Injector);
     _destroyRef = inject(DestroyRef);
     _zTranslate = inject(ZTranslateService);
-    _editorHost = viewChild.required('editorHost');
-    _floatingToolbar = viewChild.required('floatingToolbar');
-    _slashMenuTrigger = viewChild.required('slashMenuTrigger');
-    _linkPopoverTrigger = viewChild.required('linkPopoverTrigger');
-    _slashMenuScrollHost = viewChild('slashMenuScrollHost', ...(ngDevMode ? [{ debugName: "_slashMenuScrollHost" }] : []));
+    _editorHost = viewChild.required('editorHost', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_editorHost" }] : /* istanbul ignore next */ []));
+    _floatingToolbar = viewChild.required('floatingToolbar', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_floatingToolbar" }] : /* istanbul ignore next */ []));
+    _slashMenuTrigger = viewChild.required('slashMenuTrigger', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_slashMenuTrigger" }] : /* istanbul ignore next */ []));
+    _linkPopoverTrigger = viewChild.required('linkPopoverTrigger', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_linkPopoverTrigger" }] : /* istanbul ignore next */ []));
+    _slashMenuScrollHost = viewChild('slashMenuScrollHost', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_slashMenuScrollHost" }] : /* istanbul ignore next */ []));
     zOnChange = output();
     zOnFocus = output();
     zOnBlur = output();
     zControl = output();
     zEvent = output();
-    class = input('', ...(ngDevMode ? [{ debugName: "class" }] : []));
-    zSize = input('default', ...(ngDevMode ? [{ debugName: "zSize" }] : []));
-    zLabel = input('', ...(ngDevMode ? [{ debugName: "zLabel" }] : []));
-    zLabelClass = input('', ...(ngDevMode ? [{ debugName: "zLabelClass" }] : []));
-    zPlaceholder = input('', ...(ngDevMode ? [{ debugName: "zPlaceholder" }] : []));
-    zRequired = input(false, { ...(ngDevMode ? { debugName: "zRequired" } : {}), transform: zTransform });
-    zDisabled = input(false, { ...(ngDevMode ? { debugName: "zDisabled" } : {}), transform: zTransform });
-    zReadonly = input(false, { ...(ngDevMode ? { debugName: "zReadonly" } : {}), transform: zTransform });
-    zContentType = input('html', ...(ngDevMode ? [{ debugName: "zContentType" }] : []));
-    zToolbar = input(Z_EDITOR_DEFAULT_TOOLBAR, ...(ngDevMode ? [{ debugName: "zToolbar" }] : []));
-    zTipTap = input({}, ...(ngDevMode ? [{ debugName: "zTipTap" }] : []));
-    zValidators = input([], ...(ngDevMode ? [{ debugName: "zValidators" }] : []));
+    class = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "class" }] : /* istanbul ignore next */ []));
+    zSize = input('default', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "zSize" }] : /* istanbul ignore next */ []));
+    zLabel = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "zLabel" }] : /* istanbul ignore next */ []));
+    zLabelClass = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "zLabelClass" }] : /* istanbul ignore next */ []));
+    zPlaceholder = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "zPlaceholder" }] : /* istanbul ignore next */ []));
+    zRequired = input(false, { ...(ngDevMode ? { debugName: "zRequired" } : /* istanbul ignore next */ {}), transform: zTransform });
+    zDisabled = input(false, { ...(ngDevMode ? { debugName: "zDisabled" } : /* istanbul ignore next */ {}), transform: zTransform });
+    zReadonly = input(false, { ...(ngDevMode ? { debugName: "zReadonly" } : /* istanbul ignore next */ {}), transform: zTransform });
+    zContentType = input('html', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "zContentType" }] : /* istanbul ignore next */ []));
+    zToolbar = input(Z_EDITOR_DEFAULT_TOOLBAR, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "zToolbar" }] : /* istanbul ignore next */ []));
+    zTipTap = input({}, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "zTipTap" }] : /* istanbul ignore next */ []));
+    zValidators = input([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "zValidators" }] : /* istanbul ignore next */ []));
     editorId = zUuid('z-editor');
     linkInputId = zUuid('z-editor-link');
-    _value = signal('', ...(ngDevMode ? [{ debugName: "_value" }] : []));
-    _disabled = signal(false, ...(ngDevMode ? [{ debugName: "_disabled" }] : []));
-    _formControl = signal(null, ...(ngDevMode ? [{ debugName: "_formControl" }] : []));
-    _formStateVersion = signal(0, ...(ngDevMode ? [{ debugName: "_formStateVersion" }] : []));
-    _isNgModel = signal(false, ...(ngDevMode ? [{ debugName: "_isNgModel" }] : []));
-    _selectionVersion = signal(0, ...(ngDevMode ? [{ debugName: "_selectionVersion" }] : []));
-    _plainText = signal('', ...(ngDevMode ? [{ debugName: "_plainText" }] : []));
+    _value = signal('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_value" }] : /* istanbul ignore next */ []));
+    _disabled = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_disabled" }] : /* istanbul ignore next */ []));
+    _formControl = signal(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_formControl" }] : /* istanbul ignore next */ []));
+    _formStateVersion = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_formStateVersion" }] : /* istanbul ignore next */ []));
+    _isNgModel = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_isNgModel" }] : /* istanbul ignore next */ []));
+    _selectionVersion = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_selectionVersion" }] : /* istanbul ignore next */ []));
+    _plainText = signal('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_plainText" }] : /* istanbul ignore next */ []));
     slashMenuState = signal({
         visible: false,
         query: '',
@@ -297,17 +318,22 @@ class ZEditorComponent {
         to: 0,
         left: 0,
         top: 0,
-    }, ...(ngDevMode ? [{ debugName: "slashMenuState" }] : []));
-    slashMenuActiveIndex = signal(0, ...(ngDevMode ? [{ debugName: "slashMenuActiveIndex" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "slashMenuState" }] : /* istanbul ignore next */ []));
+    slashMenuActiveIndex = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "slashMenuActiveIndex" }] : /* istanbul ignore next */ []));
     linkPopoverState = signal({
         visible: false,
         left: 0,
         top: 0,
         width: 0,
         height: 0,
-    }, ...(ngDevMode ? [{ debugName: "linkPopoverState" }] : []));
-    linkUrl = signal('', ...(ngDevMode ? [{ debugName: "linkUrl" }] : []));
-    activeLinkHref = signal('', ...(ngDevMode ? [{ debugName: "activeLinkHref" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "linkPopoverState" }] : /* istanbul ignore next */ []));
+    linkUrl = signal('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "linkUrl" }] : /* istanbul ignore next */ []));
+    activeLinkHref = signal('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeLinkHref" }] : /* istanbul ignore next */ []));
     linkValidators = [
         {
             error: 'url',
@@ -345,8 +371,10 @@ class ZEditorComponent {
     uiState = signal({
         touched: false,
         dirty: false,
-    }, ...(ngDevMode ? [{ debugName: "uiState" }] : []));
-    _customError = signal(null, ...(ngDevMode ? [{ debugName: "_customError" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "uiState" }] : /* istanbul ignore next */ []));
+    _customError = signal(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_customError" }] : /* istanbul ignore next */ []));
     _onChange = () => void 0;
     _onTouched = () => void 0;
     _ngControl = null;
@@ -366,29 +394,46 @@ class ZEditorComponent {
     _resizeListenerCleanup = null;
     _bubbleMenuPositionFrame = null;
     emojiCategories = Z_EMOJI_SHEET;
-    activeEmojiCategoryId = signal(this.emojiCategories[0]?.id ?? 'smileys-people', ...(ngDevMode ? [{ debugName: "activeEmojiCategoryId" }] : []));
-    emojiSearch = signal('', ...(ngDevMode ? [{ debugName: "emojiSearch" }] : []));
-    activeEmojiCategory = computed(() => this.emojiCategories.find(category => category.id === this.activeEmojiCategoryId()) ?? this.emojiCategories[0], ...(ngDevMode ? [{ debugName: "activeEmojiCategory" }] : []));
-    activeEmojiCategoryLabel = computed(() => this.activeEmojiCategory()?.labelKey ?? 'i18n_z_ui_emoji_category_smileys', ...(ngDevMode ? [{ debugName: "activeEmojiCategoryLabel" }] : []));
-    emojiSearchQuery = computed(() => this.emojiSearch().trim().toLowerCase(), ...(ngDevMode ? [{ debugName: "emojiSearchQuery" }] : []));
+    activeEmojiCategoryId = signal(this.emojiCategories[0]?.id ?? 'smileys-people', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeEmojiCategoryId" }] : /* istanbul ignore next */ []));
+    emojiSearch = signal('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "emojiSearch" }] : /* istanbul ignore next */ []));
+    activeEmojiCategory = computed(() => this.emojiCategories.find(category => category.id === this.activeEmojiCategoryId()) ?? this.emojiCategories[0], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeEmojiCategory" }] : /* istanbul ignore next */ []));
+    activeEmojiCategoryLabel = computed(() => this.activeEmojiCategory()?.labelKey ?? 'i18n_z_ui_emoji_category_smileys', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeEmojiCategoryLabel" }] : /* istanbul ignore next */ []));
+    emojiSearchQuery = computed(() => this.emojiSearch().trim().toLowerCase(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "emojiSearchQuery" }] : /* istanbul ignore next */ []));
     activeEmojis = computed(() => {
         const query = this.emojiSearchQuery();
         if (query) {
             return this._searchEmojis(query);
         }
         return this.activeEmojiCategory()?.emojis ?? [];
-    }, ...(ngDevMode ? [{ debugName: "activeEmojis" }] : []));
-    hasEmojiResults = computed(() => this.activeEmojis().length > 0, ...(ngDevMode ? [{ debugName: "hasEmojiResults" }] : []));
-    isDisabled = computed(() => this._disabled() || this.zDisabled(), ...(ngDevMode ? [{ debugName: "isDisabled" }] : []));
-    showToolbar = computed(() => this.zToolbar() !== false && !this.zReadonly() && !this.isDisabled(), ...(ngDevMode ? [{ debugName: "showToolbar" }] : []));
-    normalizedLinkUrl = computed(() => this._normalizeUrl(this.linkUrl()), ...(ngDevMode ? [{ debugName: "normalizedLinkUrl" }] : []));
-    activeTextColor = computed(() => this._getTextStyleAttribute('color') || '#111827', ...(ngDevMode ? [{ debugName: "activeTextColor" }] : []));
-    activeBackgroundColor = computed(() => this._getTextStyleAttribute('backgroundColor') || '#ffffff', ...(ngDevMode ? [{ debugName: "activeBackgroundColor" }] : []));
-    activeBlockStyle = computed(() => this._getActiveBlockStyle(), ...(ngDevMode ? [{ debugName: "activeBlockStyle" }] : []));
-    activeBlockStyleLabel = computed(() => this.blockStyleOptions.find(option => option.command === this.activeBlockStyle())?.label ?? 'Paragraph', ...(ngDevMode ? [{ debugName: "activeBlockStyleLabel" }] : []));
-    activeAlign = computed(() => this._getActiveAlign(), ...(ngDevMode ? [{ debugName: "activeAlign" }] : []));
-    activeAlignLabel = computed(() => this.alignOptions.find(option => option.command === this.activeAlign())?.label ?? 'Left', ...(ngDevMode ? [{ debugName: "activeAlignLabel" }] : []));
-    activeAlignIcon = computed(() => this.alignOptions.find(option => option.command === this.activeAlign())?.icon ?? 'lucideAlignLeft', ...(ngDevMode ? [{ debugName: "activeAlignIcon" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeEmojis" }] : /* istanbul ignore next */ []));
+    hasEmojiResults = computed(() => this.activeEmojis().length > 0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasEmojiResults" }] : /* istanbul ignore next */ []));
+    isDisabled = computed(() => this._disabled() || this.zDisabled(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
+    showToolbar = computed(() => this.zToolbar() !== false && !this.zReadonly() && !this.isDisabled(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "showToolbar" }] : /* istanbul ignore next */ []));
+    normalizedLinkUrl = computed(() => this._normalizeUrl(this.linkUrl()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "normalizedLinkUrl" }] : /* istanbul ignore next */ []));
+    activeTextColor = computed(() => this._getTextStyleAttribute('color') || '#111827', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeTextColor" }] : /* istanbul ignore next */ []));
+    activeBackgroundColor = computed(() => this._getTextStyleAttribute('backgroundColor') || '#ffffff', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeBackgroundColor" }] : /* istanbul ignore next */ []));
+    activeBlockStyle = computed(() => this._getActiveBlockStyle(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeBlockStyle" }] : /* istanbul ignore next */ []));
+    activeBlockStyleLabel = computed(() => this.blockStyleOptions.find(option => option.command === this.activeBlockStyle())?.label ?? 'Paragraph', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeBlockStyleLabel" }] : /* istanbul ignore next */ []));
+    activeAlign = computed(() => this._getActiveAlign(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeAlign" }] : /* istanbul ignore next */ []));
+    activeAlignLabel = computed(() => this.alignOptions.find(option => option.command === this.activeAlign())?.label ?? 'Left', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeAlignLabel" }] : /* istanbul ignore next */ []));
+    activeAlignIcon = computed(() => this.alignOptions.find(option => option.command === this.activeAlign())?.icon ?? 'lucideAlignLeft', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "activeAlignIcon" }] : /* istanbul ignore next */ []));
     filteredSlashCommands = computed(() => {
         const query = this.slashMenuState().query.trim().toLowerCase();
         const commands = this.slashCommands;
@@ -404,12 +449,15 @@ class ZEditorComponent {
             ...item,
             showGroupLabel: index === 0 || matchedCommands[index - 1]?.group !== item.group,
         }));
-    }, ...(ngDevMode ? [{ debugName: "filteredSlashCommands" }] : []));
-    canApplyLink = computed(() => !!this.normalizedLinkUrl(), ...(ngDevMode ? [{ debugName: "canApplyLink" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "filteredSlashCommands" }] : /* istanbul ignore next */ []));
+    canApplyLink = computed(() => !!this.normalizedLinkUrl(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "canApplyLink" }] : /* istanbul ignore next */ []));
     effectivePlaceholder = computed(() => {
         this._zTranslate.currentLang();
         return this.zPlaceholder() || this._zTranslate.instant('i18n_z_ui_editor_placeholder');
-    }, ...(ngDevMode ? [{ debugName: "effectivePlaceholder" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "effectivePlaceholder" }] : /* istanbul ignore next */ []));
     toolbarItems = computed(() => {
         this._selectionVersion();
         const toolbar = this.zToolbar();
@@ -421,7 +469,8 @@ class ZEditorComponent {
             active: this._isToolbarCommandActive(item.id),
             disabled: this._isToolbarCommandDisabled(item.id),
         }));
-    }, ...(ngDevMode ? [{ debugName: "toolbarItems" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "toolbarItems" }] : /* istanbul ignore next */ []));
     floatingToolbarItems = computed(() => {
         this._selectionVersion();
         const itemIds = [
@@ -444,7 +493,8 @@ class ZEditorComponent {
             shortcut: this._toolbarShortcutLabels[item.id] ?? '',
             tooltip: this._getToolbarTooltip(item.id, item.label),
         }));
-    }, ...(ngDevMode ? [{ debugName: "floatingToolbarItems" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "floatingToolbarItems" }] : /* istanbul ignore next */ []));
     _shouldShowValidation = computed(() => {
         const control = this._formControl();
         this._formStateVersion();
@@ -455,7 +505,8 @@ class ZEditorComponent {
             return control.dirty;
         }
         return this.uiState().dirty || this.uiState().touched;
-    }, ...(ngDevMode ? [{ debugName: "_shouldShowValidation" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_shouldShowValidation" }] : /* istanbul ignore next */ []));
     _getValidationErrors() {
         const errors = [];
         const plainText = this._plainText().trim();
@@ -501,7 +552,8 @@ class ZEditorComponent {
             return false;
         }
         return control.invalid && this._shouldShowValidation();
-    }, ...(ngDevMode ? [{ debugName: "hasError" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasError" }] : /* istanbul ignore next */ []));
     errorMessage = computed(() => {
         const customError = this._customError();
         if (customError) {
@@ -531,7 +583,8 @@ class ZEditorComponent {
             });
         }
         return this._zTranslate.instant('i18n_z_ui_editor_invalid');
-    }, ...(ngDevMode ? [{ debugName: "errorMessage" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "errorMessage" }] : /* istanbul ignore next */ []));
     currentStatus = computed(() => {
         if (this.isDisabled()) {
             return 'disabled';
@@ -543,13 +596,16 @@ class ZEditorComponent {
             return 'error';
         }
         return 'default';
-    }, ...(ngDevMode ? [{ debugName: "currentStatus" }] : []));
-    wrapperClasses = computed(() => 'z-editor-wrapper flex w-full flex-col gap-2', ...(ngDevMode ? [{ debugName: "wrapperClasses" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "currentStatus" }] : /* istanbul ignore next */ []));
+    wrapperClasses = computed(() => 'z-editor-wrapper flex w-full flex-col gap-2', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "wrapperClasses" }] : /* istanbul ignore next */ []));
     editorClasses = computed(() => zMergeClasses(zEditorVariants({
         zSize: this.zSize(),
         zStatus: this.currentStatus(),
         zPlaceholderMode: this._placeholderMode(),
-    }), this.class()), ...(ngDevMode ? [{ debugName: "editorClasses" }] : []));
+    }), this.class()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "editorClasses" }] : /* istanbul ignore next */ []));
     constructor() {
         afterNextRender(() => {
             this._createEditor();
@@ -1713,8 +1769,8 @@ class ZEditorComponent {
         const { placeholder } = this.zTipTap();
         return typeof placeholder === 'object' && placeholder.mode === 'firstLine' ? 'firstLine' : 'everyLine';
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: ZEditorComponent, isStandalone: true, selector: "z-editor", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zLabel: { classPropertyName: "zLabel", publicName: "zLabel", isSignal: true, isRequired: false, transformFunction: null }, zLabelClass: { classPropertyName: "zLabelClass", publicName: "zLabelClass", isSignal: true, isRequired: false, transformFunction: null }, zPlaceholder: { classPropertyName: "zPlaceholder", publicName: "zPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, zRequired: { classPropertyName: "zRequired", publicName: "zRequired", isSignal: true, isRequired: false, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null }, zReadonly: { classPropertyName: "zReadonly", publicName: "zReadonly", isSignal: true, isRequired: false, transformFunction: null }, zContentType: { classPropertyName: "zContentType", publicName: "zContentType", isSignal: true, isRequired: false, transformFunction: null }, zToolbar: { classPropertyName: "zToolbar", publicName: "zToolbar", isSignal: true, isRequired: false, transformFunction: null }, zTipTap: { classPropertyName: "zTipTap", publicName: "zTipTap", isSignal: true, isRequired: false, transformFunction: null }, zValidators: { classPropertyName: "zValidators", publicName: "zValidators", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zOnChange: "zOnChange", zOnFocus: "zOnFocus", zOnBlur: "zOnBlur", zControl: "zControl", zEvent: "zEvent" }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: ZEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: ZEditorComponent, isStandalone: true, selector: "z-editor", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, zSize: { classPropertyName: "zSize", publicName: "zSize", isSignal: true, isRequired: false, transformFunction: null }, zLabel: { classPropertyName: "zLabel", publicName: "zLabel", isSignal: true, isRequired: false, transformFunction: null }, zLabelClass: { classPropertyName: "zLabelClass", publicName: "zLabelClass", isSignal: true, isRequired: false, transformFunction: null }, zPlaceholder: { classPropertyName: "zPlaceholder", publicName: "zPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, zRequired: { classPropertyName: "zRequired", publicName: "zRequired", isSignal: true, isRequired: false, transformFunction: null }, zDisabled: { classPropertyName: "zDisabled", publicName: "zDisabled", isSignal: true, isRequired: false, transformFunction: null }, zReadonly: { classPropertyName: "zReadonly", publicName: "zReadonly", isSignal: true, isRequired: false, transformFunction: null }, zContentType: { classPropertyName: "zContentType", publicName: "zContentType", isSignal: true, isRequired: false, transformFunction: null }, zToolbar: { classPropertyName: "zToolbar", publicName: "zToolbar", isSignal: true, isRequired: false, transformFunction: null }, zTipTap: { classPropertyName: "zTipTap", publicName: "zTipTap", isSignal: true, isRequired: false, transformFunction: null }, zValidators: { classPropertyName: "zValidators", publicName: "zValidators", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zOnChange: "zOnChange", zOnFocus: "zOnFocus", zOnBlur: "zOnBlur", zControl: "zControl", zEvent: "zEvent" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => ZEditorComponent),
@@ -1722,7 +1778,7 @@ class ZEditorComponent {
             },
         ], viewQueries: [{ propertyName: "_editorHost", first: true, predicate: ["editorHost"], descendants: true, isSignal: true }, { propertyName: "_floatingToolbar", first: true, predicate: ["floatingToolbar"], descendants: true, isSignal: true }, { propertyName: "_slashMenuTrigger", first: true, predicate: ["slashMenuTrigger"], descendants: true, isSignal: true }, { propertyName: "_linkPopoverTrigger", first: true, predicate: ["linkPopoverTrigger"], descendants: true, isSignal: true }, { propertyName: "_slashMenuScrollHost", first: true, predicate: ["slashMenuScrollHost"], descendants: true, isSignal: true }], exportAs: ["zEditor"], ngImport: i0, template: "<div [class]=\"wrapperClasses()\" [class.z-editor-disabled]=\"isDisabled()\" [class.z-editor-readonly]=\"zReadonly()\">\n  @if (zLabel()) {\n    <label [for]=\"editorId\" class=\"text-xs leading-none font-medium\" [class]=\"zLabelClass()\">\n      {{ zLabel() }}\n      @if (zRequired()) {\n        <span class=\"text-destructive! ml-0.5\">*</span>\n      }\n    </label>\n  }\n\n  <div [class]=\"editorClasses()\">\n    @if (showToolbar()) {\n      <div class=\"z-editor-toolbar\" role=\"toolbar\" [attr.aria-controls]=\"editorId\">\n        @for (item of toolbarItems(); track item.id) {\n          @switch (item.id) {\n            @case ('emoji') {\n              <button\n                type=\"button\"\n                class=\"z-editor-toolbar-button\"\n                z-popover\n                [zPopoverContent]=\"emojiPopover\"\n                zPosition=\"bottom-left\"\n                zTrigger=\"click\"\n                zClass=\"z-editor-emoji-popover\"\n                (zControl)=\"onEmojiPopoverControl($event)\"\n                (zShow)=\"onEmojiPopoverShow()\"\n                [disabled]=\"item.disabled\"\n                [attr.aria-label]=\"item.label\"\n                [attr.title]=\"item.label\">\n                <i z-icon [zType]=\"item.icon\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n              </button>\n            }\n            @case ('blockStyle') {\n              <button\n                type=\"button\"\n                class=\"z-editor-toolbar-button\"\n                z-popover\n                [zPopoverContent]=\"blockStylePopover\"\n                zPosition=\"bottom-left\"\n                zTrigger=\"click\"\n                zClass=\"z-editor-menu-popover\"\n                (zControl)=\"onBlockStylePopoverControl($event)\"\n                (zHideStart)=\"onFloatingPopoverHide()\"\n                [disabled]=\"item.disabled\"\n                [attr.aria-label]=\"item.label\"\n                [attr.title]=\"item.label\">\n                <i z-icon [zType]=\"item.icon\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n              </button>\n            }\n            @case ('textColor') {\n              @let textColor = activeTextColor();\n              <button\n                type=\"button\"\n                class=\"z-editor-toolbar-button\"\n                z-popover\n                [zPopoverContent]=\"textColorPopover\"\n                zPosition=\"bottom-left\"\n                zTrigger=\"click\"\n                zClass=\"z-editor-color-popover\"\n                (zControl)=\"onTextColorPopoverControl($event)\"\n                (zHideStart)=\"onFloatingPopoverHide()\"\n                [disabled]=\"item.disabled\"\n                [attr.aria-label]=\"item.label\"\n                [attr.title]=\"item.label\">\n                <i z-icon [zType]=\"item.icon\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n                <span class=\"z-editor-color-indicator\" [style.background]=\"textColor\"></span>\n              </button>\n            }\n            @case ('backgroundColor') {\n              @let bgColor = activeBackgroundColor();\n              <button\n                type=\"button\"\n                class=\"z-editor-toolbar-button\"\n                z-popover\n                [zPopoverContent]=\"backgroundColorPopover\"\n                zPosition=\"bottom-left\"\n                zTrigger=\"click\"\n                zClass=\"z-editor-color-popover\"\n                (zControl)=\"onBackgroundColorPopoverControl($event)\"\n                (zHideStart)=\"onFloatingPopoverHide()\"\n                [disabled]=\"item.disabled\"\n                [attr.aria-label]=\"item.label\"\n                [attr.title]=\"item.label\">\n                <i z-icon [zType]=\"item.icon\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n                <span class=\"z-editor-color-indicator\" [style.background]=\"bgColor\"></span>\n              </button>\n            }\n            @case ('align') {\n              <button\n                type=\"button\"\n                class=\"z-editor-toolbar-button\"\n                z-popover\n                [zPopoverContent]=\"alignPopover\"\n                zPosition=\"bottom-left\"\n                zTrigger=\"click\"\n                zClass=\"z-editor-menu-popover\"\n                (zControl)=\"onAlignPopoverControl($event)\"\n                (zHideStart)=\"onFloatingPopoverHide()\"\n                [disabled]=\"item.disabled\"\n                [attr.aria-label]=\"item.label\"\n                [attr.title]=\"item.label\">\n                <i z-icon [zType]=\"activeAlignIcon()\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n              </button>\n            }\n            @default {\n              <button\n                type=\"button\"\n                class=\"z-editor-toolbar-button\"\n                [class.z-editor-toolbar-button-active]=\"item.active\"\n                [disabled]=\"item.disabled\"\n                [attr.aria-label]=\"item.label\"\n                [attr.title]=\"item.label\"\n                (click)=\"onToolbarClick(item.id)\">\n                <i z-icon [zType]=\"item.icon\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n              </button>\n            }\n          }\n        }\n      </div>\n    }\n\n    <div\n      #editorHost\n      [id]=\"editorId\"\n      class=\"z-editor-content\"\n      role=\"textbox\"\n      [attr.aria-multiline]=\"true\"\n      [attr.aria-readonly]=\"isDisabled() || zReadonly()\"></div>\n  </div>\n\n  @if (hasError()) {\n    <p class=\"text-destructive animate-in fade-in slide-in-from-top-1 m-0 text-xs duration-200\">\n      {{ errorMessage() }}\n    </p>\n  }\n\n  <ng-template #emojiPopover>\n    @let emojiCategoryLabel =\n      emojiSearchQuery() ? ('i18n_z_ui_emoji_search_results' | translate) : (activeEmojiCategoryLabel() | translate);\n    @let activeCategoryId = activeEmojiCategoryId();\n    <div class=\"z-editor-emoji-sheet\">\n      <div class=\"z-editor-emoji-header\">\n        <div class=\"z-editor-emoji-title mb-1\">\n          <span class=\"z-editor-emoji-title-dot\" aria-hidden=\"true\"></span>\n          <span>{{ emojiCategoryLabel }}</span>\n        </div>\n        <z-input\n          class=\"z-editor-emoji-search\"\n          zSize=\"sm\"\n          [zSearch]=\"true\"\n          [zDebounce]=\"150\"\n          [zPlaceholder]=\"'i18n_z_ui_emoji_search_placeholder' | translate\"\n          [ngModel]=\"emojiSearch()\"\n          (zOnSearch)=\"emojiSearch.set($any($event))\" />\n      </div>\n      <div class=\"z-editor-emoji-body\">\n        @if (hasEmojiResults()) {\n          <div class=\"z-editor-emoji-grid\">\n            @for (emoji of activeEmojis(); track emoji) {\n              <button\n                type=\"button\"\n                class=\"z-editor-emoji-button\"\n                [attr.aria-label]=\"emoji\"\n                (click)=\"insertEmoji($any(emoji))\">\n                {{ emoji }}\n              </button>\n            }\n          </div>\n        } @else {\n          <div class=\"z-editor-emoji-empty\">\n            <span class=\"z-editor-emoji-empty-icon\" aria-hidden=\"true\">\n              <i z-icon zType=\"lucideSearchX\" zSize=\"14\" [zStrokeWidth]=\"2\"></i>\n            </span>\n            <span>{{ 'i18n_z_ui_emoji_no_results' | translate }}</span>\n          </div>\n        }\n      </div>\n      <div class=\"z-editor-emoji-footer\" role=\"tablist\">\n        @for (category of emojiCategories; track category.id) {\n          <button\n            type=\"button\"\n            role=\"tab\"\n            class=\"z-editor-emoji-footer-button cursor-pointer!\"\n            [class.z-editor-emoji-footer-button-active]=\"category.id === activeCategoryId\"\n            [attr.aria-label]=\"category.labelKey | translate\"\n            [attr.aria-selected]=\"category.id === activeCategoryId\"\n            [attr.title]=\"category.labelKey | translate\"\n            (click)=\"setEmojiCategory(category.id)\">\n            <i z-icon [zType]=\"category.icon\" zSize=\"15\" [zStrokeWidth]=\"2\"></i>\n          </button>\n        }\n      </div>\n    </div>\n  </ng-template>\n\n  <ng-template #blockStylePopover let-close=\"close\">\n    <div class=\"z-editor-menu-list\">\n      @for (option of blockStyleOptions; track option.command) {\n        <button\n          type=\"button\"\n          class=\"z-editor-menu-item\"\n          [class.z-editor-menu-item-active]=\"activeBlockStyle() === option.command\"\n          (mousedown)=\"$event.preventDefault()\"\n          (click)=\"applyBlockStyle(option.command, close)\">\n          <i z-icon [zType]=\"option.icon\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n          <span>{{ option.label }}</span>\n        </button>\n      }\n    </div>\n  </ng-template>\n\n  <ng-template #alignPopover let-close=\"close\">\n    <div class=\"z-editor-menu-list\">\n      @for (option of alignOptions; track option.command) {\n        <button\n          type=\"button\"\n          class=\"z-editor-menu-item\"\n          [class.z-editor-menu-item-active]=\"activeAlign() === option.command\"\n          (mousedown)=\"$event.preventDefault()\"\n          (click)=\"applyAlign(option.command, close)\">\n          <i z-icon [zType]=\"option.icon\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n          <span>{{ option.label }}</span>\n        </button>\n      }\n    </div>\n  </ng-template>\n\n  <ng-template #textColorPopover let-close=\"close\">\n    @let currentTextColor = activeTextColor();\n    <div class=\"z-editor-color-grid\">\n      @for (color of textColorSwatches; track color) {\n        <button\n          type=\"button\"\n          class=\"z-editor-color-swatch\"\n          [class.z-editor-color-swatch-active]=\"currentTextColor === color\"\n          [style.background]=\"color\"\n          [attr.aria-label]=\"'Text color ' + color\"\n          (mousedown)=\"$event.preventDefault()\"\n          (click)=\"setTextColor(color, close)\"></button>\n      }\n      <label class=\"z-editor-color-custom\">\n        <input type=\"color\" [value]=\"currentTextColor\" (input)=\"setTextColorFromEvent($event, close)\" />\n        {{ currentTextColor }}\n      </label>\n      <button\n        type=\"button\"\n        z-button\n        zType=\"outline\"\n        zSize=\"sm\"\n        class=\"z-editor-color-reset\"\n        (mousedown)=\"$event.preventDefault()\"\n        (click)=\"unsetTextColor(close)\">\n        Reset\n      </button>\n    </div>\n  </ng-template>\n\n  <ng-template #backgroundColorPopover let-close=\"close\">\n    @let currentBgColor = activeBackgroundColor();\n    <div class=\"z-editor-color-grid\">\n      @for (color of backgroundColorSwatches; track color) {\n        <button\n          type=\"button\"\n          class=\"z-editor-color-swatch\"\n          [class.z-editor-color-swatch-active]=\"currentBgColor === color\"\n          [style.background]=\"color\"\n          [attr.aria-label]=\"'Background color ' + color\"\n          (mousedown)=\"$event.preventDefault()\"\n          (click)=\"setBackgroundColor(color, close)\"></button>\n      }\n      <label class=\"z-editor-color-custom\">\n        <input type=\"color\" [value]=\"currentBgColor\" (input)=\"setBackgroundColorFromEvent($event, close)\" />\n        {{ currentBgColor }}\n      </label>\n      <button\n        type=\"button\"\n        z-button\n        zType=\"outline\"\n        zSize=\"sm\"\n        class=\"z-editor-color-reset\"\n        (mousedown)=\"$event.preventDefault()\"\n        (click)=\"unsetBackgroundColor(close)\">\n        Reset\n      </button>\n    </div>\n  </ng-template>\n\n  <div #floatingToolbar class=\"z-editor-floating-toolbar\" role=\"toolbar\" [attr.aria-controls]=\"editorId\">\n    @for (item of floatingToolbarItems(); track item.id) {\n      @switch (item.id) {\n        @case ('blockStyle') {\n          <button\n            type=\"button\"\n            class=\"z-editor-toolbar-button\"\n            z-popover\n            [zPopoverContent]=\"blockStylePopover\"\n            zPosition=\"bottom-left\"\n            zTrigger=\"click\"\n            zClass=\"z-editor-menu-popover\"\n            (zControl)=\"onBlockStylePopoverControl($event)\"\n            (zHideStart)=\"onFloatingPopoverHide()\"\n            [disabled]=\"item.disabled\"\n            [attr.aria-label]=\"item.label\"\n            [attr.title]=\"activeBlockStyleLabel()\"\n            (mousedown)=\"$event.preventDefault()\">\n            <i z-icon [zType]=\"item.icon\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n          </button>\n        }\n        @case ('textColor') {\n          @let textColor = activeTextColor();\n          <button\n            type=\"button\"\n            class=\"z-editor-toolbar-button\"\n            z-popover\n            [zPopoverContent]=\"textColorPopover\"\n            zPosition=\"bottom-left\"\n            zTrigger=\"click\"\n            zClass=\"z-editor-color-popover\"\n            (zControl)=\"onTextColorPopoverControl($event)\"\n            (zHideStart)=\"onFloatingPopoverHide()\"\n            [disabled]=\"item.disabled\"\n            [attr.aria-label]=\"item.label\"\n            [attr.title]=\"item.label\"\n            (mousedown)=\"$event.preventDefault()\">\n            <i z-icon [zType]=\"item.icon\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n            <span class=\"z-editor-color-indicator\" [style.background]=\"textColor\"></span>\n          </button>\n        }\n        @case ('backgroundColor') {\n          @let bgColor = activeBackgroundColor();\n          <button\n            type=\"button\"\n            class=\"z-editor-toolbar-button\"\n            z-popover\n            [zPopoverContent]=\"backgroundColorPopover\"\n            zPosition=\"bottom-left\"\n            zTrigger=\"click\"\n            zClass=\"z-editor-color-popover\"\n            (zControl)=\"onBackgroundColorPopoverControl($event)\"\n            (zHideStart)=\"onFloatingPopoverHide()\"\n            [disabled]=\"item.disabled\"\n            [attr.aria-label]=\"item.label\"\n            [attr.title]=\"item.label\"\n            (mousedown)=\"$event.preventDefault()\">\n            <i z-icon [zType]=\"item.icon\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n            <span class=\"z-editor-color-indicator\" [style.background]=\"bgColor\"></span>\n          </button>\n        }\n        @case ('align') {\n          <button\n            type=\"button\"\n            class=\"z-editor-toolbar-button\"\n            z-popover\n            [zPopoverContent]=\"alignPopover\"\n            zPosition=\"bottom-left\"\n            zTrigger=\"click\"\n            zClass=\"z-editor-menu-popover\"\n            (zControl)=\"onAlignPopoverControl($event)\"\n            (zHideStart)=\"onFloatingPopoverHide()\"\n            [disabled]=\"item.disabled\"\n            [attr.aria-label]=\"item.label\"\n            [attr.title]=\"activeAlignLabel()\"\n            (mousedown)=\"$event.preventDefault()\">\n            <i z-icon [zType]=\"activeAlignIcon()\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n          </button>\n        }\n        @default {\n          <button\n            type=\"button\"\n            class=\"z-editor-toolbar-button\"\n            z-tooltip\n            [zContent]=\"item.tooltip\"\n            zPosition=\"top\"\n            [zAlwaysShow]=\"true\"\n            [zDisabled]=\"item.disabled || !item.shortcut\"\n            [class.z-editor-toolbar-button-active]=\"item.active\"\n            [disabled]=\"item.disabled\"\n            [attr.aria-label]=\"item.label\"\n            [attr.title]=\"item.label\"\n            (mousedown)=\"$event.preventDefault()\"\n            (click)=\"onFloatingToolbarClick(item.id)\">\n            <i z-icon [zType]=\"item.icon\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n          </button>\n        }\n      }\n    }\n  </div>\n\n  <span\n    #slashMenuTrigger\n    class=\"z-editor-slash-menu-trigger\"\n    z-popover\n    [zPopoverContent]=\"slashMenuPopover\"\n    zTrigger=\"manual\"\n    zPosition=\"bottom-left\"\n    zClass=\"z-editor-slash-popover\"\n    [zOffset]=\"4\"\n    [zPopoverWidth]=\"300\"\n    [style.left.px]=\"slashMenuState().left\"\n    [style.top.px]=\"slashMenuState().top\"\n    (zControl)=\"onSlashMenuPopoverControl($event)\"\n    (zHide)=\"onSlashMenuPopoverHide()\"></span>\n\n  <ng-template #slashMenuPopover>\n    @let slashActiveIndex = slashMenuActiveIndex();\n    <div class=\"z-editor-slash-menu-shell\">\n      <div #slashMenuScrollHost class=\"z-editor-slash-menu-scrollbar\">\n        <div class=\"z-editor-slash-menu\" role=\"listbox\" [attr.aria-controls]=\"editorId\">\n          @for (item of filteredSlashCommands(); track item.id) {\n            @if (item.showGroupLabel) {\n              <div class=\"z-editor-slash-menu-group\">\n                {{ item.group }}\n              </div>\n            }\n            <button\n              type=\"button\"\n              class=\"z-editor-slash-menu-item\"\n              role=\"option\"\n              [class.z-editor-slash-menu-item-active]=\"$index === slashActiveIndex\"\n              [attr.aria-selected]=\"$index === slashActiveIndex\"\n              (mousedown)=\"$event.preventDefault()\"\n              (click)=\"applySlashCommand(item)\">\n              <i z-icon [zType]=\"item.icon\" zSize=\"16\" [zStrokeWidth]=\"2.5\"></i>\n              <span class=\"z-editor-slash-menu-copy\">\n                <span class=\"z-editor-slash-menu-label\">{{ item.label }}</span>\n              </span>\n            </button>\n          } @empty {\n            <div class=\"z-editor-slash-menu-empty\">\n              <i z-icon zType=\"lucideSearchX\" zSize=\"28\" [zStrokeWidth]=\"1.8\"></i>\n              <span>{{ 'i18n_z_ui_editor_no_commands' | translate }}</span>\n            </div>\n          }\n        </div>\n      </div>\n      <div class=\"z-editor-slash-menu-footer\" aria-hidden=\"true\">\n        <span>\n          <kbd>\u2191\u2193</kbd>\n          {{ 'i18n_z_ui_editor_shortcut_navigate' | translate }}\n        </span>\n        <span>\n          <kbd>Esc</kbd>\n          {{ 'i18n_z_ui_editor_shortcut_abort' | translate }}\n        </span>\n        <span>\n          <kbd>\u21B5</kbd>\n          {{ 'i18n_z_ui_editor_shortcut_select' | translate }}\n        </span>\n      </div>\n    </div>\n  </ng-template>\n\n  <span\n    #linkPopoverTrigger\n    class=\"z-editor-link-popover-trigger\"\n    z-popover\n    [zPopoverContent]=\"linkPopover\"\n    zTrigger=\"manual\"\n    zPosition=\"bottom-left\"\n    zClass=\"z-editor-link-popover\"\n    [zOffset]=\"6\"\n    [zPopoverWidth]=\"320\"\n    [style.left.px]=\"linkPopoverState().left\"\n    [style.top.px]=\"linkPopoverState().top\"\n    [style.width.px]=\"linkPopoverState().width\"\n    [style.height.px]=\"linkPopoverState().height\"\n    (zControl)=\"onLinkPopoverControl($event)\"\n    (zHide)=\"onLinkPopoverHide()\"></span>\n\n  <ng-template #linkPopover>\n    <div class=\"z-editor-link-popover-content\">\n      <ng-template #linkPrefix>\n        <z-icon zType=\"lucideLink\" zSize=\"16\" class=\"text-muted-foreground\" />\n      </ng-template>\n      <z-input\n        zType=\"url\"\n        zSize=\"sm\"\n        class=\"z-editor-link-popover-input\"\n        [zPrefix]=\"linkPrefix\"\n        zPlaceholder=\"https://example.com\"\n        [zValidators]=\"linkValidators\"\n        [ngModel]=\"linkUrl()\"\n        (ngModelChange)=\"onLinkUrlChange($event)\"\n        (zOnEnter)=\"applyLink()\" />\n      <div class=\"z-editor-link-popover-actions\">\n        <button\n          type=\"button\"\n          z-button\n          zType=\"ghost\"\n          zSize=\"sm\"\n          [zDisabled]=\"!canApplyLink()\"\n          (click)=\"applyLink()\"\n          aria-label=\"Apply link\">\n          <z-icon zType=\"lucideCheck\" zSize=\"16\" [zStrokeWidth]=\"2.5\" />\n        </button>\n        <button\n          type=\"button\"\n          z-button\n          zType=\"ghost\"\n          zSize=\"sm\"\n          [zDisabled]=\"!activeLinkHref()\"\n          (click)=\"openActiveLink()\"\n          aria-label=\"Open link\">\n          <z-icon zType=\"lucideExternalLink\" zSize=\"16\" [zStrokeWidth]=\"2.5\" />\n        </button>\n        <button\n          type=\"button\"\n          z-button\n          zType=\"ghost-destructive\"\n          zSize=\"sm\"\n          [zDisabled]=\"!activeLinkHref()\"\n          (click)=\"removeLink()\"\n          aria-label=\"Remove link\">\n          <z-icon zType=\"lucideUnlink\" zSize=\"16\" [zStrokeWidth]=\"2.5\" />\n        </button>\n      </div>\n    </div>\n  </ng-template>\n</div>\n", styles: [".z-editor-wrapper .z-editor-toolbar{display:flex;flex-wrap:wrap;gap:.125rem;align-items:center;border-bottom:.0625rem solid var(--border);border-top-left-radius:.375rem;border-top-right-radius:.375rem;background-color:color-mix(in srgb,var(--muted) 30%,transparent);padding:.5rem}.z-editor-wrapper .z-editor-toolbar-button{position:relative;display:inline-flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border-radius:.25rem;padding:0;color:var(--muted-foreground);transition:background-color .15s ease,color .15s ease,opacity .15s ease}.z-editor-wrapper .z-editor-toolbar-button:hover:not(:disabled){background-color:var(--accent);color:var(--foreground)}.z-editor-wrapper .z-editor-toolbar-button:disabled{cursor:not-allowed;opacity:.45}.z-editor-wrapper .z-editor-toolbar-button.z-editor-toolbar-button-active{background-color:color-mix(in srgb,var(--primary) 10%,transparent);color:var(--primary)}.z-editor-wrapper .z-editor-content{position:relative;border-bottom-right-radius:.375rem;border-bottom-left-radius:.375rem}.z-editor-wrapper .z-editor-prosemirror{width:100%;outline:none;padding:.75rem;color:var(--foreground)}.z-editor-wrapper .z-editor-prosemirror>*{margin-top:1.25rem;margin-bottom:1.25rem}.z-editor-wrapper .z-editor-prosemirror>:first-child{margin-top:0}.z-editor-wrapper .z-editor-prosemirror>:last-child{margin-bottom:0}.z-editor-wrapper .z-editor-prosemirror p{line-height:1.75}.z-editor-wrapper .z-editor-prosemirror a{color:var(--primary);font-weight:500;text-decoration-line:underline;text-decoration-color:currentcolor;text-decoration-thickness:.0625rem;text-underline-offset:.1875rem;cursor:pointer;transition:text-decoration-color .15s ease}.z-editor-wrapper .z-editor-prosemirror a:hover{text-decoration-color:color-mix(in srgb,currentcolor 70%,transparent)}.z-editor-wrapper .z-editor-prosemirror .mention{color:var(--primary);font-weight:500}.z-editor-wrapper .z-editor-prosemirror :is(h1,h2,h3,h4,h5,h6){color:var(--foreground);font-weight:700;line-height:1.2}.z-editor-wrapper .z-editor-prosemirror h1{font-size:1.875rem}.z-editor-wrapper .z-editor-prosemirror h2{font-size:1.5rem}.z-editor-wrapper .z-editor-prosemirror h3{font-size:1.25rem}.z-editor-wrapper .z-editor-prosemirror h4{font-size:1.125rem}.z-editor-wrapper .z-editor-prosemirror h5,.z-editor-wrapper .z-editor-prosemirror h6{font-size:1rem}.z-editor-wrapper .z-editor-prosemirror blockquote{border-left:.25rem solid var(--border);padding-left:1rem;font-style:italic;color:var(--muted-foreground)}.z-editor-wrapper .z-editor-prosemirror [data-type=horizontalRule]{margin-top:2rem;margin-bottom:2rem;padding-top:.5rem;padding-bottom:.5rem}.z-editor-wrapper .z-editor-prosemirror hr{border:0;border-top:.0625rem solid var(--border)}.z-editor-wrapper .z-editor-prosemirror pre{overflow-x:auto;border:.0625rem solid var(--border);border-radius:.375rem;background-color:var(--muted);padding:.75rem 1rem;font-size:.875rem;line-height:1.5;white-space:pre-wrap;word-break:break-word}.z-editor-wrapper .z-editor-prosemirror pre code{display:inline;border:0;border-radius:0;background-color:transparent;padding:0;color:inherit;font:inherit}.z-editor-wrapper .z-editor-prosemirror code{display:inline-block;border:.0625rem solid var(--border);border-radius:.375rem;background-color:var(--muted);padding:.125rem .375rem;color:var(--foreground);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.875em;font-weight:500}.z-editor-wrapper .z-editor-prosemirror :is(ul,ol){padding-left:1.5rem}.z-editor-wrapper .z-editor-prosemirror ul{list-style:disc}.z-editor-wrapper .z-editor-prosemirror ol{list-style:decimal}.z-editor-wrapper .z-editor-prosemirror li{margin-top:.375rem;margin-bottom:.375rem;padding-left:.375rem}.z-editor-wrapper .z-editor-prosemirror img{display:block;max-width:100%;border-radius:.375rem}.z-editor-wrapper .z-editor-prosemirror img[data-text-align=center]{margin-right:auto;margin-left:auto}.z-editor-wrapper .z-editor-prosemirror img[data-text-align=right]{margin-right:0;margin-left:auto}.z-editor-wrapper .z-editor-prosemirror img[data-text-align=left],.z-editor-wrapper .z-editor-prosemirror img[data-text-align=justify]{margin-right:auto;margin-left:0}.z-editor-wrapper .z-editor-prosemirror img.ProseMirror-selectednode{outline:.125rem solid var(--primary)}.z-editor-wrapper .z-editor-prosemirror .image-resizer{display:inline-flex;position:relative;flex-grow:0}.z-editor-wrapper .z-editor-prosemirror .image-resizer .resize-trigger{position:absolute;right:-6px;bottom:-9px;width:12px;height:12px;cursor:nwse-resize;border-radius:50%;background-color:var(--primary);opacity:0;transition:opacity .2s ease}.z-editor-wrapper .z-editor-prosemirror .image-resizer:hover .resize-trigger{opacity:1}.z-editor-wrapper .z-editor-prosemirror .image-resizer .image-alignment{display:flex;gap:4px;position:absolute;top:-32px;left:0;padding:4px;border-radius:6px;background-color:var(--popover);box-shadow:0 2px 8px #00000026;opacity:0;transition:opacity .2s ease;pointer-events:none}.z-editor-wrapper .z-editor-prosemirror .image-resizer:hover .image-alignment{opacity:1;pointer-events:auto}.z-editor-wrapper .z-editor-prosemirror .ProseMirror-selectednode:not(img):not(pre):not([data-node-view-wrapper]){background-color:color-mix(in srgb,var(--primary) 20%,transparent)}.z-editor-wrapper .z-editor-prosemirror :is(p,h1,h2,h3,h4,h5,h6).is-empty:before{float:left;height:0;color:var(--muted-foreground);content:attr(data-placeholder);pointer-events:none}.z-editor-placeholder-first-line .z-editor-wrapper .z-editor-prosemirror :is(p,h1,h2,h3,h4,h5,h6).is-empty:before{content:none}.z-editor-placeholder-first-line .z-editor-wrapper .z-editor-prosemirror :is(p,h1,h2,h3,h4,h5,h6).is-editor-empty:first-child:before{content:attr(data-placeholder)}.z-editor-wrapper.z-editor-disabled .z-editor-toolbar,.z-editor-wrapper.z-editor-disabled .z-editor-content{pointer-events:none}.z-editor-wrapper.z-editor-readonly .z-editor-toolbar{display:none}.z-editor-wrapper.z-editor-readonly .z-editor-content{border-radius:.375rem}.z-editor-wrapper.z-editor-readonly .z-editor-prosemirror{cursor:default}.z-editor-link-modal{padding-top:0;padding-bottom:0}.z-editor-link-modal .z-modal-scrollbar main{min-height:0;padding:1rem}.z-editor-emoji-popover{padding:0;overflow:hidden;box-shadow:0 .5rem 1.5rem -.25rem #0000002e,0 .25rem .5rem -.125rem #0000001a}.z-editor-color-popover{padding:.5rem}.z-editor-menu-popover{padding:.25rem}.z-editor-menu-list{display:flex;min-width:9rem;flex-direction:column;gap:.125rem}.z-editor-menu-item{display:flex;width:100%;cursor:pointer;align-items:center;gap:.5rem;border-radius:.25rem;padding:.375rem .5rem;color:var(--muted-foreground);font-size:.8125rem;line-height:1.25;transition:background-color .15s ease,color .15s ease}.z-editor-menu-item:hover,.z-editor-menu-item.z-editor-menu-item-active{background-color:var(--accent);color:var(--foreground)}.z-editor-color-indicator{position:absolute;right:.25rem;bottom:.1875rem;width:.75rem;height:.1875rem;border-radius:999px;box-shadow:0 0 0 .0625rem var(--border)}.z-editor-color-grid{display:grid;grid-template-columns:repeat(5,1.625rem);gap:.25rem}.z-editor-color-swatch{width:1.625rem;height:1.625rem;border:.0625rem solid var(--border);border-radius:.25rem;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}.z-editor-color-swatch:hover{transform:translateY(-.0625rem);border-color:var(--ring)}.z-editor-color-swatch.z-editor-color-swatch-active{border-color:var(--primary);box-shadow:0 0 0 .125rem color-mix(in srgb,var(--primary) 20%,transparent)}.z-editor-color-custom{grid-column:1/-1;display:flex;height:1.875rem;cursor:pointer;align-items:center;gap:.5rem;border:.0625rem solid var(--border);border-radius:.25rem;padding:.25rem .5rem;color:var(--muted-foreground);font-size:.75rem;transition:border-color .15s ease,background-color .15s ease,color .15s ease}.z-editor-color-custom input{width:1.375rem;height:1.375rem;flex:none;cursor:pointer;border:0;padding:0;background:transparent}.z-editor-color-custom:hover{border-color:var(--ring);background-color:var(--accent);color:var(--foreground)}.z-editor-color-reset{grid-column:1/-1;width:100%;justify-content:center}.z-editor-floating-toolbar{display:inline-flex;align-items:center;gap:.125rem;border:.0625rem solid var(--border);border-radius:.25rem;background-color:var(--popover);padding:.375rem;box-shadow:0 .625rem 1.5rem -.75rem #00000059,0 .25rem .75rem -.5rem #0003;visibility:hidden;opacity:0;position:fixed;top:-10000px;left:-10000px;scale:.98;translate:0 .25rem;transform-origin:top left;transition:opacity .12s ease,visibility .12s ease,scale .16s ease,translate .16s ease}.z-editor-floating-toolbar[style*=\"visibility: visible\"]{animation:z-editor-floating-toolbar-in .16s cubic-bezier(.16,1,.3,1);scale:1;translate:0 0}@keyframes z-editor-floating-toolbar-in{0%{opacity:0;scale:.96;translate:0 .375rem}to{opacity:1;scale:1;translate:0 0}}.z-editor-slash-menu-trigger,.z-editor-link-popover-trigger{position:fixed;z-index:-1;width:.0625rem;height:.0625rem;pointer-events:none}.z-editor-link-popover{padding:.5rem}.z-editor-link-popover-content{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;column-gap:.5rem}.z-editor-link-popover-input{flex:1;min-width:0}.z-editor-link-popover-actions{display:inline-flex;align-self:start;align-items:center;gap:.125rem}.z-editor-slash-popover{box-sizing:border-box;padding:0;overflow:hidden}.z-editor-slash-menu-shell{box-sizing:border-box;display:flex;min-width:0;height:min(16rem,100vh - 4rem);flex-direction:column}.z-editor-slash-menu-scrollbar{box-sizing:border-box;display:block;min-width:0;min-height:0;flex:1;overflow-x:hidden;overflow-y:scroll;overscroll-behavior:contain}.z-editor-slash-menu{box-sizing:border-box;display:flex;min-width:0;min-height:100%;flex-direction:column;padding:.2rem;gap:.2rem;color:var(--popover-foreground)}.z-editor-slash-menu-group{margin:.25rem 0 .125rem;border-top:.0625rem solid var(--border);padding:.5rem .5rem .1875rem;color:var(--muted-foreground);font-size:.6875rem;font-weight:600;line-height:1;text-transform:uppercase}.z-editor-slash-menu-group:first-child{margin-top:0;border-top:0;padding-top:.5rem}.z-editor-slash-menu-item{box-sizing:border-box;display:flex;align-self:stretch;min-width:0;cursor:pointer;align-items:center;gap:.5rem;border-radius:.25rem;padding:.375rem .75rem;text-align:left;transition:background-color .15s ease,color .15s ease}.z-editor-slash-menu-item i{color:var(--muted-foreground);flex:none}.z-editor-slash-menu-item:hover,.z-editor-slash-menu-item.z-editor-slash-menu-item-active{background-color:var(--accent);color:var(--foreground)}.z-editor-slash-menu-copy{display:flex;min-width:0;align-items:center}.z-editor-slash-menu-label{color:var(--foreground);font-size:.8125rem;font-weight:500;line-height:1.2}.z-editor-slash-menu-empty{box-sizing:border-box;display:flex;align-self:stretch;max-width:100%;min-width:0;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:.625rem;padding:1rem;color:var(--muted-foreground);font-size:.8125rem;line-height:1.15;text-align:center}.z-editor-slash-menu-empty i{color:var(--muted-foreground);flex:none}.z-editor-slash-menu-footer{box-sizing:border-box;display:flex;min-width:0;flex:none;align-items:center;gap:.75rem;border-top:.0625rem solid var(--border);padding:.375rem .625rem;color:var(--popover-foreground);font-size:.75rem;font-weight:500;line-height:1;white-space:nowrap}.z-editor-slash-menu-footer span{display:inline-flex;align-items:center;gap:.25rem}.z-editor-slash-menu-footer kbd{color:var(--foreground);font:inherit}.z-editor-emoji-sheet{display:flex;width:18rem;max-width:85vw;height:20rem;max-height:70vh;flex-direction:column;overflow:hidden;background-color:var(--popover);color:var(--popover-foreground)}.z-editor-emoji-header{display:flex;flex-direction:column;gap:.5rem;padding:.75rem .75rem .625rem;flex:none}.z-editor-emoji-title{display:flex;align-items:center;gap:.375rem;padding-inline:.25rem;color:var(--foreground);font-size:.8125rem;font-weight:600;line-height:1;letter-spacing:-.005em}.z-editor-emoji-title-dot{display:inline-block;width:.375rem;height:.375rem;border-radius:999px;background-color:var(--primary);box-shadow:0 0 0 .1875rem color-mix(in srgb,var(--primary) 18%,transparent)}.z-editor-emoji-search{width:100%}.z-editor-emoji-body{flex:1 1 0;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--muted-foreground) 30%,transparent) transparent}.z-editor-emoji-body::-webkit-scrollbar{width:.375rem}.z-editor-emoji-body::-webkit-scrollbar-track{background:transparent}.z-editor-emoji-body::-webkit-scrollbar-thumb{border-radius:999px;background-color:color-mix(in srgb,var(--muted-foreground) 30%,transparent)}.z-editor-emoji-body::-webkit-scrollbar-thumb:hover{background-color:color-mix(in srgb,var(--muted-foreground) 55%,transparent)}.z-editor-emoji-grid{display:grid;grid-template-columns:repeat(8,1.875rem);justify-content:center;gap:.125rem;padding:.25rem .5rem .5rem}.z-editor-emoji-empty{display:flex;height:100%;min-height:10rem;flex-direction:column;align-items:center;justify-content:center;gap:.375rem;padding:1.5rem .75rem;color:var(--muted-foreground);font-size:.8125rem;text-align:center}.z-editor-emoji-empty-icon{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:999px;background-color:color-mix(in srgb,var(--muted) 70%,transparent);color:var(--muted-foreground)}.z-editor-emoji-button{display:inline-flex;align-items:center;justify-content:center;width:1.875rem;height:1.875rem;border-radius:.4375rem;font-family:\"Noto Color Emoji\",\"Apple Color Emoji\",\"Segoe UI Emoji\",Twemoji Mozilla,EmojiOne Color,\"Android Emoji\",sans-serif;font-size:1.1875rem;line-height:1;transition:background-color .12s ease,box-shadow .12s ease}.z-editor-emoji-button:hover{background-color:color-mix(in srgb,var(--accent) 80%,transparent);box-shadow:0 0 0 .0625rem color-mix(in srgb,var(--ring) 35%,transparent)}.z-editor-emoji-button:active{background-color:color-mix(in srgb,var(--primary) 18%,transparent);box-shadow:0 0 0 .0625rem color-mix(in srgb,var(--primary) 45%,transparent)}.z-editor-emoji-footer{position:relative;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));align-items:center;border-top:.0625rem solid color-mix(in srgb,var(--border) 70%,transparent);padding:.25rem;background-color:color-mix(in srgb,var(--muted) 35%,transparent);flex:none}.z-editor-emoji-footer-button{position:relative;display:inline-flex;align-items:center;justify-content:center;height:1.875rem;border-radius:.4375rem;color:var(--muted-foreground);transition:color .15s ease,background-color .15s ease}.z-editor-emoji-footer-button:after{content:\"\";position:absolute;bottom:.0625rem;left:50%;width:0;height:.125rem;border-radius:999px;background-color:var(--primary);transition:width .2s ease,transform .2s ease;transform:translate(-50%)}.z-editor-emoji-footer-button:hover{color:var(--foreground);background-color:color-mix(in srgb,var(--accent) 60%,transparent)}.z-editor-emoji-footer-button.z-editor-emoji-footer-button-active{color:var(--primary)}.z-editor-emoji-footer-button.z-editor-emoji-footer-button-active:after{width:.875rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { 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"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: ZButtonComponent, selector: "z-button, button[z-button], a[z-button]", inputs: ["class", "zType", "zSize", "zShape", "zLabel", "zLoading", "zDisabled", "zTypeIcon", "zAnimatedTypeIcon", "zAnimateIcon", "zAnimationTriggerIcon", "zSizeIcon", "zStrokeWidthIcon", "zWave"], exportAs: ["zButton"] }, { kind: "component", type: ZIconComponent, selector: "z-icon, [z-icon]", inputs: ["class", "zType", "zAnimatedType", "zAnimate", "zAnimationTrigger", "zSize", "zStrokeWidth", "zSvg"] }, { kind: "component", type: ZInputComponent, selector: "z-input", inputs: ["class", "zType", "zSize", "zAlign", "zLabel", "zLabelClass", "zPlaceholder", "zRequired", "zDisabled", "zReadonly", "zLoading", "zLoadingOutline", "zPrefix", "zSuffix", "zMin", "zMax", "zStep", "zShowArrows", "zMask", "zDecimalPlaces", "zAllowNegative", "zThousandSeparator", "zDecimalMarker", "zValidators", "zAsyncValidators", "zAsyncDebounce", "zAsyncValidateOn", "zShowPasswordToggle", "zSearch", "zDebounce", "zAutofocus", "zAutoComplete", "zAllowClear", "zAutoSizeContent", "zRows", "zResize", "zMaxLength", "zAutoSuggest", "zColorConfig"], outputs: ["zOnSearch", "zOnChange", "zOnBlur", "zOnFocus", "zOnKeydown", "zOnEnter", "zOnColorCollapse", "zControl", "zEvent"], exportAs: ["zInput"] }, { kind: "directive", type: ZPopoverDirective, selector: "[z-popover]", inputs: ["zPopoverContent", "zPosition", "zTrigger", "zPopoverTrigger", "zClass", "zShowDelay", "zHideDelay", "zDisabled", "zOffset", "zPopoverWidth", "zTriggerRef", "zManualClose", "zOutsideClickClose", "zScrollClose", "zSticky", "zShowArrow", "zKeyboardSafe"], outputs: ["zShow", "zHide", "zHideStart", "zControl", "zPositionChange", "zOutsideClick"], exportAs: ["zPopover"] }, { kind: "directive", type: ZTooltipDirective, selector: "[z-tooltip], [zTooltip]", inputs: ["zContent", "zPosition", "zTooltipPosition", "zTrigger", "zTooltipTrigger", "zTooltipType", "zTooltipSize", "zClass", "zTooltipClass", "zShowDelay", "zTooltipShowDelay", "zHideDelay", "zTooltipHideDelay", "zArrow", "zTooltipArrow", "zDisabled", "zTooltipDisabled", "zOffset", "zTooltipOffset", "zAutoDetect", "zTriggerElement", "zAlwaysShow", "zMaxWidth"], outputs: ["zShow", "zHide"], exportAs: ["zTooltip"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: ZEditorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: ZEditorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'z-editor', imports: [
                         FormsModule,