npm - @justifi/webcomponents - Versions diffs - 6.7.1 → 6.7.2 - Mend

@justifi/webcomponents 6.7.1 → 6.7.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (160) hide show

package/docs/payment-facilitation/tokenize-payment-method/index.mdx ADDED Viewed

@@ -0,0 +1,350 @@
+---
+id: payment-facilitation/tokenize-payment-method/index
+title: Tokenize Payment Method
+description: Secure standalone card/bank tokenization form with built-in validation and iframe isolation.
+sidebar_position: 1
+---
+import {
+  PropsTable,
+  PartsTable,
+  getWebcomponentsVersion,
+} from '@justifi/webcomponents/docs/helpers';
+## Overview
+Component to render an entire form including a switch to use a credit card or bank account, a submit button and all fields required for proper use. This component can be used standalone or as part of the modular checkout system.
+## Usage
+<pre><code className="language-html">{`<!DOCTYPE html>
+<html dir="ltr" lang="en">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0" />
+  <title>justifi-tokenize-payment-method</title>
+  <script type="module" src="https://cdn.jsdelivr.net/npm/@justifi/webcomponents@${getWebcomponentsVersion()}/dist/webcomponents/webcomponents.esm.js"></script>
+<script
+  nomodule
+  src="https://cdn.jsdelivr.net/npm/@justifi/webcomponents@${getWebcomponentsVersion()}/dist/webcomponents/webcomponents.js"
+></script>
+  <style>
+    ::part(font-family) {
+      font-family: georgia;
+    }
+    ::part(color) {
+      color: darkslategray;
+    }
+    ::part(background-color) {
+      background-color: transparent;
+    }
+    ::part(button) {
+      padding: 0.375rem 0.75rem;
+      font-size: 16px;
+      box-shadow: none;
+      border-radius: 0px;
+      line-height: 1.5;
+      text-transform: none;
+    }
+    ::part(button-disabled) {
+      opacity: 0.5;
+    }
+    ::part(input) {
+      border-color: #555;
+      border-width: 1px;
+      border-bottom-width: 1px;
+      border-left-width: 1px;
+      border-right-width: 1px;
+      border-top-width: 1px;
+      border-radius: 0;
+      border-style: solid;
+      box-shadow: none;
+      font-size: 1rem;
+      font-weight: normal;
+      line-height: 1.5;
+      padding: 0.375rem 0.75rem;
+    }
+    ::part(input-focused) {
+      border-color: #333;
+      box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0.25);
+    }
+    ::part(input-invalid) {
+      border-color: #8a2a35;
+      box-shadow: 0 0 0 0.25rem rgba(244, 67, 54, 0.25);
+    }
+    ::part(input-invalid-and-focused) {
+      box-shadow: 0 0 0 0.25rem rgba(244, 67, 54, 0.25);
+      border-color: #8a2a35;
+    }
+    ::part(input-radio) {
+      background-color: #fff;
+      border-color: #333;
+    }
+    ::part(input-checkbox) {
+      border-color: #333;
+    }
+    ::part(input-checkbox-checked) {
+      background-color: #000;
+      border-color: #333;
+    }
+    ::part(input-checkbox-checked-focused) {
+      background-color: #000;
+      box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0.25);
+    }
+    ::part(input-checkbox-focused) {
+      background-color: #fff;
+      box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0.25);
+    }
+    ::part(button-primary) {
+      color: #333;
+      background-color: transparent;
+      border-color: #333;
+    }
+    ::part(button-primary):hover {
+      background-color: rgba(0, 0, 0, .05);
+      border-color: #333;
+      color: #333;
+    }
+    ::part(radio-list-item) {
+      border-bottom: 1px solid #ddd;
+    }
+    ::part(radio-list-item):hover {
+      background-color: #f9f9f9;
+      cursor: pointer;
+    }
+    </style>
+</head>
+<body>
+  <justifi-tokenize-payment-method
+    account-id="acc_123"
+    auth-token="authToken"
+    payment-method-group-id="pmg_123"
+    submit-button-text="Tokenize Payment Method"
+  />
+</body>
+  <script>
+    const justifiTokenizePaymentMethod = document.querySelector("justifi-tokenize-payment-method");
+    // Handle successful tokenization
+    justifiTokenizePaymentMethod.addEventListener("submit-event", (event) => {
+      const response = event.detail.response;
+      console.log("Tokenization successful:", response);
+      if (response.token) {
+        console.log("Payment method token:", response.token);
+      }
+      if (response.data) {
+        console.log("Full payment method data:", response.data);
+      }
+    });
+    // Handle errors
+    justifiTokenizePaymentMethod.addEventListener("error-event", (event) => {
+      console.error("Tokenization error:", event.detail);
+    });
+    // External tokenize button (when built-in submit button is hidden)
+    document.getElementById("tokenize-button").addEventListener("click", async () => {
+      try {
+        const result = await justifiTokenizePaymentMethod.tokenizePaymentMethod();
+        console.log("External tokenization result:", result);
+      } catch (error) {
+        console.error("External tokenization failed:", error);
+      }
+    });
+    // Fill billing form programmatically
+    document.getElementById("fill-billing-form").addEventListener("click", async () => {
+      await justifiTokenizePaymentMethod.fillBillingForm({
+        name: "John Doe",
+        address_line1: "123 Main St",
+        address_line2: "Apt 1",
+        address_city: "Anytown",
+        address_state: "NY", // Use 2-letter state code
+        address_postal_code: "12345",
+      });
+      console.log("Billing form filled");
+    });
+    // Validate form
+    document.getElementById("validate-form").addEventListener("click", async () => {
+      const validation = await justifiTokenizePaymentMethod.validate();
+      console.log("Validation result:", validation);
+      if (validation.isValid) {
+        console.log("Form is valid!");
+      } else {
+        console.log("Form has errors:", validation.errors);
+      }
+    });
+  </script>
+</html>`}</code></pre>
+## Props, Events & Methods
+<div
+  dangerouslySetInnerHTML={{
+    __html: PropsTable([
+      {
+        name: 'account-id',
+        type: 'string',
+        required: true,
+        description:
+          'Platform account that will own the resulting payment method.',
+      },
+      {
+        name: 'auth-token',
+        type: 'string',
+        required: true,
+        description:
+          'Short-lived Web Component Token with `write:tokenize:account_id` scope.',
+      },
+      {
+        name: 'payment-method-group-id',
+        type: 'string',
+        description:
+          'Optional grouping identifier that lets you preselect payment rails in Modular Checkout.',
+      },
+      {
+        name: 'hide-submit-button',
+        type: 'boolean',
+        defaultValue: 'false',
+        description:
+          'Hides the internal CTA when hosting app handles submission.',
+      },
+      {
+        name: 'save-payment-method-label',
+        type: 'string',
+        description:
+          'Overrides the checkbox label when allowing customers to store a card.',
+      },
+      {
+        name: 'locale',
+        type: 'string',
+        defaultValue: 'en-US',
+        description:
+          'Controls localization of labels, placeholders, and currency formatting.',
+      },
+      {
+        name: 'theme',
+        type: 'string',
+        description:
+          'Name of a predefined theme exported by JustiFi (optional).',
+      },
+    ]),
+  }}
+/>
+### Events
+- `tokenized`: fires when a payment token is created; payload includes `payment_method_token` and metadata.
+- `error`: fires if tokenization fails; payload includes `code`, `message`, and validation hints.
+### Public methods
+1. `tokenizePaymentMethod()` – programmatically trigger submission (returns a promise that resolves to a token payload).
+2. `fillBillingForm(partialBillingDetails)` – prefill customers' billing information from saved data.
+## Theming & Layout
+- Hosted fields remain inside PCI-safe iframes, so styling focuses on the outer wrapper plus the `::part` hooks listed below.
+<div
+  dangerouslySetInnerHTML={{
+    __html: PartsTable([
+      {
+        name: 'font-family',
+        description: 'Controls the font family for the component.',
+      },
+      {
+        name: 'color',
+        description: 'Controls the text color.',
+      },
+      {
+        name: 'background-color',
+        description: 'Controls the background color.',
+      },
+      {
+        name: 'button',
+        description: 'Button styles.',
+      },
+      {
+        name: 'button-disabled',
+        description: 'Disabled button styles.',
+      },
+      {
+        name: 'input',
+        description: 'Input field styles.',
+      },
+      {
+        name: 'input-focused',
+        description: 'Input styles when focused.',
+      },
+      {
+        name: 'input-invalid',
+        description: 'Input styles when invalid.',
+      },
+      {
+        name: 'input-invalid-and-focused',
+        description: 'Input styles when invalid and focused.',
+      },
+      {
+        name: 'input-radio',
+        description: 'Radio input styles.',
+      },
+      {
+        name: 'input-checkbox',
+        description: 'Checkbox input styles.',
+      },
+      {
+        name: 'input-checkbox-checked',
+        description: 'Checkbox input styles when checked.',
+      },
+      {
+        name: 'input-checkbox-checked-focused',
+        description: 'Checkbox input styles when checked and focused.',
+      },
+      {
+        name: 'input-checkbox-focused',
+        description: 'Checkbox input styles when focused.',
+      },
+      {
+        name: 'button-primary',
+        description: 'Primary button styles.',
+      },
+      {
+        name: 'radio-list-item',
+        description: 'Radio list item styles.',
+      },
+    ]),
+  }}
+/>
+- Slots are not exposed (all inputs are encapsulated in PCI iframes), so styling relies on CSS variables and `::part` hooks for wrapper elements.

