import { moveItemInArray, transferArrayItem, CdkDropList, CdkDrag, CdkDragPreview, CdkDragPlaceholder } from '@angular/cdk/drag-drop';
import * as i0 from '@angular/core';
import { EventEmitter, Injectable, inject, Component, Input, Output, ContentChildren, NgModule } from '@angular/core';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { TemplateDirective, TemplateModule } from '@seniorsistemas/angular-components/template';
import { NgTemplateOutlet, NgClass } from '@angular/common';
import * as i1 from '@angular/forms';
import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { ButtonComponent } from '@seniorsistemas/angular-components/button';
import { BadgeComponent } from '@seniorsistemas/angular-components/badge';
import { TranslatePipe } from '@ngx-translate/core';
import { TieredMenuDirective } from '@seniorsistemas/angular-components/tiered-menu';

class KanbanEventService {
    selectAllColumnItemsEvent = new EventEmitter();
    unselectAllColumnItemsEvent = new EventEmitter();
    selectItemEvent = new EventEmitter();
    unselectItemEvent = new EventEmitter();
    emitSelectAllColumnItemsEvent(column) {
        this.selectAllColumnItemsEvent.emit(column);
    }
    emitUnselectAllColumnItemsEvent(column) {
        this.unselectAllColumnItemsEvent.emit(column);
    }
    emitSelectItemEvent(item) {
        this.selectItemEvent.emit(item);
    }
    emitUnselectItemEvent(item) {
        this.unselectItemEvent.emit(item);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanEventService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanEventService });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanEventService, decorators: [{
            type: Injectable
        }] });

