@3ddv/software-division-components 1.4.12 → 1.5.0

package/fesm2022/3ddv-software-division-components.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { input, computed, signal, Component, InjectionToken, inject, Directive, NgModule, booleanAttribute, model, numberAttribute, viewChild, ChangeDetectionStrategy, Renderer2, ElementRef, effect, forwardRef, output, ViewEncapsulation, Injectable, ChangeDetectorRef, EventEmitter, Output, ViewChild, ApplicationRef, EnvironmentInjector, createEnvironmentInjector, createComponent, TemplateRef, Input, Inject, DestroyRef, untracked, contentChildren, contentChild } from '@angular/core';
 import * as i1 from '@angular/forms';
-import { FormSubmittedEvent, ReactiveFormsModule, NG_VALUE_ACCESSOR, TouchedChangeEvent, PristineChangeEvent, FormsModule, FormControl } from '@angular/forms';
+import { FormSubmittedEvent, ReactiveFormsModule, NG_VALUE_ACCESSOR, TouchedChangeEvent, PristineChangeEvent, FormsModule, FormControl, FormBuilder, Validators } from '@angular/forms';
 import { injectDateAdapter, provideDateAdapter, BrnNativeDateAdapter } from '@spartan-ng/brain/date-time';
 import { provideIcons, NgIcon } from '@ng-icons/core';
 import { lucideChevronRight, lucideChevronLeft, lucideCalendar, lucideArrowDown, lucideArrowUp, lucideArrowUpDown, lucideChevronDown, lucideChevronUp, lucideEye, lucideMapPin, lucideArrowRight, lucideArrowLeft, lucideX, lucideCheck } from '@ng-icons/lucide';
@@ -24,6 +24,11 @@ import * as i1$2 from '@spartan-ng/brain/dialog';
 import { BrnDialog, BrnDialogOverlay, provideBrnDialogDefaultOptions, BrnDialogRef, injectBrnDialogContext, BrnDialogClose, BrnDialogDescription, BrnDialogTitle, BrnDialogService, cssClassesToArray, DEFAULT_BRN_DIALOG_OPTIONS } from '@spartan-ng/brain/dialog';
 import { HttpClient } from '@angular/common/http';
 import { DomSanitizer } from '@angular/platform-browser';
+import { Editor } from '@tiptap/core';
+import StarterKit from '@tiptap/starter-kit';
+import Underline from '@tiptap/extension-underline';
+import Link from '@tiptap/extension-link';
+import Placeholder from '@tiptap/extension-placeholder';
 import * as i1$3 from '@spartan-ng/brain/select';
 import { BrnSelectGroup, BrnSelectLabel, BrnSelectOption, BrnSelect, BrnSelectTrigger, BrnSelectImports } from '@spartan-ng/brain/select';
 import { provideAnimationsAsync } from '@angular/platform-browser/animations/async';
@@ -5575,6 +5580,602 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
  * Public API Surface of software-division-components
  */
 