package/docs/payment-facilitation/unified-fintech-checkout/342/204/242/index.mdx ADDED Viewed

@@ -0,0 +1,150 @@
+---
+id: payment-facilitation/unified-fintech-checkout™/index
+title: Unified Fintech Checkout™
+description: Unified Fintech Checkout™ component that orchestrates payment capture, verification, and confirmation states.
+sidebar_position: 20
+---
+import { PropsTable, PartsTable } from '@justifi/webcomponents/docs/helpers';
+## Overview
+`<justifi-checkout>` renders a complete checkout experience: payment method entry, order summary, error handling, and confirmation states. Use it when you want a turnkey experience without composing Modular Checkout subcomponents manually.
+## Usage
+<pre>
+  <code className="language-html">{`<justifi-checkout
+  account-id="acc_123"
+  auth-token="wct_checkout"
+  checkout-id="chk_456"
+  locale="en-US"
+/>`}</code>
+</pre>
+## Props, Events & Methods
+<div
+  dangerouslySetInnerHTML={{
+    __html: PropsTable([
+      {
+        name: 'account-id',
+        type: 'string',
+        required: true,
+        description:
+          'Owning platform account; determines branding + permissions.',
+      },
+      {
+        name: 'auth-token',
+        type: 'string',
+        required: true,
+        description: 'Web Component Token with `write:checkout` scope.',
+      },
+      {
+        name: 'checkout-id',
+        type: 'string',
+        required: true,
+        description:
+          'Server-generated checkout session controlling line items and totals.',
+      },
+      {
+        name: 'require-save-payment-method',
+        type: 'boolean',
+        defaultValue: 'false',
+        description:
+          'When true, forces customers to save the payment method for future use.',
+      },
+      {
+        name: 'locale',
+        type: 'string',
+        defaultValue: 'en-US',
+        description:
+          'Controls currency formatting, copy, and date presentation.',
+      },
+    ]),
+  }}
+/>
+### Events
+- `completed`: Emits when payment succeeds; payload includes `checkout_id`, `payment_method_token`, and receipt data.
+- `error`: Fires if payment processing fails; includes error codes for analytics.
+- `step-changed`: Useful when you pipe analytics or breadcrumbs for multi-step flows.
+### Public methods
+1. `submit()` – Programmatically trigger the pay button (helpful if you hide the built-in CTA).
+2. `reset(checkoutId)` – Reload a different checkout session without re-mounting the component.
+## Theming & Layout
+<div
+  dangerouslySetInnerHTML={{
+    __html: PartsTable([
+      {
+        name: 'font-family',
+        description: 'Controls the font family for the component.',
+      },
+      {
+        name: 'color',
+        description: 'Controls the text color.',
+      },
+      {
+        name: 'background-color',
+        description: 'Controls the background color.',
+      },
+      {
+        name: 'button',
+        description: 'Button styles.',
+      },
+      {
+        name: 'button-disabled',
+        description: 'Disabled button styles.',
+      },
+      {
+        name: 'input',
+        description: 'Input field styles.',
+      },
+      {
+        name: 'input-focused',
+        description: 'Input styles when focused.',
+      },
+      {
+        name: 'input-invalid',
+        description: 'Input styles when invalid.',
+      },
+      {
+        name: 'input-invalid-and-focused',
+        description: 'Input styles when invalid and focused.',
+      },
+      {
+        name: 'input-radio',
+        description: 'Radio input styles.',
+      },
+      {
+        name: 'input-checkbox',
+        description: 'Checkbox input styles.',
+      },
+      {
+        name: 'input-checkbox-checked',
+        description: 'Checkbox input styles when checked.',
+      },
+      {
+        name: 'input-checkbox-checked-focused',
+        description: 'Checkbox input styles when checked and focused.',
+      },
+      {
+        name: 'input-checkbox-focused',
+        description: 'Checkbox input styles when focused.',
+      },
+      {
+        name: 'button-primary',
+        description: 'Primary button styles.',
+      },
+      {
+        name: 'radio-list-item',
+        description: 'Radio list item styles.',
+      },
+    ]),
+  }}
+/>

package/package.json CHANGED Viewed