class KanbanColumnComponent {
    kanbanEventService = inject(KanbanEventService);
    data;
    showCheckbox = true;
    headerTemplate = null;
    selectionControl = new FormControl(false);
    tieredMenuOptions;
    _unsubscribe$ = new Subject();
    ngOnInit() {
        this._validateInputs();
        this._subscriveEvents();
        this._createTieredOptions();
        this.tieredMenuOptions = this.data.options ? this.data.options : [];
    }
    ngOnDestroy() {
        this._unsubscribe$.next();
        this._unsubscribe$.complete();
    }
    _createTieredOptions() {
        if (!this.data.options)
            return;
        const options = [];
        this.data.options.forEach((option) => {
            options.push({
                ...option,
                command: () => {
                    option.command(this.data);
                },
            });
        });
        this.data.options = options;
    }
    _subscriveEvents() {
        this.selectionControl.valueChanges.pipe(takeUntil(this._unsubscribe$)).subscribe((value) => {
            if (value) {
                this.kanbanEventService.emitSelectAllColumnItemsEvent(this.data);
            }
            else {
                this.kanbanEventService.emitUnselectAllColumnItemsEvent(this.data);
            }
        });
        this.kanbanEventService.unselectItemEvent.pipe(takeUntil(this._unsubscribe$)).subscribe((_) => {
            this.selectionControl.setValue(false, { emitEvent: false });
        });
        this.kanbanEventService.selectItemEvent.pipe(takeUntil(this._unsubscribe$)).subscribe((item) => {
            if (!this.data.items.includes(item)) {
                this.selectionControl.setValue(false, { emitEvent: false });
            }
        });
        this.kanbanEventService.selectAllColumnItemsEvent
            .pipe(takeUntil(this._unsubscribe$))
            .subscribe((column) => {
            if (this.data !== column) {
                this.selectionControl.setValue(false, { emitEvent: false });
            }
        });
        this.kanbanEventService.unselectAllColumnItemsEvent
            .pipe(takeUntil(this._unsubscribe$))
            .subscribe((column) => {
            if (this.data !== column) {
                this.selectionControl.setValue(false, { emitEvent: false });
            }
        });
    }
    _validateInputs() {
        if (!this.data) {
            throw new Error('data parameter is required');
        }
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: KanbanColumnComponent, isStandalone: true, selector: "s-kanban-column", inputs: { data: "data", showCheckbox: "showCheckbox", headerTemplate: "headerTemplate" }, ngImport: i0, template: "<div class=\"kanban-column\">\n    <div class=\"kanban-column__header\">\n        <div class=\"content\">\n            <form>\n                @if (showCheckbox) {\n                    <input\n                        type=\"checkbox\"\n                        name=\"checkbox\"\n                        [formControl]=\"selectionControl\"\n                    />\n                }\n            </form>\n\n            @if (!headerTemplate) {\n                <div class=\"header\">\n                    <span class=\"title\">{{ data.title }} ({{ data.items.length }})</span>\n                </div>\n            } @else {\n                <ng-container *ngTemplateOutlet=\"headerTemplate; context: { $implicit: data }\"></ng-container>\n            }\n        </div>\n        @if (data.options) {\n            <s-button\n                priority=\"default\"\n                [disabled]=\"false\"\n                [auxiliary]=\"true\"\n                size=\"small\"\n                [menuOptions]=\"tieredMenuOptions\"\n            >\n            </s-button>\n        }\n    </div>\n    <div class=\"kanban-column__body\">\n        <ng-content></ng-content>\n    </div>\n</div>\n", styles: [".kanban-column{align-items:center;background-color:#fbfafc;border:1px solid #dedce5;display:flex;flex-direction:column;height:100%;min-height:120px;-webkit-user-select:none;user-select:none;width:100%}.kanban-column .kanban-column__header{align-items:center;border-bottom:1px solid #dedce5;display:flex;justify-content:space-between;padding:16px 16px 8px;width:100%}.kanban-column .kanban-column__header .content{display:flex;gap:16px}.kanban-column .kanban-column__header .content .teste{display:flex;flex-direction:column;font-family:\"Open Sans\" sans-serif}.kanban-column .kanban-column__header .content .teste .title{font-size:14px;font-weight:800}.kanban-column .kanban-column__header .content .teste .description{font-size:12px}.kanban-column .kanban-column__body{display:flex;height:100%;justify-content:center;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "s-button", inputs: ["id", "label", "tooltip", "tooltipPosition", "iconClass", "rightIconClass", "caret", "styleClass", "baseZIndex", "disabled", "auxiliary", "type", "priority", "menuOptions", "size", "slide", "animation", "badge", "iconColor", "menuAriaLabel", "ariaLabel"], outputs: ["clicked"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanColumnComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-kanban-column', standalone: true, imports: [FormsModule, ReactiveFormsModule, NgTemplateOutlet, ButtonComponent], template: "<div class=\"kanban-column\">\n    <div class=\"kanban-column__header\">\n        <div class=\"content\">\n            <form>\n                @if (showCheckbox) {\n                    <input\n                        type=\"checkbox\"\n                        name=\"checkbox\"\n                        [formControl]=\"selectionControl\"\n                    />\n                }\n            </form>\n\n            @if (!headerTemplate) {\n                <div class=\"header\">\n                    <span class=\"title\">{{ data.title }} ({{ data.items.length }})</span>\n                </div>\n            } @else {\n                <ng-container *ngTemplateOutlet=\"headerTemplate; context: { $implicit: data }\"></ng-container>\n            }\n        </div>\n        @if (data.options) {\n            <s-button\n                priority=\"default\"\n                [disabled]=\"false\"\n                [auxiliary]=\"true\"\n                size=\"small\"\n                [menuOptions]=\"tieredMenuOptions\"\n            >\n            </s-button>\n        }\n    </div>\n    <div class=\"kanban-column__body\">\n        <ng-content></ng-content>\n    </div>\n</div>\n", styles: [".kanban-column{align-items:center;background-color:#fbfafc;border:1px solid #dedce5;display:flex;flex-direction:column;height:100%;min-height:120px;-webkit-user-select:none;user-select:none;width:100%}.kanban-column .kanban-column__header{align-items:center;border-bottom:1px solid #dedce5;display:flex;justify-content:space-between;padding:16px 16px 8px;width:100%}.kanban-column .kanban-column__header .content{display:flex;gap:16px}.kanban-column .kanban-column__header .content .teste{display:flex;flex-direction:column;font-family:\"Open Sans\" sans-serif}.kanban-column .kanban-column__header .content .teste .title{font-size:14px;font-weight:800}.kanban-column .kanban-column__header .content .teste .description{font-size:12px}.kanban-column .kanban-column__body{display:flex;height:100%;justify-content:center;width:100%}\n"] }]
        }], propDecorators: { data: [{
                type: Input,
                args: [{ required: true }]
            }], showCheckbox: [{
                type: Input
            }], headerTemplate: [{
                type: Input
            }] } });

