import * as i0 from '@angular/core';
import { inject, DestroyRef, viewChild, input, signal, forwardRef, ChangeDetectionStrategy, Component } from '@angular/core';
import { C as ContentEditorContentEditableDirective } from './ngstarter-ui-components-content-editor-content-editor-content-editable.directive-Bvfa2dqh.mjs';
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 CursorController } from './ngstarter-ui-components-content-editor-cursor-controller-4Ak8VqGX.mjs';

class ParagraphBlockComponent {
    _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 */ []));
    props = input([], ...(ngDevMode ? [{ debugName: "props" }] : /* istanbul ignore next */ []));
    index = input.required(...(ngDevMode ? [{ debugName: "index" }] : /* istanbul ignore next */ []));
    placeholder = input('Enter text here', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
    _content = signal('', ...(ngDevMode ? [{ debugName: "_content" }] : /* istanbul ignore next */ []));
    _props = signal([], ...(ngDevMode ? [{ debugName: "_props" }] : /* istanbul ignore next */ []));
    _isEmpty = signal(true, ...(ngDevMode ? [{ debugName: "_isEmpty" }] : /* istanbul ignore next */ []));
    initialized = signal(false, ...(ngDevMode ? [{ debugName: "initialized" }] : /* istanbul ignore next */ []));
    ngOnInit() {
        this._content.set(this.content());
        this._props.set(this.props());
        this._isEmpty.set(this.content().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 cursorController = new CursorController(element);
        cursorController.setToEnd();
    }
    getData() {
        return {
            content: this._content(),
            props: this._props(),
            settings: {
                ...this.settings(),
            }
        };
    }
    isEmpty() {
        return this.getData().content.trim().length === 0;
    }
    onContentChanged(content) {
        if (!this.initialized()) {
            return;
        }
        this._content.set(content);
        this._isEmpty.set(content.trim().length === 0);
        this.update();
    }
    onPropsChanged(props) {
        this._contentBuilder.setBlockProps(this.id(), props);
    }
    onPressedEnter(event) {
        event.preventDefault();
        event.stopPropagation();
        this._contentBuilder.insertEmptyBlock(this.index());
    }
    onContentEditableInitialized() {
        if (this._store.focusedBlockId() === this.id()) {
            this.focus();
        }
        this.initialized.set(true);
    }
    _onKeyDown(event) {
        if (event.key === 'Backspace' && !this._content()) {
            this._contentBuilder.deleteBlock(this.id());
        }
    }
    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: ParagraphBlockComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.4", type: ParagraphBlockComponent, isStandalone: true, selector: "ngs-paragraph-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 }, props: { classPropertyName: "props", publicName: "props", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-empty": "_isEmpty()" }, classAttribute: "ngs-paragraph-block" }, providers: [
            {
                provide: CONTENT_EDITOR_BLOCK,
                useExisting: forwardRef(() => ParagraphBlockComponent),
                multi: true
            }
        ], viewQueries: [{ propertyName: "_contentRef", first: true, predicate: ["contentRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<p #contentRef\n   class=\"content\"\n   [ngsContentEditorContentEditable]=\"_content()\"\n   [settings]=\"settings()\"\n   [props]=\"props()\"\n   (propsChanged)=\"onPropsChanged($event)\"\n   [attr.data-empty-placeholder]=\"placeholder()\"\n   (contentChanged)=\"onContentChanged($event)\"\n   (pressedEnter)=\"onPressedEnter($event)\"\n   (keydown)=\"_onKeyDown($event)\"\n   (initialized)=\"onContentEditableInitialized()\"></p>\n", styles: [":host{display:block;position:relative}:host p{line-height:var(--leading-normal)}:host .content{outline:none}:host-context(.block.is-active) .content:empty:before,:host-context(.block.cdk-focused) .content: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: ParagraphBlockComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-paragraph-block', imports: [
                        ContentEditorContentEditableDirective
                    ], providers: [
                        {
                            provide: CONTENT_EDITOR_BLOCK,
                            useExisting: forwardRef(() => ParagraphBlockComponent),
                            multi: true
                        }
                    ], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                        'class': 'ngs-paragraph-block',
                        '[class.is-empty]': '_isEmpty()'
                    }, template: "<p #contentRef\n   class=\"content\"\n   [ngsContentEditorContentEditable]=\"_content()\"\n   [settings]=\"settings()\"\n   [props]=\"props()\"\n   (propsChanged)=\"onPropsChanged($event)\"\n   [attr.data-empty-placeholder]=\"placeholder()\"\n   (contentChanged)=\"onContentChanged($event)\"\n   (pressedEnter)=\"onPressedEnter($event)\"\n   (keydown)=\"_onKeyDown($event)\"\n   (initialized)=\"onContentEditableInitialized()\"></p>\n", styles: [":host{display:block;position:relative}:host p{line-height:var(--leading-normal)}:host .content{outline:none}:host-context(.block.is-active) .content:empty:before,:host-context(.block.cdk-focused) .content: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 }] }], props: [{ type: i0.Input, args: [{ isSignal: true, alias: "props", required: false }] }], index: [{ type: i0.Input, args: [{ isSignal: true, alias: "index", required: true }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }] } });

export { ParagraphBlockComponent };
//# sourceMappingURL=ngstarter-ui-components-content-editor-paragraph-block.component-DjgGUc7s.mjs.map