@@ -1,11 +1,24 @@
 {
   "name": "@justifi/webcomponents",
-  "version": "6.7.1",
+  "version": "6.7.2",
   "description": "JustiFi Web Components",
   "collection": "dist/collection/collection-manifest.json",
   "main": "dist/index.cjs.js",
   "module": "dist/module/index.js",
   "types": "dist/types/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/types/index.d.ts",
+      "require": "./dist/index.cjs.js",
+      "import": "./dist/module/index.js"
+    },
+    "./docs/*": "./docs/*",
+    "./docs/helpers": "./docs/helpers/index.ts",
+    "./docs/helpers/*": "./docs/helpers/*.js",
+    "./dist/module/*": "./dist/module/*.js",
+    "./dist/docs.json": "./dist/docs.json",
+    "./package.json": "./package.json"
+  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/justifi-tech/web-component-library.git"
@@ -15,7 +28,8 @@
     "registry": "https://registry.npmjs.org"
   },
   "files": [
-    "dist/"
+    "dist/",
+    "docs/"
   ],
   "dependencies": {
     "@popperjs/core": "^2.11.8",
@@ -34,14 +48,14 @@
   },
   "devDependencies": {
     "@babel/preset-env": "^7.21.5",
-    "@babel/preset-react": "^7.18.6",
     "@babel/preset-typescript": "^7.21.5",
+    "@eslint/eslintrc": "^3.3.1",
     "@rollup/plugin-replace": "^6.0.1",
     "@stencil/sass": "^3.0.1",
     "@types/jest": "29.5.14",
-    "@types/react": "^19.0.12",
-    "@types/react-dom": "^19.0.4",
     "dotenv": "^16.3.1",
+    "eslint": "^9.27.0",
+    "eslint-plugin-mdx": "^3.1.5",
     "jest": "^29.7.0",
     "jest-cli": "^29.7.0",
     "jest-environment-node": "^29.7.0",
@@ -58,6 +72,7 @@
     "generate": "stencil generate",
     "test": "TZ=utc stencil test --spec",
     "test:watch": "TZ=utc stencil test --spec --watchAll",
-    "test:file": "stencil test --spec --watch --"
+    "test:file": "stencil test --spec --watch --",
+    "docs:lint": "eslint --ext .md,.mdx --config docs/.eslintrc.cjs docs"
   }
 }

package/dist/webcomponents/p-1df660a9.entry.js DELETED Viewed

@@ -1 +0,0 @@