class KanbanItemDraggingComponent {
    quantityItems = 0;
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanItemDraggingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: KanbanItemDraggingComponent, isStandalone: true, selector: "s-kanban-item-dragging", inputs: { quantityItems: "quantityItems" }, ngImport: i0, template: "<div class=\"kanban-item-dragging-container\">\r\n    @if (quantityItems) {\r\n        <div class=\"kanban-item-dragging\"></div>\r\n    }\r\n\r\n    <div\r\n        class=\"kanban-item-dragging\"\r\n        [ngClass]=\"{ 'kanban-item-dragging--over': quantityItems }\"\r\n    >\r\n        <div class=\"content\">\r\n            <input\r\n                type=\"checkbox\"\r\n                checked\r\n            />\r\n            <s-badge\r\n                [text]=\"'platform.angular_components.count_items_selected' | translate: { count: quantityItems }\"\r\n                color=\"blue\"\r\n            >\r\n            </s-badge>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".kanban-item-dragging-container:has(.kanban-item-dragging--over){padding-top:12px}.kanban-item-dragging{background-color:#fff;border:1px solid #428bca;border-radius:4px;box-shadow:0 1px 5px #00000040;height:52px;padding:16px;width:260px}.kanban-item-dragging .content{display:flex;gap:16px}.kanban-item-dragging--over{left:12px;position:relative;top:-64px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: BadgeComponent, selector: "s-badge", inputs: ["type", "color", "title", "text", "selectable", "iconClass", "iconPosition", "infoSign", "enableTruncateText"], outputs: ["selected"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanItemDraggingComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-kanban-item-dragging', standalone: true, imports: [NgClass, BadgeComponent, TranslatePipe], template: "<div class=\"kanban-item-dragging-container\">\r\n    @if (quantityItems) {\r\n        <div class=\"kanban-item-dragging\"></div>\r\n    }\r\n\r\n    <div\r\n        class=\"kanban-item-dragging\"\r\n        [ngClass]=\"{ 'kanban-item-dragging--over': quantityItems }\"\r\n    >\r\n        <div class=\"content\">\r\n            <input\r\n                type=\"checkbox\"\r\n                checked\r\n            />\r\n            <s-badge\r\n                [text]=\"'platform.angular_components.count_items_selected' | translate: { count: quantityItems }\"\r\n                color=\"blue\"\r\n            >\r\n            </s-badge>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [".kanban-item-dragging-container:has(.kanban-item-dragging--over){padding-top:12px}.kanban-item-dragging{background-color:#fff;border:1px solid #428bca;border-radius:4px;box-shadow:0 1px 5px #00000040;height:52px;padding:16px;width:260px}.kanban-item-dragging .content{display:flex;gap:16px}.kanban-item-dragging--over{left:12px;position:relative;top:-64px}\n"] }]
        }], propDecorators: { quantityItems: [{
                type: Input
            }] } });

