import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-b153bfd0.js';
import { c as config } from './config-5a775b7a.js';
import { L as Locale } from './locale-e5107fad.js';
import { r as renderListItems } from './render-list-item-7a57cb7a.js';

const filesToListItemsData = (files) => {
    const itemsData = [];
    files.forEach(file => {
        const itemId = typeof file === "string" ? file : file.name;
        const itemValue = typeof file === "string" ? file : file.name;
        const itemIcon = undefined;
        const itemChecked = false;
        itemsData.push({
            itemId: itemId,
            itemValue: itemValue,
            itemIcon: itemIcon,
            itemChecked: itemChecked
        });
    });
    return itemsData;
};

const bpmImportFilesCss = ":host{display:grid;block-size:100%}.opacity-0{opacity:0}.gxi-hidden{display:none !important}.align-center{display:flex;align-items:center}.align-end{display:flex;align-items:end}.overflow-auto{overflow:auto}:host(.gx-ide-component){height:100% !important;display:flex !important;flex-direction:column !important}.gx-ide-main-wrapper{color:var(--gx-ide-component-text-color);font-weight:var(--font-style-regular);font-size:var(--font-size-body-m);font-family:var(--font-family-body);height:100%;display:flex;flex-direction:column;flex-grow:1;box-sizing:border-box}.buttons-container{display:flex;gap:var(--spacing-gap-m)}.giu-static-pill-icon-and-text,.giu-static-pill{background-color:var(--elevation-background-color, var(--color-accent-surface-elevation-1));padding-inline:var(--spacing-padding-m);color:var(--color-text-neutral-default);font-size:var(--font-size-body-s);line-height:var(--line-height-relaxed);font-weight:var(--font-style-regular);border-radius:4px;min-block-size:25px;display:inline-grid;align-items:center;pointer-events:none;inline-size:max-content}.giu-static-pill-icon-and-text{display:inline-grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--spacing-gap-m)}.tab-full-width-buttons::part(tab-list block-start),.tab-full-width-buttons::part(tab-list block-end){grid-auto-columns:1fr}.tab-full-width-buttons::part(tab block-start){justify-content:center}.tree-view::part(item__header){--icon__system_warning_warning--disabled:var(\n    --icon__system_warning_warning--enabled\n  )}.tabular-grid{--focus-outline-width:1px}.control-wrapper{display:flex;gap:var(--spacing-gap-m);align-items:center}.control-wrapper--vertical{flex-direction:column;align-items:start}.controls-wrapper{display:flex;gap:var(--spacing-gap-m)}.controls-wrapper--vertical{flex-direction:column;align-items:start}.input-text{box-sizing:border-box;background-color:transparent;border:1px solid var(--color-border-neutral-default);border-radius:4px;height:26px;color:var(--color-text-neutral-default);font-size:var(--font-size-body-xs)}.input-text--full-width{align-self:stretch}:host{display:block}.main{display:grid;grid-template-rows:1fr auto;block-size:100%;gap:var(--spacing-gap-l)}.path-list{inline-size:100%;block-size:100%}gx-ide-list-selector::part(list){block-size:100%}.hidden-input{display:none}.checkbox-container{display:flex;gap:var(--spacing-gap-m)}.footer{display:flex;flex-direction:column;gap:var(--spacing-gap-l)}";