+/**
+ * Predefined toolbar presets
+ */
+const TOOLBAR_PRESETS = {
+    minimal: {
+        bold: true,
+        italic: true,
+        link: true,
+    },
+    standard: {
+        bold: true,
+        italic: true,
+        underline: true,
+        bulletList: true,
+        orderedList: true,
+        headings: [1, 2, 3],
+        link: true,
+    },
+    full: {
+        bold: true,
+        italic: true,
+        underline: true,
+        strike: true,
+        bulletList: true,
+        orderedList: true,
+        headings: [1, 2, 3, 4, 5, 6],
+        horizontalRule: true,
+        link: true,
+        blockquote: true,
+        code: true,
+        codeBlock: true,
+        undo: true,
+        redo: true,
+    },
+};
+/**
+ * Default toolbar configuration (standard preset)
+ */
+const DEFAULT_TOOLBAR_CONFIG = TOOLBAR_PRESETS.standard;
+
+/**
+ * Default link configuration
+ */
+const DEFAULT_LINK_CONFIG = {
+    openOnClick: false,
+    linkClass: 'text-blue-500 underline',
+    addNoopener: true,
+    openInNewTab: true,
+};
+/**
+ * Default editor configuration
+ */
+const DEFAULT_EDITOR_CONFIG = {
+    placeholder: '',
+    minHeight: '180px',
+    autoFocus: false,
+    linkConfig: DEFAULT_LINK_CONFIG,
+    spellcheck: true,
+};
+
+/**
+ * Toolbar component for the rich text editor
+ * Provides formatting buttons with responsive design and active state tracking
+ */
+class EditorToolbarComponent {
+    /** The TipTap editor instance */
+    editor = input.required();
+    /** Toolbar configuration */
+    config = input(DEFAULT_TOOLBAR_CONFIG);
+    /** Event emitted when link button is clicked */
+    linkRequested = output();
+    /** Mobile menu visibility state */
+    showMobileMenu = signal(false);
+    /** Computed config with defaults applied */
+    mergedConfig = computed(() => {
+        return { ...DEFAULT_TOOLBAR_CONFIG, ...this.config() };
+    });
+    /** Check if any formatting option is enabled */
+    hasFormattingOptions = computed(() => {
+        const cfg = this.mergedConfig();
+        return cfg.bold || cfg.italic || cfg.underline || cfg.strike;
+    });
+    /** Check if any list option is enabled */
+    hasListOptions = computed(() => {
+        const cfg = this.mergedConfig();
+        return cfg.bulletList || cfg.orderedList;
+    });
+    /** Check if any heading is enabled */
+    hasHeadings = computed(() => {
+        const cfg = this.mergedConfig();
+        return cfg.headings && cfg.headings.length > 0;
+    });
+    /** Check if history buttons are enabled */
+    hasHistory = computed(() => {
+        const cfg = this.mergedConfig();
+        return cfg.undo || cfg.redo;
+    });
+    /** Check if code options are enabled */
+    hasCodeOptions = computed(() => {
+        const cfg = this.mergedConfig();
+        return cfg.code || cfg.codeBlock;
+    });
+    /** Toggle mobile menu visibility */
+    toggleMobileMenu() {
+        this.showMobileMenu.update(v => !v);
+    }
+    /** Toggle heading with smart selection handling */
+    toggleHeading(level) {
+        const editor = this.editor();
+        const { from, to } = editor.state.selection;
+        const selectedText = editor.state.doc.textBetween(from, to);
+        if (selectedText) {
+            // Delete selected text and insert heading with the text
+            editor
+                .chain()
+                .focus()
+                .deleteRange({ from, to })
+                .insertContent(`<h${level}>${selectedText}</h${level}>`)
+                .run();
+        }
+        else {
+            // Toggle heading on current line
+            editor.chain().focus().toggleHeading({ level }).run();
+        }
+    }
+    /** Request link insertion/editing */
+    setLink() {
+        this.linkRequested.emit();
+    }
+    /** Toggle bold formatting */
+    toggleBold() {
+        this.editor().chain().focus().toggleBold().run();
+    }
+    /** Toggle italic formatting */
+    toggleItalic() {
+        this.editor().chain().focus().toggleItalic().run();
+    }
+    /** Toggle underline formatting */
+    toggleUnderline() {
+        this.editor().chain().focus().toggleUnderline().run();
+    }
+    /** Toggle strikethrough formatting */
+    toggleStrike() {
+        this.editor().chain().focus().toggleStrike().run();
+    }
+    /** Toggle bullet list */
+    toggleBulletList() {
+        this.editor().chain().focus().toggleBulletList().run();
+    }
+    /** Toggle ordered list */
+    toggleOrderedList() {
+        this.editor().chain().focus().toggleOrderedList().run();
+    }
+    /** Insert horizontal rule */
+    insertHorizontalRule() {
+        this.editor().chain().focus().setHorizontalRule().run();
+    }
+    /** Toggle blockquote */
+    toggleBlockquote() {
+        this.editor().chain().focus().toggleBlockquote().run();
+    }
+    /** Toggle inline code */
+    toggleCode() {
+        this.editor().chain().focus().toggleCode().run();
+    }
+    /** Toggle code block */
+    toggleCodeBlock() {
+        this.editor().chain().focus().toggleCodeBlock().run();
+    }
+    /** Undo last action */
+    undo() {
+        this.editor().chain().focus().undo().run();
+    }
+    /** Redo last undone action */
+    redo() {
+        this.editor().chain().focus().redo().run();
+    }
+    /** Remove link from selection */
+    unsetLink() {
+        this.editor().chain().focus().unsetLink().run();
+    }
+    /** Check if a formatting type is active */
+    isActive(type, options) {
+        return this.editor().isActive(type, options);
+    }
+    /** Track function for heading levels */
+    trackByLevel(index, level) {
+        return level;
+    }
+    /** Track function for custom buttons */
+    trackByButtonId(index, btn) {
+        return btn.id;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EditorToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: EditorToolbarComponent, isStandalone: true, selector: "sdc-editor-toolbar", inputs: { editor: { classPropertyName: "editor", publicName: "editor", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { linkRequested: "linkRequested" }, ngImport: i0, template: "<div class=\"sdc-editor-toolbar\">\n  <!-- Mobile: Expandable toolbar -->\n  <div class=\"sdc-editor-toolbar__mobile\">\n    <div class=\"sdc-editor-toolbar__mobile-container\">\n      <!-- Primary actions row -->\n      <div class=\"sdc-editor-toolbar__mobile-primary\">\n        <div class=\"sdc-editor-toolbar__button-group\">\n          @if (mergedConfig().bold) {\n            <button\n              type=\"button\"\n              class=\"sdc-editor-toolbar__button\"\n              [class.sdc-editor-toolbar__button--active]=\"isActive('bold')\"\n              (click)=\"toggleBold()\"\n              title=\"Bold\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                <path\n                  d=\"M6 4h5a3 3 0 0 1 0 6H6zm0 6h6a3 3 0 0 1 0 6H6z\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\" />\n              </svg>\n            </button>\n          }\n\n          @if (mergedConfig().italic) {\n            <button\n              type=\"button\"\n              class=\"sdc-editor-toolbar__button\"\n              [class.sdc-editor-toolbar__button--active]=\"isActive('italic')\"\n              (click)=\"toggleItalic()\"\n              title=\"Italic\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                <path\n                  d=\"M10 4h6M4 16h6m2-12l-6 16\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\" />\n              </svg>\n            </button>\n          }\n\n          @if (mergedConfig().link) {\n            <button\n              type=\"button\"\n              class=\"sdc-editor-toolbar__button\"\n              [class.sdc-editor-toolbar__button--active]=\"isActive('link')\"\n              (click)=\"setLink()\"\n              title=\"Link\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                <path\n                  d=\"M8 12a3 3 0 0 0 4.24 0l3.5-3.5a3 3 0 0 0-4.24-4.24l-.88.87M12 8a3 3 0 0 0-4.24 0l-3.5 3.5a3 3 0 0 0 4.24 4.24l.88-.87\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\" />\n              </svg>\n            </button>\n          }\n        </div>\n\n        <!-- Toggle button -->\n        <button\n          type=\"button\"\n          class=\"sdc-editor-toolbar__button sdc-editor-toolbar__toggle\"\n          [class.sdc-editor-toolbar__toggle--open]=\"showMobileMenu()\"\n          (click)=\"toggleMobileMenu()\"\n          title=\"More options\">\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n            <path\n              d=\"M6 8l4 4 4-4\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\" />\n          </svg>\n        </button>\n      </div>\n\n      <!-- Expanded toolbar -->\n      @if (showMobileMenu()) {\n        <div class=\"sdc-editor-toolbar__mobile-expanded\">\n          <!-- Text formatting -->\n          <div class=\"sdc-editor-toolbar__button-group\">\n            @if (mergedConfig().underline) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                [class.sdc-editor-toolbar__button--active]=\"isActive('underline')\"\n                (click)=\"toggleUnderline()\"\n                title=\"Underline\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <path\n                    d=\"M6 4v5a4 4 0 0 0 8 0V4M4 17h12\"\n                    stroke=\"currentColor\"\n                    stroke-width=\"2\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\" />\n                </svg>\n              </button>\n            }\n\n            @if (mergedConfig().strike) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                [class.sdc-editor-toolbar__button--active]=\"isActive('strike')\"\n                (click)=\"toggleStrike()\"\n                title=\"Strikethrough\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <path\n                    d=\"M4 10h12M7 4c-1.5 0-3 1-3 3s1.5 3 3 3h6c1.5 0 3 1 3 3s-1.5 3-3 3\"\n                    stroke=\"currentColor\"\n                    stroke-width=\"2\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\" />\n                </svg>\n              </button>\n            }\n\n            @if (mergedConfig().bulletList) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                [class.sdc-editor-toolbar__button--active]=\"isActive('bulletList')\"\n                (click)=\"toggleBulletList()\"\n                title=\"Bullet List\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <circle cx=\"5\" cy=\"5\" r=\"1.5\" fill=\"currentColor\" />\n                  <circle cx=\"5\" cy=\"10\" r=\"1.5\" fill=\"currentColor\" />\n                  <circle cx=\"5\" cy=\"15\" r=\"1.5\" fill=\"currentColor\" />\n                  <rect x=\"9\" y=\"4\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n                  <rect x=\"9\" y=\"9\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n                  <rect x=\"9\" y=\"14\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n                </svg>\n              </button>\n            }\n\n            @if (mergedConfig().orderedList) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                [class.sdc-editor-toolbar__button--active]=\"isActive('orderedList')\"\n                (click)=\"toggleOrderedList()\"\n                title=\"Ordered List\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <text x=\"3\" y=\"7\" font-size=\"6\" fill=\"currentColor\">1.</text>\n                  <text x=\"3\" y=\"12\" font-size=\"6\" fill=\"currentColor\">2.</text>\n                  <text x=\"3\" y=\"17\" font-size=\"6\" fill=\"currentColor\">3.</text>\n                  <rect x=\"9\" y=\"4\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n                  <rect x=\"9\" y=\"9\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n                  <rect x=\"9\" y=\"14\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n                </svg>\n              </button>\n            }\n          </div>\n\n          <!-- Headings -->\n          @if (hasHeadings()) {\n            <div class=\"sdc-editor-toolbar__button-group\">\n              @for (level of mergedConfig().headings; track level) {\n                <button\n                  type=\"button\"\n                  class=\"sdc-editor-toolbar__button sdc-editor-toolbar__button--text\"\n                  [class.sdc-editor-toolbar__button--active]=\"isActive('heading', { level })\"\n                  (click)=\"toggleHeading(level)\"\n                  [title]=\"'Heading ' + level\">\n                  H{{ level }}\n                </button>\n              }\n            </div>\n          }\n\n          <!-- Extra options -->\n          <div class=\"sdc-editor-toolbar__button-group\">\n            @if (mergedConfig().blockquote) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                [class.sdc-editor-toolbar__button--active]=\"isActive('blockquote')\"\n                (click)=\"toggleBlockquote()\"\n                title=\"Blockquote\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <path\n                    d=\"M4 8h4v4H4zM12 8h4v4h-4zM4 12v2a2 2 0 0 0 2 2M12 12v2a2 2 0 0 0 2 2\"\n                    stroke=\"currentColor\"\n                    stroke-width=\"2\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\" />\n                </svg>\n              </button>\n            }\n\n            @if (mergedConfig().horizontalRule) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                (click)=\"insertHorizontalRule()\"\n                title=\"Horizontal Rule\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <path d=\"M2 10h16\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n                </svg>\n              </button>\n            }\n\n            @if (isActive('link')) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                (click)=\"unsetLink()\"\n                title=\"Remove Link\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <path\n                    d=\"M8 12a3 3 0 0 0 4.24 0l3.5-3.5a3 3 0 0 0-4.24-4.24M12 8a3 3 0 0 0-4.24 0l-3.5 3.5a3 3 0 0 0 4.24 4.24M3 17l14-14\"\n                    stroke=\"currentColor\"\n                    stroke-width=\"2\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\" />\n                </svg>\n              </button>\n            }\n          </div>\n        </div>\n      }\n    </div>\n  </div>\n\n  <!-- Desktop: Full toolbar -->\n  <div class=\"sdc-editor-toolbar__desktop\">\n    <!-- Text formatting group -->\n    @if (hasFormattingOptions()) {\n      <div class=\"sdc-editor-toolbar__button-group\">\n        @if (mergedConfig().bold) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('bold')\"\n            (click)=\"toggleBold()\"\n            title=\"Bold\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M6 4h5a3 3 0 0 1 0 6H6zm0 6h6a3 3 0 0 1 0 6H6z\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().italic) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('italic')\"\n            (click)=\"toggleItalic()\"\n            title=\"Italic\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M10 4h6M4 16h6m2-12l-6 16\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().underline) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('underline')\"\n            (click)=\"toggleUnderline()\"\n            title=\"Underline\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M6 4v5a4 4 0 0 0 8 0V4M4 17h12\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().strike) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('strike')\"\n            (click)=\"toggleStrike()\"\n            title=\"Strikethrough\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M4 10h12M7 4c-1.5 0-3 1-3 3s1.5 3 3 3h6c1.5 0 3 1 3 3s-1.5 3-3 3\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n      </div>\n\n      <div class=\"sdc-editor-toolbar__separator\"></div>\n    }\n\n    <!-- List group -->\n    @if (hasListOptions()) {\n      <div class=\"sdc-editor-toolbar__button-group\">\n        @if (mergedConfig().bulletList) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('bulletList')\"\n            (click)=\"toggleBulletList()\"\n            title=\"Bullet List\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <circle cx=\"5\" cy=\"5\" r=\"1.5\" fill=\"currentColor\" />\n              <circle cx=\"5\" cy=\"10\" r=\"1.5\" fill=\"currentColor\" />\n              <circle cx=\"5\" cy=\"15\" r=\"1.5\" fill=\"currentColor\" />\n              <rect x=\"9\" y=\"4\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n              <rect x=\"9\" y=\"9\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n              <rect x=\"9\" y=\"14\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().orderedList) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('orderedList')\"\n            (click)=\"toggleOrderedList()\"\n            title=\"Ordered List\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <text x=\"3\" y=\"7\" font-size=\"6\" fill=\"currentColor\">1.</text>\n              <text x=\"3\" y=\"12\" font-size=\"6\" fill=\"currentColor\">2.</text>\n              <text x=\"3\" y=\"17\" font-size=\"6\" fill=\"currentColor\">3.</text>\n              <rect x=\"9\" y=\"4\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n              <rect x=\"9\" y=\"9\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n              <rect x=\"9\" y=\"14\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n            </svg>\n          </button>\n        }\n      </div>\n\n      <div class=\"sdc-editor-toolbar__separator\"></div>\n    }\n\n    <!-- Headings group -->\n    @if (hasHeadings()) {\n      <div class=\"sdc-editor-toolbar__button-group\">\n        @for (level of mergedConfig().headings; track level) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button sdc-editor-toolbar__button--text\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('heading', { level })\"\n            (click)=\"toggleHeading(level)\"\n            [title]=\"'Heading ' + level\">\n            H{{ level }}\n          </button>\n        }\n      </div>\n\n      <div class=\"sdc-editor-toolbar__separator\"></div>\n    }\n\n    <!-- Block formatting group -->\n    @if (mergedConfig().blockquote || mergedConfig().horizontalRule || hasCodeOptions()) {\n      <div class=\"sdc-editor-toolbar__button-group\">\n        @if (mergedConfig().blockquote) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('blockquote')\"\n            (click)=\"toggleBlockquote()\"\n            title=\"Blockquote\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M4 8h4v4H4zM12 8h4v4h-4zM4 12v2a2 2 0 0 0 2 2M12 12v2a2 2 0 0 0 2 2\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().code) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('code')\"\n            (click)=\"toggleCode()\"\n            title=\"Inline Code\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M7 5l-4 5 4 5M13 5l4 5-4 5\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().codeBlock) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('codeBlock')\"\n            (click)=\"toggleCodeBlock()\"\n            title=\"Code Block\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <rect x=\"2\" y=\"2\" width=\"16\" height=\"16\" rx=\"2\" stroke=\"currentColor\" stroke-width=\"2\" />\n              <path d=\"M6 7l-2 3 2 3M10 7l2 3-2 3\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().horizontalRule) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            (click)=\"insertHorizontalRule()\"\n            title=\"Horizontal Rule\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path d=\"M2 10h16\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n            </svg>\n          </button>\n        }\n      </div>\n\n      <div class=\"sdc-editor-toolbar__separator\"></div>\n    }\n\n    <!-- Link group -->\n    @if (mergedConfig().link) {\n      <div class=\"sdc-editor-toolbar__button-group\">\n        <button\n          type=\"button\"\n          class=\"sdc-editor-toolbar__button\"\n          [class.sdc-editor-toolbar__button--active]=\"isActive('link')\"\n          (click)=\"setLink()\"\n          title=\"Insert Link\">\n          <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n            <path\n              d=\"M8 12a3 3 0 0 0 4.24 0l3.5-3.5a3 3 0 0 0-4.24-4.24l-.88.87M12 8a3 3 0 0 0-4.24 0l-3.5 3.5a3 3 0 0 0 4.24 4.24l.88-.87\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\" />\n          </svg>\n        </button>\n\n        @if (isActive('link')) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            (click)=\"unsetLink()\"\n            title=\"Remove Link\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M8 12a3 3 0 0 0 4.24 0l3.5-3.5a3 3 0 0 0-4.24-4.24M12 8a3 3 0 0 0-4.24 0l-3.5 3.5a3 3 0 0 0 4.24 4.24M3 17l14-14\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n      </div>\n    }\n\n    <!-- History group -->\n    @if (hasHistory()) {\n      <div class=\"sdc-editor-toolbar__separator\"></div>\n      <div class=\"sdc-editor-toolbar__button-group\">\n        @if (mergedConfig().undo) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            (click)=\"undo()\"\n            title=\"Undo\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M4 8h10a4 4 0 0 1 0 8H10M4 8l4-4M4 8l4 4\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().redo) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            (click)=\"redo()\"\n            title=\"Redo\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M16 8H6a4 4 0 0 0 0 8h4M16 8l-4-4M16 8l-4 4\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n      </div>\n    }\n\n    <!-- Custom buttons -->\n    @if (mergedConfig().customButtons && mergedConfig().customButtons!.length > 0) {\n      <div class=\"sdc-editor-toolbar__separator\"></div>\n      <div class=\"sdc-editor-toolbar__button-group\">\n        @for (btn of mergedConfig().customButtons; track btn.id) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"btn.isActive ? btn.isActive() : false\"\n            (click)=\"btn.action()\"\n            [title]=\"btn.title\"\n            [innerHTML]=\"btn.icon\">\n          </button>\n        }\n      </div>\n    }\n  </div>\n</div>\n", styles: [".sdc-editor-toolbar{width:100%}.sdc-editor-toolbar__mobile{display:block}@media (min-width: 768px){.sdc-editor-toolbar__mobile{display:none}}.sdc-editor-toolbar__mobile-container{background-color:var(--sdc-toolbar-bg, #ffffff);border:1px solid var(--sdc-toolbar-border, #e5e7eb);border-radius:.5rem;overflow:hidden}.sdc-editor-toolbar__mobile-primary{display:flex;align-items:center;justify-content:space-between;padding:.5rem}.sdc-editor-toolbar__mobile-expanded{border-top:1px solid var(--sdc-toolbar-border, #e5e7eb);padding:.5rem;background-color:var(--sdc-toolbar-expanded-bg, #f9fafb);display:flex;flex-wrap:wrap;gap:.5rem}.sdc-editor-toolbar__desktop{display:none}@media (min-width: 768px){.sdc-editor-toolbar__desktop{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem;background-color:var(--sdc-toolbar-bg, #ffffff);border:1px solid var(--sdc-toolbar-border, #e5e7eb);border-radius:.5rem;padding:.25rem}}.sdc-editor-toolbar__button-group{display:flex;gap:.125rem}.sdc-editor-toolbar__separator{width:1px;height:1.5rem;background-color:var(--sdc-toolbar-separator, #d1d5db);margin:0 .25rem}.sdc-editor-toolbar__button{display:inline-flex;align-items:center;justify-content:center;padding:.5rem;border-radius:.375rem;border:none;background:transparent;color:var(--sdc-toolbar-button-color, #4b5563);cursor:pointer;transition:background-color .15s ease,color .15s ease;min-width:2rem;min-height:2rem}.sdc-editor-toolbar__button:hover{background-color:var(--sdc-toolbar-button-hover-bg, #f3f4f6)}.sdc-editor-toolbar__button--active{background-color:var(--sdc-toolbar-button-active-bg, #dbeafe);color:var(--sdc-toolbar-button-active-color, #2563eb)}.sdc-editor-toolbar__button--active:hover{background-color:var(--sdc-toolbar-button-active-hover-bg, #bfdbfe)}.sdc-editor-toolbar__button--text{font-weight:600;font-size:.875rem;padding:.375rem .5rem}.sdc-editor-toolbar__toggle svg{transition:transform .2s ease}.sdc-editor-toolbar__toggle--open svg{transform:rotate(180deg)}:host-context(.theme-sdc) .sdc-editor-toolbar__button--active{background-color:#e0f2fe;color:#0369a1}:host-context(.theme-sdc) .sdc-editor-toolbar__button--active:hover{background-color:#bae6fd}:host-context(.theme-backoffice) .sdc-editor-toolbar{--sdc-toolbar-bg: #ffffff;--sdc-toolbar-border: #d1d5db;--sdc-toolbar-button-color: #374151}:host-context(.theme-backoffice) .sdc-editor-toolbar__button--active{background-color:#fed7aa;color:#c2410c}:host-context(.theme-backoffice) .sdc-editor-toolbar__button--active:hover{background-color:#fdba74}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EditorToolbarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sdc-editor-toolbar', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"sdc-editor-toolbar\">\n  <!-- Mobile: Expandable toolbar -->\n  <div class=\"sdc-editor-toolbar__mobile\">\n    <div class=\"sdc-editor-toolbar__mobile-container\">\n      <!-- Primary actions row -->\n      <div class=\"sdc-editor-toolbar__mobile-primary\">\n        <div class=\"sdc-editor-toolbar__button-group\">\n          @if (mergedConfig().bold) {\n            <button\n              type=\"button\"\n              class=\"sdc-editor-toolbar__button\"\n              [class.sdc-editor-toolbar__button--active]=\"isActive('bold')\"\n              (click)=\"toggleBold()\"\n              title=\"Bold\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                <path\n                  d=\"M6 4h5a3 3 0 0 1 0 6H6zm0 6h6a3 3 0 0 1 0 6H6z\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\" />\n              </svg>\n            </button>\n          }\n\n          @if (mergedConfig().italic) {\n            <button\n              type=\"button\"\n              class=\"sdc-editor-toolbar__button\"\n              [class.sdc-editor-toolbar__button--active]=\"isActive('italic')\"\n              (click)=\"toggleItalic()\"\n              title=\"Italic\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                <path\n                  d=\"M10 4h6M4 16h6m2-12l-6 16\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\" />\n              </svg>\n            </button>\n          }\n\n          @if (mergedConfig().link) {\n            <button\n              type=\"button\"\n              class=\"sdc-editor-toolbar__button\"\n              [class.sdc-editor-toolbar__button--active]=\"isActive('link')\"\n              (click)=\"setLink()\"\n              title=\"Link\">\n              <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                <path\n                  d=\"M8 12a3 3 0 0 0 4.24 0l3.5-3.5a3 3 0 0 0-4.24-4.24l-.88.87M12 8a3 3 0 0 0-4.24 0l-3.5 3.5a3 3 0 0 0 4.24 4.24l.88-.87\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\" />\n              </svg>\n            </button>\n          }\n        </div>\n\n        <!-- Toggle button -->\n        <button\n          type=\"button\"\n          class=\"sdc-editor-toolbar__button sdc-editor-toolbar__toggle\"\n          [class.sdc-editor-toolbar__toggle--open]=\"showMobileMenu()\"\n          (click)=\"toggleMobileMenu()\"\n          title=\"More options\">\n          <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n            <path\n              d=\"M6 8l4 4 4-4\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\" />\n          </svg>\n        </button>\n      </div>\n\n      <!-- Expanded toolbar -->\n      @if (showMobileMenu()) {\n        <div class=\"sdc-editor-toolbar__mobile-expanded\">\n          <!-- Text formatting -->\n          <div class=\"sdc-editor-toolbar__button-group\">\n            @if (mergedConfig().underline) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                [class.sdc-editor-toolbar__button--active]=\"isActive('underline')\"\n                (click)=\"toggleUnderline()\"\n                title=\"Underline\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <path\n                    d=\"M6 4v5a4 4 0 0 0 8 0V4M4 17h12\"\n                    stroke=\"currentColor\"\n                    stroke-width=\"2\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\" />\n                </svg>\n              </button>\n            }\n\n            @if (mergedConfig().strike) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                [class.sdc-editor-toolbar__button--active]=\"isActive('strike')\"\n                (click)=\"toggleStrike()\"\n                title=\"Strikethrough\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <path\n                    d=\"M4 10h12M7 4c-1.5 0-3 1-3 3s1.5 3 3 3h6c1.5 0 3 1 3 3s-1.5 3-3 3\"\n                    stroke=\"currentColor\"\n                    stroke-width=\"2\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\" />\n                </svg>\n              </button>\n            }\n\n            @if (mergedConfig().bulletList) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                [class.sdc-editor-toolbar__button--active]=\"isActive('bulletList')\"\n                (click)=\"toggleBulletList()\"\n                title=\"Bullet List\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <circle cx=\"5\" cy=\"5\" r=\"1.5\" fill=\"currentColor\" />\n                  <circle cx=\"5\" cy=\"10\" r=\"1.5\" fill=\"currentColor\" />\n                  <circle cx=\"5\" cy=\"15\" r=\"1.5\" fill=\"currentColor\" />\n                  <rect x=\"9\" y=\"4\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n                  <rect x=\"9\" y=\"9\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n                  <rect x=\"9\" y=\"14\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n                </svg>\n              </button>\n            }\n\n            @if (mergedConfig().orderedList) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                [class.sdc-editor-toolbar__button--active]=\"isActive('orderedList')\"\n                (click)=\"toggleOrderedList()\"\n                title=\"Ordered List\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <text x=\"3\" y=\"7\" font-size=\"6\" fill=\"currentColor\">1.</text>\n                  <text x=\"3\" y=\"12\" font-size=\"6\" fill=\"currentColor\">2.</text>\n                  <text x=\"3\" y=\"17\" font-size=\"6\" fill=\"currentColor\">3.</text>\n                  <rect x=\"9\" y=\"4\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n                  <rect x=\"9\" y=\"9\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n                  <rect x=\"9\" y=\"14\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n                </svg>\n              </button>\n            }\n          </div>\n\n          <!-- Headings -->\n          @if (hasHeadings()) {\n            <div class=\"sdc-editor-toolbar__button-group\">\n              @for (level of mergedConfig().headings; track level) {\n                <button\n                  type=\"button\"\n                  class=\"sdc-editor-toolbar__button sdc-editor-toolbar__button--text\"\n                  [class.sdc-editor-toolbar__button--active]=\"isActive('heading', { level })\"\n                  (click)=\"toggleHeading(level)\"\n                  [title]=\"'Heading ' + level\">\n                  H{{ level }}\n                </button>\n              }\n            </div>\n          }\n\n          <!-- Extra options -->\n          <div class=\"sdc-editor-toolbar__button-group\">\n            @if (mergedConfig().blockquote) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                [class.sdc-editor-toolbar__button--active]=\"isActive('blockquote')\"\n                (click)=\"toggleBlockquote()\"\n                title=\"Blockquote\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <path\n                    d=\"M4 8h4v4H4zM12 8h4v4h-4zM4 12v2a2 2 0 0 0 2 2M12 12v2a2 2 0 0 0 2 2\"\n                    stroke=\"currentColor\"\n                    stroke-width=\"2\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\" />\n                </svg>\n              </button>\n            }\n\n            @if (mergedConfig().horizontalRule) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                (click)=\"insertHorizontalRule()\"\n                title=\"Horizontal Rule\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <path d=\"M2 10h16\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n                </svg>\n              </button>\n            }\n\n            @if (isActive('link')) {\n              <button\n                type=\"button\"\n                class=\"sdc-editor-toolbar__button\"\n                (click)=\"unsetLink()\"\n                title=\"Remove Link\">\n                <svg width=\"16\" height=\"16\" viewBox=\"0 0 20 20\" fill=\"none\">\n                  <path\n                    d=\"M8 12a3 3 0 0 0 4.24 0l3.5-3.5a3 3 0 0 0-4.24-4.24M12 8a3 3 0 0 0-4.24 0l-3.5 3.5a3 3 0 0 0 4.24 4.24M3 17l14-14\"\n                    stroke=\"currentColor\"\n                    stroke-width=\"2\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\" />\n                </svg>\n              </button>\n            }\n          </div>\n        </div>\n      }\n    </div>\n  </div>\n\n  <!-- Desktop: Full toolbar -->\n  <div class=\"sdc-editor-toolbar__desktop\">\n    <!-- Text formatting group -->\n    @if (hasFormattingOptions()) {\n      <div class=\"sdc-editor-toolbar__button-group\">\n        @if (mergedConfig().bold) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('bold')\"\n            (click)=\"toggleBold()\"\n            title=\"Bold\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M6 4h5a3 3 0 0 1 0 6H6zm0 6h6a3 3 0 0 1 0 6H6z\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().italic) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('italic')\"\n            (click)=\"toggleItalic()\"\n            title=\"Italic\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M10 4h6M4 16h6m2-12l-6 16\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().underline) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('underline')\"\n            (click)=\"toggleUnderline()\"\n            title=\"Underline\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M6 4v5a4 4 0 0 0 8 0V4M4 17h12\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().strike) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('strike')\"\n            (click)=\"toggleStrike()\"\n            title=\"Strikethrough\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M4 10h12M7 4c-1.5 0-3 1-3 3s1.5 3 3 3h6c1.5 0 3 1 3 3s-1.5 3-3 3\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n      </div>\n\n      <div class=\"sdc-editor-toolbar__separator\"></div>\n    }\n\n    <!-- List group -->\n    @if (hasListOptions()) {\n      <div class=\"sdc-editor-toolbar__button-group\">\n        @if (mergedConfig().bulletList) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('bulletList')\"\n            (click)=\"toggleBulletList()\"\n            title=\"Bullet List\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <circle cx=\"5\" cy=\"5\" r=\"1.5\" fill=\"currentColor\" />\n              <circle cx=\"5\" cy=\"10\" r=\"1.5\" fill=\"currentColor\" />\n              <circle cx=\"5\" cy=\"15\" r=\"1.5\" fill=\"currentColor\" />\n              <rect x=\"9\" y=\"4\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n              <rect x=\"9\" y=\"9\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n              <rect x=\"9\" y=\"14\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().orderedList) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('orderedList')\"\n            (click)=\"toggleOrderedList()\"\n            title=\"Ordered List\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <text x=\"3\" y=\"7\" font-size=\"6\" fill=\"currentColor\">1.</text>\n              <text x=\"3\" y=\"12\" font-size=\"6\" fill=\"currentColor\">2.</text>\n              <text x=\"3\" y=\"17\" font-size=\"6\" fill=\"currentColor\">3.</text>\n              <rect x=\"9\" y=\"4\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n              <rect x=\"9\" y=\"9\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n              <rect x=\"9\" y=\"14\" width=\"8\" height=\"2\" rx=\"1\" fill=\"currentColor\" />\n            </svg>\n          </button>\n        }\n      </div>\n\n      <div class=\"sdc-editor-toolbar__separator\"></div>\n    }\n\n    <!-- Headings group -->\n    @if (hasHeadings()) {\n      <div class=\"sdc-editor-toolbar__button-group\">\n        @for (level of mergedConfig().headings; track level) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button sdc-editor-toolbar__button--text\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('heading', { level })\"\n            (click)=\"toggleHeading(level)\"\n            [title]=\"'Heading ' + level\">\n            H{{ level }}\n          </button>\n        }\n      </div>\n\n      <div class=\"sdc-editor-toolbar__separator\"></div>\n    }\n\n    <!-- Block formatting group -->\n    @if (mergedConfig().blockquote || mergedConfig().horizontalRule || hasCodeOptions()) {\n      <div class=\"sdc-editor-toolbar__button-group\">\n        @if (mergedConfig().blockquote) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('blockquote')\"\n            (click)=\"toggleBlockquote()\"\n            title=\"Blockquote\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M4 8h4v4H4zM12 8h4v4h-4zM4 12v2a2 2 0 0 0 2 2M12 12v2a2 2 0 0 0 2 2\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().code) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('code')\"\n            (click)=\"toggleCode()\"\n            title=\"Inline Code\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M7 5l-4 5 4 5M13 5l4 5-4 5\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().codeBlock) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"isActive('codeBlock')\"\n            (click)=\"toggleCodeBlock()\"\n            title=\"Code Block\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <rect x=\"2\" y=\"2\" width=\"16\" height=\"16\" rx=\"2\" stroke=\"currentColor\" stroke-width=\"2\" />\n              <path d=\"M6 7l-2 3 2 3M10 7l2 3-2 3\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().horizontalRule) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            (click)=\"insertHorizontalRule()\"\n            title=\"Horizontal Rule\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path d=\"M2 10h16\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" />\n            </svg>\n          </button>\n        }\n      </div>\n\n      <div class=\"sdc-editor-toolbar__separator\"></div>\n    }\n\n    <!-- Link group -->\n    @if (mergedConfig().link) {\n      <div class=\"sdc-editor-toolbar__button-group\">\n        <button\n          type=\"button\"\n          class=\"sdc-editor-toolbar__button\"\n          [class.sdc-editor-toolbar__button--active]=\"isActive('link')\"\n          (click)=\"setLink()\"\n          title=\"Insert Link\">\n          <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n            <path\n              d=\"M8 12a3 3 0 0 0 4.24 0l3.5-3.5a3 3 0 0 0-4.24-4.24l-.88.87M12 8a3 3 0 0 0-4.24 0l-3.5 3.5a3 3 0 0 0 4.24 4.24l.88-.87\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\" />\n          </svg>\n        </button>\n\n        @if (isActive('link')) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            (click)=\"unsetLink()\"\n            title=\"Remove Link\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M8 12a3 3 0 0 0 4.24 0l3.5-3.5a3 3 0 0 0-4.24-4.24M12 8a3 3 0 0 0-4.24 0l-3.5 3.5a3 3 0 0 0 4.24 4.24M3 17l14-14\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n      </div>\n    }\n\n    <!-- History group -->\n    @if (hasHistory()) {\n      <div class=\"sdc-editor-toolbar__separator\"></div>\n      <div class=\"sdc-editor-toolbar__button-group\">\n        @if (mergedConfig().undo) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            (click)=\"undo()\"\n            title=\"Undo\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M4 8h10a4 4 0 0 1 0 8H10M4 8l4-4M4 8l4 4\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n\n        @if (mergedConfig().redo) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            (click)=\"redo()\"\n            title=\"Redo\">\n            <svg width=\"18\" height=\"18\" viewBox=\"0 0 20 20\" fill=\"none\">\n              <path\n                d=\"M16 8H6a4 4 0 0 0 0 8h4M16 8l-4-4M16 8l-4 4\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\" />\n            </svg>\n          </button>\n        }\n      </div>\n    }\n\n    <!-- Custom buttons -->\n    @if (mergedConfig().customButtons && mergedConfig().customButtons!.length > 0) {\n      <div class=\"sdc-editor-toolbar__separator\"></div>\n      <div class=\"sdc-editor-toolbar__button-group\">\n        @for (btn of mergedConfig().customButtons; track btn.id) {\n          <button\n            type=\"button\"\n            class=\"sdc-editor-toolbar__button\"\n            [class.sdc-editor-toolbar__button--active]=\"btn.isActive ? btn.isActive() : false\"\n            (click)=\"btn.action()\"\n            [title]=\"btn.title\"\n            [innerHTML]=\"btn.icon\">\n          </button>\n        }\n      </div>\n    }\n  </div>\n</div>\n", styles: [".sdc-editor-toolbar{width:100%}.sdc-editor-toolbar__mobile{display:block}@media (min-width: 768px){.sdc-editor-toolbar__mobile{display:none}}.sdc-editor-toolbar__mobile-container{background-color:var(--sdc-toolbar-bg, #ffffff);border:1px solid var(--sdc-toolbar-border, #e5e7eb);border-radius:.5rem;overflow:hidden}.sdc-editor-toolbar__mobile-primary{display:flex;align-items:center;justify-content:space-between;padding:.5rem}.sdc-editor-toolbar__mobile-expanded{border-top:1px solid var(--sdc-toolbar-border, #e5e7eb);padding:.5rem;background-color:var(--sdc-toolbar-expanded-bg, #f9fafb);display:flex;flex-wrap:wrap;gap:.5rem}.sdc-editor-toolbar__desktop{display:none}@media (min-width: 768px){.sdc-editor-toolbar__desktop{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem;background-color:var(--sdc-toolbar-bg, #ffffff);border:1px solid var(--sdc-toolbar-border, #e5e7eb);border-radius:.5rem;padding:.25rem}}.sdc-editor-toolbar__button-group{display:flex;gap:.125rem}.sdc-editor-toolbar__separator{width:1px;height:1.5rem;background-color:var(--sdc-toolbar-separator, #d1d5db);margin:0 .25rem}.sdc-editor-toolbar__button{display:inline-flex;align-items:center;justify-content:center;padding:.5rem;border-radius:.375rem;border:none;background:transparent;color:var(--sdc-toolbar-button-color, #4b5563);cursor:pointer;transition:background-color .15s ease,color .15s ease;min-width:2rem;min-height:2rem}.sdc-editor-toolbar__button:hover{background-color:var(--sdc-toolbar-button-hover-bg, #f3f4f6)}.sdc-editor-toolbar__button--active{background-color:var(--sdc-toolbar-button-active-bg, #dbeafe);color:var(--sdc-toolbar-button-active-color, #2563eb)}.sdc-editor-toolbar__button--active:hover{background-color:var(--sdc-toolbar-button-active-hover-bg, #bfdbfe)}.sdc-editor-toolbar__button--text{font-weight:600;font-size:.875rem;padding:.375rem .5rem}.sdc-editor-toolbar__toggle svg{transition:transform .2s ease}.sdc-editor-toolbar__toggle--open svg{transform:rotate(180deg)}:host-context(.theme-sdc) .sdc-editor-toolbar__button--active{background-color:#e0f2fe;color:#0369a1}:host-context(.theme-sdc) .sdc-editor-toolbar__button--active:hover{background-color:#bae6fd}:host-context(.theme-backoffice) .sdc-editor-toolbar{--sdc-toolbar-bg: #ffffff;--sdc-toolbar-border: #d1d5db;--sdc-toolbar-button-color: #374151}:host-context(.theme-backoffice) .sdc-editor-toolbar__button--active{background-color:#fed7aa;color:#c2410c}:host-context(.theme-backoffice) .sdc-editor-toolbar__button--active:hover{background-color:#fdba74}\n"] }]
+        }] });
+
+/**
+ * Modal component for inserting/editing links in the rich text editor
+ */
+class LinkModalComponent {
+    fb = inject(FormBuilder);
+    /** Whether the modal is visible */
+    visible = input(false);
+    /** Pre-selected text to use as link text */
+    selectedText = input('');
+    /** Existing URL when editing a link */
+    existingUrl = input('');
+    /** Event emitted when a link is added/updated */
+    linkAdded = output();
+    /** Event emitted when the modal is closed */
+    closed = output();
+    /** Form group for link data */
+    linkForm;
+    /** Track if form was submitted to show validation errors */
+    submitted = signal(false);
+    /** Computed title based on whether we're editing or adding */
+    modalTitle = computed(() => {
+        return this.existingUrl() ? 'Edit Link' : 'Add Link';
+    });
+    constructor() {
+        this.linkForm = this.fb.group({
+            url: ['', [Validators.required, Validators.pattern('https?://.+')]],
+            text: ['', Validators.required],
+        });
+        // Effect to update form when inputs change
+        effect(() => {
+            const text = this.selectedText();
+            const url = this.existingUrl();
+            const isVisible = this.visible();
+            if (isVisible) {
+                this.linkForm.patchValue({
+                    text: text || '',
+                    url: url || '',
+                });
+                this.submitted.set(false);
+            }
+        });
+    }
+    /** Submit the form and emit link data */
+    addLink() {
+        this.submitted.set(true);
+        if (this.linkForm.valid) {
+            const { url, text } = this.linkForm.value;
+            this.linkAdded.emit({ url, text });
+            this.closeModal();
+        }
+        else {
+            this.linkForm.markAllAsTouched();
+        }
+    }
+    /** Close the modal and reset form */
+    closeModal() {
+        this.closed.emit();
+        this.linkForm.reset();
+        this.submitted.set(false);
+    }
+    /** Check if a field has errors and should show them */
+    hasError(fieldName) {
+        const field = this.linkForm.get(fieldName);
+        return !!(field?.invalid && (field?.touched || this.submitted()));
+    }
+    /** Get specific error for a field */
+    getError(fieldName, errorType) {
+        const field = this.linkForm.get(fieldName);
+        return !!field?.errors?.[errorType];
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LinkModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: LinkModalComponent, isStandalone: true, selector: "sdc-link-modal", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, selectedText: { classPropertyName: "selectedText", publicName: "selectedText", isSignal: true, isRequired: false, transformFunction: null }, existingUrl: { classPropertyName: "existingUrl", publicName: "existingUrl", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { linkAdded: "linkAdded", closed: "closed" }, ngImport: i0, template: "@if (visible()) {\n  <div class=\"sdc-link-modal__overlay\" (click)=\"closeModal()\">\n    <div class=\"sdc-link-modal__container\" (click)=\"$event.stopPropagation()\">\n      <!-- Header -->\n      <div class=\"sdc-link-modal__header\">\n        <h3 class=\"sdc-link-modal__title\">{{ modalTitle() }}</h3>\n        <button\n          type=\"button\"\n          class=\"sdc-link-modal__close\"\n          (click)=\"closeModal()\"\n          aria-label=\"Close\">\n          <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n            <path\n              d=\"M15 5L5 15M5 5l10 10\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\" />\n          </svg>\n        </button>\n      </div>\n\n      <!-- Content -->\n      <div class=\"sdc-link-modal__content\">\n        <form [formGroup]=\"linkForm\" class=\"sdc-link-modal__form\">\n          <!-- Link Text Field -->\n          <div class=\"sdc-link-modal__field\">\n            <label for=\"linkText\" class=\"sdc-link-modal__label\">\n              Link Text\n            </label>\n            <input\n              id=\"linkText\"\n              type=\"text\"\n              formControlName=\"text\"\n              placeholder=\"Enter link text\"\n              class=\"sdc-link-modal__input\"\n              [class.sdc-link-modal__input--error]=\"hasError('text')\" />\n            @if (hasError('text')) {\n              <span class=\"sdc-link-modal__error\">\n                Link text is required\n              </span>\n            }\n          </div>\n\n          <!-- URL Field -->\n          <div class=\"sdc-link-modal__field\">\n            <label for=\"linkUrl\" class=\"sdc-link-modal__label\">\n              URL\n            </label>\n            <input\n              id=\"linkUrl\"\n              type=\"url\"\n              formControlName=\"url\"\n              placeholder=\"https://example.com\"\n              class=\"sdc-link-modal__input\"\n              [class.sdc-link-modal__input--error]=\"hasError('url')\" />\n            @if (hasError('url')) {\n              <span class=\"sdc-link-modal__error\">\n                @if (getError('url', 'required')) {\n                  URL is required\n                } @else if (getError('url', 'pattern')) {\n                  URL must start with http:// or https://\n                }\n              </span>\n            }\n            <span class=\"sdc-link-modal__hint\">\n              Must start with http:// or https://\n            </span>\n          </div>\n        </form>\n      </div>\n\n      <!-- Footer -->\n      <div class=\"sdc-link-modal__footer\">\n        <button\n          type=\"button\"\n          class=\"sdc-link-modal__button sdc-link-modal__button--secondary\"\n          (click)=\"closeModal()\">\n          Cancel\n        </button>\n        <button\n          type=\"button\"\n          class=\"sdc-link-modal__button sdc-link-modal__button--primary\"\n          [disabled]=\"linkForm.invalid\"\n          (click)=\"addLink()\">\n          {{ existingUrl() ? 'Update' : 'Add' }} Link\n        </button>\n      </div>\n    </div>\n  </div>\n}\n", styles: [".sdc-link-modal__overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.sdc-link-modal__container{background-color:var(--sdc-modal-bg, #ffffff);border-radius:1rem;box-shadow:0 25px 50px -12px #00000040;max-width:28rem;width:100%;overflow:hidden;animation:sdc-modal-enter .2s ease-out}@keyframes sdc-modal-enter{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.sdc-link-modal__header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.5rem;border-bottom:1px solid var(--sdc-modal-border, #e5e7eb)}.sdc-link-modal__title{margin:0;font-size:1.125rem;font-weight:600;color:var(--sdc-modal-title-color, #111827)}.sdc-link-modal__close{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border:none;background:transparent;color:var(--sdc-modal-close-color, #6b7280);border-radius:.375rem;cursor:pointer;transition:background-color .15s ease,color .15s ease}.sdc-link-modal__close:hover{background-color:var(--sdc-modal-close-hover-bg, #f3f4f6);color:var(--sdc-modal-close-hover-color, #111827)}.sdc-link-modal__content{padding:1.5rem}.sdc-link-modal__form{display:flex;flex-direction:column;gap:1.25rem}.sdc-link-modal__field{display:flex;flex-direction:column;gap:.5rem}.sdc-link-modal__label{font-size:.875rem;font-weight:500;color:var(--sdc-modal-label-color, #374151)}.sdc-link-modal__input{width:100%;padding:.75rem 1rem;border:1px solid var(--sdc-modal-input-border, #d1d5db);border-radius:.5rem;font-size:1rem;color:var(--sdc-modal-input-color, #111827);background-color:var(--sdc-modal-input-bg, #ffffff);transition:border-color .15s ease,box-shadow .15s ease}.sdc-link-modal__input:focus{outline:none;border-color:var(--sdc-modal-input-focus-border, #3b82f6);box-shadow:0 0 0 3px var(--sdc-modal-input-focus-ring, rgba(59, 130, 246, .1))}.sdc-link-modal__input::placeholder{color:var(--sdc-modal-input-placeholder, #9ca3af)}.sdc-link-modal__input--error{border-color:var(--sdc-modal-input-error-border, #ef4444)}.sdc-link-modal__input--error:focus{border-color:var(--sdc-modal-input-error-border, #ef4444);box-shadow:0 0 0 3px var(--sdc-modal-input-error-ring, rgba(239, 68, 68, .1))}.sdc-link-modal__error{font-size:.75rem;color:var(--sdc-modal-error-color, #ef4444)}.sdc-link-modal__hint{font-size:.75rem;color:var(--sdc-modal-hint-color, #6b7280)}.sdc-link-modal__footer{display:flex;justify-content:flex-end;gap:.75rem;padding:1rem 1.5rem;border-top:1px solid var(--sdc-modal-border, #e5e7eb);background-color:var(--sdc-modal-footer-bg, #f9fafb)}.sdc-link-modal__button{display:inline-flex;align-items:center;justify-content:center;padding:.625rem 1.25rem;font-size:.875rem;font-weight:500;border-radius:.5rem;cursor:pointer;transition:background-color .15s ease,color .15s ease,opacity .15s ease}.sdc-link-modal__button--secondary{background-color:var(--sdc-modal-btn-secondary-bg, #ffffff);border:1px solid var(--sdc-modal-btn-secondary-border, #d1d5db);color:var(--sdc-modal-btn-secondary-color, #374151)}.sdc-link-modal__button--secondary:hover{background-color:var(--sdc-modal-btn-secondary-hover-bg, #f3f4f6)}.sdc-link-modal__button--primary{background-color:var(--sdc-modal-btn-primary-bg, #3b82f6);border:1px solid transparent;color:var(--sdc-modal-btn-primary-color, #ffffff)}.sdc-link-modal__button--primary:hover{background-color:var(--sdc-modal-btn-primary-hover-bg, #2563eb)}.sdc-link-modal__button--primary:disabled{opacity:.5;cursor:not-allowed}:host-context(.theme-sdc) .sdc-link-modal__button--primary{background-color:#0ea5e9}:host-context(.theme-sdc) .sdc-link-modal__button--primary:hover{background-color:#0284c7}:host-context(.theme-backoffice) .sdc-link-modal__button--primary{background-color:#f97316}:host-context(.theme-backoffice) .sdc-link-modal__button--primary:hover{background-color:#ea580c}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LinkModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sdc-link-modal', standalone: true, imports: [ReactiveFormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (visible()) {\n  <div class=\"sdc-link-modal__overlay\" (click)=\"closeModal()\">\n    <div class=\"sdc-link-modal__container\" (click)=\"$event.stopPropagation()\">\n      <!-- Header -->\n      <div class=\"sdc-link-modal__header\">\n        <h3 class=\"sdc-link-modal__title\">{{ modalTitle() }}</h3>\n        <button\n          type=\"button\"\n          class=\"sdc-link-modal__close\"\n          (click)=\"closeModal()\"\n          aria-label=\"Close\">\n          <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n            <path\n              d=\"M15 5L5 15M5 5l10 10\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\" />\n          </svg>\n        </button>\n      </div>\n\n      <!-- Content -->\n      <div class=\"sdc-link-modal__content\">\n        <form [formGroup]=\"linkForm\" class=\"sdc-link-modal__form\">\n          <!-- Link Text Field -->\n          <div class=\"sdc-link-modal__field\">\n            <label for=\"linkText\" class=\"sdc-link-modal__label\">\n              Link Text\n            </label>\n            <input\n              id=\"linkText\"\n              type=\"text\"\n              formControlName=\"text\"\n              placeholder=\"Enter link text\"\n              class=\"sdc-link-modal__input\"\n              [class.sdc-link-modal__input--error]=\"hasError('text')\" />\n            @if (hasError('text')) {\n              <span class=\"sdc-link-modal__error\">\n                Link text is required\n              </span>\n            }\n          </div>\n\n          <!-- URL Field -->\n          <div class=\"sdc-link-modal__field\">\n            <label for=\"linkUrl\" class=\"sdc-link-modal__label\">\n              URL\n            </label>\n            <input\n              id=\"linkUrl\"\n              type=\"url\"\n              formControlName=\"url\"\n              placeholder=\"https://example.com\"\n              class=\"sdc-link-modal__input\"\n              [class.sdc-link-modal__input--error]=\"hasError('url')\" />\n            @if (hasError('url')) {\n              <span class=\"sdc-link-modal__error\">\n                @if (getError('url', 'required')) {\n                  URL is required\n                } @else if (getError('url', 'pattern')) {\n                  URL must start with http:// or https://\n                }\n              </span>\n            }\n            <span class=\"sdc-link-modal__hint\">\n              Must start with http:// or https://\n            </span>\n          </div>\n        </form>\n      </div>\n\n      <!-- Footer -->\n      <div class=\"sdc-link-modal__footer\">\n        <button\n          type=\"button\"\n          class=\"sdc-link-modal__button sdc-link-modal__button--secondary\"\n          (click)=\"closeModal()\">\n          Cancel\n        </button>\n        <button\n          type=\"button\"\n          class=\"sdc-link-modal__button sdc-link-modal__button--primary\"\n          [disabled]=\"linkForm.invalid\"\n          (click)=\"addLink()\">\n          {{ existingUrl() ? 'Update' : 'Add' }} Link\n        </button>\n      </div>\n    </div>\n  </div>\n}\n", styles: [".sdc-link-modal__overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.sdc-link-modal__container{background-color:var(--sdc-modal-bg, #ffffff);border-radius:1rem;box-shadow:0 25px 50px -12px #00000040;max-width:28rem;width:100%;overflow:hidden;animation:sdc-modal-enter .2s ease-out}@keyframes sdc-modal-enter{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.sdc-link-modal__header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.5rem;border-bottom:1px solid var(--sdc-modal-border, #e5e7eb)}.sdc-link-modal__title{margin:0;font-size:1.125rem;font-weight:600;color:var(--sdc-modal-title-color, #111827)}.sdc-link-modal__close{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border:none;background:transparent;color:var(--sdc-modal-close-color, #6b7280);border-radius:.375rem;cursor:pointer;transition:background-color .15s ease,color .15s ease}.sdc-link-modal__close:hover{background-color:var(--sdc-modal-close-hover-bg, #f3f4f6);color:var(--sdc-modal-close-hover-color, #111827)}.sdc-link-modal__content{padding:1.5rem}.sdc-link-modal__form{display:flex;flex-direction:column;gap:1.25rem}.sdc-link-modal__field{display:flex;flex-direction:column;gap:.5rem}.sdc-link-modal__label{font-size:.875rem;font-weight:500;color:var(--sdc-modal-label-color, #374151)}.sdc-link-modal__input{width:100%;padding:.75rem 1rem;border:1px solid var(--sdc-modal-input-border, #d1d5db);border-radius:.5rem;font-size:1rem;color:var(--sdc-modal-input-color, #111827);background-color:var(--sdc-modal-input-bg, #ffffff);transition:border-color .15s ease,box-shadow .15s ease}.sdc-link-modal__input:focus{outline:none;border-color:var(--sdc-modal-input-focus-border, #3b82f6);box-shadow:0 0 0 3px var(--sdc-modal-input-focus-ring, rgba(59, 130, 246, .1))}.sdc-link-modal__input::placeholder{color:var(--sdc-modal-input-placeholder, #9ca3af)}.sdc-link-modal__input--error{border-color:var(--sdc-modal-input-error-border, #ef4444)}.sdc-link-modal__input--error:focus{border-color:var(--sdc-modal-input-error-border, #ef4444);box-shadow:0 0 0 3px var(--sdc-modal-input-error-ring, rgba(239, 68, 68, .1))}.sdc-link-modal__error{font-size:.75rem;color:var(--sdc-modal-error-color, #ef4444)}.sdc-link-modal__hint{font-size:.75rem;color:var(--sdc-modal-hint-color, #6b7280)}.sdc-link-modal__footer{display:flex;justify-content:flex-end;gap:.75rem;padding:1rem 1.5rem;border-top:1px solid var(--sdc-modal-border, #e5e7eb);background-color:var(--sdc-modal-footer-bg, #f9fafb)}.sdc-link-modal__button{display:inline-flex;align-items:center;justify-content:center;padding:.625rem 1.25rem;font-size:.875rem;font-weight:500;border-radius:.5rem;cursor:pointer;transition:background-color .15s ease,color .15s ease,opacity .15s ease}.sdc-link-modal__button--secondary{background-color:var(--sdc-modal-btn-secondary-bg, #ffffff);border:1px solid var(--sdc-modal-btn-secondary-border, #d1d5db);color:var(--sdc-modal-btn-secondary-color, #374151)}.sdc-link-modal__button--secondary:hover{background-color:var(--sdc-modal-btn-secondary-hover-bg, #f3f4f6)}.sdc-link-modal__button--primary{background-color:var(--sdc-modal-btn-primary-bg, #3b82f6);border:1px solid transparent;color:var(--sdc-modal-btn-primary-color, #ffffff)}.sdc-link-modal__button--primary:hover{background-color:var(--sdc-modal-btn-primary-hover-bg, #2563eb)}.sdc-link-modal__button--primary:disabled{opacity:.5;cursor:not-allowed}:host-context(.theme-sdc) .sdc-link-modal__button--primary{background-color:#0ea5e9}:host-context(.theme-sdc) .sdc-link-modal__button--primary:hover{background-color:#0284c7}:host-context(.theme-backoffice) .sdc-link-modal__button--primary{background-color:#f97316}:host-context(.theme-backoffice) .sdc-link-modal__button--primary:hover{background-color:#ea580c}\n"] }]
+        }], ctorParameters: () => [] });
+
+/**
+ * A rich text editor component built on TipTap
+ *
+ * This component provides a WYSIWYG editor with configurable toolbar,
+ * form integration, and theme support.
+ *
+ * @since 1.5.0
+ */
+class RichTextEditorComponent {
+    /** Editor content container element */
+    editorContent = viewChild('editorContent');
+    /** TipTap editor instance (signal for change detection) */
+    editorSignal = signal(null);
+    /** Getter for backward compatibility */
+    get editor() {
+        return this.editorSignal();
+    }
+    // ============================================
+    // Input signals
+    // ============================================
+    /** Theme class to apply */
+    theme = input('theme-sdc');
+    /** Form control for two-way binding */
+    control = input(null);
+    /** Placeholder text when editor is empty */
+    placeholder = input('');
+    /** Whether the editor is disabled */
+    disabled = input(false);
+    /** Minimum height of the editor */
+    minHeight = input('180px');
+    /** Maximum height of the editor (enables scrolling) */
+    maxHeight = input(null);
+    /** Toolbar configuration object */
+    toolbarConfig = input(DEFAULT_TOOLBAR_CONFIG);
+    /** Toolbar preset name (overrides toolbarConfig) */
+    toolbarPreset = input(null);
+    /** Link behavior configuration */
+    linkConfig = input(DEFAULT_LINK_CONFIG);
+    /** Error display mode */
+    errorDisplayMode = input('after-submit');
+    /** Custom error message */
+    errorMessage = input('');
+    /** Label text */
+    label = input('');
+    /** Label position */
+    labelPosition = input('top');
+    /** Name attribute for form control */
+    name = input('');
+    /** Whether to autofocus the editor on init */
+    autoFocus = input(false);
+    // ============================================
+    // Output signals
+    // ============================================
+    /** Emits when the editor is ready */
+    editorReady = output();
+    /** Emits HTML content on change */
+    contentChange = output();
+    /** Emits on focus */
+    onFocus = output();
+    /** Emits on blur */
+    onBlur = output();
+    // ============================================
+    // Internal state
+    // ============================================
+    /** Form control state for validation display */
+    controlState = signal({ invalid: false, touched: false, dirty: false, errors: null, isFormSubmitted: false });
+    /** Link modal visibility state */
+    showLinkModal = signal(false);
+    /** Selected text for link modal */
+    selectedText = signal('');
+    /** Existing URL when editing a link */
+    existingLinkUrl = signal('');
+    /** Subscriptions for cleanup */
+    subscriptions = [];
+    /** Flag to prevent update loops */
+    isUpdatingFromEditor = false;
+    /** Cached form control reference (to avoid calling signals in callbacks) */
+    formControlRef = null;
+    // ============================================
+    // Computed values
+    // ============================================
+    /** Computed toolbar config using preset or custom config */
+    computedToolbarConfig = computed(() => {
+        const preset = this.toolbarPreset();
+        if (preset) {
+            return TOOLBAR_PRESETS[preset];
+        }
+        return this.toolbarConfig();
+    });
+    /** Computed class string for the component */
+    computedClass = computed(() => {
+        const themeClass = this.theme();
+        const errorClass = this.showError() ? 'has-error' : '';
+        const disabledClass = this.disabled() ? 'sdc-rich-text-editor--disabled' : '';
+        return ['sdc-rich-text-editor', themeClass, errorClass, disabledClass].filter(Boolean).join(' ');
+    });
+    /** Computed label class */
+    labelClass = computed(() => {
+        const position = this.labelPosition();
+        return position === 'left' ? 'sdc-rich-text-editor__label left' : 'sdc-rich-text-editor__label top';
+    });
+    /** Whether to show the label */
+    showLabel = computed(() => {
+        return this.label() && this.label().trim().length > 0;
+    });
+    /** Current error message to display */
+    currentErrorMessage = computed(() => {
+        const customMessage = this.errorMessage();
+        const hasErrors = Object.keys(this.controlState()?.errors ?? {}).length > 0;
+        if (hasErrors && customMessage && customMessage.trim().length > 0) {
+            return customMessage;
+        }
+        if (hasErrors) {
+            const firstErrorKey = Object.keys(this.controlState()?.errors ?? {})[0];
+            return this.getValidatorErrorMessage(firstErrorKey);
+        }
+        return '';
+    });
+    /** Whether to show error */
+    showError = computed(() => {
+        const errorMode = this.errorDisplayMode();
+        if (this.controlState()?.invalid) {
+            if (errorMode === 'always') {
+                return this.controlState()?.touched || this.controlState()?.dirty || this.controlState()?.isFormSubmitted;
+            }
+            else if (errorMode === 'after-submit') {
+                return this.controlState()?.isFormSubmitted;
+            }
+        }
+        return false;
+    });
+    /** Computed editor styles */
+    editorStyles = computed(() => {
+        const styles = {
+            minHeight: this.minHeight(),
+        };
+        const maxH = this.maxHeight();
+        if (maxH) {
+            styles['maxHeight'] = maxH;
+            styles['overflowY'] = 'auto';
+        }
+        return styles;
+    });
+    constructor() {
+        // No effects needed - disabled state is set during initialization
+        // and can be updated via setDisabled() method if needed dynamically
+    }
+    ngOnInit() {
+        // Validate required inputs
+        if ((this.control() || this.showLabel()) && !this.name()) {
+            console.warn('RichTextEditorComponent: name is recommended when control or label inputs are present');
+        }
+        // Cache the control reference to avoid calling signals in callbacks
+        const ctrl = this.control();
+        this.formControlRef = ctrl;
+        // Subscribe to form events for validation
+        const formEventsSubscription = ctrl?.parent?.events.subscribe(event => {
+            if (event instanceof FormSubmittedEvent) {
+                this.controlState.set({ ...this.controlState(), isFormSubmitted: true });
+                if (event.source.status === 'INVALID') {
+                    this.controlState.set({ ...this.controlState(), invalid: true });
+                }
+            }
+            this.updateErrors();
+        });
+        const statusChangesSubscription = ctrl?.statusChanges.subscribe(status => {
+            if (status === 'INVALID') {
+                this.controlState.set({ ...this.controlState(), invalid: true });
+            }
+            this.updateErrors();
+        });
+        if (formEventsSubscription) {
+            this.subscriptions.push(formEventsSubscription);
+        }
+        if (statusChangesSubscription) {
+            this.subscriptions.push(statusChangesSubscription);
+        }
+    }
+    ngAfterViewInit() {
+        this.initializeEditor();
+    }
+    ngOnDestroy() {
+        this.editorSignal()?.destroy();
+        this.subscriptions.forEach(sub => sub.unsubscribe());
+    }
+    /** Initialize the TipTap editor */
+    initializeEditor() {
+        const element = this.editorContent()?.nativeElement;
+        if (!element)
+            return;
+        const linkCfg = { ...DEFAULT_LINK_CONFIG, ...this.linkConfig() };
+        const newEditor = new Editor({
+            element,
+            extensions: [
+                StarterKit.configure({
+                    heading: {
+                        levels: this.computedToolbarConfig().headings || [1, 2, 3],
+                    },
+                }),
+                Underline,
+                Link.configure({
+                    openOnClick: linkCfg.openOnClick,
+                    HTMLAttributes: {
+                        class: linkCfg.linkClass,
+                        ...(linkCfg.openInNewTab ? { target: '_blank' } : {}),
+                        ...(linkCfg.addNoopener ? { rel: 'noopener noreferrer' } : {}),
+                    },
+                }),
+                Placeholder.configure({
+                    placeholder: this.placeholder(),
+                }),
+            ],
+            content: this.formControlRef?.value || '',
+            editable: !this.disabled(),
+            autofocus: this.autoFocus(),
+            onUpdate: ({ editor }) => {
+                this.isUpdatingFromEditor = true;
+                const html = editor.getHTML();
+                // Update form control - cache the control reference
+                const ctrl = this.formControlRef;
+                if (ctrl) {
+                    ctrl.setValue(html, { emitEvent: false });
+                    ctrl.markAsDirty();
+                }
+                // Emit content change
+                this.contentChange.emit(html);
+                this.isUpdatingFromEditor = false;
+            },
+            onFocus: ({ event }) => {
+                this.controlState.set({ ...this.controlState(), touched: true });
+                this.onFocus.emit(event);
+            },
+            onBlur: ({ event }) => {
+                this.controlState.set({ ...this.controlState(), touched: true });
+                // Update errors on blur to ensure validation shows after touch
+                this.updateErrors();
+                this.onBlur.emit(event);
+            },
+        });
+        // Set the signal to trigger change detection
+        this.editorSignal.set(newEditor);
+        this.editorReady.emit(newEditor);
+    }
+    /** Update error state from form control */
+    updateErrors() {
+        const ctrl = this.formControlRef;
+        const newErrors = ctrl?.errors || null;
+        this.controlState.set({
+            ...this.controlState(),
+            errors: newErrors,
+            invalid: !!newErrors,
+        });
+    }
+    /** Get error message for validator */
+    getValidatorErrorMessage(errorKey) {
+        switch (errorKey) {
+            case 'required':
+                return 'This field is required.';
+            case 'minlength':
+                return 'Content is too short.';
+            case 'maxlength':
+                return 'Content is too long.';
+            default:
+                return 'Please enter a valid value.';
+        }
+    }
+    /** Handle link button click from toolbar */
+    handleLinkRequested() {
+        const editor = this.editorSignal();
+        if (!editor)
+            return;
+        const { from, to } = editor.state.selection;
+        const selectedText = editor.state.doc.textBetween(from, to);
+        // Check if we're on an existing link
+        const linkMark = editor.getAttributes('link');
+        const existingUrl = linkMark?.href || '';
+        this.selectedText.set(selectedText);
+        this.existingLinkUrl.set(existingUrl);
+        this.showLinkModal.set(true);
+    }
+    /** Handle link added from modal */
+    handleLinkAdded(data) {
+        const editor = this.editorSignal();
+        if (!editor)
+            return;
+        const { url, text } = data;
+        const { from, to } = editor.state.selection;
+        const hasSelection = from !== to;
+        if (hasSelection) {
+            // Update selected text with link
+            editor.chain().focus().setLink({ href: url }).run();
+        }
+        else {
+            // Insert new link at cursor position
+            editor
+                .chain()
+                .focus()
+                .insertContent(`<a href="${url}">${text}</a>`)
+                .run();
+        }
+    }
+    /** Handle link modal close */
+    handleLinkModalClose() {
+        this.showLinkModal.set(false);
+        this.selectedText.set('');
+        this.existingLinkUrl.set('');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RichTextEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: RichTextEditorComponent, isStandalone: true, selector: "sdc-rich-text-editor", inputs: { theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", 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 }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, toolbarConfig: { classPropertyName: "toolbarConfig", publicName: "toolbarConfig", isSignal: true, isRequired: false, transformFunction: null }, toolbarPreset: { classPropertyName: "toolbarPreset", publicName: "toolbarPreset", isSignal: true, isRequired: false, transformFunction: null }, linkConfig: { classPropertyName: "linkConfig", publicName: "linkConfig", isSignal: true, isRequired: false, transformFunction: null }, errorDisplayMode: { classPropertyName: "errorDisplayMode", publicName: "errorDisplayMode", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { editorReady: "editorReady", contentChange: "contentChange", onFocus: "onFocus", onBlur: "onBlur" }, viewQueries: [{ propertyName: "editorContent", first: true, predicate: ["editorContent"], descendants: true, isSignal: true }], ngImport: i0, template: "<div [class]=\"computedClass()\">\n  <!-- Label -->\n  @if (showLabel()) {\n    <label [for]=\"name()\" [class]=\"labelClass()\">\n      {{ label() }}\n    </label>\n  }\n\n  <div class=\"sdc-rich-text-editor__wrapper\" [class.sdc-rich-text-editor__wrapper--left-label]=\"labelPosition() === 'left'\">\n    <!-- Toolbar -->\n    @if (editorSignal()) {\n      <sdc-editor-toolbar\n        [editor]=\"editorSignal()!\"\n        [config]=\"computedToolbarConfig()\"\n        (linkRequested)=\"handleLinkRequested()\"\n      />\n    }\n\n    <!-- Editor content area -->\n    <div\n      class=\"sdc-rich-text-editor__content\"\n      [class.sdc-rich-text-editor__content--error]=\"showError()\"\n      [class.sdc-rich-text-editor__content--disabled]=\"disabled()\"\n      [style]=\"editorStyles()\">\n      <div #editorContent class=\"sdc-rich-text-editor__prosemirror\"></div>\n    </div>\n\n    <!-- Error message -->\n    @if (showError() && currentErrorMessage()) {\n      <div class=\"sdc-rich-text-editor__error\">\n        {{ currentErrorMessage() }}\n      </div>\n    }\n  </div>\n</div>\n\n<!-- Link Modal -->\n<sdc-link-modal\n  [visible]=\"showLinkModal()\"\n  [selectedText]=\"selectedText()\"\n  [existingUrl]=\"existingLinkUrl()\"\n  (linkAdded)=\"handleLinkAdded($event)\"\n  (closed)=\"handleLinkModalClose()\"\n/>\n", styles: [".sdc-rich-text-editor{display:flex;flex-direction:column;gap:.5rem;width:100%;font-family:var(--sdc-font-family, system-ui, -apple-system, sans-serif)}.sdc-rich-text-editor__label{font-size:.875rem;font-weight:500;color:var(--sdc-label-color, #374151)}.sdc-rich-text-editor__label.left{min-width:8rem;padding-top:.5rem}.sdc-rich-text-editor__label.top{margin-bottom:.25rem}.sdc-rich-text-editor__wrapper{display:flex;flex-direction:column;gap:.5rem;flex:1}.sdc-rich-text-editor__wrapper--left-label{flex-direction:row;align-items:flex-start}.sdc-rich-text-editor__content{border:2px solid var(--sdc-editor-border, #e5e7eb);border-radius:.5rem;background-color:var(--sdc-editor-bg, #ffffff);transition:border-color .15s ease,box-shadow .15s ease;overflow:hidden}.sdc-rich-text-editor__content:focus-within{border-color:var(--sdc-editor-focus-border, #3b82f6);box-shadow:0 0 0 3px var(--sdc-editor-focus-ring, rgba(59, 130, 246, .1))}.sdc-rich-text-editor__content--error{border-color:var(--sdc-editor-error-border, #ef4444)}.sdc-rich-text-editor__content--error:focus-within{border-color:var(--sdc-editor-error-border, #ef4444);box-shadow:0 0 0 3px var(--sdc-editor-error-ring, rgba(239, 68, 68, .1))}.sdc-rich-text-editor__content--disabled{opacity:.6;cursor:not-allowed;background-color:var(--sdc-editor-disabled-bg, #f9fafb)}.sdc-rich-text-editor__prosemirror{padding:1rem 1.25rem}:host ::ng-deep .ProseMirror{outline:none;min-height:inherit;font-size:1rem;line-height:1.625;color:var(--sdc-editor-text-color, #111827)}:host ::ng-deep .ProseMirror:focus{outline:none}:host ::ng-deep .ProseMirror h1{font-size:2rem;font-weight:700;margin:1.5rem 0 1rem;line-height:1.25;color:var(--sdc-editor-heading-color, #111827)}:host ::ng-deep .ProseMirror h2{font-size:1.5rem;font-weight:600;margin:1.25rem 0 .75rem;line-height:1.3;color:var(--sdc-editor-heading-color, #111827)}:host ::ng-deep .ProseMirror h3{font-size:1.25rem;font-weight:600;margin:1rem 0 .5rem;line-height:1.4;color:var(--sdc-editor-heading-color, #111827)}:host ::ng-deep .ProseMirror h4{font-size:1.125rem;font-weight:600;margin:1rem 0 .5rem;line-height:1.4;color:var(--sdc-editor-heading-color, #111827)}:host ::ng-deep .ProseMirror h5,:host ::ng-deep .ProseMirror h6{font-size:1rem;font-weight:600;margin:.75rem 0 .5rem;line-height:1.5;color:var(--sdc-editor-heading-color, #111827)}:host ::ng-deep .ProseMirror h1:first-child,:host ::ng-deep .ProseMirror h2:first-child,:host ::ng-deep .ProseMirror h3:first-child,:host ::ng-deep .ProseMirror h4:first-child,:host ::ng-deep .ProseMirror h5:first-child,:host ::ng-deep .ProseMirror h6:first-child{margin-top:0}:host ::ng-deep .ProseMirror p{margin:0 0 1rem}:host ::ng-deep .ProseMirror p:last-child{margin-bottom:0}:host ::ng-deep .ProseMirror a{color:var(--sdc-editor-link-color, #3b82f6);text-decoration:underline;cursor:pointer}:host ::ng-deep .ProseMirror a:hover{color:var(--sdc-editor-link-hover-color, #2563eb)}:host ::ng-deep .ProseMirror ul,:host ::ng-deep .ProseMirror ol{padding-left:1.5rem;margin:0 0 1rem}:host ::ng-deep .ProseMirror ul{list-style-type:disc}:host ::ng-deep .ProseMirror ol{list-style-type:decimal}:host ::ng-deep .ProseMirror li{margin-bottom:.25rem}:host ::ng-deep .ProseMirror li p{margin:0}:host ::ng-deep .ProseMirror ul ul,:host ::ng-deep .ProseMirror ol ol,:host ::ng-deep .ProseMirror ul ol,:host ::ng-deep .ProseMirror ol ul{margin-top:.25rem;margin-bottom:0}:host ::ng-deep .ProseMirror blockquote{border-left:4px solid var(--sdc-editor-blockquote-border, #e5e7eb);padding-left:1rem;margin:1rem 0;color:var(--sdc-editor-blockquote-color, #6b7280);font-style:italic}:host ::ng-deep .ProseMirror code{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,monospace;font-size:.875em;background-color:var(--sdc-editor-code-bg, #f3f4f6);padding:.125rem .375rem;border-radius:.25rem;color:var(--sdc-editor-code-color, #dc2626)}:host ::ng-deep .ProseMirror pre{background-color:var(--sdc-editor-code-block-bg, #1f2937);color:var(--sdc-editor-code-block-color, #f3f4f6);font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,monospace;font-size:.875rem;padding:1rem;border-radius:.5rem;overflow-x:auto;margin:1rem 0}:host ::ng-deep .ProseMirror pre code{background:none;padding:0;color:inherit;font-size:inherit}:host ::ng-deep .ProseMirror hr{border:none;border-top:2px solid var(--sdc-editor-hr-color, #e5e7eb);margin:1.5rem 0}:host ::ng-deep .ProseMirror s{text-decoration:line-through}:host ::ng-deep .ProseMirror strong{font-weight:700}:host ::ng-deep .ProseMirror em{font-style:italic}:host ::ng-deep .ProseMirror u{text-decoration:underline}:host ::ng-deep .ProseMirror p.is-editor-empty:first-child:before{content:attr(data-placeholder);color:var(--sdc-editor-placeholder-color, #9ca3af);pointer-events:none;float:left;height:0}:host ::ng-deep .ProseMirror ::selection{background-color:var(--sdc-editor-selection-bg, rgba(59, 130, 246, .2))}.sdc-rich-text-editor__error{font-size:.75rem;color:var(--sdc-editor-error-color, #ef4444);margin-top:.25rem}.sdc-rich-text-editor--disabled .sdc-rich-text-editor__prosemirror{pointer-events:none}:host-context(.theme-sdc) .sdc-rich-text-editor__content:focus-within{border-color:#0ea5e9;box-shadow:0 0 0 3px #0ea5e91a}:host-context(.theme-sdc) ::ng-deep .ProseMirror a{color:#0ea5e9}:host-context(.theme-sdc) ::ng-deep .ProseMirror a:hover{color:#0284c7}:host-context(.theme-backoffice) .sdc-rich-text-editor__content:focus-within{border-color:#f97316;box-shadow:0 0 0 3px #f973161a}:host-context(.theme-backoffice) .sdc-rich-text-editor__content--error:focus-within{border-color:#ef4444;box-shadow:0 0 0 3px #ef44441a}:host-context(.theme-backoffice) ::ng-deep .ProseMirror a{color:#f97316}:host-context(.theme-backoffice) ::ng-deep .ProseMirror a:hover{color:#ea580c}:host-context(.theme-backoffice) ::ng-deep .ProseMirror blockquote{border-left-color:#fed7aa}@media (max-width: 640px){:host ::ng-deep .ProseMirror h1{font-size:1.5rem}:host ::ng-deep .ProseMirror h2{font-size:1.25rem}:host ::ng-deep .ProseMirror h3{font-size:1.125rem}.sdc-rich-text-editor__prosemirror{padding:.75rem 1rem}}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: EditorToolbarComponent, selector: "sdc-editor-toolbar", inputs: ["editor", "config"], outputs: ["linkRequested"] }, { kind: "component", type: LinkModalComponent, selector: "sdc-link-modal", inputs: ["visible", "selectedText", "existingUrl"], outputs: ["linkAdded", "closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RichTextEditorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'sdc-rich-text-editor', standalone: true, imports: [ReactiveFormsModule, EditorToolbarComponent, LinkModalComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class]=\"computedClass()\">\n  <!-- Label -->\n  @if (showLabel()) {\n    <label [for]=\"name()\" [class]=\"labelClass()\">\n      {{ label() }}\n    </label>\n  }\n\n  <div class=\"sdc-rich-text-editor__wrapper\" [class.sdc-rich-text-editor__wrapper--left-label]=\"labelPosition() === 'left'\">\n    <!-- Toolbar -->\n    @if (editorSignal()) {\n      <sdc-editor-toolbar\n        [editor]=\"editorSignal()!\"\n        [config]=\"computedToolbarConfig()\"\n        (linkRequested)=\"handleLinkRequested()\"\n      />\n    }\n\n    <!-- Editor content area -->\n    <div\n      class=\"sdc-rich-text-editor__content\"\n      [class.sdc-rich-text-editor__content--error]=\"showError()\"\n      [class.sdc-rich-text-editor__content--disabled]=\"disabled()\"\n      [style]=\"editorStyles()\">\n      <div #editorContent class=\"sdc-rich-text-editor__prosemirror\"></div>\n    </div>\n\n    <!-- Error message -->\n    @if (showError() && currentErrorMessage()) {\n      <div class=\"sdc-rich-text-editor__error\">\n        {{ currentErrorMessage() }}\n      </div>\n    }\n  </div>\n</div>\n\n<!-- Link Modal -->\n<sdc-link-modal\n  [visible]=\"showLinkModal()\"\n  [selectedText]=\"selectedText()\"\n  [existingUrl]=\"existingLinkUrl()\"\n  (linkAdded)=\"handleLinkAdded($event)\"\n  (closed)=\"handleLinkModalClose()\"\n/>\n", styles: [".sdc-rich-text-editor{display:flex;flex-direction:column;gap:.5rem;width:100%;font-family:var(--sdc-font-family, system-ui, -apple-system, sans-serif)}.sdc-rich-text-editor__label{font-size:.875rem;font-weight:500;color:var(--sdc-label-color, #374151)}.sdc-rich-text-editor__label.left{min-width:8rem;padding-top:.5rem}.sdc-rich-text-editor__label.top{margin-bottom:.25rem}.sdc-rich-text-editor__wrapper{display:flex;flex-direction:column;gap:.5rem;flex:1}.sdc-rich-text-editor__wrapper--left-label{flex-direction:row;align-items:flex-start}.sdc-rich-text-editor__content{border:2px solid var(--sdc-editor-border, #e5e7eb);border-radius:.5rem;background-color:var(--sdc-editor-bg, #ffffff);transition:border-color .15s ease,box-shadow .15s ease;overflow:hidden}.sdc-rich-text-editor__content:focus-within{border-color:var(--sdc-editor-focus-border, #3b82f6);box-shadow:0 0 0 3px var(--sdc-editor-focus-ring, rgba(59, 130, 246, .1))}.sdc-rich-text-editor__content--error{border-color:var(--sdc-editor-error-border, #ef4444)}.sdc-rich-text-editor__content--error:focus-within{border-color:var(--sdc-editor-error-border, #ef4444);box-shadow:0 0 0 3px var(--sdc-editor-error-ring, rgba(239, 68, 68, .1))}.sdc-rich-text-editor__content--disabled{opacity:.6;cursor:not-allowed;background-color:var(--sdc-editor-disabled-bg, #f9fafb)}.sdc-rich-text-editor__prosemirror{padding:1rem 1.25rem}:host ::ng-deep .ProseMirror{outline:none;min-height:inherit;font-size:1rem;line-height:1.625;color:var(--sdc-editor-text-color, #111827)}:host ::ng-deep .ProseMirror:focus{outline:none}:host ::ng-deep .ProseMirror h1{font-size:2rem;font-weight:700;margin:1.5rem 0 1rem;line-height:1.25;color:var(--sdc-editor-heading-color, #111827)}:host ::ng-deep .ProseMirror h2{font-size:1.5rem;font-weight:600;margin:1.25rem 0 .75rem;line-height:1.3;color:var(--sdc-editor-heading-color, #111827)}:host ::ng-deep .ProseMirror h3{font-size:1.25rem;font-weight:600;margin:1rem 0 .5rem;line-height:1.4;color:var(--sdc-editor-heading-color, #111827)}:host ::ng-deep .ProseMirror h4{font-size:1.125rem;font-weight:600;margin:1rem 0 .5rem;line-height:1.4;color:var(--sdc-editor-heading-color, #111827)}:host ::ng-deep .ProseMirror h5,:host ::ng-deep .ProseMirror h6{font-size:1rem;font-weight:600;margin:.75rem 0 .5rem;line-height:1.5;color:var(--sdc-editor-heading-color, #111827)}:host ::ng-deep .ProseMirror h1:first-child,:host ::ng-deep .ProseMirror h2:first-child,:host ::ng-deep .ProseMirror h3:first-child,:host ::ng-deep .ProseMirror h4:first-child,:host ::ng-deep .ProseMirror h5:first-child,:host ::ng-deep .ProseMirror h6:first-child{margin-top:0}:host ::ng-deep .ProseMirror p{margin:0 0 1rem}:host ::ng-deep .ProseMirror p:last-child{margin-bottom:0}:host ::ng-deep .ProseMirror a{color:var(--sdc-editor-link-color, #3b82f6);text-decoration:underline;cursor:pointer}:host ::ng-deep .ProseMirror a:hover{color:var(--sdc-editor-link-hover-color, #2563eb)}:host ::ng-deep .ProseMirror ul,:host ::ng-deep .ProseMirror ol{padding-left:1.5rem;margin:0 0 1rem}:host ::ng-deep .ProseMirror ul{list-style-type:disc}:host ::ng-deep .ProseMirror ol{list-style-type:decimal}:host ::ng-deep .ProseMirror li{margin-bottom:.25rem}:host ::ng-deep .ProseMirror li p{margin:0}:host ::ng-deep .ProseMirror ul ul,:host ::ng-deep .ProseMirror ol ol,:host ::ng-deep .ProseMirror ul ol,:host ::ng-deep .ProseMirror ol ul{margin-top:.25rem;margin-bottom:0}:host ::ng-deep .ProseMirror blockquote{border-left:4px solid var(--sdc-editor-blockquote-border, #e5e7eb);padding-left:1rem;margin:1rem 0;color:var(--sdc-editor-blockquote-color, #6b7280);font-style:italic}:host ::ng-deep .ProseMirror code{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,monospace;font-size:.875em;background-color:var(--sdc-editor-code-bg, #f3f4f6);padding:.125rem .375rem;border-radius:.25rem;color:var(--sdc-editor-code-color, #dc2626)}:host ::ng-deep .ProseMirror pre{background-color:var(--sdc-editor-code-block-bg, #1f2937);color:var(--sdc-editor-code-block-color, #f3f4f6);font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,monospace;font-size:.875rem;padding:1rem;border-radius:.5rem;overflow-x:auto;margin:1rem 0}:host ::ng-deep .ProseMirror pre code{background:none;padding:0;color:inherit;font-size:inherit}:host ::ng-deep .ProseMirror hr{border:none;border-top:2px solid var(--sdc-editor-hr-color, #e5e7eb);margin:1.5rem 0}:host ::ng-deep .ProseMirror s{text-decoration:line-through}:host ::ng-deep .ProseMirror strong{font-weight:700}:host ::ng-deep .ProseMirror em{font-style:italic}:host ::ng-deep .ProseMirror u{text-decoration:underline}:host ::ng-deep .ProseMirror p.is-editor-empty:first-child:before{content:attr(data-placeholder);color:var(--sdc-editor-placeholder-color, #9ca3af);pointer-events:none;float:left;height:0}:host ::ng-deep .ProseMirror ::selection{background-color:var(--sdc-editor-selection-bg, rgba(59, 130, 246, .2))}.sdc-rich-text-editor__error{font-size:.75rem;color:var(--sdc-editor-error-color, #ef4444);margin-top:.25rem}.sdc-rich-text-editor--disabled .sdc-rich-text-editor__prosemirror{pointer-events:none}:host-context(.theme-sdc) .sdc-rich-text-editor__content:focus-within{border-color:#0ea5e9;box-shadow:0 0 0 3px #0ea5e91a}:host-context(.theme-sdc) ::ng-deep .ProseMirror a{color:#0ea5e9}:host-context(.theme-sdc) ::ng-deep .ProseMirror a:hover{color:#0284c7}:host-context(.theme-backoffice) .sdc-rich-text-editor__content:focus-within{border-color:#f97316;box-shadow:0 0 0 3px #f973161a}:host-context(.theme-backoffice) .sdc-rich-text-editor__content--error:focus-within{border-color:#ef4444;box-shadow:0 0 0 3px #ef44441a}:host-context(.theme-backoffice) ::ng-deep .ProseMirror a{color:#f97316}:host-context(.theme-backoffice) ::ng-deep .ProseMirror a:hover{color:#ea580c}:host-context(.theme-backoffice) ::ng-deep .ProseMirror blockquote{border-left-color:#fed7aa}@media (max-width: 640px){:host ::ng-deep .ProseMirror h1{font-size:1.5rem}:host ::ng-deep .ProseMirror h2{font-size:1.25rem}:host ::ng-deep .ProseMirror h3{font-size:1.125rem}.sdc-rich-text-editor__prosemirror{padding:.75rem 1rem}}\n"] }]
+        }], ctorParameters: () => [] });
+
+// Main component
+
 class HlmSelect {
     userClass = input('', { alias: 'class' });
     _computedClass = computed(() => hlm(this.userClass()));
@@ -5963,5 +6564,5 @@ function provideScreenObserver(screens) {
  * Generated bundle index. Do not edit.
  */
 
-export { AddDigitalWalletComponent, BasePopoverComponent, BasePopoverDataTransformer, BaseSeatDataTransformer, BaseSectionDataTransformer, BraintreeComponent, ButtonComponent, CONFIGURATION_SERVICE, CarouselComponent, CarouselItemComponent, CartComponent, CartItemComponent, CartItemService, CheckboxComponent, DVM_FORMATTER, DVM_SERVICE, DatePickerComponent, DialogComponent, HlmDialogService as DialogService, DrawerComponent, DrawerService, DvmPopoverPositionerService, InputComponent, LegendComponent, LegendElementsComponent, LoaderComponent, LoaderService, MapLoaderComponent, NeighborsComponent, POPOVER_MANAGER, POPOVER_POSITIONER, PopoverComponent, PopoverManagerService, PopoverService, RadioComponent, ScreenObserver, SeatListComponent, SeatPopoverComponent, SectionPopoverComponent, SelectComponent, StepperComponent, SvgIconComponent, THUMBNAIL_PROVIDER, TableComponent, TicketInfoItemComponent, TicketInfoItemService, applyGlobalCssVariables, provideScreenObserver, provideSdc };
+export { AddDigitalWalletComponent, BasePopoverComponent, BasePopoverDataTransformer, BaseSeatDataTransformer, BaseSectionDataTransformer, BraintreeComponent, ButtonComponent, CONFIGURATION_SERVICE, CarouselComponent, CarouselItemComponent, CartComponent, CartItemComponent, CartItemService, CheckboxComponent, DEFAULT_EDITOR_CONFIG, DEFAULT_LINK_CONFIG, DEFAULT_TOOLBAR_CONFIG, DVM_FORMATTER, DVM_SERVICE, DatePickerComponent, DialogComponent, HlmDialogService as DialogService, DrawerComponent, DrawerService, DvmPopoverPositionerService, EditorToolbarComponent, InputComponent, LegendComponent, LegendElementsComponent, LinkModalComponent, LoaderComponent, LoaderService, MapLoaderComponent, NeighborsComponent, POPOVER_MANAGER, POPOVER_POSITIONER, PopoverComponent, PopoverManagerService, PopoverService, RadioComponent, RichTextEditorComponent, ScreenObserver, SeatListComponent, SeatPopoverComponent, SectionPopoverComponent, SelectComponent, StepperComponent, SvgIconComponent, THUMBNAIL_PROVIDER, TOOLBAR_PRESETS, TableComponent, TicketInfoItemComponent, TicketInfoItemService, applyGlobalCssVariables, provideScreenObserver, provideSdc };
 //# sourceMappingURL=3ddv-software-division-components.mjs.map