- import{r as t,c as e,h as i,g as s,H as a}from"./p-DwYM91AU.js";import{S as r}from"./p-BP2sTIQV.js";import"./p-CZfYo5-1.js";import{c as n,J as d}from"./p-BEu9YFnf.js";import{w as o,c}from"./p-tGDdRx0W.js";import"./p-HXpYMWUU.js";import{a as h,C as l}from"./p-Cjcsf8ku.js";import{c as u}from"./p-BrRsgB8S.js";import"./p-CLHwhyvu.js";import"./p-B5rtFhtR.js";import"./p-BH0Xfn-F.js";import{P as f}from"./p-DkoufM1t.js";import{S as m}from"./p-CsgUIrv8.js";import{B as b}from"./p-Ty7R7tsw.js";import{v as p}from"./p-sA8HBfkI.js";import"./p-Dr8Z8wfP.js";import"./p-yyedWKWX.js";import"./p-B09GVew-.js";import"./p-BYsgavgS.js";const y=class{constructor(i){t(this,i),this.radioClick=e(this,"radio-click"),this.checked=!1,this.hidden=!1,this.handleClick=()=>{this.radioClick.emit(this.value)}}render(){return i(r,{key:"1ae40f787970160e38b72f917bda96f480d2a890"},i("div",{key:"2130596c8294cc38365e6126806735da0f93ef4a",class:`radio-list-item p-3 ${this.class||""}`,part:p,onClick:this.handleClick,hidden:this.hidden},i("form-control-radio",{key:"7d5524f518430f2bfd1c9863f354318929353cfb",name:this.name,value:this.value,checked:this.checked,label:this.label,inputHandler:()=>null})))}},v={[f.NEW_BANK_ACCOUNT]:"New bank account",[f.NEW_CARD]:"New credit or debit card"},g="Payment form not ready",k="Validation error",w=class{constructor(i){t(this,i),this.errorEvent=e(this,"error-event"),this.submitEvent=e(this,"submit-event"),this.computedHideSubmitButton=!1,this.isLoading=!1,this.submitButtonText="Submit"}paymentMethodsChanged(){this.setDefaultSelectedPaymentMethod()}connectedCallback(){this.setDefaultSelectedPaymentMethod(),this.setComputedHideSubmitButton()}disconnectedCallback(){var t;null===(t=this.analytics)||void 0===t||t.cleanup(),this.unsubscribeFromStore&&this.unsubscribeFromStore()}componentWillLoad(){n(),this.analytics=new d(this)}handleRadioClick(t){this.selectedPaymentMethod=t.detail,u.selectedPaymentMethod={type:t.detail}}async fillBillingForm(t){var e;null===(e=this.billingFormRef)||void 0===e||e.fill(t)}async tokenizePaymentMethod(t){null==t||t.preventDefault(),this.validateRequiredProps(),this.isLoading=!0;try{if(!(await this.validate()).isValid)return this.errorEvent.emit({errorCode:h.TOKENIZE_ERROR,message:k}),void(this.isLoading=!1);const t=await this.resolvePaymentMethod({isValid:!0});return t.error&&this.emitError({errorCode:t.error.code,message:t.error.message}),this.submitEvent.emit({response:t}),t}catch(t){const e=this.createErrorResponse(h.TOKENIZE_ERROR,t.message);return this.emitError({errorCode:h.TOKENIZE_ERROR,message:t.message}),this.submitEvent.emit({response:e}),e}finally{this.isLoading=!1}}async validate(){if(!this.areFormsReady())return{isValid:!1,errors:{general:g}};const[t,e]=await Promise.all([this.billingFormRef.validate(),this.paymentMethodFormRef.validate()]);return{isValid:t.isValid&&e.isValid,errors:Object.assign(Object.assign({},t.errors),e.errors)}}async tokenize(){try{const t=await this.billingFormRef.getValues(),e={clientId:this.authToken||u.authToken,account:this.accountId||u.accountId,paymentMethodMetadata:this.buildPaymentMethodMetadata(t)};return await this.paymentMethodFormRef.tokenize(e)}catch(t){return t}}validateRequiredProps(){this.authToken||u.authToken||this.emitError({errorCode:h.TOKENIZE_ERROR,message:"Auth token is required when using the tokenize-payment-method component not slotted in justifi-modular-checkout"}),this.accountId||u.accountId||this.emitError({errorCode:h.TOKENIZE_ERROR,message:"Account ID is required when using the tokenize-payment-method component not slotted in justifi-modular-checkout"})}setDefaultSelectedPaymentMethod(){this.selectedPaymentMethod||(this.disableCreditCard?this.disableBankAccount||(this.selectedPaymentMethod=f.NEW_BANK_ACCOUNT,u.selectedPaymentMethod={type:f.NEW_BANK_ACCOUNT}):(this.selectedPaymentMethod=f.NEW_CARD,u.selectedPaymentMethod={type:f.NEW_CARD}))}setComputedHideSubmitButton(){if(void 0!==this.hideSubmitButton)return void(this.computedHideSubmitButton=this.hideSubmitButton);const t=this.isSlottedWithinModularCheckout();this.computedHideSubmitButton=t}isSlottedWithinModularCheckout(){var t;let e=null===(t=this.host)||void 0===t?void 0:t.parentElement;for(;e;){if("JUSTIFI-MODULAR-CHECKOUT"===e.tagName)return!0;e=e.parentElement}return!1}get availablePaymentMethods(){const t=[];return this.disableCreditCard||t.push(f.NEW_CARD),this.disableBankAccount||t.push(f.NEW_BANK_ACCOUNT),t}areFormsReady(){return!(!this.billingFormRef||!this.paymentMethodFormRef)}emitError(t){this.errorEvent.emit(Object.assign(Object.assign({},t),{severity:l.ERROR}))}createErrorResponse(t,e){return{error:{code:t,message:e,decline_code:void 0}}}async resolvePaymentMethod(t){if(!this.areFormsReady())return this.createErrorResponse("form_not_ready",g);try{const e=await this.validate();if(!e.isValid||!t.isValid){const t=Object.values(e.errors)[0]||k;return{validationError:!0,error:{code:"validation_error",message:String(t),decline_code:void 0}}}return await this.performTokenization()}catch(t){return{error:t}}}async performTokenization(){var t,e;const i=await this.tokenize();if(i.error)return{error:i.error};const s=i.data;return{token:(null===(t=s.card)||void 0===t?void 0:t.token)||(null===(e=s.bank_account)||void 0===e?void 0:e.token),data:s}}buildPaymentMethodMetadata(t){return this.shouldSavePaymentMethod?Object.assign(Object.assign({},t),{payment_method_group_id:this.paymentMethodGroupID}):Object.assign({},t)}get paymentMethodGroupID(){return this.paymentMethodGroupId||u.paymentMethodGroupId}get shouldSavePaymentMethod(){return!(!this.paymentMethodGroupId&&!u.savePaymentMethod)}get shouldHideRadioInput(){return this.disableCreditCard||this.disableBankAccount}renderPaymentMethodOption(t){const e=this.selectedPaymentMethod===t&&void 0===u.selectedPaymentMethod.id;return i("div",{class:"payment-method"},i("justifi-radio-list-item",{name:"paymentMethodType",value:t,checked:e,label:v[t],hidden:this.shouldHideRadioInput}),e&&this.renderSelectedPaymentMethodForm(t))}renderSelectedPaymentMethodForm(t){return i("div",{class:"mt-4 pb-4"},this.renderPaymentMethodForm(t),i("div",{class:"mt-4"},i("justifi-billing-form",{ref:t=>this.billingFormRef=t,hideCardBillingForm:this.hideCardBillingForm,hideBankAccountBillingForm:this.hideBankAccountBillingForm,paymentMethodType:t})),i("div",{class:"mt-4"},i("justifi-save-new-payment-method",{hidden:!this.paymentMethodGroupID,label:this.savePaymentMethodLabel})))}renderPaymentMethodForm(t){return i(t===f.NEW_CARD?"justifi-card-form":"justifi-bank-account-form",{ref:t=>this.paymentMethodFormRef=t})}render(){return i(r,{key:"8017b0fe2b0e3045a097e30aadf6a54ed2c32e62"},i("form",{key:"c7b0ac690a66cfb693d28e7d0eabc93817de4659"},i("fieldset",{key:"fb29e26a4100985595c420024d2a5ff48c79043b"},i("div",{key:"589f51297059afda2e385281dcfeafd67fbd2268",class:"row gy-3"},i("div",{key:"bf067015fb3ff24e08501899e370f92dda774c2e",class:"col-12"},this.availablePaymentMethods.map((t=>this.renderPaymentMethodOption(t)))),i("div",{key:"28872ca9239e2f85cb83ad8e6f27dc10f84da151",class:"col-12"},i("justifi-button",{key:"1be3f46e34b42e69d065384dd195d7fdc09a0560",text:this.submitButtonText,variant:"primary",type:"submit",clickHandler:t=>this.tokenizePaymentMethod(t),isLoading:this.isLoading,"data-testid":"submit-button",hidden:this.computedHideSubmitButton}))))))}get host(){return s(this)}static get watchers(){return{disableCreditCard:["paymentMethodsChanged"],disableBankAccount:["paymentMethodsChanged"]}}},j=t=>{const{isReady:e}=t;return e?null:i("div",{class:"container-fluid p-0"},i("div",{class:"row mb-3"},i("div",{class:"col-12 align-content-end"},i(m,{height:"18px",width:"120px"}),i(m,{height:"36px"}))),i("div",{class:"row"},i("div",{class:"col-12 align-content-end"},i(m,{height:"18px",width:"110px"}),i(m,{height:"36px"}))))},C=class{constructor(e){t(this,e),this.isReady=!1}async componentWillLoad(){await o(),this.iframeOrigin=c.iframeOrigin,n(),this.analytics=new d(this)}componentDidRender(){Promise.all([this.accountNumberIframeElement,this.routingNumberIframeElement].map((t=>new Promise((e=>{t.addEventListener("iframeLoaded",(()=>{e()}))}))))).then((()=>{this.isReady=!0}))}disconnectedCallback(){var t;null===(t=this.analytics)||void 0===t||t.cleanup()}async validate(){const t=await this.accountNumberIframeElement.validate(),e=await this.routingNumberIframeElement.validate();return t&&e}async tokenize({clientId:t,paymentMethodMetadata:e,account:i}){return this.accountNumberIframeElement.tokenize(t,e,i)}render(){return i(r,{key:"0daa12da1ca699a05ca499425c4a37e4d913b2dd"},i(j,{key:"9d4ee0af94759d71d52130781401d322fcb5e397",isReady:this.isReady}),i("hidden-input",{key:"dc4ee0054cbc7acb214a1c410f8fd387677f92dc"}),i("div",{key:"b489311f205e0ffdaa4680621b706322bd3fc4ca",class:"container-fluid p-0",style:{opacity:this.isReady?"1":"0",height:this.isReady?"auto":"0"}},i("div",{key:"2d1b00b9705d1a94364f691d4ad705c339abbbce",class:"row mb-3"},i("iframe-input",{key:"21a66eb7d87b77c1ff1a1171a4cb84a4759853dd",inputId:"accountNumber",ref:t=>this.accountNumberIframeElement=t,label:"Account Number",iframeOrigin:`${this.iframeOrigin}/v2/accountNumber`})),i("div",{key:"1ff36d49f7304e203cdefea46010100ed750ed68",class:"row"},i("iframe-input",{key:"2211a638c875e504e7e25e0704788d7a437b5806",inputId:"routingNumber",ref:t=>this.routingNumberIframeElement=t,label:"Routing Number",iframeOrigin:`${this.iframeOrigin}/v2/routingNumber`}))))}},M=class{constructor(e){t(this,e)}get showSimpleCardBillingForm(){return this.paymentMethodType===f.NEW_CARD&&this.hideCardBillingForm}get showSimpleBankAccountBillingForm(){return this.paymentMethodType===f.NEW_BANK_ACCOUNT&&this.hideBankAccountBillingForm}async getValues(){var t;return null===(t=this.selectedFormRef)||void 0===t?void 0:t.getValues()}async fill(t){var e;null===(e=this.selectedFormRef)||void 0===e||e.fill(t)}async validate(){var t;return null===(t=this.selectedFormRef)||void 0===t?void 0:t.validate()}render(){return i(a,null,i(this.showSimpleBankAccountBillingForm?"justifi-bank-account-billing-form-simple":this.showSimpleCardBillingForm?"justifi-card-billing-form-simple":"justifi-billing-form-full",{legend:this.legend,ref:t=>this.selectedFormRef=t}))}},x=class{constructor(e){t(this,e),this.variant="primary",this.type="button"}render(){return i(r,{key:"7c8b76c4eaa412f2dc2ba59fd56cb7c28f46656c"},i(b,{key:"9440f90ebb380703b35b6c5d811e5d0780e80fd2",variant:this.variant,isLoading:this.isLoading,clickHandler:this.clickHandler,class:this.class,type:this.type,disabled:this.disabled,style:this.customStyle},this.text))}},_=t=>{const{isReady:e}=t;return e?null:i("div",{class:"container-fluid p-0"},i("div",{class:"mb-3"},i(m,{height:"18px",width:"100px"}),i(m,{height:"36px"})),i("div",{class:"row"},i("div",{class:"col-4 align-content-end"},i(m,{height:"18px",width:"80px"}),i(m,{height:"36px"})),i("div",{class:"col-4 align-content-end"},i(m,{height:"36px"})),i("div",{class:"col-4 align-content-end"},i(m,{height:"18px",width:"30px"}),i(m,{height:"36px"}))))},P=class{constructor(e){t(this,e),this.isReady=!1}async componentWillLoad(){await o(),this.iframeOrigin=c.iframeOrigin,n(),this.analytics=new d(this)}componentDidRender(){Promise.all([this.cardNumberIframeElement,this.expirationMonthIframeElement,this.expirationYearIframeElement,this.cvvIframeElement].map((t=>new Promise((e=>{t.addEventListener("iframeLoaded",(()=>{e()}))}))))).then((()=>{this.isReady=!0}))}disconnectedCallback(){var t;null===(t=this.analytics)||void 0===t||t.cleanup()}async validate(){const t=await this.cardNumberIframeElement.validate(),e=await this.expirationMonthIframeElement.validate(),i=await this.expirationYearIframeElement.validate(),s=await this.cvvIframeElement.validate();return t&&e&&i&&s}async tokenize({clientId:t,paymentMethodMetadata:e,account:i}){return this.cardNumberIframeElement.tokenize(t,e,i)}render(){return i(r,{key:"b0b07a928be767102b59ec93ab0df6296b8418af"},i(_,{key:"03d37e42253a905ece1e6a9b1d654e84665470d6",isReady:this.isReady}),i("hidden-input",{key:"62f657a6c0a4d5b7a7bbf809abeb42eba0d22345"}),i("div",{key:"874cac5eac376c8c4e12d99f760cd3cd487a6521",class:"container-fluid p-0",style:{opacity:this.isReady?"1":"0",height:this.isReady?"auto":"0"}},i("div",{key:"dcada2d72eebe506fe4cab8ad6eb959c551e9e2d",class:"mb-3"},i("iframe-input",{key:"7e784726f8dd0c8b35832646bc99e0d2131c08f9",inputId:"cardNumber",ref:t=>this.cardNumberIframeElement=t,label:"Card Number",iframeOrigin:`${this.iframeOrigin}/v2/cardNumber`})),i("div",{key:"2384099f3aa18b7d6bbc346f47ba9ff06e5b7e86",class:"row"},i("div",{key:"5fb523cd3f398894e5c7ee3e8a58d34581492410",class:"col-4 align-content-end"},i("iframe-input",{key:"a3b4aa06a5c85162d24e25a5261a9a2cc64a6b82",inputId:"expirationMonth",ref:t=>this.expirationMonthIframeElement=t,label:"Expiration",iframeOrigin:`${this.iframeOrigin}/v2/expirationMonth`})),i("div",{key:"3ccd6a19fce1c393a8c58534113239c518d51a4f",class:"col-4 align-content-end"},i("iframe-input",{key:"6d064b868c73b4431b476194602843b0f28729e0",inputId:"expirationYear",ref:t=>this.expirationYearIframeElement=t,label:"",iframeOrigin:`${this.iframeOrigin}/v2/expirationYear`})),i("div",{key:"26cd762bec43890e96ab5c6903943b0f4cfa9672",class:"col-4 align-content-end"},i("iframe-input",{key:"826dfe08347461bc5a94296b181826b70a7d1f6f",inputId:"CVV",ref:t=>this.cvvIframeElement=t,label:"CVV",iframeOrigin:`${this.iframeOrigin}/v2/CVV`})))))}},B=class{constructor(i){t(this,i),this.checkboxChanged=e(this,"checkboxChanged"),this.label="Save New Payment Method",this.isChecked=!1,this.handleCheckboxChange=(t,e)=>{this.isChecked=e,u.savePaymentMethod=e,this.checkboxChanged.emit(this.isChecked)}}render(){return i(r,{key:"7cc086e518b2defcea924398cd5957b44a893d94"},i("form-control-checkbox",{key:"523dd82fe06f0c0a6d259a84f320c0a335261232",label:this.label||"Save New Payment Method",name:"saveNewPaymentMethod",checked:this.isChecked,inputHandler:this.handleCheckboxChange}))}};export{w as internal_tokenize_payment_method,C as justifi_bank_account_form,M as justifi_billing_form,x as justifi_button,P as justifi_card_form,y as justifi_radio_list_item,B as justifi_save_new_payment_method}

