@justifi/webcomponents 6.0.4 → 6.0.6-rc.1

package/dist/module/table.js

@@ -1,5 +1,5 @@
 import { h } from '@stencil/core/internal/client';
-import { u as table, ar as tableHead, as as tableHeadRow, at as tableRow, au as tableFoot, av as tableFootRow, aw as tableFootCell, ax as tableEmpty, ay as tableError, w as tableCell } from './parts.js';
+import { v as table, as as tableHead, at as tableHeadRow, au as tableRow, av as tableFoot, aw as tableFootRow, ax as tableFootCell, ay as tableEmpty, az as tableError, x as tableCell } from './parts.js';
 import { S as Spinner } from './spinner.js';
 
 const TableWrapper = (props, children) => {

package/dist/module/terminal-orders-list-core2.js

@@ -8,7 +8,7 @@ import './dinero.js';
 import { f as TerminalOrderType } from './Refund.js';
 import { p as pagingDefaults } from './Pagination.js';
 import './Business.js';
-import { v as tableHeadCell, a8 as getAlternateTableCellPart } from './parts.js';
+import { w as tableHeadCell, a9 as getAlternateTableCellPart } from './parts.js';
 import { e as convertToLocal } from './utils2.js';
 import { B as Badge, a as BadgeVariant } from './badge.js';
 import { o as onQueryParamsChange, g as getRequestParams } from './terminal-orders-list-params-state.js';
@@ -164,7 +164,7 @@ const TerminalOrdersListCore = /*@__PURE__*/ proxyCustomElement(class TerminalOr
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h(TableWrapper, { key: 'a8131df17851ab1468e025932371fa4b97ccc144' }, h(TableComponent, { key: '0fc81f64fb8a8f138f25c70522d046921edbd094' }, h(TableHead, { key: '7cc8be0184008cf08128eb1f241ab670538ecc65' }, h(TableHeadRow, { key: '5a7aa37a2b8f02469ca6c703e098da9431c0b45f' }, this.terminalOrdersTable.columnData.map((column) => column))), h(TableBody, { key: 'ff32aad8d5c4f319550d47ae1e0f77b617aa3d70' }, h(TableLoadingState, { key: 'dcc25430c77867a2c9639eba359c0d54cbacb73a', columnSpan: this.terminalOrdersTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '474ecda7420d595f49777f31910a380b48a8a1bc', isEmpty: this.showEmptyState, columnSpan: this.terminalOrdersTable.columnKeys.length }), h(TableErrorState, { key: 'd91e28581823ca91778159914157a003b011caaf', columnSpan: this.terminalOrdersTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.terminalOrdersTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: '6dea4a93ab757d35916b9351e4e5fa7f76b4afd9' }, h(TableFootRow, { key: '5098c2d994bb0ba397bc94d7a0e9419b06e582a5' }, h(TableFootCell, { key: '5a8f90708691987f672cde0c102323225568d989', colSpan: this.terminalOrdersTable.columnData.length }, h("pagination-menu", { key: '509e53f4c070fc9a8b479dc673c526417aceb5ef', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
+        return (h(TableWrapper, { key: 'f642f35fa0bd514d42f94a2991ec00923159d788' }, h(TableComponent, { key: 'dc6a0488729a57c4792ae84a16c8a7d4c00e16cb' }, h(TableHead, { key: '04ebae008a9e7c29b1a5bd2efb948605857743f0' }, h(TableHeadRow, { key: '61931ebd8258c4a6e83692de4dd43cb3766cad0e' }, this.terminalOrdersTable.columnData.map((column) => column))), h(TableBody, { key: 'f8acfec2e54c75df0c5e0082ed14693f1f01169a' }, h(TableLoadingState, { key: '095f29bb7c56371397c07a22f40b17b673d7c8d1', columnSpan: this.terminalOrdersTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'fc77d1eb81ec891fbe6345e4fd23028d70c60331', isEmpty: this.showEmptyState, columnSpan: this.terminalOrdersTable.columnKeys.length }), h(TableErrorState, { key: '5a6e8f297219dc45d96d5d7e17a8636ca1b50648', columnSpan: this.terminalOrdersTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.terminalOrdersTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: '66b118f9daba0f6b8a12869d3348a06e7425f1f0' }, h(TableFootRow, { key: 'a3e149e674bb6f5a9114da1b917ddb7addf6effb' }, h(TableFootCell, { key: '34eedd1c6d8ff11935a5b411d821efd4eba1381f', colSpan: this.terminalOrdersTable.columnData.length }, h("pagination-menu", { key: '1374d80bd8c0307afae2c226f3e07b9e1cf21878', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
     }
     static get watchers() { return {
         "pagingParams": ["updateOnPropChange"],

package/dist/module/terminal-quantity-selector2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { q as card, Y as image, Z as buttonLink } from './parts.js';
+import { u as card, Z as image, _ as buttonLink } from './parts.js';
 import { d as defineCustomElement$2 } from './custom-popper2.js';
 import { d as defineCustomElement$1 } from './form-control-tooltip2.js';
 
@@ -26,7 +26,7 @@ const TerminalQuantitySelector = /*@__PURE__*/ proxyCustomElement(class Terminal
         };
     }
     render() {
-        return (h("div", { key: '852621f3c36375e9c300201e4405c95501488c6d', class: "rounded shadow-sm card p-2", part: card }, h("div", { key: '1695cd25eaf56619ef4cc39d81c11ca9b6a5cd45', class: "d-flex gap-3" }, h("div", { key: '9930b0bd8881bc70bc5bdb2b31428980ec83a49b', class: "d-flex align-items-center" }, h("img", { key: 'ac71b5e64fd9081e8dc9c962cac1e747f2234fc4', src: this.imageUrl, alt: this.modelName, height: 75, width: 75, part: image })), h("div", { key: '0d575087df793cdeaf7bc04744d60647ea7d563f', class: "d-flex flex-column flex-grow-1 gap-3 p-4 justify-content-center" }, h("div", { key: '35f18a705ee606a825c8ad7a6ebe449e6941e4e5', class: "row" }, h("div", { key: 'bf4f916904479fc7abf3167cacd9a655709a5048', class: "col-6 d-flex gap-2" }, this.modelName, h("form-control-tooltip", { key: '1a96f19f6f9732c5f8d9dbb2405de2d3f24b142d', helpText: this.description })), h("div", { key: 'af1ca75c5134c832d8f64b63833b7494c8c11ca5', class: "col-6 d-flex justify-content-end align-items-center" }, h("button", { key: '0d400a00a808c508ba870dc8e37d597581dd86ae', class: "p-0 minus btn", onClick: this.removeUnit, part: buttonLink }, "-"), h("div", { key: '4348aef4cf19c02c574242f82061087e74e82617', class: "w-25 text-center" }, this.selectedQuantity), h("button", { key: '75791dfdb7861bb7c1e4a2dc5376bceb12a19009', class: "p-0 plus btn", onClick: this.addUnit, part: buttonLink }, "+")))))));
+        return (h("div", { key: '5a0ac226861b9349ad26e184d9295052ca987ba5', class: "rounded shadow-sm card p-2", part: card }, h("div", { key: '89d2c494975c1a2d2c71d9047c44119a48c5ba11', class: "d-flex gap-3" }, h("div", { key: 'ca30020f4b3469df0a59f5ca5fa8b81a039f9d5f', class: "d-flex align-items-center" }, h("img", { key: '291fc116fff8b4d33ba3fc1bfb2ec3bd59bef007', src: this.imageUrl, alt: this.modelName, height: 75, width: 75, part: image })), h("div", { key: '56466b3e7a47f7156b40bc0e60d8158d63f5700a', class: "d-flex flex-column flex-grow-1 gap-3 p-4 justify-content-center" }, h("div", { key: '871c7d5d2575a6a26ee11d817b1cce5ce42cbffb', class: "row" }, h("div", { key: '12e3e653243d07dc4a712f9127927924e13c411a', class: "col-6 d-flex gap-2" }, this.modelName, h("form-control-tooltip", { key: 'a69d9738422defbb50ec1abb951b049e53fb5f8c', helpText: this.description })), h("div", { key: '84bc103439e64acc04b20afd0295a792c78595c5', class: "col-6 d-flex justify-content-end align-items-center" }, h("button", { key: 'e245dfcc301ef1efe2aed937af3d21eecff1004e', class: "p-0 minus btn", onClick: this.removeUnit, part: buttonLink }, "-"), h("div", { key: '30827d9946f4d82b57ee3967ab2cfe475e9ab65c', class: "w-25 text-center" }, this.selectedQuantity), h("button", { key: '758b3a72d98a540b8b92dc8b86c8abdd7d19d2a9', class: "p-0 plus btn", onClick: this.addUnit, part: buttonLink }, "+")))))));
     }
 }, [256, "terminal-quantity-selector", {
         "modelName": [1, "model-name"],

package/dist/module/terminals-list-core2.js

@@ -9,8 +9,8 @@ import { T as Table, a as TableWrapper, b as TableComponent, c as TableHead, d a
 import { T as TableClickActions } from './event-types.js';
 import './justifi-radio-list-item2.js';
 import { B as Badge, a as BadgeVariant } from './badge.js';
-import { v as tableHeadCell, a8 as getAlternateTableCellPart } from './parts.js';
-import { k as capitalFirstLetter } from './utils2.js';
+import { w as tableHeadCell, a9 as getAlternateTableCellPart } from './parts.js';
+import { l as capitalFirstLetter } from './utils2.js';
 import { o as onQueryParamsChange, g as getRequestParams } from './terminals-list-params-state.js';
 import { d as defineCustomElement$1 } from './pagination-menu2.js';
 
@@ -187,7 +187,7 @@ const TerminalsListCore = /*@__PURE__*/ proxyCustomElement(class TerminalsListCo
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h(TableWrapper, { key: '27022f23dcede378c6a6d16bffb040aa6448f4be' }, h(TableComponent, { key: '5d369cf93698adb50b843f65c747672abeb74cb4' }, h(TableHead, { key: '21173a74ccb82d7c3278157dae4ef3d471dbee5f' }, h(TableHeadRow, { key: '43e425567500ff324fd6ed68647a9504df812bf6' }, this.terminalsTable.columnData.map((column) => column))), h(TableBody, { key: '1151ee93144161308f8b27b0172acb32d2096d25' }, h(TableLoadingState, { key: '353fb24dfbd941e8bba6f62799e0feea42d05c53', columnSpan: this.terminalsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'daa19b965b5519e766ba8bbb63cfc4327128bf22', isEmpty: this.showEmptyState, columnSpan: this.terminalsTable.columnKeys.length }), h(TableErrorState, { key: 'ee44061fa93cd20a59040a7b3faaeac10a925810', columnSpan: this.terminalsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.terminalsTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: '12cb09495ba8d416fd3593ccae4f205735226ecf' }, h(TableFootRow, { key: 'da2e2695e6101193db9f67a0a76ce1ce8abdc646' }, h(TableFootCell, { key: 'bffd81b4e90e668caa47813f96ab1a7764fa0f1b', colSpan: this.terminalsTable.columnData.length }, h("pagination-menu", { key: '61c268da3402e0675f54515617a6bd2d58834e17', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
+        return (h(TableWrapper, { key: 'dd5f6ca2944a4c612c5a99e7e70b64240ff77890' }, h(TableComponent, { key: '05c34cdbf22ec62b04165259fc456b8f7f94e166' }, h(TableHead, { key: '9d55c62444326c96a8cf81f2237d6bd16ecef155' }, h(TableHeadRow, { key: 'a0f923fb4937dad46d37085f15b93097aa9453bb' }, this.terminalsTable.columnData.map((column) => column))), h(TableBody, { key: 'bb82808aaf16e572b90e09f9666384907317c617' }, h(TableLoadingState, { key: 'a5fad3901302bd468c1e8e312eb3fadedee709c4', columnSpan: this.terminalsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'f954dda201865b55141e9288219729561fc22240', isEmpty: this.showEmptyState, columnSpan: this.terminalsTable.columnKeys.length }), h(TableErrorState, { key: '8fce08061353a7ed9d5f364489cce99fb934e36c', columnSpan: this.terminalsTable.columnKeys.length, errorMessage: this.errorMessage }), this.showRowData && this.terminalsTable.rowData.map((data, index) => (h(TableRow, { "data-test-id": "table-row", "data-row-entity-id": this.entityId[index], onClick: this.rowClickHandler }, data)))), this.paging && (h(TableFoot, { key: 'e62da6a0cfca1447dce0e65999ecaee501cb1060' }, h(TableFootRow, { key: '12e0ac4fb55a6cb9960a4bc69296addccc629b54' }, h(TableFootCell, { key: '4024dfbee9409a2b1e9d22272ba23ed16c0afbe8', colSpan: this.terminalsTable.columnData.length }, h("pagination-menu", { key: '201eb194b2f8c620b5a775d7e2077c8e33de8aa2', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
     }
     static get watchers() { return {
         "pagingParams": ["updateOnPropChange"],

package/dist/module/tokenize-payment-method.js

@@ -277,7 +277,7 @@ const TokenizePaymentMethod = /*@__PURE__*/ proxyCustomElement(class TokenizePay
         return paymentMethodType === PAYMENT_METHODS.NEW_CARD ? (h("justifi-card-form", { ref: (el) => (this.paymentMethodFormRef = el) })) : (h("justifi-bank-account-form", { ref: (el) => (this.paymentMethodFormRef = el) }));
     }
     render() {
-        return (h(StyledHost, { key: '5fc5dad15215fe24b421f4d6c13355fb849b8a76' }, h("form", { key: '0e0330e5b11ee3ae0bef9e092fa2fb2a0a6af3e7' }, h("fieldset", { key: 'ee4c026ccda62a249e019a9e105e40ea465fc400' }, h("div", { key: '15a8a86fa5be8a545745260d76a8c3b2569d6a0e', class: "row gy-3" }, h("div", { key: 'bbbeed6ee96311394a876b4beb206e8e335184c2', class: "col-12" }, this.availablePaymentMethods.map((method) => this.renderPaymentMethodOption(method))), h("div", { key: 'da2a2009abe4348e25a5fc712557e81e9f6c4c1f', class: "col-12" }, h("justifi-button", { key: '050939c757999383226f281ee0eff1ec178be203', text: this.submitButtonText, variant: "primary", type: "submit", clickHandler: (e) => this.tokenizePaymentMethod(e), isLoading: this.isLoading, "data-testid": "submit-button", hidden: this.computedHideSubmitButton })))))));
+        return (h(StyledHost, { key: 'bf221d17739bf70c3f581f3b9791a725e76c3f35' }, h("form", { key: 'df117d42d4160f31df1fca5d6903967cc48ad573' }, h("fieldset", { key: '550e670feffb405c669d44c44eb9073f535c6cb6' }, h("div", { key: '8eff7d3ab19618da54161220b92641bf19bfa82d', class: "row gy-3" }, h("div", { key: 'bf9d19e92be74abf48ce65c97efb3f9df52d4c3c', class: "col-12" }, this.availablePaymentMethods.map((method) => this.renderPaymentMethodOption(method))), h("div", { key: 'eef1f4e1e03c2263efb51ae94085c5a3d73a9166', class: "col-12" }, h("justifi-button", { key: 'f0e5697e658236610da45c34e64a8cbb3f0f9d95', text: this.submitButtonText, variant: "primary", type: "submit", clickHandler: (e) => this.tokenizePaymentMethod(e), isLoading: this.isLoading, "data-testid": "submit-button", hidden: this.computedHideSubmitButton })))))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/module/utils.js

@@ -1,11 +1,11 @@
 import { h } from '@stencil/core/internal/client';
-import { h as heading2, t as text, a as heading1 } from './parts.js';
+import { h as heading2, t as text, l as link, a as heading1 } from './parts.js';
 
-const ErrorState = (errorMessage) => (h("main", { class: "p-4 d-flex justify-content-center text-center", style: { fontSize: '1.2rem' } }, h("p", { part: text }, errorMessage)));
+const ErrorState = (errorMessage) => (h("main", { class: "p-4 d-flex justify-content-center text-center", style: { fontSize: "1.2rem" } }, h("p", { part: text }, errorMessage)));
 const DetailSectionTitle = (props) => (h("h2", { part: heading2, class: "mt-4 fs-5 border-bottom pb-3" }, props.sectionTitle));
-const DetailItem = ({ title, value, }) => title && value ? (h("div", { class: "d-table-row gap-2" }, h("span", { class: "fw-bold d-table-cell px-2", part: text }, title), h("span", { class: "flex-1 d-table-cell px-2 text-wrap", part: text }, value))) : null;
+const DetailItem = ({ title, value, onClick, }) => title && value ? (h("div", { class: "row justify-content-between" }, h("div", { class: "col-12 col-md-4" }, h("span", { class: "fw-bold", part: text }, title)), h("div", { class: `col-12 col-md-8 ${onClick ? "text-decoration-underline text-primary" : ""}`, style: { cursor: onClick ? "pointer" : "auto" }, onClick: () => onClick && onClick() }, h("span", { class: "text-wrap", part: onClick ? link : text }, value)))) : null;
 const EntityHeadInfoItem = ({ title, value, classes, }) => (h("div", { class: `d-flex flex-column ${classes}` }, h("span", { class: "fw-bold border-1 border-bottom ps-2 pe-2", part: heading2 }, title), h("span", { class: "pt-2 ps-2 pe-2", part: text }, value)));
 const EntityHeadInfo = ({ title, slot, badge }, children) => (h("div", { slot: slot, class: "p-2" }, h("div", { class: "d-flex flex-row align-items-center gap-2 mb-2" }, h("h1", { class: "m-0", part: heading1 }, title), badge), h("div", { class: "d-flex flex-row align-items-top", part: text }, children)));
-const CodeBlock = ({ metadata }) => metadata && Object.keys(metadata).length ? (h("div", { class: 'mt-4' }, h("pre", { class: "p-2", "aria-label": "metadata content" }, h("code", null, JSON.stringify(metadata, null, 2))))) : null;
+const CodeBlock = ({ metadata }) => metadata && Object.keys(metadata).length ? (h("div", { class: "mt-4" }, h("pre", { class: "p-2", "aria-label": "metadata content" }, h("code", null, JSON.stringify(metadata, null, 2))))) : null;
 
 export { CodeBlock as C, DetailSectionTitle as D, ErrorState as E, DetailItem as a, EntityHeadInfo as b, EntityHeadInfoItem as c };

package/dist/module/utils2.js

@@ -22300,5 +22300,8 @@ function generateTabId() {
     return (((_a = crypto.randomUUID) === null || _a === void 0 ? void 0 : _a.call(crypto)) ||
         `${Date.now()}-${Math.random().toString(36).slice(2)}`);
 }
+function capitalizeFirstLetter(str) {
+    return str.charAt(0).toUpperCase() + str.slice(1);
+}
 
-export { formatDate as a, formatTimeSeconds as b, formatCurrency as c, formatTime as d, convertToLocal as e, formatMediumDate as f, generateId as g, convertToUTC as h, isEmptyObject as i, generateTabId as j, capitalFirstLetter as k, formatDisplayDate as l, addAttribute as m, formatPhoneNumber as n, processHTML as p, removeAttribute as r, snakeCaseToHumanReadable as s };
+export { formatDate as a, formatTimeSeconds as b, formatCurrency as c, formatTime as d, convertToLocal as e, formatMediumDate as f, generateId as g, convertToUTC as h, isEmptyObject as i, capitalizeFirstLetter as j, generateTabId as k, capitalFirstLetter as l, formatDisplayDate as m, addAttribute as n, formatPhoneNumber as o, processHTML as p, removeAttribute as r, snakeCaseToHumanReadable as s };

package/dist/types/api/Checkout.d.ts

@@ -57,6 +57,7 @@ export interface ICheckout {
         credit_card_payments: boolean;
         insurance_payments?: boolean;
         bank_account_verification?: boolean;
+        apple_payments?: boolean;
     };
     bnpl?: IBnpl;
     total_amount: number;
@@ -88,6 +89,7 @@ export declare class Checkout implements ICheckout {
         credit_card_payments: boolean;
         insurance_payments?: boolean;
         bank_account_verification?: boolean;
+        apple_payments?: boolean;
     };
     bnpl?: IBnpl;
     total_amount: number;

package/dist/types/api/ComponentEvents.d.ts

@@ -21,3 +21,7 @@ export interface ComponentErrorEvent {
     severity?: ComponentErrorSeverity;
     data?: any;
 }
+export interface RecordClickEvent {
+    id: string;
+    type: 'account' | 'payment' | 'metadata';
+}

package/dist/types/components/business-details/owner-details/owner-details.d.ts

@@ -1,4 +1,4 @@
-import { Identity } from '../../../api/Identity';
+import { Identity } from "../../../api/Identity";
 export declare class OwnerDetails {
     owners: Identity[];
     render(): any;

package/dist/types/components/business-forms/schemas/business-form-schema.d.ts

@@ -26,8 +26,8 @@ export declare const businessFormSchema: import("yup").ObjectSchema<{
             country?: string;
         };
         title?: string;
-        ssn_last4?: string;
         name?: string;
+        ssn_last4?: string;
         email?: string;
         phone?: string;
         dob_full?: string;

package/dist/types/components/payment-details/payment-details.d.ts

@@ -1,13 +1,14 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { PaymentService } from '../../api/services/payment.service';
 import JustifiAnalytics from '../../api/Analytics';
-import { ComponentErrorEvent } from '../../api/ComponentEvents';
+import { ComponentErrorEvent, RecordClickEvent } from '../../api/ComponentEvents';
 export declare class PaymentDetails {
     paymentId: string;
     authToken: string;
     getPaymentDetails: Function;
     errorMessage: string;
     errorEvent: EventEmitter<ComponentErrorEvent>;
+    recordClickEvent: EventEmitter<RecordClickEvent>;
     analytics: JustifiAnalytics;
     componentWillLoad(): void;
     disconnectedCallback(): void;
@@ -15,5 +16,6 @@ export declare class PaymentDetails {
     private initializeGetPaymentDetails;
     paymentService: PaymentService;
     handleErrorEvent: (event: any) => void;
+    handleRecordClickEvent: (event: CustomEvent<RecordClickEvent>) => void;
     render(): any;
 }

package/dist/types/components/payout-details/payout-details-core.d.ts

@@ -1,16 +1,20 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { Payout } from '../../api';
-import { ComponentErrorEvent } from '../../api/ComponentEvents';
+import { ComponentErrorEvent, RecordClickEvent } from '../../api/ComponentEvents';
 export declare class PayoutDetailsCore {
     getPayout: Function;
     getPayoutCSV: Function;
+    enableRecordClick: boolean;
     payout: Payout;
     loading: boolean;
     errorMessage: string;
     errorEvent: EventEmitter<ComponentErrorEvent>;
+    recordClickEvent: EventEmitter<RecordClickEvent>;
     componentWillLoad(): void;
     getPayoutWatcher(): void;
     fetchData(): void;
     downloadCSV: () => void;
+    formatMethod(deliveryMethod: string): string;
+    handleRecordClick: (id: string) => void;
     render(): any;
 }

package/dist/types/components/payout-details/payout-details.d.ts

@@ -4,6 +4,7 @@ import { ComponentErrorEvent } from '../../api/ComponentEvents';
 export declare class PayoutDetails {
     payoutId: string;
     authToken: string;
+    enableRecordClick: boolean;
     getPayout: Function;
     getPayoutCSV: Function;
     errorMessage: string;

package/dist/types/components.d.ts

@@ -7,16 +7,15 @@
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 import { Business, IAdditionalQuestions, IAddress } from "./api/Business";
 import { ComponentClickEvent as ComponentClickEvent1, ComponentErrorCodes, ComponentErrorEvent as ComponentErrorEvent1, ComponentFormStepCompleteEvent as ComponentFormStepCompleteEvent1, ComponentSubmitEvent as ComponentSubmitEvent1, FileSelectEvent, IApiResponse, ICheckoutPaymentModeParam, ICheckoutStatus, ILoadedEventResponse, IRefund, ITerminalStatus, TerminalModelName, TerminalOrderStatus, TerminalOrderType } from "./api";
-import { ComponentClickEvent, ComponentErrorEvent, ComponentFormStepCompleteEvent, ComponentSubmitEvent } from "./api/ComponentEvents";
+import { ComponentClickEvent, ComponentErrorEvent, ComponentFormStepCompleteEvent, ComponentSubmitEvent, RecordClickEvent } from "./api/ComponentEvents";
 import { Placement, PositioningStrategy } from "@popperjs/core";
 import { EntityDocumentType, FileSelectEvent as FileSelectEvent1 } from "./api/Document";
 import { IPaymentMethodMetadata } from "./api/PaymentMethod";
-import { BillingFormFields as BillingFormFields1, FormController } from "./components";
 import { DisputeEvidenceDocument } from "./api/DisputeEvidenceDocument";
 import { DisputeResponseFormStep } from "./components/dispute-management/dispute-response/dispute-response-form-types";
 import { ApplePayButtonStyle, ApplePayButtonType, IApplePayToken } from "./api/ApplePay";
 import { BillingFormFields } from "./components/checkout/billing-form/billing-form-schema";
-import { FormController as FormController1 } from "./ui-components/form/form";
+import { FormController } from "./ui-components/form/form";
 import { Dispute, IDispute } from "./api/Dispute";
 import { CheckoutChangedEventDetail, SelectedPaymentMethod } from "./components/modular-checkout/ModularCheckout";
 import { PaymentMethodPayload } from "./components/checkout/payment-method-payload";
@@ -25,16 +24,15 @@ import { Identity } from "./api/Identity";
 import { PaginationProps } from "./ui-components/pagination-menu/pagination-menu";
 export { Business, IAdditionalQuestions, IAddress } from "./api/Business";
 export { ComponentClickEvent as ComponentClickEvent1, ComponentErrorCodes, ComponentErrorEvent as ComponentErrorEvent1, ComponentFormStepCompleteEvent as ComponentFormStepCompleteEvent1, ComponentSubmitEvent as ComponentSubmitEvent1, FileSelectEvent, IApiResponse, ICheckoutPaymentModeParam, ICheckoutStatus, ILoadedEventResponse, IRefund, ITerminalStatus, TerminalModelName, TerminalOrderStatus, TerminalOrderType } from "./api";
-export { ComponentClickEvent, ComponentErrorEvent, ComponentFormStepCompleteEvent, ComponentSubmitEvent } from "./api/ComponentEvents";
+export { ComponentClickEvent, ComponentErrorEvent, ComponentFormStepCompleteEvent, ComponentSubmitEvent, RecordClickEvent } from "./api/ComponentEvents";
 export { Placement, PositioningStrategy } from "@popperjs/core";
 export { EntityDocumentType, FileSelectEvent as FileSelectEvent1 } from "./api/Document";
 export { IPaymentMethodMetadata } from "./api/PaymentMethod";
-export { BillingFormFields as BillingFormFields1, FormController } from "./components";
 export { DisputeEvidenceDocument } from "./api/DisputeEvidenceDocument";
 export { DisputeResponseFormStep } from "./components/dispute-management/dispute-response/dispute-response-form-types";
 export { ApplePayButtonStyle, ApplePayButtonType, IApplePayToken } from "./api/ApplePay";
 export { BillingFormFields } from "./components/checkout/billing-form/billing-form-schema";
-export { FormController as FormController1 } from "./ui-components/form/form";
+export { FormController } from "./ui-components/form/form";
 export { Dispute, IDispute } from "./api/Dispute";
 export { CheckoutChangedEventDetail, SelectedPaymentMethod } from "./components/modular-checkout/ModularCheckout";
 export { PaymentMethodPayload } from "./components/checkout/payment-method-payload";
@@ -362,7 +360,7 @@ export namespace Components {
      * and the other one  is meant to be just read only.
      */
     interface JustifiBusinessCoreInfo {
-        "formController": FormController1;
+        "formController": FormController;
     }
     interface JustifiBusinessCoreInfoFormStep {
         "allowOptionalFields"?: boolean;
@@ -416,7 +414,7 @@ export namespace Components {
     }
     interface JustifiBusinessRepresentativeFormInputs {
         "errors": any;
-        "formController": FormController1;
+        "formController": FormController;
         "representativeDefaultValue": any;
     }
     interface JustifiBusinessRepresentativeFormStep {
@@ -636,7 +634,7 @@ export namespace Components {
         "authToken": string;
         "checkoutId": string;
         "setSelectedPaymentMethod": (paymentMethod: SelectedPaymentMethod) => Promise<void>;
-        "submitCheckout": (submitCheckoutArgs?: BillingFormFields1) => Promise<void>;
+        "submitCheckout": (submitCheckoutArgs?: BillingFormFields) => Promise<void>;
         "validate": () => Promise<boolean>;
     }
     interface JustifiOrderTerminals {
@@ -735,6 +733,10 @@ export namespace Components {
     }
     interface JustifiPayoutDetails {
         "authToken": string;
+        /**
+          * @default false
+         */
+        "enableRecordClick": boolean;
         "payoutId": string;
     }
     interface JustifiPayoutTransactionsList {
@@ -889,7 +891,7 @@ export namespace Components {
         "authToken"?: string;
         "disableBankAccount"?: boolean;
         "disableCreditCard"?: boolean;
-        "fillBillingForm": (fields: BillingFormFields1) => Promise<void>;
+        "fillBillingForm": (fields: BillingFormFields) => Promise<void>;
         "hideBankAccountBillingForm"?: boolean;
         "hideCardBillingForm"?: boolean;
         "hideSubmitButton"?: boolean;
@@ -954,6 +956,10 @@ export namespace Components {
         "getPayments": Function;
     }
     interface PayoutDetailsCore {
+        /**
+          * @default false
+         */
+        "enableRecordClick": boolean;
         "getPayout": Function;
         "getPayoutCSV": Function;
     }
@@ -2281,6 +2287,7 @@ declare global {
     };
     interface HTMLJustifiPaymentDetailsElementEventMap {
         "error-event": ComponentErrorEvent;
+        "record-click-event": RecordClickEvent;
     }
     interface HTMLJustifiPaymentDetailsElement extends Components.JustifiPaymentDetails, HTMLStencilElement {
         addEventListener<K extends keyof HTMLJustifiPaymentDetailsElementEventMap>(type: K, listener: (this: HTMLJustifiPaymentDetailsElement, ev: JustifiPaymentDetailsCustomEvent<HTMLJustifiPaymentDetailsElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -2747,6 +2754,7 @@ declare global {
     };
     interface HTMLPayoutDetailsCoreElementEventMap {
         "error-event": ComponentErrorEvent;
+        "record-click-event": RecordClickEvent;
     }
     interface HTMLPayoutDetailsCoreElement extends Components.PayoutDetailsCore, HTMLStencilElement {
         addEventListener<K extends keyof HTMLPayoutDetailsCoreElementEventMap>(type: K, listener: (this: HTMLPayoutDetailsCoreElement, ev: PayoutDetailsCoreCustomEvent<HTMLPayoutDetailsCoreElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -3315,7 +3323,7 @@ declare namespace LocalJSX {
      * and the other one  is meant to be just read only.
      */
     interface JustifiBusinessCoreInfo {
-        "formController"?: FormController1;
+        "formController"?: FormController;
     }
     interface JustifiBusinessCoreInfoFormStep {
         "allowOptionalFields"?: boolean;
@@ -3378,7 +3386,7 @@ declare namespace LocalJSX {
     }
     interface JustifiBusinessRepresentativeFormInputs {
         "errors"?: any;
-        "formController"?: FormController1;
+        "formController"?: FormController;
         "representativeDefaultValue"?: any;
     }
     interface JustifiBusinessRepresentativeFormStep {
@@ -3640,6 +3648,7 @@ declare namespace LocalJSX {
     interface JustifiPaymentDetails {
         "authToken"?: string;
         "onError-event"?: (event: JustifiPaymentDetailsCustomEvent<ComponentErrorEvent>) => void;
+        "onRecord-click-event"?: (event: JustifiPaymentDetailsCustomEvent<RecordClickEvent>) => void;
         "paymentId"?: string;
     }
     interface JustifiPaymentProvisioning {
@@ -3716,6 +3725,10 @@ declare namespace LocalJSX {
     }
     interface JustifiPayoutDetails {
         "authToken"?: string;
+        /**
+          * @default false
+         */
+        "enableRecordClick"?: boolean;
         "onError-event"?: (event: JustifiPayoutDetailsCustomEvent<ComponentErrorEvent>) => void;
         "payoutId"?: string;
     }
@@ -3935,9 +3948,14 @@ declare namespace LocalJSX {
         "onError-event"?: (event: PaymentsListCoreCustomEvent<ComponentErrorEvent>) => void;
     }
     interface PayoutDetailsCore {
+        /**
+          * @default false
+         */
+        "enableRecordClick"?: boolean;
         "getPayout"?: Function;
         "getPayoutCSV"?: Function;
         "onError-event"?: (event: PayoutDetailsCoreCustomEvent<ComponentErrorEvent>) => void;
+        "onRecord-click-event"?: (event: PayoutDetailsCoreCustomEvent<RecordClickEvent>) => void;
     }
     interface PayoutsListCore {
         "columns"?: string;

package/dist/types/stencil-public-runtime.d.ts

@@ -1,5 +1,6 @@
 type CustomMethodDecorator<T> = (target: object, propertyKey: string | symbol, descriptor: TypedPropertyDescriptor<T>) => TypedPropertyDescriptor<T> | void;
-type UnionToIntersection<U> = (U extends any ? (x: U) => void : never) extends (x: infer I) => void ? I : never;
+type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => void ? I : never;
+type MixinInstance<F> = F extends (base: MixedInCtor) => MixedInCtor<infer I> ? I : never;
 export interface ComponentDecorator {
     (opts?: ComponentOptions): ClassDecorator;
 }
@@ -340,7 +341,6 @@ export declare function forceUpdate(ref: any): void;
 export declare function getRenderingRef(): any;
 export interface HTMLStencilElement extends Omit<HTMLElement, 'autocorrect'> {
     componentOnReady(): Promise<this>;
-    autocorrect: 'on' | 'off';
 }
 /**
  * Schedules a DOM-write task. The provided callback will be executed
@@ -365,18 +365,27 @@ export declare function readTask(task: RafCallback): void;
  * Unhandled exception raised while rendering, during event handling, or lifecycles will trigger the custom event handler.
  */
 export declare const setErrorHandler: (handler: ErrorHandler) => void;
-export type MixinFactory = <TBase extends new (...args: any[]) => any>(base: TBase) => abstract new (...args: ConstructorParameters<TBase>) => any;
+/**
+ * @deprecated - Use `MixedInCtor` instead:
+ * ```ts
+ * import { MixedInCtor } from '@stencil/core';
+ *
+ * const AFactoryFn = <B extends MixedInCtor>(Base: B) => {class A extends Base { propA = A }; return A;}
+ * ```
+ */
+export type MixinFactory = (base: MixedInCtor) => MixedInCtor;
+export type MixedInCtor<T = {}> = new (...args: any[]) => T;
 /**
  * Compose multiple mixin classes into a single constructor.
  * The resulting class has the combined instance types of all mixed-in classes.
  *
  * Example:
- * ```
- * import { Mixin, MixinFactory } from '@stencil/core';
+ * ```ts
+ * import { Mixin, MixedInCtor } from '@stencil/core';
  *
- * const AWrap: MixinFactory = (Base) => {class A extends Base { propA = A }; return A;}
- * const BWrap: MixinFactory = (Base) => {class B extends Base { propB = B }; return B;}
- * const CWrap: MixinFactory = (Base) => {class C extends Base { propC = C }; return C;}
+ * const AWrap = <B extends MixedInCtor>(Base: B) => {class A extends Base { propA = A }; return A;}
+ * const BWrap = <B extends MixedInCtor>(Base: B) => {class B extends Base { propB = B }; return B;}
+ * const CWrap = <B extends MixedInCtor>(Base: B) => {class C extends Base { propC = C }; return C;}
  *
  * class X extends Mixin(AWrap, BWrap, CWrap) {
  *   render() { return <div>{this.propA} {this.propB} {this.propC}</div>; }
@@ -384,9 +393,9 @@ export type MixinFactory = <TBase extends new (...args: any[]) => any>(base: TBa
  * ```
  *
  * @param mixinFactories mixin factory functions that return a class which extends from the provided class.
- * @returns a class that that is composed from extending each of the provided classes in the order they were provided.
+ * @returns a class that is composed from extending each of the provided classes in the order they were provided.
  */
-export declare function Mixin<TMixins extends readonly MixinFactory[]>(...mixinFactories: TMixins): abstract new (...args: any[]) => UnionToIntersection<InstanceType<ReturnType<TMixins[number]>>>;
+export declare function Mixin<const TMixins extends readonly MixinFactory[]>(...mixinFactories: TMixins): abstract new (...args: any[]) => UnionToIntersection<MixinInstance<TMixins[number]>>;
 /**
  * This file gets copied to all distributions of stencil component collections.
  * - no imports

package/dist/types/store/checkout.store.d.ts

@@ -5,6 +5,7 @@ interface IInitialState {
     authToken: string;
     billingFormFields: BillingFormFields;
     bnplEnabled: boolean;
+    applePayEnabled: boolean;
     insuranceEnabled: boolean;
     bnplProviderApiVersion: string;
     bnplProviderCheckoutUrl: string;

package/dist/types/styles/parts.d.ts

@@ -12,7 +12,7 @@ export declare const heading2 = "heading-2 heading text color font-family";
 export declare const heading3 = "heading-3 heading text color font-family";
 export declare const heading4 = "heading-4 heading text color font-family";
 export declare const heading5 = "heading-5 heading text color font-family";
-export declare const link = "link text color font-family";
+export declare const link = "link text font-family";
 export declare const button = "button text color font-family";
 export declare const buttonPrimary = "button-primary button text color font-family";
 export declare const buttonSecondary = "button-secondary button text color font-family";

package/dist/types/ui-components/details/utils.d.ts

@@ -1,11 +1,12 @@
-import { FunctionalComponent } from '../../stencil-public-runtime';
+import { FunctionalComponent } from "../../stencil-public-runtime";
 export declare const ErrorState: (errorMessage: string) => any;
 export declare const DetailSectionTitle: FunctionalComponent<{
     sectionTitle: string;
 }>;
-export declare const DetailItem: ({ title, value, }: {
+export declare const DetailItem: ({ title, value, onClick, }: {
     title: string;
     value: string;
+    onClick?: () => void;
 }) => any;
 export declare const EntityHeadInfoItem: ({ title, value, classes, }: {
     title: string;

package/dist/types/utils/utils.d.ts

@@ -31,4 +31,5 @@ export declare function processHTML(htmlString: any, functions: any): any;
 export declare function formatPhoneNumber(number: any): string;
 export declare function generateId(length?: number): string;
 export declare function generateTabId(): string;
+export declare function capitalizeFirstLetter(str: string): string;
 export {};