import { __esDecorate, __runInitializers } from "tslib";
import { RequestConfig } from '@api-client/core/models/RequestConfig.js';
import { html, nothing } from 'lit';
import { property } from 'lit/decorators.js';
import { live } from 'lit/directives/live.js';
import ApiElement from '../ApiElement.js';
import '../../md/switch/ui-switch.js';
import '../../md/text-field/ui-filled-text-field.js';
let RequestConfigElement = (() => {
    let _classSuper = ApiElement;
    let _config_decorators;
    let _config_initializers = [];
    let _config_extraInitializers = [];
    return class RequestConfigElement extends _classSuper {
        static {
            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
            _config_decorators = [property({ type: Object })];
            __esDecorate(this, null, _config_decorators, { kind: "accessor", name: "config", static: false, private: false, access: { has: obj => "config" in obj, get: obj => obj.config, set: (obj, value) => { obj.config = value; } }, metadata: _metadata }, _config_initializers, _config_extraInitializers);
            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
        }
        #config_accessor_storage = __runInitializers(this, _config_initializers, new RequestConfig().toJSON());
        /**
         * HTTP request configuration for the transport.
         */
        get config() { return this.#config_accessor_storage; }
        set config(value) { this.#config_accessor_storage = value; }
        handleEnabledToggle(e) {
            const node = e.currentTarget;
            this.config.enabled = !!node.checked;
            this.notifyChange();
            this.requestUpdate();
        }
        handleFollowRedirects(e) {
            const node = e.currentTarget;
            this.config.followRedirects = node.checked;
            this.notifyChange();
        }
        handleIgnoreCookies(e) {
            const node = e.currentTarget;
            this.config.ignoreSessionCookies = node.checked;
            this.notifyChange();
        }
        handleValidateCertificates(e) {
            const node = e.currentTarget;
            this.config.validateCertificates = node.checked;
            this.notifyChange();
        }
        handleDefaultHeaders(e) {
            const node = e.currentTarget;
            this.config.defaultHeaders = node.checked;
            this.notifyChange();
            this.requestUpdate();
        }
        handleTimeoutChange(e) {
            const input = e.target;
            const raw = input.value.trim();
            if (!raw) {
                delete this.config.timeout;
                this.requestUpdate();
            }
            else {
                const num = Number(raw);
                if (Number.isNaN(num)) {
                    input.setCustomValidity('Invalid input.');
                    input.checkValidity();
                    return;
                }
                if (this.config.timeout === num) {
                    return;
                }
                this.config.timeout = num;
            }
            input.setCustomValidity('');
            input.checkValidity();
            this.notifyChange();
            this.requestUpdate();
        }
        handleDefaultUserAgentChange(e) {
            const input = e.target;
            const raw = input.value.trim();
            if (!raw) {
                if (!this.config.defaultUserAgent) {
                    this.requestUpdate();
                    return;
                }
                delete this.config.defaultUserAgent;
                this.requestUpdate();
            }
            else {
                if (this.config.defaultUserAgent === raw) {
                    return;
                }
                this.config.defaultUserAgent = raw;
            }
            this.notifyChange();
        }
        handleDefaultAcceptChange(e) {
            const input = e.target;
            const raw = input.value.trim();
            if (!raw) {
                if (!this.config.defaultAccept) {
                    this.requestUpdate();
                    return;
                }
                delete this.config.defaultAccept;
                this.requestUpdate();
            }
            else {
                if (this.config.defaultAccept === raw) {
                    return;
                }
                this.config.defaultAccept = raw;
            }
            this.notifyChange();
        }
        render() {
            return html `
      ${this.renderPanelTitle()} ${this.renderEnableSwitch()} ${this.renderRedirectsConfig()}
      ${this.renderIgnoreSessionCookiesConfig()} ${this.renderValidateCertificatesConfig()}
      ${this.renderDefaultHeadersConfig()} ${this.renderDefaultUserAgentConfig()} ${this.renderDefaultAcceptConfig()}
      ${this.renderTimeoutConfig()}
    `;
        }
        renderPanelTitle() {
            return html `
      <div class="title-medium">Request options</div>
      <p class="body-medium">This overrides other configurations defined in the application.</p>
    `;
        }
        renderEnableSwitch() {
            const { enabled = false } = this.config;
            return html `
      <div class="form-row">
        <ui-switch
          name="enabled"
          .checked="${enabled}"
          @change="${this.handleEnabledToggle}"
          title="Toggle options enabled"
          aria-label="Toggle options enabled"
          id="enable"
        ></ui-switch>
        <label class="label-large" for="enable"> Enable custom request options </label>
      </div>
    `;
        }
        renderRedirectsConfig() {
            const { enabled = false, followRedirects = false } = this.config;
            if (!enabled) {
                return nothing;
            }
            return html `
      <div class="form-row">
        <ui-switch
          name="followRedirects"
          id="followRedirects"
          .checked="${followRedirects}"
          @change="${this.handleFollowRedirects}"
          title="Toggle follow redirects"
          aria-label="Toggle follow redirects"
        ></ui-switch>
        <label class="label-large" for="followRedirects"> Follow redirects </label>
      </div>
    `;
        }
        renderTimeoutConfig() {
            const { enabled = false, timeout = 90 } = this.config;
            if (!enabled) {
                return nothing;
            }
            const value = typeof timeout === 'number' ? String(timeout) : '';
            return html `
      <div class="form-row">
        <ui-filled-text-field
          name="timeout"
          label="Request timeout"
          .value="${live(value)}"
          @change="${this.handleTimeoutChange}"
          supportingText="0 for no timeout, clear for default."
          inputMode="numeric"
          invalidText="Enter a positive integer or zero."
        ></ui-filled-text-field>
      </div>
    `;
        }
        renderDefaultUserAgentConfig() {
            const { enabled = false, defaultUserAgent = 'api-client', defaultHeaders = false } = this.config;
            if (!enabled || !defaultHeaders) {
                return nothing;
            }
            return html `
      <div class="form-row">
        <ui-filled-text-field
          name="defaultUserAgent"
          label="Default user agent"
          .value="${live(defaultUserAgent)}"
          @change="${this.handleDefaultUserAgentChange}"
        ></ui-filled-text-field>
      </div>
    `;
        }
        renderDefaultAcceptConfig() {
            const { enabled = false, defaultAccept = '*/*', defaultHeaders = false } = this.config;
            if (!enabled || !defaultHeaders) {
                return nothing;
            }
            return html `
      <div class="form-row">
        <ui-filled-text-field
          name="defaultAccept"
          label="Default accept"
          .value="${live(defaultAccept)}"
          @change="${this.handleDefaultAcceptChange}"
        ></ui-filled-text-field>
      </div>
    `;
        }
        renderIgnoreSessionCookiesConfig() {
            const { enabled = false, ignoreSessionCookies = false } = this.config;
            if (!enabled) {
                return nothing;
            }
            return html `
      <div class="form-row">
        <ui-switch
          name="ignoreSessionCookies"
          id="ignoreSessionCookies"
          .checked="${ignoreSessionCookies}"
          @change="${this.handleIgnoreCookies}"
          title="Toggle ignore cookies"
          aria-label="Toggle ignore cookies"
        ></ui-switch>
        <label class="label-large" for="ignoreSessionCookies"> Ignore cookies </label>
      </div>
    `;
        }
        renderValidateCertificatesConfig() {
            const { enabled = false, validateCertificates = false } = this.config;
            if (!enabled) {
                return nothing;
            }
            return html `
      <div class="form-row">
        <ui-switch
          name="validateCertificates"
          id="validateCertificates"
          .checked="${validateCertificates}"
          @change="${this.handleValidateCertificates}"
          title="Toggle validate certificates"
          aria-label="Toggle validate certificates"
        ></ui-switch>
        <label class="label-large" for="validateCertificates"> Validate certificates </label>
      </div>
    `;
        }
        renderDefaultHeadersConfig() {
            const { enabled = false, defaultHeaders = false } = this.config;
            if (!enabled) {
                return nothing;
            }
            return html `
      <div class="form-row">
        <ui-switch
          name="defaultHeaders"
          id="defaultHeaders"
          .checked="${defaultHeaders}"
          @change="${this.handleDefaultHeaders}"
          title="Toggle validate certificates"
          aria-label="Toggle validate certificates"
        ></ui-switch>
        <label class="label-large" for="defaultHeaders">
          Add default headers to the request (accept and user agent)
        </label>
      </div>
    `;
        }
        constructor() {
            super(...arguments);
            __runInitializers(this, _config_extraInitializers);
        }
    };
})();
/**
 * @fires change - when the configuration object changed.
 */
export default RequestConfigElement;
//# sourceMappingURL=RequestConfigElement.js.map