package/dist/webcomponents/p-296bd0b6.entry.js DELETED Viewed

@@ -1 +0,0 @@

- import{h as t,r as s,c as e}from"./p-DwYM91AU.js";import{c as r,a as i,F as o}from"./p-DiJD6Iqx.js";import{f as n}from"./p-B09GVew-.js";import"./p-tGDdRx0W.js";import{C as a,a as u}from"./p-Cjcsf8ku.js";import{R as l,l as m}from"./p-BrRsgB8S.js";import"./p-CLHwhyvu.js";import"./p-B5rtFhtR.js";import"./p-BH0Xfn-F.js";import{B as h}from"./p-Ty7R7tsw.js";import{S as p}from"./p-BP2sTIQV.js";import"./p-CZfYo5-1.js";import{P as c}from"./p-DGGjRqDa.js";import{m as d}from"./p-DATDsXcA.js";import{c as f,J as v}from"./p-BEu9YFnf.js";import{g as j,a as y}from"./p-D2muobcE.js";import{A as b}from"./p-yyedWKWX.js";import{S as w}from"./p-CsgUIrv8.js";import"./p-BFTU3MAI.js";import"./p-HXpYMWUU.js";import"./p-BYsgavgS.js";import"./p-DkoufM1t.js";import"./p-sA8HBfkI.js";import"./p-Dr8Z8wfP.js";const g=t=>{const s=+t;return i().required("Amount is required").test("max-amount",`Refund amount cannot be more than payment amount: ${n(s)}`,(function(t){return+t<=+s})).test("min-amount","Refund amount must be greater than 0",(function(t){return+t>0}))},A=t=>{if(t)return r({amount:g(t),description:i().optional(),reason:i().optional().oneOf([l.customerRequest,l.duplicate,l.fraudulent],"Select a reason")})},B=[{label:"Select a reason",value:""},{label:"Customer requested a refund",value:"customer_request"},{label:"Customer was double-charged",value:"duplicate"},{label:"Payment was reported as fraud",value:"fraudulent"}],R=b();class x{async postRefund(t,s,e,r){return R.post({endpoint:`payments/${t}/refunds`,headers:{"Sub-Account":s},body:r,authToken:e})}}const D=()=>t("div",{class:"row gap-3"},t("div",{class:"col-12"},t(w,{width:"100%",height:"40px"}))),T=()=>t(p,null,t("div",{class:"row gap-5"},t(D,null),t(D,null),t(D,null))),I=class{constructor(t){s(this,t),this.errorEvent=e(this,"error-event"),this.submitEvent=e(this,"submit-event"),this.refundPayload={},this.displayAmount="",this.errors={},this.paymentLoading=!0,this.refundLoading=!1,this.hideSubmitButton=!1,this.inputHandler=(t,s)=>{this.formController.setValues(Object.assign(Object.assign({},this.formController.values.getValue()),{[t]:s}))}}componentWillLoad(){f(),this.analytics=new v(this),this.initializeApi(),this.formController=new o(A())}handleError(t,s,e){this.errorEvent.emit({errorCode:t,message:s,severity:e})}checkAmount(t){return t>0}handleInvalidAmount(){this.submitDisabled=!0,this.handleError(u.INVALID_REFUND_AMOUNT,"Refund amount must be greater than 0",a.ERROR)}initializeFormController(){const t=this.refundPayload.amount,s=t?t.toString():"0";this.formController=new o(A(s)),this.formController.setInitialValues({amount:s}),this.formController.values.subscribe((t=>{this.refundPayload=Object.assign({},t)})),this.formController.errors.subscribe((t=>{this.errors=Object.assign({},t)}))}initializeApi(){this.paymentId&&this.authToken?d({id:this.paymentId,authToken:this.authToken,service:new c})({onSuccess:({payment:t})=>{this.refundPayload=new m({amount:t.amount_refundable})},onError:({error:t,code:s,severity:e})=>{this.handleError(s,t,e)},final:()=>{this.checkAmount(this.refundPayload.amount)?this.initializeFormController():this.handleInvalidAmount(),this.paymentLoading=!1}}):this.handleError(u.MISSING_PROPS,"Payment ID and Auth Token are required",a.ERROR)}async refundPayment(t){if(t&&t.preventDefault(),!await this.formController.validate())return;const s=(({authToken:t,accountId:s,paymentId:e,service:r})=>async({refundBody:i,onSuccess:o,onError:n,final:u})=>{var l;try{const u=await r.postRefund(e,s,t,i);if(u.error)return n({error:y(u.error),code:j(null===(l=u.error)||void 0===l?void 0:l.code),severity:a.ERROR});o(u)}catch(t){const s=j(null==t?void 0:t.code);return n({error:t.message||t,code:s,severity:a.ERROR})}finally{return u()}})({authToken:this.authToken,accountId:this.accountId,paymentId:this.paymentId,service:new x}),e=this.formController.values.getValue();return this.refundLoading=!0,new Promise((t=>{let r;s({refundBody:e,onSuccess:t=>{r=t},onError:({error:t,code:s,severity:e})=>{r=t,this.handleError(t,s,e)},final:()=>{this.submitEvent.emit({response:r}),this.submitDisabled=!0,this.refundLoading=!1,t(r.data)}})}))}render(){if(this.paymentLoading)return t(T,null);const s=this.formController.getInitialValues(),e=this.refundPayload.amount;return t(p,null,t("form",null,t("fieldset",null,t("div",{class:"row gy-3"},t("div",{class:"col-12"},t("form-control-monetary",{name:"amount",label:"Refund Amount",defaultValue:s.amount,inputHandler:this.inputHandler,errorText:this.errors.amount})),t("div",{class:"col-12"},t("form-control-select",{name:"reason",label:"Reason for refund (optional)",defaultValue:s.reason,inputHandler:this.inputHandler,options:B,errorText:this.errors.reason})),t("div",{class:"col-12"},t("form-control-textarea",{name:"description",label:"Note (optional)",defaultValue:s.description,inputHandler:this.inputHandler,maxLength:250,errorText:this.errors.description})),t("div",{class:"form-group d-flex flex-row-reverse"},t(h,{variant:"primary",type:"submit",onClick:this.refundPayment.bind(this),isLoading:this.paymentLoading||this.refundLoading,hidden:this.hideSubmitButton,disabled:this.submitDisabled},`Refund ${n(+e)}`))))))}};export{I as justifi_refund_payment}

