@justifi/webcomponents 5.7.6-rc-21 → 5.7.7

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

@@ -1,11 +1,6 @@
-import { h, proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/internal/client';
+import { h, proxyCustomElement, HTMLElement, createEvent, Host } from '@stencil/core/internal/client';
 import { c as formatCurrency } from './utils2.js';
-import { r as radioListItem } from './parts.js';
-import { c as checkoutStore } from './checkout.store.js';
-import { S as StyledHost } from './styled-host.js';
-import './details.js';
-import './event-types.js';
-import './justifi-radio-list-item2.js';
+import { X as radioListItem } from './parts.js';
 import { d as defineCustomElement$2 } from './form-control-help-text2.js';
 import { d as defineCustomElement$1 } from './form-control-radio2.js';
 
@@ -19,31 +14,29 @@ const SezzlePaymentMethod = /*@__PURE__*/ proxyCustomElement(class SezzlePayment
     constructor() {
         super();
         this.__registerHost();
-        this.__attachShadow();
         this.paymentMethodOptionSelected = createEvent(this, "paymentMethodOptionSelected", 7);
-        this.paymentMethodOptionId = 'sezzle';
         this.onPaymentMethodOptionClick = (e) => {
             e.preventDefault();
-            checkoutStore.selectedPaymentMethod = this.paymentMethodOptionId;
-            this.paymentMethodOptionSelected.emit(this.paymentMethodOptionId);
+            this.paymentMethodOptionSelected.emit(this.paymentMethodOption);
         };
         this.initializeSezzleCheckout = () => {
             let resolveSezzlePromise;
             this.sezzlePromise = new Promise((resolve) => { resolveSezzlePromise = resolve; });
-            const amount = Number(checkoutStore.paymentAmount);
+            const bnpl = this.bnpl;
+            const amount = +this.paymentAmount; // convert to number
             const Checkout = window.Checkout;
             const checkout = new Checkout({
                 mode: 'popup',
-                publicKey: checkoutStore.bnplProviderClientId,
-                apiMode: checkoutStore.bnplProviderMode,
-                apiVersion: checkoutStore.bnplProviderApiVersion,
+                publicKey: bnpl.provider_client_id,
+                apiMode: bnpl.provider_mode,
+                apiVersion: bnpl.provider_api_version,
             });
             checkout.sezzleButtonElement = this.sezzleButtonRef;
             checkout.init({
                 onClick: function (event) {
                     event.preventDefault();
                     checkout.startCheckout({
-                        checkout_url: checkoutStore.bnplProviderCheckoutUrl,
+                        checkout_url: bnpl.provider_checkout_url
                     });
                 },
                 onComplete: (event) => resolveSezzlePromise({ bnpl: event.data }),
@@ -55,8 +48,6 @@ const SezzlePaymentMethod = /*@__PURE__*/ proxyCustomElement(class SezzlePayment
         };
     }
     componentDidRender() {
-        if (!this.scriptRef)
-            return;
         this.scriptRef.onload = () => {
             this.sezzleButtonRef = document.createElement('button');
             this.initializeSezzleCheckout();
@@ -70,14 +61,16 @@ const SezzlePaymentMethod = /*@__PURE__*/ proxyCustomElement(class SezzlePayment
         return this.sezzlePromise;
     }
     render() {
-        var _a, _b;
-        if (!checkoutStore.bnplEnabled || checkoutStore.disableBnpl) {
-            console.warn('justifi-sezzle-payment-method: BNPL is not enabled for this account.');
-            return null;
-        }
-        return (h(StyledHost, { class: "payment-method" }, h("script", { src: "https://checkout-sdk.sezzle.com/checkout.min.js", async: true, ref: (el) => (this.scriptRef = el) }), h("div", { class: "radio-list-item p-3", part: radioListItem, onClick: this.onPaymentMethodOptionClick }, h("form-control-radio", { name: "paymentMethodType", value: this.paymentMethodOptionId, checked: checkoutStore.selectedPaymentMethod === this.paymentMethodOptionId, label: h("div", null, h("div", null, "Buy now, pay later with ", sezzleLogo), this.installmentPlan && (h("small", null, h("span", null, (_a = this.installmentPlan) === null || _a === void 0 ? void 0 : _a.installments.length), "\u00A0", h("span", null, this.installmentPlan.schedule, " payments of"), "\u00A0", h("span", { class: "fw-bold" }, formatCurrency((_b = this.installmentPlan) === null || _b === void 0 ? void 0 : _b.installments[0].amountInCents))))) }))));
+        var _a, _b, _c;
+        return (h(Host, { key: '4ae50e7bbb15d0049d069edacd0d95ba7c13dbe5', class: "payment-method" }, h("script", { key: '42a0590d89626ba7a93852e421eb121626b48375', src: "https://checkout-sdk.sezzle.com/checkout.min.js", async: true, ref: (el) => (this.scriptRef = el) }), h("div", { key: '31a2a72650486c258267c6d4de3723f7afa5b063', class: "radio-list-item p-3", part: radioListItem, onClick: this.onPaymentMethodOptionClick }, h("form-control-radio", { key: 'eac1adbcd82fcb4f9c440c53c40ce34af6092991', name: "paymentMethodType", value: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, checked: this.isSelected, label: h("div", null, h("div", null, "Buy now, pay later with ", sezzleLogo), this.installmentPlan && (h("small", null, h("span", null, (_b = this.installmentPlan) === null || _b === void 0 ? void 0 : _b.installments.length), "\u00A0", h("span", null, this.installmentPlan.schedule, " payments of"), "\u00A0", h("span", { class: "fw-bold" }, formatCurrency((_c = this.installmentPlan) === null || _c === void 0 ? void 0 : _c.installments[0].amountInCents))))) }))));
     }
-}, [257, "justifi-sezzle-payment-method", {
+}, [256, "justifi-sezzle-payment-method", {
+        "bnpl": [8],
+        "clientId": [1, "client-id"],
+        "accountId": [1, "account-id"],
+        "paymentMethodOption": [16, "payment-method-option"],
+        "isSelected": [4, "is-selected"],
+        "paymentAmount": [2, "payment-amount"],
         "installmentPlan": [32],
         "sezzleCheckout": [32],
         "sezzlePromise": [32],

package/dist/module/shipping-details.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { c as create$3, a as create$6, F as FormController } from './form.js';
 import { D as DisputeResponseFormStep, f as fileInputHandler } from './file-input-handler.js';
-import { _ as heading5 } from './parts.js';
+import { $ as heading5 } from './parts.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-file-v22.js';
@@ -44,7 +44,7 @@ const ShippingDetails = /*@__PURE__*/ proxyCustomElement(class ShippingDetails e
     }
     render() {
         var _a, _b, _c, _d, _e;
-        return (h("div", { key: 'a0907d5f1fe8d40876f816b6d332dbb0d9afe975' }, h("div", { key: '3f22d56b30227d9ce0d22dc45c4e29bba60b5366', class: "row gy-3" }, h("div", { key: 'ec768dcf266527e981712f55cdb1921d0e6ef257', class: "col-12" }, h("h2", { key: '0b0e92ba9164941f48e1162937d7bd694683b206', class: "h5", part: heading5 }, "Shipping Details")), h("div", { key: '2a5f5508c7f8b1a3a674d4bd18a2cba725ff86e7', class: "col-12" }, h("form-control-text", { key: 'deb04aa47dee3269ad8ad84b59edfdf251207520', label: "Shipping Carrier Name", name: "shipping_carrier", defaultValue: (_a = this.disputeResponse) === null || _a === void 0 ? void 0 : _a.shipping_carrier, inputHandler: this.inputHandler, errorText: this.errors.shipping_carrier })), h("div", { key: 'e340cf8f480c335b7e565e7d4bf052685bc3f78f', class: "col-12" }, h("form-control-text", { key: '8e3d040776e821518c0d04ea8d0da2d0ddb75cd3', label: "Tracking Number", name: "shipping_tracking_number", defaultValue: (_b = this.disputeResponse) === null || _b === void 0 ? void 0 : _b.shipping_tracking_number, inputHandler: this.inputHandler, errorText: this.errors.shipping_tracking_number })), h("div", { key: '71dab91e7befe734db1b8f02bb3fd8d1b8180ab8', class: "col-12" }, h("form-control-date", { key: 'f257e98c81762700c7164a8cbd86764ebe4e4353', label: "Date Shipped", name: "shipping_date", defaultValue: (_c = this.disputeResponse) === null || _c === void 0 ? void 0 : _c.shipping_date, inputHandler: this.inputHandler, errorText: this.errors.shipping_date })), h("div", { key: 'e69255a96e9292fea2269f7f0a7888e53e5a8be7', class: "col-12" }, h("form-control-textarea", { key: 'b40386270d12484982d81a85db0e95853f76ec58', label: "Shipping Address", name: "shipping_address", defaultValue: (_d = this.disputeResponse) === null || _d === void 0 ? void 0 : _d.shipping_address, inputHandler: this.inputHandler, errorText: this.errors.shipping_address })), h("div", { key: '23f2a4dabdaefef86940ae03e00a5d240d061a2f', class: "col-12" }, h("form-control-file-v2", { key: '6db6eb9ed1803d7c25f2b9dd03955be7e9c41a34', label: "Shipping Documentation", name: "shipping_documentation", onChange: (e) => fileInputHandler(e, this.documents), errorText: (_e = this.documentErrors) === null || _e === void 0 ? void 0 : _e.shipping_documentation })))));
+        return (h("div", { key: '9659228d60badf5ed8ce9166d6f7a9c9857024b5' }, h("div", { key: '3cd0f255e7719311293fdab4b3c3b053835e7062', class: "row gy-3" }, h("div", { key: '132759e99a8a5797d2a386ae802ce3607f15efaa', class: "col-12" }, h("h2", { key: '1ba83f329ea9a44584d59fdce07b7d2acba37f41', class: "h5", part: heading5 }, "Shipping Details")), h("div", { key: '467f5246bccc7401e5b8dab660961bd639f9ff2b', class: "col-12" }, h("form-control-text", { key: 'dd7d33309fd9af4ae12462e4cb6e294c1fb05735', label: "Shipping Carrier Name", name: "shipping_carrier", defaultValue: (_a = this.disputeResponse) === null || _a === void 0 ? void 0 : _a.shipping_carrier, inputHandler: this.inputHandler, errorText: this.errors.shipping_carrier })), h("div", { key: '2b96dbe354f2cc65b676cde07d004253fe74469f', class: "col-12" }, h("form-control-text", { key: '1574517f3c463c8e2ac2a2a0cdb85eb7c8349971', label: "Tracking Number", name: "shipping_tracking_number", defaultValue: (_b = this.disputeResponse) === null || _b === void 0 ? void 0 : _b.shipping_tracking_number, inputHandler: this.inputHandler, errorText: this.errors.shipping_tracking_number })), h("div", { key: '76dc169253d3de15c041e21d3b116a0973a0884b', class: "col-12" }, h("form-control-date", { key: 'f1a80bd55f350559aff614a219191fd026287910', label: "Date Shipped", name: "shipping_date", defaultValue: (_c = this.disputeResponse) === null || _c === void 0 ? void 0 : _c.shipping_date, inputHandler: this.inputHandler, errorText: this.errors.shipping_date })), h("div", { key: 'e314c9bb0b0edaf5a7ff01e3ec804377a9ca2f4f', class: "col-12" }, h("form-control-textarea", { key: '13ea3ccb3001cbef1453cefbcc663e10eff62cb6', label: "Shipping Address", name: "shipping_address", defaultValue: (_d = this.disputeResponse) === null || _d === void 0 ? void 0 : _d.shipping_address, inputHandler: this.inputHandler, errorText: this.errors.shipping_address })), h("div", { key: 'eeffc742b048ca828caefd7ccb1793927e1f3295', class: "col-12" }, h("form-control-file-v2", { key: '5d7c17b8acef1b41d80301640d90c3c0e17f2471', label: "Shipping Documentation", name: "shipping_documentation", onChange: (e) => fileInputHandler(e, this.documents), errorText: (_e = this.documentErrors) === null || _e === void 0 ? void 0 : _e.shipping_documentation })))));
     }
 }, [256, "justifi-shipping-details", {
         "disputeResponse": [8, "dispute-response"],

package/dist/module/spinner.js

@@ -1,5 +1,5 @@
 import { h } from '@stencil/core/internal/client';
-import { C as loadingSpinner } from './parts.js';
+import { w as loadingSpinner } from './parts.js';
 
 const Spinner = () => {
     return (h("div", { class: "d-flex justify-content-center" },

package/dist/module/table-filters-menu2.js

@@ -29,7 +29,7 @@ const TableFiltersMenu = /*@__PURE__*/ proxyCustomElement(class TableFiltersMenu
         this.showClearButton = hasFilters(this.params);
     }
     render() {
-        return (h("div", { key: 'b270a6f9e52e45e958bb02e31569d4f56135ee25', class: "d-flex gap-2" }, h("div", { key: '76d9eef0672c27ec28a95bc062f946739a2c5dc7', class: "dropdown pb-3" }, h("button", { key: '3de6afb2c92bde835ae894e7548b3e07b86fb0bf', type: "button dropdown-toggle", ref: (el) => (this.anchorButton = el), class: "btn btn-primary dropdown-toggle", part: dropdownMenuButton, "data-test-id": "open-filters-button", "data-bs-toggle": "dropdown" }, "Filters"), h("custom-popper", { key: 'de744460fb721b5949ca0cfcf6a751e4b6a008d0', offset: [20, 10], strategy: "fixed", anchorRef: this.anchorButton, trigger: "click" }, h("form", { key: 'c8b6d3e8e28b90fb3dedd80e71c7a8a0f30b6a8f', class: "dropdown-menu", part: dropdownMenu, "data-test-id": "filter-menu", ref: (el) => (this.menu = el), onSubmit: (e) => e.preventDefault() }, h("slot", { key: '44e50fab6d4f6c7a76f90659cced1c61e94ec43d' })))), h("div", { key: 'b5ec37cc1f28005c2b87b14bd10b74e619012ce5' }, h(Button, { key: '5bae9de44fcdb6e015ac3311945bdcee1887e827', variant: "secondary", onClick: () => this.clearParams(), hidden: !this.showClearButton, "data-test-id": "clear-filters-button" }, "Clear Filters"))));
+        return (h("div", { key: '3fceb3195060fd21e0928f3b3e41e2e205794778', class: "d-flex gap-2" }, h("div", { key: 'cf023a74f709332a918bd099cae2de4dc3ffd40f', class: "dropdown pb-3" }, h("button", { key: '7c909ff07e4ea69dda84c80f944bb45f65306605', type: "button dropdown-toggle", ref: (el) => (this.anchorButton = el), class: "btn btn-primary dropdown-toggle", part: dropdownMenuButton, "data-test-id": "open-filters-button", "data-bs-toggle": "dropdown" }, "Filters"), h("custom-popper", { key: '78bfa19b68f3112f4f3eb0e6fd188b32c8b07aee', offset: [20, 10], strategy: "fixed", anchorRef: this.anchorButton, trigger: "click" }, h("form", { key: '5d77ae310a35fae91da9c0e8ccd468367f2cd730', class: "dropdown-menu", part: dropdownMenu, "data-test-id": "filter-menu", ref: (el) => (this.menu = el), onSubmit: (e) => e.preventDefault() }, h("slot", { key: '2bda5c97dbe499de4336b43196181096457bcb47' })))), h("div", { key: '1cdf8224ed35bfa57f4972225e54ff7182bac293' }, h(Button, { key: '5c593fa8cbe357b6aba8e36c2f332a12a4d24042', variant: "secondary", onClick: () => this.clearParams(), hidden: !this.showClearButton, "data-test-id": "clear-filters-button" }, "Clear Filters"))));
     }
     static get watchers() { return {
         "params": ["watchParamsHandler"]

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 { m 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, o as tableCell } from './parts.js';
 import { S as Spinner } from './spinner.js';
 
 const TableWrapper = (props, children) => {

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

@@ -2,14 +2,14 @@ import { h, proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/i
 import { T as Table, a as TableWrapper, b as TableComponent, c as TableHead, d as TableHeadRow, e as TableBody, f as TableLoadingState, g as TableEmptyState, h as TableErrorState, i as TableRow, j as TableFoot, k as TableFootRow, l as TableFootCell } from './table.js';
 import './details.js';
 import { T as TableClickActions } from './event-types.js';
-import './justifi-radio-list-item2.js';
 import './config-state.js';
-import './dinero.js';
-import { f as TerminalOrderType } from './Refund.js';
+import { j as convertToLocal } from './utils2.js';
+import './Checkout.js';
 import { p as pagingDefaults } from './Pagination.js';
+import './Payment.js';
+import { a as TerminalOrderType } from './Refund.js';
 import './Business.js';
-import { v as tableHeadCell, a8 as getAlternateTableCellPart } from './parts.js';
-import { e as convertToLocal } from './utils2.js';
+import { n as tableHeadCell, a8 as getAlternateTableCellPart } from './parts.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';
 import { d as defineCustomElement$1 } from './pagination-menu2.js';
@@ -166,7 +166,7 @@ const TerminalOrdersListCore = /*@__PURE__*/ proxyCustomElement(class TerminalOr
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h(TableWrapper, { key: '8a0766c914fedb4544e1420a9d4821033ff5b63e' }, h(TableComponent, { key: '082e4d1231d470bbdcdb6283b769dfa170d4497c' }, h(TableHead, { key: '657a36dea6be9c12ea4d184b80100926f5d5a776' }, h(TableHeadRow, { key: '15e2897c02a069998ab7e317714e27b5c25496de' }, this.terminalOrdersTable.columnData.map((column) => column))), h(TableBody, { key: '2c4ce1e4d6542a6a35fe84e930d5aa80be8f1e5e' }, h(TableLoadingState, { key: '9d6dc10cbc5bac7dc70f5b89835e66d94b7a7f47', columnSpan: this.terminalOrdersTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '8cbb3e23fe963729e25e2692db64027a8fa60cd3', isEmpty: this.showEmptyState, columnSpan: this.terminalOrdersTable.columnKeys.length }), h(TableErrorState, { key: 'b13a399c4df1f596d46cc87236172499eecfcde8', 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: '95df4815cc997770b8422a9ad1553bf1fca04c55' }, h(TableFootRow, { key: '4e58cb642110fa73b437fa8eccb8bc7900bb0409' }, h(TableFootCell, { key: '42f6b9a69a798bbe7f6478adb99294156bcffab3', colSpan: this.terminalOrdersTable.columnData.length }, h("pagination-menu", { key: '82740c87d012610d1f7863b52463e7d6ac4ad482', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
+        return (h(TableWrapper, { key: '128b8fa2d0a3cab6f4dad593961401193298397c' }, h(TableComponent, { key: 'c80b9c9718aa88c72374976ad5b164ffaa764725' }, h(TableHead, { key: '37987af09980ff3e0bb595d5f721a193efa06ebd' }, h(TableHeadRow, { key: '60d0b9c55efca1f55880a022fdf98f62bd974acc' }, this.terminalOrdersTable.columnData.map((column) => column))), h(TableBody, { key: 'b34b4a8fd8165f45a547e48389520a29c91e961f' }, h(TableLoadingState, { key: '202c63bb7f9d4ea85f29e5382c2d96c284bea305', columnSpan: this.terminalOrdersTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'e44b24f14d7280081d2f241e5762be3fab8e5ac3', isEmpty: this.showEmptyState, columnSpan: this.terminalOrdersTable.columnKeys.length }), h(TableErrorState, { key: '77ac84b67ad094216c0df88a2400b15a72db97d4', 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: '0745f06ea066b8cca010648427ffcb941a2cbbfb' }, h(TableFootRow, { key: 'e9760054c8b9f675b3c12461bb21f148a4112aa4' }, h(TableFootCell, { key: 'd5cae96c5ed3ee809923405fa2751057ba82af41', colSpan: this.terminalOrdersTable.columnData.length }, h("pagination-menu", { key: 'd0f1bcd31f0799ff1a8b7a1a807437b81bbc2e73', 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 { k 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';
 
@@ -24,7 +24,7 @@ const TerminalQuantitySelector = /*@__PURE__*/ proxyCustomElement(class Terminal
         };
     }
     render() {
-        return (h("div", { key: 'de2e01cebd222ad371a15df4aade26d3e118ddee', class: "rounded shadow-sm card p-2", part: card }, h("div", { key: '8e69419c2b7cd0917dd27d42edef08e2d06d79fb', class: "d-flex gap-3" }, h("div", { key: 'c9f83f6f3857e3ec38134194e8ce9d5e9c614992', class: "d-flex align-items-center" }, h("img", { key: '576be452c664824354355b8ed02777dd63d2cddb', src: this.imageUrl, alt: this.modelName, height: 75, width: 75, part: image })), h("div", { key: '0c978b052b05d5b6384a0a13411b339c0522dfd3', class: "d-flex flex-column flex-grow-1 gap-3 p-4 justify-content-center" }, h("div", { key: '40c72c35a8a8418c4d873dbbd6f4ca089142bc14', class: "row" }, h("div", { key: '5fd4f0be8b88e49ad6f332b39d8bf5061ed7ebc3', class: "col-6 d-flex gap-2" }, this.modelName, h("form-control-tooltip", { key: '5d30721f60481bb7994578aefbe2b58055134044', helpText: this.description })), h("div", { key: 'e78454dc8e9fc81f65d01bafc4877d254db08508', class: "col-6 d-flex justify-content-end align-items-center" }, h("button", { key: 'e2f601209f58ce5b87aa546888da3077e1dc3aed', class: "p-0 minus btn", onClick: this.removeUnit, part: buttonLink }, "-"), h("div", { key: '32f9805571ec676ebfcf664029579d50e5e500ca', class: "w-25 text-center" }, this.selectedQuantity), h("button", { key: 'c7ac123ecc6fcaa06a0beaa5f36ed842beba928c', class: "p-0 plus btn", onClick: this.addUnit, part: buttonLink }, "+")))))));
+        return (h("div", { key: '347cc119dae6013a0110551d37349839d5a8c60f', class: "rounded shadow-sm card p-2", part: card }, h("div", { key: '965e0282bfe78cabec08d6af980489c07d1c1087', class: "d-flex gap-3" }, h("div", { key: '868d31537eac74b7f5201739cf7527bc2e4c7130', class: "d-flex align-items-center" }, h("img", { key: 'f3c9ca6d9cc12e42f9ed1f469fde8ec507d03fff', src: this.imageUrl, alt: this.modelName, height: 75, width: 75, part: image })), h("div", { key: '474461af6bbb24f5d0433698b8761e2bfa76d0f3', class: "d-flex flex-column flex-grow-1 gap-3 p-4 justify-content-center" }, h("div", { key: '157c8422a4087b274bb8b3c0861ea3daa7d8d700', class: "row" }, h("div", { key: 'cfda71e7a75b716bfaa635dd0218c163f1b2aa22', class: "col-6 d-flex gap-2" }, this.modelName, h("form-control-tooltip", { key: '5e8193abfa9bbd3f27ad396871faa64700413bb5', helpText: this.description })), h("div", { key: '47a47124bf3ce63264efdc96d74dcd7849a32c96', class: "col-6 d-flex justify-content-end align-items-center" }, h("button", { key: '252798ab53ef9b68184be2d95c6b12d7e8b5e976', class: "p-0 minus btn", onClick: this.removeUnit, part: buttonLink }, "-"), h("div", { key: '0ec025653e8d4fad3cc435af716af0771fb2f8ca', class: "w-25 text-center" }, this.selectedQuantity), h("button", { key: '01f895f944b4caf85e46d90756b54fc162f0f1b0', class: "p-0 plus btn", onClick: this.addUnit, part: buttonLink }, "+")))))));
     }
 }, [256, "terminal-quantity-selector", {
         "modelName": [1, "model-name"],

package/dist/module/terminal.service.js

@@ -1,6 +1,8 @@
 import { A as Api } from './Api.js';
-import './Refund.js';
+import './Checkout.js';
 import './Pagination.js';
+import './Payment.js';
+import './Refund.js';
 import './Business.js';
 
 const api = Api();

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

@@ -1,16 +1,16 @@
 import { h, proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/internal/client';
 import './config-state.js';
-import './dinero.js';
-import './Refund.js';
+import { m as capitalFirstLetter } from './utils2.js';
+import './Checkout.js';
 import { p as pagingDefaults } from './Pagination.js';
+import './Payment.js';
+import './Refund.js';
 import './Business.js';
 import './details.js';
 import { T as Table, a as TableWrapper, b as TableComponent, c as TableHead, d as TableHeadRow, e as TableBody, f as TableLoadingState, g as TableEmptyState, h as TableErrorState, i as TableRow, j as TableFoot, k as TableFootRow, l as TableFootCell } from './table.js';
 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 { j as capitalFirstLetter } from './utils2.js';
+import { n as tableHeadCell, a8 as getAlternateTableCellPart } from './parts.js';
 import { o as onQueryParamsChange, g as getRequestParams } from './terminals-list-params-state.js';
 import { d as defineCustomElement$1 } from './pagination-menu2.js';
 
@@ -180,7 +180,7 @@ const TerminalsListCore = /*@__PURE__*/ proxyCustomElement(class TerminalsListCo
         return !this.showEmptyState && !this.showErrorState && !this.loading;
     }
     render() {
-        return (h(TableWrapper, { key: 'b2e853d103eb893f825170d3ed551e03382e57df' }, h(TableComponent, { key: '73bab60cad7132c91099113d96f52181e2dc2850' }, h(TableHead, { key: '14a6d161dae9949570fbdb0bb8455c406dc9c748' }, h(TableHeadRow, { key: '97e7bcfebcc66f87a2e10a046f13e3e79a1af96c' }, this.terminalsTable.columnData.map((column) => column))), h(TableBody, { key: 'eaa976b34876dd9dbc2fca3c21b7a591e72b224e' }, h(TableLoadingState, { key: 'a8fb237f44d2de11f14fe80d8146d29e09521e0c', columnSpan: this.terminalsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: '94eb12a433df19e4e5cb917157540f5de567950a', isEmpty: this.showEmptyState, columnSpan: this.terminalsTable.columnKeys.length }), h(TableErrorState, { key: 'dc8fe9dfd5154a630971a5fdbbfdac9bbb04006d', 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: '3452bdbdf0f4670ea81145eeb900961d370c3f80' }, h(TableFootRow, { key: 'ba21d21290c1d83e9f44d2373306ddf94af899ad' }, h(TableFootCell, { key: '2506579fde96ee0809967d95afa8243a1b6d232c', colSpan: this.terminalsTable.columnData.length }, h("pagination-menu", { key: 'eae2ec2a0833dac1eba55797619e68c03076fdcf', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
+        return (h(TableWrapper, { key: '5ac52a5c666e2fa570cecb81092592795623adfa' }, h(TableComponent, { key: 'dbcde2fe24d4b377bfa7103db4c441e4e38537c6' }, h(TableHead, { key: '34b676d43e989020a363b76e838e12a35cc7f127' }, h(TableHeadRow, { key: 'd238b92b6d2d175a6badebee5e2089ff95ab77eb' }, this.terminalsTable.columnData.map((column) => column))), h(TableBody, { key: '6309ec4f6a4cbafeb068192a95afa42288b6d900' }, h(TableLoadingState, { key: '62cd851290e81aee8f96066bd8a6e7892d797513', columnSpan: this.terminalsTable.columnKeys.length, isLoading: this.loading }), h(TableEmptyState, { key: 'ff26f57ec23766361290113889a4c85f6c6ecee9', isEmpty: this.showEmptyState, columnSpan: this.terminalsTable.columnKeys.length }), h(TableErrorState, { key: '6ee48938a04a465ff189dcab515e8300e38e9ed8', 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: '5eac0724e3e65a5394fc026804f131a8b6c6116c' }, h(TableFootRow, { key: 'cd4fcf88e4729d15722b8b75cb21796cfbbf9f20' }, h(TableFootCell, { key: 'eb6618e74f0b5689e0c0a8266f0c76a10e98fe36', colSpan: this.terminalsTable.columnData.length }, h("pagination-menu", { key: 'f2454d466c09357f9b59dd55be0b2ef629ef073a', paging: Object.assign(Object.assign({}, this.paging), { handleClickPrevious: this.handleClickPrevious, handleClickNext: this.handleClickNext }) }))))))));
     }
     static get watchers() { return {
         "pagingParams": ["updateOnPropChange"],