const GxIdeTemplate = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.componentDidRenderFirstTime = createEvent(this, "componentDidRenderFirstTime", 7);
        this.selectionChanged = createEvent(this, "selectionChanged", 7);
        this.renderedFirstTime = false;
        // 7.LISTENERS //
        // 8.PUBLIC METHODS API //
        // 9.LOCAL METHODS //
        this.fileSelectionChangedHandler = (selectedItem) => {
            this.selectionChanged.emit();
            const selectedFiles = Array.isArray(selectedItem.detail)
                ? selectedItem.detail
                : [selectedItem.detail];
            this.selectedFiles = selectedFiles.map(item => item.itemValue);
        };
        this.loadFileHandle = async () => {
            this.fileInput.click();
        };
        this.handleFileInputChange = (event) => {
            const fileInput = event.target;
            if (fileInput.files && fileInput.files.length > 0) {
                const newFiles = Array.from(fileInput.files);
                const uniqueFiles = newFiles.filter(newFile => !this.files.some(existingFile => existingFile.name === newFile.name));
                this.files = [...this.files, ...uniqueFiles];
            }
            this.fileInput.value = null;
        };
        this.confirmCallbackHandle = async () => {
            if (this.confirmCallback && this.files.length > 0) {
                const data = {
                    automaticBackup: this.automaticBackupEl.value === "true",
                    files: this.files
                };
                await this.confirmCallback(data);
            }
        };
        this.removeFiles = (filesToRemove) => {
            this.files = this.files.filter(file => !filesToRemove.includes(file.name));
            this.selectedFiles = [];
            this.fileInput.value = null;
        };
        this.handleRemoveButtonClick = () => {
            this.removeFiles(this.selectedFiles);
        };
        this.files = [];
        this.selectedFiles = [];
        this.displayTitle = false;
        this.allowedExtensions = undefined;
        this.confirmCallback = undefined;
        this.cancelCallback = undefined;
    }
    // 6.COMPONENT LIFECYCLE METHODS //
    async componentWillLoad() {
        this._componentLocale = await Locale.getComponentStrings(this.el);
    }
    componentDidRender() {
        if (!this.renderedFirstTime) {
            this.componentDidRenderFirstTime.emit(this._componentLocale.componentName);
            this.renderedFirstTime = true;
        }
    }
    // 10.RENDER() FUNCTION //
    render() {
        var _a;
        return (h(Host, { class: "gx-ide-component" }, h("div", { class: "gx-ide-main-wrapper" }, h("gx-ide-container", { slimmerFooter: config.gxIdeContainer.slimmerFooter }, h("div", { class: "main" }, h("div", { class: "controls-wrapper controls-wrapper--vertical" }, h("label", { htmlFor: "path-list" }, this._componentLocale.main.listLabel), h("gx-ide-list-selector", { id: "path-list", type: "multi-selection", listName: "path-list", ordered: true, onSelectionChanged: this.fileSelectionChangedHandler, class: "path-list" }, renderListItems(filesToListItemsData(this.files)))), h("div", { class: "footer" }, h("div", { class: "checkbox-container" }, h("ch-checkbox", { id: "automatic-backup", accessibleName: this._componentLocale.main.automaticBackupLabel, checkedValue: "true", unCheckedValue: "false", value: "checked", ref: (el) => (this.automaticBackupEl = el) }), h("label", { htmlFor: "automatic-backup" }, this._componentLocale.main.automaticBackupLabel)), h("div", { class: "controls-wrapper" }, h("input", { type: "file", id: "input_file", accept: (_a = this.allowedExtensions) === null || _a === void 0 ? void 0 : _a.join(", "), ref: el => (this.fileInput = el), onChange: this.handleFileInputChange, class: "hidden-input", multiple: true }), h("button", { onClick: this.loadFileHandle }, this._componentLocale.main.addFilesButton), h("button", { onClick: this.handleRemoveButtonClick, disabled: this.selectedFiles.length === 0 }, this._componentLocale.main.removeFilesButton, " (", this.selectedFiles.length, ")")))), h("button", { slot: "footer-end", onClick: this.confirmCallbackHandle }, this._componentLocale.footer.confirmButton), h("button", { slot: "footer-end", onClick: this.cancelCallback }, this._componentLocale.footer.cancelButton)))));
    }
    static get assetsDirs() { return ["gx-ide-assets/bpm-import-files"]; }
    get el() { return getElement(this); }
};
GxIdeTemplate.style = bpmImportFilesCss;

export { GxIdeTemplate as gx_ide_bpm_import_files };

//# sourceMappingURL=gx-ide-bpm-import-files.entry.js.map