class KanbanItemComponent {
    _kanbanEventService = inject(KanbanEventService);
    item;
    selected = false;
    showCheckbox = true;
    headerTemplate = null;
    bodyTemplate = null;
    footerTemplate = null;
    kanbanItemOptions = [];
    ngOnInit() {
        this._convertToTieredMenuItemData();
    }
    onSelectedChange(value) {
        if (value) {
            this._kanbanEventService.emitSelectItemEvent(this.item);
        }
        else {
            this._kanbanEventService.emitUnselectItemEvent(this.item);
        }
    }
    _convertToTieredMenuItemData() {
        if (!this.item.options)
            return;
        const options = [];
        this.item.options.forEach((option) => {
            options.push({
                ...option,
                command: () => option.command(this.item),
            });
        });
        this.kanbanItemOptions = options;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: KanbanItemComponent, isStandalone: true, selector: "s-kanban-item", inputs: { item: "item", selected: "selected", showCheckbox: "showCheckbox", headerTemplate: "headerTemplate", bodyTemplate: "bodyTemplate", footerTemplate: "footerTemplate" }, ngImport: i0, template: "<div\r\n    class=\"kanban-item\"\r\n    [ngClass]=\"{\r\n        'kanban-item--selected': selected && !item.disabled,\r\n        'kanban-item--disabled': item.disabled,\r\n        'kanban-item--frozen': !item.disabled && item.frozen,\r\n    }\"\r\n>\r\n    <div class=\"kanban-item__header\">\r\n        <div class=\"content\">\r\n            <form>\r\n                @if (showCheckbox && !item.disabled && !item.frozen) {\r\n                    <input\r\n                        type=\"checkbox\"\r\n                        name=\"checkbox\"\r\n                        [(ngModel)]=\"selected\"\r\n                        (ngModelChange)=\"onSelectedChange($event)\"\r\n                        (click)=\"$event.stopPropagation()\"\r\n                    />\r\n                }\r\n            </form>\r\n            <ng-container *ngTemplateOutlet=\"headerTemplate; context: { $implicit: item }\"></ng-container>\r\n        </div>\r\n        @if (item.options && !item.disabled) {\r\n            <button\r\n                class=\"options-button\"\r\n                (click)=\"$event.stopPropagation()\"\r\n                sTieredMenu\r\n                [items]=\"kanbanItemOptions\"\r\n            >\r\n                <i class=\"fas fa-ellipsis-v\"></i>\r\n            </button>\r\n        }\r\n    </div>\r\n    <div class=\"kanban-item__body\">\r\n        <ng-container *ngTemplateOutlet=\"bodyTemplate; context: { $implicit: item }\"></ng-container>\r\n    </div>\r\n    @if (footerTemplate) {\r\n        <div class=\"kanban-item__footer\">\r\n            <ng-container *ngTemplateOutlet=\"footerTemplate; context: { $implicit: item }\"></ng-container>\r\n        </div>\r\n    }\r\n</div>\r\n", styles: [".kanban-item{background-color:#fff;border-radius:4px;box-shadow:0 1px 5px #00000040;cursor:pointer;display:flex;flex-direction:column;margin:16px;min-width:260px;padding:16px;-webkit-user-select:none;user-select:none}.kanban-item .kanban-item__header{display:flex;justify-content:space-between}.kanban-item .kanban-item__header .content{display:flex;gap:16px}.kanban-item .kanban-item__header .options-button{background-color:transparent;border:none;cursor:pointer;margin-right:-8px;padding:0 8px}.kanban-item .kanban-item__body{margin:16px 0}.kanban-item .kanban-item__footer{border-top:1px solid #dedce5;display:flex;justify-content:space-between}.kanban-item .kanban-item__footer .date-info{align-items:center;color:#6e7280;display:flex;font-family:\"Open Sans\" sans-serif;font-size:12px;gap:4px;line-height:150%}.kanban-item--selected{border:1px solid #428BCA}.kanban-item--disabled{opacity:50%}.kanban-item--frozen{box-shadow:none}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TieredMenuDirective, selector: "[sTieredMenu]", inputs: ["items", "focusedItem", "triggerEvent", "ariaLabel"], outputs: ["tieredMenuOpened", "tieredMenuClosed"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanItemComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-kanban-item', standalone: true, imports: [NgClass, FormsModule, NgTemplateOutlet, TieredMenuDirective], template: "<div\r\n    class=\"kanban-item\"\r\n    [ngClass]=\"{\r\n        'kanban-item--selected': selected && !item.disabled,\r\n        'kanban-item--disabled': item.disabled,\r\n        'kanban-item--frozen': !item.disabled && item.frozen,\r\n    }\"\r\n>\r\n    <div class=\"kanban-item__header\">\r\n        <div class=\"content\">\r\n            <form>\r\n                @if (showCheckbox && !item.disabled && !item.frozen) {\r\n                    <input\r\n                        type=\"checkbox\"\r\n                        name=\"checkbox\"\r\n                        [(ngModel)]=\"selected\"\r\n                        (ngModelChange)=\"onSelectedChange($event)\"\r\n                        (click)=\"$event.stopPropagation()\"\r\n                    />\r\n                }\r\n            </form>\r\n            <ng-container *ngTemplateOutlet=\"headerTemplate; context: { $implicit: item }\"></ng-container>\r\n        </div>\r\n        @if (item.options && !item.disabled) {\r\n            <button\r\n                class=\"options-button\"\r\n                (click)=\"$event.stopPropagation()\"\r\n                sTieredMenu\r\n                [items]=\"kanbanItemOptions\"\r\n            >\r\n                <i class=\"fas fa-ellipsis-v\"></i>\r\n            </button>\r\n        }\r\n    </div>\r\n    <div class=\"kanban-item__body\">\r\n        <ng-container *ngTemplateOutlet=\"bodyTemplate; context: { $implicit: item }\"></ng-container>\r\n    </div>\r\n    @if (footerTemplate) {\r\n        <div class=\"kanban-item__footer\">\r\n            <ng-container *ngTemplateOutlet=\"footerTemplate; context: { $implicit: item }\"></ng-container>\r\n        </div>\r\n    }\r\n</div>\r\n", styles: [".kanban-item{background-color:#fff;border-radius:4px;box-shadow:0 1px 5px #00000040;cursor:pointer;display:flex;flex-direction:column;margin:16px;min-width:260px;padding:16px;-webkit-user-select:none;user-select:none}.kanban-item .kanban-item__header{display:flex;justify-content:space-between}.kanban-item .kanban-item__header .content{display:flex;gap:16px}.kanban-item .kanban-item__header .options-button{background-color:transparent;border:none;cursor:pointer;margin-right:-8px;padding:0 8px}.kanban-item .kanban-item__body{margin:16px 0}.kanban-item .kanban-item__footer{border-top:1px solid #dedce5;display:flex;justify-content:space-between}.kanban-item .kanban-item__footer .date-info{align-items:center;color:#6e7280;display:flex;font-family:\"Open Sans\" sans-serif;font-size:12px;gap:4px;line-height:150%}.kanban-item--selected{border:1px solid #428BCA}.kanban-item--disabled{opacity:50%}.kanban-item--frozen{box-shadow:none}\n"] }]
        }], propDecorators: { item: [{
                type: Input,
                args: [{ required: true }]
            }], selected: [{
                type: Input
            }], showCheckbox: [{
                type: Input
            }], headerTemplate: [{
                type: Input
            }], bodyTemplate: [{
                type: Input
            }], footerTemplate: [{
                type: Input
            }] } });