package/dist/webcomponents/p-Dr8Z8wfP.js DELETED Viewed

	@@ -1 +0,0 @@
1	- var e={name:"@justifi/webcomponents",version:"6.7.1"};export{e as p}

package/dist/webcomponents/p-ca0d1c6c.entry.js DELETED Viewed

@@ -1 +0,0 @@

- import{r as t,c as s,h as r}from"./p-DwYM91AU.js";import{P as i}from"./p-DGGjRqDa.js";import"./p-tGDdRx0W.js";import"./p-HXpYMWUU.js";import{C as o,a as e}from"./p-Cjcsf8ku.js";import{P as p}from"./p-BrRsgB8S.js";import"./p-CLHwhyvu.js";import"./p-B5rtFhtR.js";import"./p-BH0Xfn-F.js";import{g as a,a as n}from"./p-D2muobcE.js";import{c as m,J as c}from"./p-BEu9YFnf.js";import{S as h}from"./p-BP2sTIQV.js";import"./p-CZfYo5-1.js";import{d as f}from"./p-RTAZ4tdd.js";import"./p-yyedWKWX.js";import"./p-B09GVew-.js";import"./p-BYsgavgS.js";import"./p-DkoufM1t.js";import"./p-Dr8Z8wfP.js";import"./p-W9WWoLzT.js";import"./p-U3nU15el.js";import"./p-sA8HBfkI.js";const d=class{constructor(r){t(this,r),this.errorEvent=s(this,"error-event"),this.errorMessage=null,this.columns=f,this.handleErrorEvent=t=>{this.errorMessage=t.detail.message,this.errorEvent.emit(t.detail)}}componentWillLoad(){m(),this.analytics=new c(this),this.initializeGetPayments()}disconnectedCallback(){var t;null===(t=this.analytics)||void 0===t||t.cleanup()}propChanged(){this.initializeGetPayments()}initializeGetPayments(){this.accountId&&this.authToken?this.getPayments=(({id:t,authToken:s,service:r})=>async({params:i,onSuccess:e,onError:m,final:c})=>{var h,f;try{const c=await r.fetchPayments(t,s,i);if(c.error)return m({error:n(c.error),code:a(null===(f=c.error)||void 0===f?void 0:f.code),severity:o.ERROR});{const t=Object.assign({},c.page_info);e({payments:(null===(h=c.data)||void 0===h?void 0:h.map((t=>new p(t))))||[],pagingInfo:t})}}catch(t){const s=a(null==t?void 0:t.code);return m({error:t.message||t,code:s,severity:o.ERROR})}finally{return c()}})({id:this.accountId,authToken:this.authToken,service:new i}):(this.errorMessage="Account ID and Auth Token are required",this.errorEvent.emit({errorCode:e.MISSING_PROPS,message:this.errorMessage,severity:o.ERROR}))}render(){return r(h,{key:"171935cc29253ff76262498183fd0f3a0f4a7eef"},r("payments-list-core",{key:"71be865f5035b6db46f4b97a3a36f08391de4f58",getPayments:this.getPayments,"onError-event":this.handleErrorEvent,columns:this.columns}))}static get watchers(){return{accountId:["propChanged"],authToken:["propChanged"]}}};export{d as justifi_payments_list}

