import { __esDecorate, __runInitializers } from "tslib";
import { html } from 'lit';
import { ifDefined } from 'lit/directives/if-defined.js';
import { classMap } from 'lit/directives/class-map.js';
import { Activity } from './Activity.js';
import state from '../decorators/state.js';
import { IntentResult } from './ActivityManager.js';
import '../md/dialog/ui-dialog.js';
import '../md/button/ui-text-button.js';
/**
 * A special kind of activity that renders content in a modal dialog.
 * When a modal activity is running the underlying activities are paused.
 *
 * A modal activity uses the UiDialogElement to render its content. The dialog
 * is inserted directly into the `<body>` element of the document and rendered
 * in the top layer. Because of that, the modal activity does not support
 * regular rendering logic. It creates its own render root that is used to render
 * the template.
 */
let ModalActivity = (() => {
    let _classSuper = Activity;
    let _opened_decorators;
    let _opened_initializers = [];
    let _opened_extraInitializers = [];
    return class ModalActivity extends _classSuper {
        static {
            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
            _opened_decorators = [state()];
            __esDecorate(this, null, _opened_decorators, { kind: "accessor", name: "opened", static: false, private: false, access: { has: obj => "opened" in obj, get: obj => obj.opened, set: (obj, value) => { obj.opened = value; } }, metadata: _metadata }, _opened_initializers, _opened_extraInitializers);
            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
        }
        /**
         * The list of classes to apply to the dialog.
         */
        dialogClasses = {};
        #opened_accessor_storage = __runInitializers(this, _opened_initializers, true
        /**
         * The id of the form used to render the dialog.
         */
        );
        /**
         * Controls dialog visibility without controlling the activity state.
         */
        get opened() { return this.#opened_accessor_storage; }
        set opened(value) { this.#opened_accessor_storage = value; }
        /**
         * The id of the form used to render the dialog.
         */
        formId = __runInitializers(this, _opened_extraInitializers);
        onResume() {
            this.renderRoot = document.createElement('div');
            this.renderRoot.classList.add('modal-activit-container');
            document.body.appendChild(this.renderRoot);
            super.onResume();
            this.requestUpdate();
        }
        async finish() {
            if (this.renderRoot) {
                document.body.removeChild(this.renderRoot);
                this.renderRoot = undefined;
            }
            await super.finish();
        }
        handleDialogClosed(e) {
            const { cancelled, value } = e.detail;
            if (cancelled) {
                this.handleNegativeAction(value);
            }
            else {
                this.handlePositiveAction(value);
            }
        }
        /**
         * Called when the dialog is closed with a negative action.
         * Override this function to handle the negative action.
         * @param value The value passed to the dialog when it is closed.
         */
        handleNegativeAction(value) {
            this.setResult(IntentResult.RESULT_CANCELED, value);
            this.finish();
        }
        /**
         * Called when the dialog is closed with a positive action.
         * Override this function to handle the positive action.
         * @param value The value passed to the dialog when it is closed.
         */
        // eslint-disable-next-line @typescript-eslint/no-unused-vars
        handlePositiveAction(value) {
            this.finish();
        }
        /**
         * Override this method to handle the form submission.
         * @param e The submit event.
         */
        handleSubmit(e) {
            e.preventDefault();
        }
        /**
         * The function called by the rendered when rendering this dialog.
         * This way, the `render()` function is still used as the primary template provider.
         */
        renderDialog() {
            const classes = {
                activityDialog: true,
                [this.constructor.name.toLowerCase()]: true,
                ...this.dialogClasses,
            };
            return html `<ui-dialog modal .open="${this.opened}" class="${classMap(classes)}" @close="${this.handleDialogClosed}"
      >${this.render()}</ui-dialog
    >`;
        }
        /**
         * Used with dialogs that render forms. Override the `handleSubmit` method
         * to handle the form submission.
         * @param content The content to render in the form.
         * @param name Optional form name
         */
        renderForm(content, name) {
            if (!this.formId) {
                this.formId = `form-${this.constructor.name.toLowerCase()}`;
            }
            return html `<form
      id="${this.formId}"
      name="${ifDefined(name)}"
      class="dialog-content"
      @submit="${this.handleSubmit}"
    >
      ${content}
    </form>`;
        }
        /**
         * Renders the cancel button for the dialog.
         * @param label The label to use for the cancel button.
         */
        renderNegativeButton(init = {}) {
            const { label = 'Cancel' } = init;
            return html `<ui-text-button slot="button" type="button" value="dismiss">${label}</ui-text-button>`;
        }
        /**
         * Renders the submit button for the dialog.
         * If the formId is set, the button will be a submit button.
         * Otherwise, it will be a regular button.
         * @param label The label to use for the submit button.
         */
        renderPositiveButton(init = {}) {
            const { label = 'OK', disabled = false } = init;
            const { formId } = this;
            const type = formId ? 'submit' : 'button';
            // UI buttons have a proper support for form association.
            return html `<ui-text-button
      slot="button"
      ?disabled="${disabled}"
      type="${type}"
      value="confirm"
      form="${ifDefined(formId)}"
      >${label}</ui-text-button
    >`;
        }
        /**
         * Renders the title for the dialog.
         * @param title The title to render in the dialog.
         */
        renderTitle(title) {
            return html `<span slot="title">${title}</span>`;
        }
    };
})();
export { ModalActivity };
//# sourceMappingURL=ModalActivity.js.map