/**
 * @description Componente de quadro Kanban com suporte a arrastar e soltar colunas e itens.
 * Permite seleção via checkboxes, templates customizáveis para cabeçalho, corpo e rodapé
 * dos cards, além de emitir eventos de movição e seleção.
 *
 * @example
 * ```html
 * <s-kanban
 *   [data]="dadosKanban"
 *   (itemsMoved)="onItemMovido($event)" />
 * ```
 *
 * @category Data
 */
class KanbanComponent {
    kanbanEventService = inject(KanbanEventService);
    /** @description Dados do quadro Kanban com colunas e itens. Campo obrigatório. */
    data;
    /** @description Exibe checkboxes de seleção em cada item Kanban. @default true */
    showItemCheckboxes = true;
    /** @description Exibe checkboxes de seleção no cabeçalho de cada coluna. @default true */
    showColumnCheckboxes = true;
    /** @description Emitido quando o usuário move um item entre colunas ou posições. */
    itemsMoved = new EventEmitter();
    /** @description Emitido quando os dados do quadro são atualizados após movição. */
    dataUpdated = new EventEmitter();
    /** @description Emitido quando a seleção de itens muda, com a lista de itens selecionados. */
    itemsSelected = new EventEmitter();
    selectedColumn = null;
    selectedItems = new Set();
    draggingItems = new Set();
    columnHeaderTemplate = null;
    columnEmptyMessageTemplate = null;
    itemHeaderTemplate = null;
    itemBodyTemplate = null;
    itemFooterTemplate = null;
    _instanceId = `kanban-${Math.random().toString(36).substring(2, 9)}-${Date.now().toString(36)}`;
    _columnIdMap = new Map();
    _unsubscribe$ = new Subject();
    templates = null;
    ngOnInit() {
        this._subscribeEvents();
        this._normalizeData();
        this._validateInputs();
    }
    ngAfterContentInit() {
        this._getTemplates();
    }
    ngOnDestroy() {
        this._unsubscribe$.next();
        this._unsubscribe$.complete();
    }
    drop(event) {
        const previousColumn = this.data.columns.find((column) => column.id === event.previousContainer.id);
        const targetColumn = this.data.columns.find((column) => column.id === event.container.id);
        if (!previousColumn || !targetColumn) {
            throw new Error('Unable to obtain information about columns when performing drag and drop');
        }
        if (event.previousContainer === event.container) {
            moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
        }
        else {
            transferArrayItem(event.previousContainer.data, event.container.data, event.previousIndex, event.currentIndex);
        }
        this.selectedItems.forEach((item) => {
            const previousIndex = event.previousContainer.data.indexOf(item);
            if (previousIndex !== -1 && item !== event.item.data) {
                if (event.previousContainer === event.container) {
                    moveItemInArray(event.container.data, previousIndex, event.currentIndex);
                }
                else {
                    transferArrayItem(event.previousContainer.data, event.container.data, previousIndex, event.currentIndex);
                }
            }
        });
        this.selectedItems.add(event.item.data);
        this.itemsMoved.emit({
            items: [...this.selectedItems],
            previousColumn,
            targetColumn,
        });
        if (this.dataUpdated.observers?.length) {
            this.dataUpdated.emit({ ...this.data });
        }
        this.data.columns.forEach((column) => {
            this.kanbanEventService.emitUnselectAllColumnItemsEvent(column);
        });
        this.selectedItems.clear();
    }
    selectItem(event, item, column) {
        if (item.disabled || item.frozen)
            return;
        if (event.ctrlKey) {
            if (this.selectedItems.delete(item)) {
                this.kanbanEventService.emitUnselectItemEvent(item);
            }
            else {
                if (this.selectedColumn && !this.selectedColumn.items.includes(item)) {
                    this.selectedItems.clear();
                }
                this.selectedItems.add(item);
                this.selectedColumn = column;
                this.kanbanEventService.emitSelectItemEvent(item);
            }
        }
        else {
            if (this.selectedItems.delete(item))
                return;
            this.selectedItems.clear();
            this.selectedItems.add(item);
            this.selectedColumn = column;
            this.kanbanEventService.emitSelectItemEvent(item);
        }
    }
    dragStarted() {
        this.selectedItems.forEach((item) => {
            this.draggingItems.add(item);
        });
    }
    dragReleased() {
        this.draggingItems.clear();
    }
    getLinkedColumns(currentColumn) {
        return this.data.columns
            .filter((column) => column != currentColumn)
            .map((column) => column.id ?? '');
    }
    getColumnHeaderTemplate() {
        return this._getCustomTemplate('column-header') ?? null;
    }
    getColumnEmptyMessageTemplate() {
        return this._getCustomTemplate('column-empty-message') ?? null;
    }
    getItemHeaderTemplate() {
        return this._getCustomTemplate('item-header') ?? null;
    }
    getItemBodyTemplate() {
        return this._getCustomTemplate('item-body') ?? null;
    }
    getItemFooterTemplate() {
        return this._getCustomTemplate('item-footer') ?? null;
    }
    _getCustomTemplate(type) {
        return this.templates?.find((template) => template.type === type)?.template ?? null;
    }
    _subscribeEvents() {
        this.kanbanEventService.selectAllColumnItemsEvent
            .pipe(takeUntil(this._unsubscribe$))
            .subscribe((column) => {
            column.items
                .filter((item) => !item.disabled && !item.frozen)
                .forEach((item) => {
                this.selectedItems.add(item);
            });
            this.selectedColumn = column;
            this.itemsSelected.emit([...this.selectedItems]);
        });
        this.kanbanEventService.unselectAllColumnItemsEvent.pipe(takeUntil(this._unsubscribe$)).subscribe((_) => {
            this.selectedItems.clear();
        });
        this.kanbanEventService.selectItemEvent.pipe(takeUntil(this._unsubscribe$)).subscribe((item) => {
            if (this.selectedColumn && !this.selectedColumn.items.includes(item)) {
                this.selectedItems.clear();
            }
            this.selectedItems.add(item);
            this.itemsSelected.emit([...this.selectedItems]);
            // Finding the item column and setting selectedColumn.
            this.data.columns.forEach((column) => {
                column.items.forEach((currentItem) => {
                    if (currentItem === item) {
                        this.selectedColumn = column;
                        return;
                    }
                });
            });
        });
        this.kanbanEventService.unselectItemEvent.pipe(takeUntil(this._unsubscribe$)).subscribe((item) => {
            this.selectedItems.delete(item);
        });
    }
    _normalizeData() {
        this.data.columns.forEach((column) => {
            const originalId = column.id || `col-${Math.random().toString(36).substring(2, 9)}`;
            // Não mutar column.id, manter original
            if (!column.id) {
                column.id = originalId;
            }
            // Criar ID único para esta instância
            const uniqueId = `${this._instanceId}-${originalId}`;
            this._columnIdMap.set(originalId, uniqueId);
        });
    }
    _validateInputs() {
        const columns = this.data.columns;
        const columnIds = this.data.columns.map((column) => column.id);
        if (new Set(columnIds).size !== columns.length) {
            throw new Error('Repeated IDs are not accepted.');
        }
    }
    _getTemplates() {
        this.columnHeaderTemplate = this.getColumnHeaderTemplate();
        this.columnEmptyMessageTemplate = this.getColumnEmptyMessageTemplate();
        this.itemHeaderTemplate = this.getItemHeaderTemplate();
        this.itemBodyTemplate = this.getItemBodyTemplate();
        this.itemFooterTemplate = this.getItemFooterTemplate();
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: KanbanComponent, isStandalone: true, selector: "s-kanban", inputs: { data: "data", showItemCheckboxes: "showItemCheckboxes", showColumnCheckboxes: "showColumnCheckboxes" }, outputs: { itemsMoved: "itemsMoved", dataUpdated: "dataUpdated", itemsSelected: "itemsSelected" }, queries: [{ propertyName: "templates", predicate: TemplateDirective }], ngImport: i0, template: "<div class=\"kanban\">\r\n    @for (column of data.columns; track column) {\r\n        <s-kanban-column\r\n            [data]=\"column\"\r\n            [showCheckbox]=\"showColumnCheckboxes\"\r\n            [headerTemplate]=\"columnHeaderTemplate\"\r\n        >\r\n            <div\r\n                [id]=\"column.id + ''\"\r\n                style=\"height: 100%; width: 100%\"\r\n                cdkDropList\r\n                #dynamicList=\"cdkDropList\"\r\n                [cdkDropListData]=\"column.items\"\r\n                [cdkDropListConnectedTo]=\"getLinkedColumns(column)\"\r\n                (cdkDropListDropped)=\"drop($event)\"\r\n            >\r\n                @if (column.items.length === 0) {\r\n                    @if (!columnEmptyMessageTemplate) {\r\n                        <div class=\"empty-message\">\r\n                            <p class=\"text\">\r\n                                <span class=\"fas fa-clock\"></span>&nbsp;\r\n                                <span>{{\r\n                                    'platform.angular_components.count_items_in_target'\r\n                                        | translate: { count: column.items.length, target: column.title }\r\n                                }}</span>\r\n                            </p>\r\n                        </div>\r\n                    } @else {\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"columnEmptyMessageTemplate; context: { $implicit: column }\"\r\n                        ></ng-container>\r\n                    }\r\n                }\r\n                @for (item of column.items; track item) {\r\n                    <div\r\n                        cdkDrag\r\n                        [cdkDragData]=\"item\"\r\n                        [cdkDragDisabled]=\"item.disabled || item.frozen\"\r\n                        (cdkDragStarted)=\"dragStarted()\"\r\n                        (cdkDragReleased)=\"dragReleased()\"\r\n                        (click)=\"selectItem($event, item, column)\"\r\n                    >\r\n                        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\r\n                        <ng-container *cdkDragPreview>\r\n                            @if (selectedItems.size > 1) {\r\n                                <s-kanban-item-dragging [quantityItems]=\"selectedItems.size\"></s-kanban-item-dragging>\r\n                            } @else {\r\n                                <div class=\"max-w-96\">\r\n                                    <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\r\n                                </div>\r\n                            }\r\n                        </ng-container>\r\n                        <ng-template #itemTemplate>\r\n                            <s-kanban-item\r\n                                [item]=\"item\"\r\n                                [selected]=\"selectedItems.has(item)\"\r\n                                [showCheckbox]=\"showItemCheckboxes\"\r\n                                [headerTemplate]=\"itemHeaderTemplate\"\r\n                                [bodyTemplate]=\"itemBodyTemplate\"\r\n                                [footerTemplate]=\"itemFooterTemplate\"\r\n                            >\r\n                            </s-kanban-item>\r\n                        </ng-template>\r\n                        <div *cdkDragPlaceholder>\r\n                            <div class=\"placeholder\">\r\n                                <div class=\"placeholder-line\"></div>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                }\r\n            </div>\r\n        </s-kanban-column>\r\n    }\r\n</div>\r\n", styles: [".kanban{display:flex;gap:16px;overflow:auto;width:100%}.kanban .empty-message{display:flex;justify-content:center;margin:16px}.kanban .empty-message .text{overflow:hidden;text-align:center;text-overflow:ellipsis;width:100%;white-space:nowrap}@media screen and (max-width: 600px){.kanban{flex-direction:column}}s-kanban-column{display:flex;flex-grow:1;min-width:292px}.placeholder{display:flex;justify-content:center}.placeholder .placeholder-line{background-color:#a5a5b2;height:1px;margin:6px 0;width:50%}\n"], dependencies: [{ kind: "component", type: KanbanColumnComponent, selector: "s-kanban-column", inputs: ["data", "showCheckbox", "headerTemplate"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDragPreview, selector: "ng-template[cdkDragPreview]", inputs: ["data", "matchSize"] }, { kind: "component", type: KanbanItemDraggingComponent, selector: "s-kanban-item-dragging", inputs: ["quantityItems"] }, { kind: "component", type: KanbanItemComponent, selector: "s-kanban-item", inputs: ["item", "selected", "showCheckbox", "headerTemplate", "bodyTemplate", "footerTemplate"] }, { kind: "directive", type: CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-kanban', standalone: true, imports: [
                        KanbanColumnComponent,
                        CdkDropList,
                        NgTemplateOutlet,
                        CdkDrag,
                        CdkDragPreview,
                        KanbanItemDraggingComponent,
                        KanbanItemComponent,
                        CdkDragPlaceholder,
                        TranslatePipe,
                    ], template: "<div class=\"kanban\">\r\n    @for (column of data.columns; track column) {\r\n        <s-kanban-column\r\n            [data]=\"column\"\r\n            [showCheckbox]=\"showColumnCheckboxes\"\r\n            [headerTemplate]=\"columnHeaderTemplate\"\r\n        >\r\n            <div\r\n                [id]=\"column.id + ''\"\r\n                style=\"height: 100%; width: 100%\"\r\n                cdkDropList\r\n                #dynamicList=\"cdkDropList\"\r\n                [cdkDropListData]=\"column.items\"\r\n                [cdkDropListConnectedTo]=\"getLinkedColumns(column)\"\r\n                (cdkDropListDropped)=\"drop($event)\"\r\n            >\r\n                @if (column.items.length === 0) {\r\n                    @if (!columnEmptyMessageTemplate) {\r\n                        <div class=\"empty-message\">\r\n                            <p class=\"text\">\r\n                                <span class=\"fas fa-clock\"></span>&nbsp;\r\n                                <span>{{\r\n                                    'platform.angular_components.count_items_in_target'\r\n                                        | translate: { count: column.items.length, target: column.title }\r\n                                }}</span>\r\n                            </p>\r\n                        </div>\r\n                    } @else {\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"columnEmptyMessageTemplate; context: { $implicit: column }\"\r\n                        ></ng-container>\r\n                    }\r\n                }\r\n                @for (item of column.items; track item) {\r\n                    <div\r\n                        cdkDrag\r\n                        [cdkDragData]=\"item\"\r\n                        [cdkDragDisabled]=\"item.disabled || item.frozen\"\r\n                        (cdkDragStarted)=\"dragStarted()\"\r\n                        (cdkDragReleased)=\"dragReleased()\"\r\n                        (click)=\"selectItem($event, item, column)\"\r\n                    >\r\n                        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\r\n                        <ng-container *cdkDragPreview>\r\n                            @if (selectedItems.size > 1) {\r\n                                <s-kanban-item-dragging [quantityItems]=\"selectedItems.size\"></s-kanban-item-dragging>\r\n                            } @else {\r\n                                <div class=\"max-w-96\">\r\n                                    <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\r\n                                </div>\r\n                            }\r\n                        </ng-container>\r\n                        <ng-template #itemTemplate>\r\n                            <s-kanban-item\r\n                                [item]=\"item\"\r\n                                [selected]=\"selectedItems.has(item)\"\r\n                                [showCheckbox]=\"showItemCheckboxes\"\r\n                                [headerTemplate]=\"itemHeaderTemplate\"\r\n                                [bodyTemplate]=\"itemBodyTemplate\"\r\n                                [footerTemplate]=\"itemFooterTemplate\"\r\n                            >\r\n                            </s-kanban-item>\r\n                        </ng-template>\r\n                        <div *cdkDragPlaceholder>\r\n                            <div class=\"placeholder\">\r\n                                <div class=\"placeholder-line\"></div>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                }\r\n            </div>\r\n        </s-kanban-column>\r\n    }\r\n</div>\r\n", styles: [".kanban{display:flex;gap:16px;overflow:auto;width:100%}.kanban .empty-message{display:flex;justify-content:center;margin:16px}.kanban .empty-message .text{overflow:hidden;text-align:center;text-overflow:ellipsis;width:100%;white-space:nowrap}@media screen and (max-width: 600px){.kanban{flex-direction:column}}s-kanban-column{display:flex;flex-grow:1;min-width:292px}.placeholder{display:flex;justify-content:center}.placeholder .placeholder-line{background-color:#a5a5b2;height:1px;margin:6px 0;width:50%}\n"] }]
        }], propDecorators: { data: [{
                type: Input,
                args: [{ required: true }]
            }], showItemCheckboxes: [{
                type: Input
            }], showColumnCheckboxes: [{
                type: Input
            }], itemsMoved: [{
                type: Output
            }], dataUpdated: [{
                type: Output
            }], itemsSelected: [{
                type: Output
            }], templates: [{
                type: ContentChildren,
                args: [TemplateDirective]
            }] } });

class KanbanModule {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: KanbanModule, imports: [TemplateModule, KanbanComponent], exports: [KanbanComponent, TemplateModule] });
    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanModule, providers: [KanbanEventService], imports: [TemplateModule, KanbanComponent, TemplateModule] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KanbanModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [TemplateModule, KanbanComponent],
                    exports: [KanbanComponent, TemplateModule],
                    providers: [KanbanEventService],
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { KanbanComponent, KanbanModule };
//# sourceMappingURL=seniorsistemas-angular-components-kanban.mjs.map
