import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
import { l as lodashExports } from './lodash.js';
import './config-state.js';
import { e as convertToUTC, h as convertToLocal } from './utils2.js';
import { I as ICheckoutStatus, g as ICheckoutPaymentModeParam } from './Plaid.js';
import './Pagination.js';
import './Business.js';
import './ApplePay.js';
import { f as filterParams, p as propsParams, c as clearParams } from './checkouts-list-params-state.js';
import { ad as filterMenu, ae as filterParam } from './parts.js';
import { S as StyledHost } from './styled-host.js';
import './justifi-details2.js';
import './event-types.js';
import './justifi-radio-list-item2.js';
import { d as defineCustomElement$7 } from './custom-popper2.js';
import { d as defineCustomElement$6 } from './form-control-date2.js';
import { d as defineCustomElement$5 } from './form-control-select2.js';
import { d as defineCustomElement$4 } from './form-control-text2.js';
import { d as defineCustomElement$3 } from './form-control-tooltip2.js';
import { d as defineCustomElement$2 } from './table-filters-menu2.js';

const JustifiCheckoutsListFilters$1 = /*@__PURE__*/ proxyCustomElement(class JustifiCheckoutsListFilters extends HTMLElement {
    constructor(registerHost) {
        super();
        if (registerHost !== false) {
            this.__registerHost();
        }
        this.__attachShadow();
        this.setParamsOnChange = (name, value) => {
            filterParams[name] = value;
        };
        this.handleDateInput = (name, value) => {
            const utcDate = convertToUTC(value, { setExactTime: true });
            this.setParamsOnChange(name, utcDate);
        };
    }
    componentWillLoad() {
        // debounced input handler for text input
        this.debouncedSetParamsOnChange = lodashExports.debounce(this.setParamsOnChange, 300);
        const propsToSet = {
            status: this.checkoutStatus,
            payment_mode: this.paymentMode,
            checkout_id: this.checkoutId,
            successful_payment_id: this.successfulPaymentId,
            created_after: this.createdAfter,
            created_before: this.createdBefore
        };
        Object.entries(propsToSet).forEach(([key, value]) => {
            if (value) {
                propsParams[key] = value;
            }
        });
    }
    get checkoutStatusOptions() {
        return [
            { label: 'All', value: '' },
            { label: 'Created', value: ICheckoutStatus.created },
            { label: 'Completed', value: ICheckoutStatus.completed },
            { label: 'Attempted', value: ICheckoutStatus.attempted },
            { label: 'Expired', value: ICheckoutStatus.expired },
        ];
    }
    get checkoutPaymentModeOptions() {
        return [
            { label: 'All', value: '' },
            { label: 'E-commerce', value: ICheckoutPaymentModeParam.ecom },
            { label: 'BNPL', value: ICheckoutPaymentModeParam.bnpl },
            { label: 'Apple Pay', value: ICheckoutPaymentModeParam.apple_pay },
        ];
    }
    render() {
        const filterMenuParams = Object.assign({}, filterParams);
        return (h(StyledHost, { key: '1c4b39ee0103e6905affa774f202dd76f147bc89' }, h("table-filters-menu", { key: '9cb0457d0e6ce05925f4e0da04532008020dd46e', params: filterMenuParams, clearParams: clearParams, part: filterMenu }, h("div", { key: 'e5c370717e3cf2571f2017d185c7f3ea08eab1c8', class: "grid-cols-2 gap-3 p-1" }, h("div", { key: '2e3c1832bb800fa9065b189a299234fafa7eb4e3', class: "p-2" }, h("form-control-text", { key: '33e1e31d842aa0b8c47e3ea1bc12cc860691f5e3', name: "checkout_id", label: "Checkout ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.checkoutId || filterParams.checkout_id, disabled: !!this.checkoutId, part: filterParam })), h("div", { key: '4dcfe2f56d8405f376eb4aa52deaea0fb64e8ff5', class: "p-2" }, h("form-control-text", { key: '272ba42827048aa45ada6090eaf9574950ebaca2', name: "successful_payment_id", label: "Successful Payment ID", inputHandler: this.debouncedSetParamsOnChange, defaultValue: this.successfulPaymentId || filterParams.successful_payment_id, disabled: !!this.successfulPaymentId, part: filterParam })), h("div", { key: '7c4e0ad12e0031a70aeaec5a0423d9b0b45c70a4', class: "p-2" }, h("form-control-select", { key: '87775c3a0d1de63301dde682f79a7c2c11a4958b', name: "status", label: "Status", options: this.checkoutStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.checkoutStatus || filterParams.status || '', disabled: !!this.checkoutStatus, part: filterParam })), h("div", { key: 'e751b51d9e2725addd6e9b082bf326fc039b0a7a', class: "p-2" }, h("form-control-select", { key: '642fc1af53bc89d1604a864f4088781096cd24a2', name: "payment_mode", label: "Payment Mode", options: this.checkoutPaymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || filterParams.payment_mode || '', disabled: !!this.paymentMode, part: filterParam })), h("div", { key: 'a95638261e002677c51299342d34bafc8a8615b4', class: "p-2" }, h("form-control-date", { key: 'ca017b89e5ae0ea3f4d55ade8de2acbdc2062c86', name: "created_after", label: "Created After", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdAfter, { showInputDateTime: true }) ||
                convertToLocal(filterParams.created_after, { showInputDateTime: true }), showTime: true, disabled: !!this.createdAfter, part: filterParam })), h("div", { key: '0585dff7f655db9da4f3c2124eac6c90b74dbe3b', class: "p-2" }, h("form-control-date", { key: '50fee01232661f33c1996549cf6523c92dc937c4', name: "created_before", label: "Created Before", inputHandler: this.handleDateInput, defaultValue: convertToLocal(this.createdBefore, { showInputDateTime: true }) ||
                convertToLocal(filterParams.created_before, { showInputDateTime: true }), showTime: true, disabled: !!this.createdBefore, part: filterParam }))))));
    }
}, [257, "justifi-checkouts-list-filters", {
        "checkoutStatus": [1, "checkout-status"],
        "paymentMode": [1, "payment-mode"],
        "checkoutId": [1, "checkout-id"],
        "successfulPaymentId": [1, "successful-payment-id"],
        "createdAfter": [1, "created-after"],
        "createdBefore": [1, "created-before"]
    }]);
function defineCustomElement$1() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["justifi-checkouts-list-filters", "custom-popper", "form-control-date", "form-control-select", "form-control-text", "form-control-tooltip", "table-filters-menu"];
    components.forEach(tagName => { switch (tagName) {
        case "justifi-checkouts-list-filters":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, JustifiCheckoutsListFilters$1);
            }
            break;
        case "custom-popper":
            if (!customElements.get(tagName)) {
                defineCustomElement$7();
            }
            break;
        case "form-control-date":
            if (!customElements.get(tagName)) {
                defineCustomElement$6();
            }
            break;
        case "form-control-select":
            if (!customElements.get(tagName)) {
                defineCustomElement$5();
            }
            break;
        case "form-control-text":
            if (!customElements.get(tagName)) {
                defineCustomElement$4();
            }
            break;
        case "form-control-tooltip":
            if (!customElements.get(tagName)) {
                defineCustomElement$3();
            }
            break;
        case "table-filters-menu":
            if (!customElements.get(tagName)) {
                defineCustomElement$2();
            }
            break;
    } });
}
defineCustomElement$1();

const JustifiCheckoutsListFilters = JustifiCheckoutsListFilters$1;
const defineCustomElement = defineCustomElement$1;

export { JustifiCheckoutsListFilters, defineCustomElement };
