var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { html, css, customElement } from '../../../../../../external/lit/index.js';
import { UmbTextStyles } from '../../../../style/index.js';
import { UmbModalBaseElement } from '../../../../modal/index.js';
let UmbExamineFieldsSettingsModalElement = class UmbExamineFieldsSettingsModalElement extends UmbModalBaseElement {
    render() {
        return html `<umb-body-layout headline=${this.localize.term('general_fields')}>
			<uui-scroll-container id="field-settings"> ${this.#renderFields()} </uui-scroll-container>
			<div slot="actions">
				<uui-button
					look="primary"
					label=${this.localize.term('general_close')}
					@click="${this._submitModal}"></uui-button>
			</div>
		</umb-body-layout>`;
    }
    #setExposed(fieldSetting) {
        const newField = { ...fieldSetting, exposed: !fieldSetting.exposed };
        const updatedFields = this.modalContext?.getValue().fields.map((field) => {
            if (field.name === fieldSetting.name)
                return newField;
            else
                return field;
        }) ?? [];
        this.modalContext?.updateValue({ fields: updatedFields });
    }
    #renderFields() {
        if (!this.value.fields.length)
            return;
        return html `<span>
			${Object.values(this.value.fields).map((field) => {
            return html `<uui-toggle
						name="${field.name}"
						label="${field.name}"
						.checked="${field.exposed}"
						@change="${() => this.#setExposed(field)}"></uui-toggle>
					<br />`;
        })}
		</span>`;
    }
    static { this.styles = [
        UmbTextStyles,
        css `
			:host {
				display: relative;
			}

			uui-scroll-container {
				overflow-y: scroll;
				height: 100%;
				max-height: 100%;
				min-height: 0;
				flex: 1;
			}
		`,
    ]; }
};
UmbExamineFieldsSettingsModalElement = __decorate([
    customElement('umb-examine-fields-settings-modal')
], UmbExamineFieldsSettingsModalElement);
export { UmbExamineFieldsSettingsModalElement };
export default UmbExamineFieldsSettingsModalElement;
