import * as i0 from '@angular/core';
import { inject, DestroyRef, viewChild, input, signal, computed, ChangeDetectionStrategy, Component } from '@angular/core';
import { C as ContentBuilderStore, a as CONTENT_BUILDER, b as CONTENT_EDITOR_BLOCK } from './ngstarter-ui-components-content-editor-ngstarter-ui-components-content-editor-DNLTNGYa.mjs';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { C as ContentEditorContentEditableDirective } from './ngstarter-ui-components-content-editor-content-editor-content-editable.directive-Bvfa2dqh.mjs';

class QuoteBlockComponent {
    _store = inject(ContentBuilderStore);
    _contentBuilder = inject(CONTENT_BUILDER);
    _destroyRef = inject(DestroyRef);
    _contentRef = viewChild.required('contentRef');
    id = input.required(...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
    content = input.required(...(ngDevMode ? [{ debugName: "content" }] : /* istanbul ignore next */ []));
    settings = input.required(...(ngDevMode ? [{ debugName: "settings" }] : /* istanbul ignore next */ []));
    index = input.required(...(ngDevMode ? [{ debugName: "index" }] : /* istanbul ignore next */ []));
    placeholder = input('Enter quote here', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
    captionPlaceholder = input('Enter caption here', ...(ngDevMode ? [{ debugName: "captionPlaceholder" }] : /* istanbul ignore next */ []));
    _citeContent = signal('', ...(ngDevMode ? [{ debugName: "_citeContent" }] : /* istanbul ignore next */ []));
    _citeProps = signal([], ...(ngDevMode ? [{ debugName: "_citeProps" }] : /* istanbul ignore next */ []));
    _captionContent = signal('', ...(ngDevMode ? [{ debugName: "_captionContent" }] : /* istanbul ignore next */ []));
    _captionProps = signal([], ...(ngDevMode ? [{ debugName: "_captionProps" }] : /* istanbul ignore next */ []));
    _isEmpty = signal(true, ...(ngDevMode ? [{ debugName: "_isEmpty" }] : /* istanbul ignore next */ []));
    initialized = signal(false, ...(ngDevMode ? [{ debugName: "initialized" }] : /* istanbul ignore next */ []));
    citeOriginalContent = computed(() => {
        return this.content().cite.content || '';
    }, ...(ngDevMode ? [{ debugName: "citeOriginalContent" }] : /* istanbul ignore next */ []));
    citeOriginalProps = computed(() => {
        return this.content().cite.props || [];
    }, ...(ngDevMode ? [{ debugName: "citeOriginalProps" }] : /* istanbul ignore next */ []));
    captionOriginalContent = computed(() => {
        return this.content().caption?.content || '';
    }, ...(ngDevMode ? [{ debugName: "captionOriginalContent" }] : /* istanbul ignore next */ []));
    captionOriginalProps = computed(() => {
        return this.content().caption?.props || [];
    }, ...(ngDevMode ? [{ debugName: "captionOriginalProps" }] : /* istanbul ignore next */ []));
    ngOnInit() {
        this._citeContent.set(this.citeOriginalContent());
        this._citeProps.set(this.citeOriginalProps());
        this._captionContent.set(this.captionOriginalContent());
        this._captionProps.set(this.captionOriginalProps());
        this._isEmpty.set(this._citeContent().length === 0);
        this._contentBuilder
            .focusChanged
            .pipe(takeUntilDestroyed(this._destroyRef))
            .subscribe(() => {
            if (this._store.focusedBlockId() === this.id()) {
                this.focus();
            }
        });
    }
    focus() {
        const element = this._contentRef().nativeElement;
        const range = window.document.createRange();
        range.setStart(element, 0);
        range.setEnd(element, 0);
        const selection = window.getSelection();
        selection.removeAllRanges();
        selection.addRange(range);
    }
    getData() {
        return {
            content: {
                cite: {
                    content: this._citeContent(),
                    props: this._citeProps(),
                },
                caption: {
                    content: this._captionContent(),
                    props: this._captionProps(),
                }
            },
            settings: {
                ...this.settings(),
            }
        };
    }
    isEmpty() {
        return this.getData().content.cite.content.trim().length === 0;
    }
    onCiteContentChanged(content) {
        if (!this.initialized()) {
            return;
        }
        this._isEmpty.set(content.trim().length === 0);
        this._citeContent.set(content.trim());
        this.update();
    }
    onCaptionContentChanged(content) {
        if (!this.initialized()) {
            return;
        }
        this._captionContent.set(content.trim());
        this.update();
    }
    onCitePropsChanged(props) {
        this._citeProps.set(props);
        this.update();
    }
    onCaptionPropsChanged(props) {
        this._captionProps.set(props);
        this.update();
    }
    onPressedEnter(event) {
        event.preventDefault();
        event.stopPropagation();
        this._contentBuilder.insertEmptyBlock(this.index());
    }
    onContentEditableInitialized() {
        if (this._store.focusedBlockId() === this.id()) {
            this.focus();
        }
        this.initialized.set(true);
    }
    update() {
        this._store.updateBlock(this.id(), { ...this.getData(), isEmpty: this.isEmpty() });
        this._contentBuilder.emitContentChangeEvent();
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: QuoteBlockComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.4", type: QuoteBlockComponent, isStandalone: true, selector: "ngs-quote-block", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: true, transformFunction: null }, settings: { classPropertyName: "settings", publicName: "settings", isSignal: true, isRequired: true, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, captionPlaceholder: { classPropertyName: "captionPlaceholder", publicName: "captionPlaceholder", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
            {
                provide: CONTENT_EDITOR_BLOCK,
                useExisting: QuoteBlockComponent,
                multi: true
            }
        ], viewQueries: [{ propertyName: "_contentRef", first: true, predicate: ["contentRef"], descendants: true, isSignal: true }], exportAs: ["ngsQuoteBlock"], ngImport: i0, template: "<blockquote #contentRef\n            #contentEditableRef=\"ngsContentEditorContentEditable\"\n            class=\"content\"\n            [ngsContentEditorContentEditable]=\"citeOriginalContent()\"\n            [props]=\"citeOriginalProps()\"\n            (propsChanged)=\"onCitePropsChanged($event)\"\n            [attr.data-empty-placeholder]=\"placeholder()\"\n            (contentChanged)=\"onCiteContentChanged($event)\"\n            (pressedEnter)=\"onPressedEnter($event)\"\n            (initialized)=\"onContentEditableInitialized()\"></blockquote>\n<div class=\"caption\"\n     #captionRef\n     #captionEditableRef=\"ngsContentEditorContentEditable\"\n     [ngsContentEditorContentEditable]=\"captionOriginalContent()\"\n     [props]=\"captionOriginalProps()\"\n     (propsChanged)=\"onCaptionPropsChanged($event)\"\n     [attr.data-empty-placeholder]=\"placeholder()\"\n     (contentChanged)=\"onCaptionContentChanged($event)\"\n     (pressedEnter)=\"onPressedEnter($event)\"></div>\n", styles: [":host{display:block;margin:calc(var(--spacing, .25rem) * 2) 0}:host .content{outline:none;border-inline-start:calc(var(--spacing, .25rem) * 1) solid var(--ngs-color-border);padding:calc(var(--spacing, .25rem) * 2) calc(var(--spacing, .25rem) * 3);margin-bottom:calc(var(--spacing, .25rem) * 2)}:host .caption{outline:none;font-size:var(--ngs-font-size-sm);color:var(--ngs-color-neutral-600)}:host-context .content:empty:before,:host-context .caption:empty:before{content:attr(data-empty-placeholder);color:var(--ngs-color-neutral-500)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: ContentEditorContentEditableDirective, selector: "[ngsContentEditorContentEditable]", inputs: ["ngsContentEditorContentEditable", "settings", "props"], outputs: ["contentChanged", "pressedEnter", "initialized", "propsChanged"], exportAs: ["ngsContentEditorContentEditable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: QuoteBlockComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-quote-block', exportAs: 'ngsQuoteBlock', imports: [
                        ContentEditorContentEditableDirective,
                    ], providers: [
                        {
                            provide: CONTENT_EDITOR_BLOCK,
                            useExisting: QuoteBlockComponent,
                            multi: true
                        }
                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<blockquote #contentRef\n            #contentEditableRef=\"ngsContentEditorContentEditable\"\n            class=\"content\"\n            [ngsContentEditorContentEditable]=\"citeOriginalContent()\"\n            [props]=\"citeOriginalProps()\"\n            (propsChanged)=\"onCitePropsChanged($event)\"\n            [attr.data-empty-placeholder]=\"placeholder()\"\n            (contentChanged)=\"onCiteContentChanged($event)\"\n            (pressedEnter)=\"onPressedEnter($event)\"\n            (initialized)=\"onContentEditableInitialized()\"></blockquote>\n<div class=\"caption\"\n     #captionRef\n     #captionEditableRef=\"ngsContentEditorContentEditable\"\n     [ngsContentEditorContentEditable]=\"captionOriginalContent()\"\n     [props]=\"captionOriginalProps()\"\n     (propsChanged)=\"onCaptionPropsChanged($event)\"\n     [attr.data-empty-placeholder]=\"placeholder()\"\n     (contentChanged)=\"onCaptionContentChanged($event)\"\n     (pressedEnter)=\"onPressedEnter($event)\"></div>\n", styles: [":host{display:block;margin:calc(var(--spacing, .25rem) * 2) 0}:host .content{outline:none;border-inline-start:calc(var(--spacing, .25rem) * 1) solid var(--ngs-color-border);padding:calc(var(--spacing, .25rem) * 2) calc(var(--spacing, .25rem) * 3);margin-bottom:calc(var(--spacing, .25rem) * 2)}:host .caption{outline:none;font-size:var(--ngs-font-size-sm);color:var(--ngs-color-neutral-600)}:host-context .content:empty:before,:host-context .caption:empty:before{content:attr(data-empty-placeholder);color:var(--ngs-color-neutral-500)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }], propDecorators: { _contentRef: [{ type: i0.ViewChild, args: ['contentRef', { isSignal: true }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: true }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: true }] }], settings: [{ type: i0.Input, args: [{ isSignal: true, alias: "settings", required: true }] }], index: [{ type: i0.Input, args: [{ isSignal: true, alias: "index", required: true }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], captionPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "captionPlaceholder", required: false }] }] } });

export { QuoteBlockComponent };
//# sourceMappingURL=ngstarter-ui-components-content-editor-quote-block.component-B3pek1H6.mjs.map