package/dist/webcomponents/p-cc0c722c.entry.js DELETED Viewed

@@ -1 +0,0 @@

- import{r as t,c as s,h as i}from"./p-DwYM91AU.js";import"./p-tGDdRx0W.js";import"./p-HXpYMWUU.js";import{C as o,a as r}from"./p-Cjcsf8ku.js";import{C as e}from"./p-BrRsgB8S.js";import"./p-CLHwhyvu.js";import"./p-B5rtFhtR.js";import"./p-BH0Xfn-F.js";import{g as a,a as c}from"./p-D2muobcE.js";import{c as p,J as n}from"./p-BEu9YFnf.js";import{C as h}from"./p-VRubcA-q.js";import{m as u,S as m}from"./p-C9VmfRis.js";import{S as d}from"./p-BP2sTIQV.js";import"./p-CZfYo5-1.js";import{d as f}from"./p-CBbwdoSa.js";import"./p-BYsgavgS.js";import"./p-B09GVew-.js";import"./p-DkoufM1t.js";import"./p-Dr8Z8wfP.js";import"./p-yyedWKWX.js";import"./p-U3nU15el.js";import"./p-sA8HBfkI.js";const j=class{constructor(i){t(this,i),this.errorEvent=s(this,"error-event"),this.errorMessage=null,this.columns=f,this.handleErrorEvent=t=>{this.errorMessage=t.detail.message,this.errorEvent.emit(t.detail)}}componentWillLoad(){p(),this.analytics=new n(this),this.initializeGetData()}disconnectedCallback(){var t;null===(t=this.analytics)||void 0===t||t.cleanup()}propChanged(){this.initializeGetData()}initializeGetData(){this.initializeGetCheckouts(),this.initializeGetSubAccounts()}initializeGetCheckouts(){this.accountId&&this.authToken?this.getCheckouts=(({accountId:t,authToken:s,service:i})=>async({params:r,onSuccess:p,onError:n})=>{var h,u;try{const m=await i.fetchCheckouts(t,s,r);if(m.error)return n({error:c(m.error),code:a(null===(u=m.error)||void 0===u?void 0:u.code),severity:o.ERROR});{const t=Object.assign({},m.page_info);p({checkouts:(null===(h=m.data)||void 0===h?void 0:h.map((t=>new e(t))))||[],pagingInfo:t})}}catch(t){const s=a(null==t?void 0:t.code);return n({error:t.message||t,code:s,severity:o.ERROR})}})({accountId:this.accountId,authToken:this.authToken,service:new h}):(this.errorMessage="Account ID and Auth Token are required",this.errorEvent.emit({errorCode:r.MISSING_PROPS,message:this.errorMessage,severity:o.ERROR}))}initializeGetSubAccounts(){this.accountId&&this.authToken&&(this.getSubAccounts=u({accountId:this.accountId,authToken:this.authToken,service:new m}))}render(){return i(d,{key:"0e9e50e18983dad43cfab19f2271678d3f5e6abd"},i("checkouts-list-core",{key:"6f128cc756477ff64638625d9a9ff9a5b4533948",getCheckouts:this.getCheckouts,getSubAccounts:this.getSubAccounts,"onError-event":this.handleErrorEvent,columns:this.columns}))}static get watchers(){return{accountId:["propChanged"],authToken:["propChanged"]}}};export{j as justifi_checkouts_list}

package/dist/webcomponents/p-def84700.entry.js DELETED Viewed

@@ -1 +0,0 @@

