import { __esDecorate, __runInitializers } from "tslib";
import { bound } from '../../decorators/bound.js';
import { DEFAULT_STATUS_CONFIG } from '@api-client/core/modeling/definitions/Status.js';
import { html } from 'lit';
import { SemanticType } from '@api-client/core/modeling/Semantics.js';
import { renderHelp } from '../../help/render.js';
import { TaxonomyDialog } from './TaxonomyDialog.js';
import '../../md/chip/ui-chip-set.js';
import '../../md/chip/ui-chip.js';
/**
 * A class that generates a dialog that allows the user to configure the taxonomy of a status field.
 */
let StatusTaxonomy = (() => {
    let _classSuper = TaxonomyDialog;
    let _instanceExtraInitializers = [];
    let _handleAllowedStatesChange_decorators;
    let _handleRemoveStatus_decorators;
    let _render_decorators;
    return class StatusTaxonomy extends _classSuper {
        static {
            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
            _handleAllowedStatesChange_decorators = [bound];
            _handleRemoveStatus_decorators = [bound];
            _render_decorators = [bound];
            __esDecorate(this, null, _handleAllowedStatesChange_decorators, { kind: "method", name: "handleAllowedStatesChange", static: false, private: false, access: { has: obj => "handleAllowedStatesChange" in obj, get: obj => obj.handleAllowedStatesChange }, metadata: _metadata }, null, _instanceExtraInitializers);
            __esDecorate(this, null, _handleRemoveStatus_decorators, { kind: "method", name: "handleRemoveStatus", static: false, private: false, access: { has: obj => "handleRemoveStatus" in obj, get: obj => obj.handleRemoveStatus }, metadata: _metadata }, null, _instanceExtraInitializers);
            __esDecorate(this, null, _render_decorators, { kind: "method", name: "render", static: false, private: false, access: { has: obj => "render" in obj, get: obj => obj.render }, metadata: _metadata }, null, _instanceExtraInitializers);
            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
        }
        domainElement = __runInitializers(this, _instanceExtraInitializers);
        static title = `Configure Status Taxonomy`;
        /**
         * The enum values defined for the property, if any.
         * These values take precedence over the default values defined in the StatusConfig.
         */
        propertyEnum;
        constructor(domainElement) {
            let config;
            const semantic = domainElement.semantics.find((s) => s.id === SemanticType.Status);
            if (semantic && semantic.config) {
                config = structuredClone(semantic.config);
            }
            else {
                config = {};
            }
            super(config);
            this.domainElement = domainElement;
            this.propertyEnum = domainElement.schema?.enum;
        }
        formCallback(event) {
            const semantic = this.domainElement.semantics.find((s) => s.id === SemanticType.Status);
            if (semantic) {
                semantic.config = this.config;
            }
            else {
                this.domainElement.semantics.push({
                    id: SemanticType.Status,
                    config: this.config,
                });
            }
            this.domainElement.domain.notifyChange();
            return super.formCallback(event);
        }
        handleAllowedStatesChange(event) {
            const input = event.target;
            const value = input.value.trim();
            if (value) {
                const states = this.config?.allowedStates ?? DEFAULT_STATUS_CONFIG.allowedStates ?? [];
                if (!states.includes(value)) {
                    states.push(value);
                    this.config = { ...this.config, allowedStates: states };
                    this.requestUpdate();
                }
                input.value = '';
            }
        }
        handleRemoveStatus(event) {
            const chip = event.currentTarget;
            const index = parseInt(chip.dataset.index || '-1', 10);
            if (index >= 0 && this.config?.allowedStates) {
                this.config.allowedStates.splice(index, 1);
                this.requestUpdate();
            }
        }
        render() {
            if (this.propertyEnum && this.propertyEnum.length > 0) {
                return html ` <div class="content">${this.renderEnumSetMessage()}</div> `;
            }
            return html `${this.renderIntro()}
      <div class="input-group">${this.renderAllowedStatesInput()}</div> `;
        }
        renderIntro() {
            return html `<div class="row">
        <span class="body-medium input">
          Define a list of valid states for this property (e.g., "Pending", "Active", "Completed"). This ensures data
          consistency and helps drive business workflows.
        </span>
        ${renderHelp('taxonomy', 'status:overview')}
      </div>
      <span class="body-medium">
        <strong>Note:</strong> If you define a list of "Enum Values" in the main property editor, that list will be used
        instead of the states defined here.
      </span>`;
        }
        renderEnumSetMessage() {
            return html `<div class="row">
      <span class="body-medium input">
        This property has a list of "Enum Values" defined in its main schema. Therefore, that list is being used as the
        source for allowed statuses.
      </span>
      ${renderHelp('taxonomy', 'status:enumIntegration')}
    </div>`;
        }
        renderAllowedStatesInput() {
            const value = this.config?.allowedStates ?? DEFAULT_STATUS_CONFIG.allowedStates;
            const chips = (value || []).map((state, index) => html `<ui-chip type="input" removable data-index="${index}" @remove="${this.handleRemoveStatus}"
          >${state}</ui-chip
        >`);
            return html `
      <div class="row input-row">
        <div class="input chips-input">
          <ui-outlined-text-field
            class="input"
            name="allowedStates"
            label="Allowed States"
            @change="${this.handleAllowedStatesChange}"
            supportingText="Add a state and press Enter to add it to the list."
          ></ui-outlined-text-field>
          <ui-chip-set>${chips}</ui-chip-set>
        </div>
        ${renderHelp('taxonomy', 'status:allowedStates')}
      </div>
    `;
        }
    };
})();
export { StatusTaxonomy };
//# sourceMappingURL=StatusTaxonomy.js.map