import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
import { s as snakeCaseToHumanReadable, f as formatDate, a as formatTime } from './utils2.js';
import { B as card, h as heading2, C as table, D as tableHeadCell, E as tableCell } from './parts.js';
import { S as Skeleton } from './skeleton.js';
import './justifi-details2.js';
import './event-types.js';
import './justifi-radio-list-item2.js';

const BusinessDocumentsOnFile = /*@__PURE__*/ proxyCustomElement(class BusinessDocumentsOnFile extends HTMLElement {
    constructor(registerHost) {
        super();
        if (registerHost !== false) {
            this.__registerHost();
        }
        this.documents = [];
        this.isLoading = false;
    }
    render() {
        if (this.isLoading) {
            return h(Skeleton, { height: "50px" });
        }
        if (!this.documents.length) {
            return null;
        }
        return (h(Host, null, h("div", { class: "card", part: card }, h("div", { class: "card-body" }, h("h5", { class: "card-title", part: heading2 }, "Documents Already on File"), h("div", { class: "table-responsive" }, h("table", { class: "table table-sm table-borderless", part: table }, h("thead", null, h("tr", null, h("th", { style: { width: "25%" }, part: tableHeadCell, scope: "col" }, "File Name"), h("th", { style: { width: "25%" }, part: tableHeadCell, scope: "col" }, "File Type"), h("th", { style: { width: "25%" }, part: tableHeadCell, scope: "col" }, "Document Type"), h("th", { style: { width: "25%" }, part: tableHeadCell, scope: "col" }, "Date Uploaded"))), h("tbody", null, this.documents.sort((a, b) => a.document_type.localeCompare(b.document_type))
            .map((document, index) => {
            return (h("tr", { class: index === 0 ? "border-bottom border-top" : "border-bottom" }, h("td", { part: tableCell }, document.file_name), h("td", { part: tableCell }, document.file_type), h("td", { part: tableCell }, snakeCaseToHumanReadable(document.document_type)), h("td", { part: tableCell }, `${formatDate(document.created_at)} - ${formatTime(document.created_at)}`)));
        })))))), h("hr", null)));
    }
}, [256, "business-documents-on-file", {
        "documents": [8],
        "isLoading": [4, "is-loading"]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["business-documents-on-file"];
    components.forEach(tagName => { switch (tagName) {
        case "business-documents-on-file":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, BusinessDocumentsOnFile);
            }
            break;
    } });
}
defineCustomElement();

export { BusinessDocumentsOnFile as B, defineCustomElement as d };