- import{h as s,r as i,c as t}from"./p-DwYM91AU.js";import{ao as e,am as r,ai as o,G as l}from"./p-sA8HBfkI.js";import{S as d}from"./p-BP2sTIQV.js";import"./p-CZfYo5-1.js";import{c as a,J as n}from"./p-BEu9YFnf.js";import{C as h,a as c}from"./p-Cjcsf8ku.js";import{B as u}from"./p-Dlrq1iZf.js";import{B as v}from"./p-B5rtFhtR.js";import{m as p}from"./p-sCHf--Vc.js";import{S as m}from"./p-CsgUIrv8.js";import"./p-tGDdRx0W.js";import"./p-HXpYMWUU.js";import{k as f,j as w,b as g}from"./p-BrRsgB8S.js";import"./p-CLHwhyvu.js";import"./p-BH0Xfn-F.js";import{g as b,a as x}from"./p-D2muobcE.js";import{T as y}from"./p-CCxsFwC4.js";import{k as j}from"./p-B09GVew-.js";import"./p-Dr8Z8wfP.js";import"./p-yyedWKWX.js";import"./p-BYsgavgS.js";import"./p-DkoufM1t.js";const k=()=>s("div",{class:"row gap-3"},s("div",{class:"col-12"},s(m,{width:"25%"})),s("div",{class:"col-12"},s(m,{width:"100%"})),s("div",{class:"col-12 d-flex gap-3"},s(m,{width:"50%"}),s(m,{width:"50%"})),s("div",{class:"col-12 d-flex gap-3"},s(m,{width:"65%"}),s(m,{width:"35%"}))),S=()=>s("div",{class:"row gap-5"},s("div",{class:"col-12"},s(m,{width:"40%",height:"40px"})),s(k,null)),B=()=>s("div",{class:"terminal-selector-skeleton mt-4 rounded shadow-sm"},s("div",{class:"d-flex align-items-center gap-3"},s(m,{width:"125px",height:"125px",styles:{borderRadius:"8px"}}),s("div",{class:"flex-grow-1"},s("div",{class:"d-flex row flex-row"},s("div",{class:"col-6 flex-column"},s(m,null),s(m,{width:"60%"})),s("div",{class:"d-flex justify-content-end align-items-center gap-2 col-6"},s(m,{width:"32px",height:"32px",styles:{borderRadius:"50%"}}),s(m,{width:"80px",height:"32px"}),s(m,{width:"32px",height:"32px",styles:{borderRadius:"50%"}}))),s("div",{class:"mt-4"},s("div",{class:"d-flex flex-column gap-2"},s(m,null),s(m,null)))))),C=class{constructor(s){i(this,s),this.errorEvent=t(this,"error-event"),this.submitted=t(this,"submit-event"),this.shipping=!1,this.submitButtonText="Submit Order",this.loading={business:!0,terminals:!0},this.submitting=!1,this.error=null,this.totalQuantity=0}componentWillLoad(){this.order=new w({business_id:this.businessId,sub_account_id:this.accountId,order_type:this.shipping?g.boardingShipping:g.boardingOnly}),a(),this.analytics=new n(this),this.loadData()}disconnectedCallback(){var s;null===(s=this.analytics)||void 0===s||s.cleanup()}handleError(s,i,t){this.error={message:s,code:i,severity:t},this.errorEvent.emit({errorCode:i,message:s,severity:t})}loadData(){this.businessId&&this.authToken?(this.initializeGetBusiness(),this.initializeGetTerminalModels()):this.handleError("Invalid business id or auth token",c.MISSING_PROPS,h.ERROR)}initializeGetBusiness(){p({id:this.businessId,authToken:this.authToken,service:new u})({onSuccess:({business:s})=>{this.business=new v(s),this.loading.business=!1},onError:({error:s,code:i,severity:t})=>{this.handleError(s,i,t),this.loading.business=!1}})}initializeGetTerminalModels(){(({id:s,authToken:i,service:t})=>async({onSuccess:e,onError:r})=>{var o,l,d,a;try{const n=await t.fetchTerminalModels(s,i);if(n.error)return r({error:x(n.error),code:b(null===(a=n.error)||void 0===a?void 0:a.code),severity:h.ERROR});e({terminals:(null===(l=null===(o=n.data)||void 0===o?void 0:o.terminal_order_models)||void 0===l?void 0:l.map((s=>new f(s))))||[],orderLimit:null===(d=n.data)||void 0===d?void 0:d.order_limit})}catch(s){const i=b(null==s?void 0:s.code);return r({error:s.message||s,code:i,severity:h.ERROR})}})({id:this.accountId,authToken:this.authToken,service:new y})({onSuccess:({terminals:s,orderLimit:i})=>{this.terminalModels=s,this.orderLimit=i,this.loading.terminals=!1},onError:({error:s,code:i,severity:t})=>{this.handleError(s,i,t),this.loading.terminals=!1}})}submitOrder(){const s=(({authToken:s,service:i,apiOrigin:t="https://wc-proxy.justifi.ai"})=>async({terminalOrder:e,onSuccess:r,onError:o})=>{var l;try{const d=await i.orderTerminals(s,e,t);if(d.error)return o({error:x(d.error),code:b(null===(l=d.error)||void 0===l?void 0:l.code),severity:h.ERROR});{const{data:s}=d;r({data:s})}}catch(s){const i=b(null==s?void 0:s.code);return o({error:s.message||s,code:i,severity:h.ERROR})}})({authToken:this.authToken,service:new y});this.submitting=!0,s({terminalOrder:this.order.payload,onSuccess:({data:s})=>{this.submitted.emit(s),this.submitting=!1},onError:({error:s,code:i,severity:t})=>{this.handleError(s,i,t),this.submitting=!1}})}onSelectedQuantityChange(s){this.order.updateTerminal(s.detail.modelName,s.detail.quantity),this.totalQuantity=this.order.totalQuantity}renderLoading(){return s("div",null,this.loading.business&&s(S,null),this.loading.terminals&&s("div",{class:"mt-5"},s(B,null),s(B,null),s(B,null)))}renderBusinessDetails(){var i,t,o,l,d,a,n,h;if(!this.loading.business&&this.business)return s("div",{class:"d-flex flex-column gap-4 mb-5 pt-5"},s("div",{class:"row"},s("div",{class:"col-12"},s("h2",{part:r},this.business.legal_name))),s("div",{class:"row"},s("div",{class:"col-6"},s("h5",{part:e},"Representative:"),s("div",null,s("div",null,null===(t=null===(i=this.business)||void 0===i?void 0:i.representative)||void 0===t?void 0:t.name),s("div",null,null===(l=null===(o=this.business)||void 0===o?void 0:o.representative)||void 0===l?void 0:l.title),s("div",null,null===(a=null===(d=this.business)||void 0===d?void 0:d.representative)||void 0===a?void 0:a.email),s("div",null,j(null===(h=null===(n=this.business)||void 0===n?void 0:n.representative)||void 0===h?void 0:h.phone)))),s("div",{class:"col-6"},s("h5",{part:e},this.shipping?"Shipping Address:":"Business Address:"),s("div",null,this.business.legal_address.line1,this.business.legal_address.line2?`, ${this.business.legal_address.line2}`:"",s("br",null),this.business.legal_address.city,", ",this.business.legal_address.state," ",this.business.legal_address.postal_code))))}renderTerminals(){if(!this.loading.terminals&&this.terminalModels)return s("div",{class:"d-flex flex-column gap-2 mt-5"},this.terminalModels.map((i=>s("terminal-quantity-selector",{modelName:i.model_name,description:i.description,imageUrl:i.image_url,helpUrl:i.help_url,limit:this.orderLimit-this.order.totalQuantity,onSelectedQuantityChange:this.onSelectedQuantityChange.bind(this)}))))}renderOrderSection(){return s("div",{class:"mt-3"},s("div",{class:"text-end"},"Order limit: ",this.orderLimit),s("div",{class:"d-flex justify-content-end mt-3"},s("button",{class:"btn btn-primary submit-btn",onClick:this.submitOrder.bind(this),disabled:0===this.order.totalQuantity||this.submitting,part:o},this.submitting?"Submitting...":this.submitButtonText)))}render(){return s(d,{key:"aa60b46b6f455a6e925a835f1b558c88966b2a90"},s("div",{key:"33361446b5b2848a0d7d4af36ff54a3be76a5779",part:l},this.renderLoading(),this.renderBusinessDetails(),this.renderTerminals(),this.renderOrderSection()))}};export{C as justifi_order_terminals}