@justifi/webcomponents 4.0.5 → 4.0.6

package/dist/collection/components/payment-form/payment-method-selector.css

@@ -67,6 +67,343 @@
   --bs-highlight-bg: #fff3cd;
 }
 
+.spinner-grow,
+.spinner-border {
+  display: inline-block;
+  width: var(--bs-spinner-width);
+  height: var(--bs-spinner-height);
+  vertical-align: var(--bs-spinner-vertical-align);
+  border-radius: 50%;
+  animation: var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name);
+}
+
+@keyframes spinner-border {
+  to {
+    transform: rotate(360deg) /* rtl:ignore */;
+  }
+}
+.spinner-border {
+  --bs-spinner-width: 2rem;
+  --bs-spinner-height: 2rem;
+  --bs-spinner-vertical-align: -0.125em;
+  --bs-spinner-border-width: 0.25em;
+  --bs-spinner-animation-speed: 0.75s;
+  --bs-spinner-animation-name: spinner-border;
+  border: var(--bs-spinner-border-width) solid currentcolor;
+  border-right-color: transparent;
+}
+
+.spinner-border-sm {
+  --bs-spinner-width: 1rem;
+  --bs-spinner-height: 1rem;
+  --bs-spinner-border-width: 0.2em;
+}
+
+@keyframes spinner-grow {
+  0% {
+    transform: scale(0);
+  }
+  50% {
+    opacity: 1;
+    transform: none;
+  }
+}
+.spinner-grow {
+  --bs-spinner-width: 2rem;
+  --bs-spinner-height: 2rem;
+  --bs-spinner-vertical-align: -0.125em;
+  --bs-spinner-animation-speed: 0.75s;
+  --bs-spinner-animation-name: spinner-grow;
+  background-color: currentcolor;
+  opacity: 0;
+}
+
+.spinner-grow-sm {
+  --bs-spinner-width: 1rem;
+  --bs-spinner-height: 1rem;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .spinner-border,
+  .spinner-grow {
+    --bs-spinner-animation-speed: 1.5s;
+  }
+}
+.clearfix::after {
+  display: block;
+  clear: both;
+  content: "";
+}
+
+.text-bg-primary {
+  color: #fff !important;
+  background-color: RGBA(13, 110, 253, var(--bs-bg-opacity, 1)) !important;
+}
+
+.text-bg-secondary {
+  color: #fff !important;
+  background-color: RGBA(108, 117, 125, var(--bs-bg-opacity, 1)) !important;
+}
+
+.text-bg-success {
+  color: #fff !important;
+  background-color: RGBA(25, 135, 84, var(--bs-bg-opacity, 1)) !important;
+}
+
+.text-bg-info {
+  color: #000 !important;
+  background-color: RGBA(13, 202, 240, var(--bs-bg-opacity, 1)) !important;
+}
+
+.text-bg-warning {
+  color: #000 !important;
+  background-color: RGBA(255, 193, 7, var(--bs-bg-opacity, 1)) !important;
+}
+
+.text-bg-danger {
+  color: #fff !important;
+  background-color: RGBA(220, 53, 69, var(--bs-bg-opacity, 1)) !important;
+}
+
+.text-bg-light {
+  color: #000 !important;
+  background-color: RGBA(248, 249, 250, var(--bs-bg-opacity, 1)) !important;
+}
+
+.text-bg-dark {
+  color: #fff !important;
+  background-color: RGBA(33, 37, 41, var(--bs-bg-opacity, 1)) !important;
+}
+
+.link-primary {
+  color: #0d6efd !important;
+}
+.link-primary:hover, .link-primary:focus {
+  color: #0a58ca !important;
+}
+
+.link-secondary {
+  color: #6c757d !important;
+}
+.link-secondary:hover, .link-secondary:focus {
+  color: #565e64 !important;
+}
+
+.link-success {
+  color: #198754 !important;
+}
+.link-success:hover, .link-success:focus {
+  color: #146c43 !important;
+}
+
+.link-info {
+  color: #0dcaf0 !important;
+}
+.link-info:hover, .link-info:focus {
+  color: #3dd5f3 !important;
+}
+
+.link-warning {
+  color: #ffc107 !important;
+}
+.link-warning:hover, .link-warning:focus {
+  color: #ffcd39 !important;
+}
+
+.link-danger {
+  color: #dc3545 !important;
+}
+.link-danger:hover, .link-danger:focus {
+  color: #b02a37 !important;
+}
+
+.link-light {
+  color: #f8f9fa !important;
+}
+.link-light:hover, .link-light:focus {
+  color: #f9fafb !important;
+}
+
+.link-dark {
+  color: #212529 !important;
+}
+.link-dark:hover, .link-dark:focus {
+  color: #1a1e21 !important;
+}
+
+.ratio {
+  position: relative;
+  width: 100%;
+}
+.ratio::before {
+  display: block;
+  padding-top: var(--bs-aspect-ratio);
+  content: "";
+}
+.ratio > * {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.ratio-1x1 {
+  --bs-aspect-ratio: 100%;
+}
+
+.ratio-4x3 {
+  --bs-aspect-ratio: 75%;
+}
+
+.ratio-16x9 {
+  --bs-aspect-ratio: 56.25%;
+}
+
+.ratio-21x9 {
+  --bs-aspect-ratio: 42.8571428571%;
+}
+
+.fixed-top {
+  position: fixed;
+  top: 0;
+  right: 0;
+  left: 0;
+  z-index: 1030;
+}
+
+.fixed-bottom {
+  position: fixed;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1030;
+}
+
+.sticky-top {
+  position: sticky;
+  top: 0;
+  z-index: 1020;
+}
+
+.sticky-bottom {
+  position: sticky;
+  bottom: 0;
+  z-index: 1020;
+}
+
+@media (min-width: 576px) {
+  .sticky-sm-top {
+    position: sticky;
+    top: 0;
+    z-index: 1020;
+  }
+  .sticky-sm-bottom {
+    position: sticky;
+    bottom: 0;
+    z-index: 1020;
+  }
+}
+@media (min-width: 768px) {
+  .sticky-md-top {
+    position: sticky;
+    top: 0;
+    z-index: 1020;
+  }
+  .sticky-md-bottom {
+    position: sticky;
+    bottom: 0;
+    z-index: 1020;
+  }
+}
+@media (min-width: 992px) {
+  .sticky-lg-top {
+    position: sticky;
+    top: 0;
+    z-index: 1020;
+  }
+  .sticky-lg-bottom {
+    position: sticky;
+    bottom: 0;
+    z-index: 1020;
+  }
+}
+@media (min-width: 1200px) {
+  .sticky-xl-top {
+    position: sticky;
+    top: 0;
+    z-index: 1020;
+  }
+  .sticky-xl-bottom {
+    position: sticky;
+    bottom: 0;
+    z-index: 1020;
+  }
+}
+@media (min-width: 1400px) {
+  .sticky-xxl-top {
+    position: sticky;
+    top: 0;
+    z-index: 1020;
+  }
+  .sticky-xxl-bottom {
+    position: sticky;
+    bottom: 0;
+    z-index: 1020;
+  }
+}
+.hstack {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  align-self: stretch;
+}
+
+.vstack {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  align-self: stretch;
+}
+
+.visually-hidden,
+.visually-hidden-focusable:not(:focus):not(:focus-within) {
+  position: absolute !important;
+  width: 1px !important;
+  height: 1px !important;
+  padding: 0 !important;
+  margin: -1px !important;
+  overflow: hidden !important;
+  clip: rect(0, 0, 0, 0) !important;
+  white-space: nowrap !important;
+  border: 0 !important;
+}
+
+.stretched-link::after {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1;
+  content: "";
+}
+
+.text-truncate {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.vr {
+  display: inline-block;
+  align-self: stretch;
+  width: 1px;
+  min-height: 1em;
+  background-color: currentcolor;
+  opacity: 0.25;
+}
+
 .form-label {
   margin-bottom: 0.5rem;
 }

package/dist/collection/components/payment-form/payment-method-selector.js

@@ -92,3 +92,4 @@ export class PaymentMethodSelector {
       }];
   }
 }
+//# sourceMappingURL=payment-method-selector.js.map

package/dist/collection/components/payment-form/payment-method-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"payment-method-selector.js","sourceRoot":"","sources":["../../../../src/components/payment-form/payment-method-selector.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,QAAQ,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAGlF,MAAM,mBAAmB,GAAG;EAC1B,WAAW,EAAE,cAAc;EAC3B,IAAI,EAAE,MAAM;CACb,CAAC;AAOF,MAAM,OAAO,qBAAqB;;8BACmB,EAAE;;;EAMrD,eAAe,CAAC,KAAU;IACxB,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;EACtD,CAAC;EAED,MAAM;IACJ,OAAO,CACL,WAAK,KAAK,EAAC,+BAA+B,EAAC,IAAI,EAAC,OAAO,gBAAY,uCAAuC,IACvG,IAAI,CAAC,kBAAkB,CAAC,GAAG,CAAC,CAAC,iBAAqC,EAAE,EAAE,CAAC,CACtE,EAAC,QAAQ;MACP,aACE,EAAE,EAAE,iBAAiB,EACrB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,mBAAmB,EACxB,KAAK,EAAE,iBAAiB,EACxB,QAAQ,EAAE,CAAC,KAAU,EAAE,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,EACrD,OAAO,EAAE,IAAI,CAAC,yBAAyB,KAAK,iBAAiB,EAC7D,KAAK,EAAC,yBAAyB,GAC/B;MACF,aAAO,OAAO,EAAE,iBAAiB,EAAE,KAAK,EAAC,6CAA6C,IACnF,mBAAmB,CAAC,iBAAiB,CAAC,CACjC,CACC,CACZ,CAAC,CACE,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, Fragment, h, Prop } from '@stencil/core';\nimport { PaymentMethodTypes } from '../../api';\n\nconst PaymentMethodLabels = {\n  bankAccount: 'Bank Account',\n  card: 'Card',\n};\n\n@Component({\n  tag: 'justifi-payment-method-selector',\n  styleUrl: 'payment-method-selector.scss',\n  shadow: true,\n})\nexport class PaymentMethodSelector {\n  @Prop() paymentMethodTypes: PaymentMethodTypes[] = [];\n  @Prop() selectedPaymentMethodType: PaymentMethodTypes;\n  @Event({ bubbles: true }) paymentMethodSelected: EventEmitter;\n\n  defaultRadioButtonOption!: HTMLInputElement;\n\n  onChangeHandler(event: any) {\n    this.paymentMethodSelected.emit(event.target.value);\n  }\n\n  render() {\n    return (\n      <div class=\"btn-group jfi-btn-radio-group\" role=\"group\" aria-label=\"Radio toggle group for payment method\">\n        {this.paymentMethodTypes.map((paymentMethodType: PaymentMethodTypes) => (\n          <Fragment>\n            <input\n              id={paymentMethodType}\n              type=\"radio\"\n              name=\"paymentMethodType\"\n              value={paymentMethodType}\n              onChange={(event: any) => this.onChangeHandler(event)}\n              checked={this.selectedPaymentMethodType === paymentMethodType}\n              class=\"btn-check jfi-btn-radio\"\n            />\n            <label htmlFor={paymentMethodType} class=\"btn btn-outline-primary jfi-btn-radio-label\">\n              {PaymentMethodLabels[paymentMethodType]}\n            </label>\n          </Fragment>\n        ))}\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/payment-form/test/payment-form.e2e.js

@@ -0,0 +1,23 @@
+import { newE2EPage } from '@stencil/core/testing';
+describe('justifi-payment-form', () => {
+  it('should correctly render submit button with correct text', async () => {
+    // Create new testing page and add our component to it
+    const page = await newE2EPage();
+    await page.setContent(`
+        <justifi-payment-form
+          bank-account="true"
+          card="true"
+          email="test@example.com"
+          iframe-origin="https://iframe.example.com"
+          client-id="testId"
+          account-id="accountId"
+          submit-button-text="Pay Now"
+        />
+      `);
+    // Find the submit button on the page
+    const submitButton = await page.find('justifi-payment-form >>> button');
+    // Assert that the submit button's text is set correctly
+    expect(await submitButton.textContent).toBe('Pay Now');
+  });
+});
+//# sourceMappingURL=payment-form.e2e.js.map

package/dist/collection/components/payment-form/test/payment-form.e2e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"payment-form.e2e.js","sourceRoot":"","sources":["../../../../../src/components/payment-form/test/payment-form.e2e.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,QAAQ,CAAC,sBAAsB,EAAE,GAAG,EAAE;EACpC,EAAE,CAAC,yDAAyD,EAAE,KAAK,IAAI,EAAE;IACvE,sDAAsD;IACtD,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CACnB;;;;;;;;;;OAUC,CACF,CAAC;IAEF,qCAAqC;IACrC,MAAM,YAAY,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,iCAAiC,CAAC,CAAC;IAExE,wDAAwD;IACxD,MAAM,CAAC,MAAM,YAAY,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;EACzD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newE2EPage } from '@stencil/core/testing';\n\ndescribe('justifi-payment-form', () => {\n  it('should correctly render submit button with correct text', async () => {\n    // Create new testing page and add our component to it\n    const page = await newE2EPage();\n    await page.setContent(\n      `\n        <justifi-payment-form\n          bank-account=\"true\"\n          card=\"true\"\n          email=\"test@example.com\"\n          iframe-origin=\"https://iframe.example.com\"\n          client-id=\"testId\"\n          account-id=\"accountId\"\n          submit-button-text=\"Pay Now\"\n        />\n      `,\n    );\n\n    // Find the submit button on the page\n    const submitButton = await page.find('justifi-payment-form >>> button');\n\n    // Assert that the submit button's text is set correctly\n    expect(await submitButton.textContent).toBe('Pay Now');\n  });\n});\n"]}

package/dist/collection/components/payment-form/test/payment-form.spec.js

@@ -0,0 +1,182 @@
+import { newSpecPage } from '@stencil/core/testing';
+import { PaymentForm } from '../payment-form';
+import { PaymentMethodTypes } from '../../../api';
+describe('justifi-payment-form', () => {
+  // State Testing
+  it('should update allowedPaymentMethodTypes and selectedPaymentMethodType state correctly when connectedCallback is invoked', async () => {
+    // Mock properties
+    const mockComponent = new PaymentForm();
+    mockComponent.bankAccount = true;
+    mockComponent.card = true;
+    // Invoke the lifecycle method
+    mockComponent.connectedCallback();
+    // Assertions
+    expect(mockComponent.allowedPaymentMethodTypes).toEqual([PaymentMethodTypes.card, PaymentMethodTypes.bankAccount]);
+    expect(mockComponent.selectedPaymentMethodType).toBe(PaymentMethodTypes.card);
+  });
+  it('should update submitButtonEnabled state when enableSubmitButton method is called', async () => {
+    // Mock component
+    const mockComponent = new PaymentForm();
+    mockComponent.submitButtonEnabled = false;
+    // Call the method
+    await mockComponent.enableSubmitButton();
+    // Assertion
+    expect(mockComponent.submitButtonEnabled).toBe(true);
+  });
+  it('should update selectedPaymentMethodType when paymentMethodSelected event is fired', async () => {
+    // Mock component
+    const mockComponent = new PaymentForm();
+    mockComponent.selectedPaymentMethodType = PaymentMethodTypes.card;
+    // Define the event details
+    const detail = PaymentMethodTypes.bankAccount;
+    const event = new CustomEvent('paymentMethodSelected', { detail });
+    // Simulate the event
+    mockComponent.paymentMethodSelectedHandler(event);
+    // Assertion
+    expect(mockComponent.selectedPaymentMethodType).toBe(PaymentMethodTypes.bankAccount);
+  });
+  // Props Testing
+  it('should have the expected default properties', () => {
+    const paymentForm = new PaymentForm();
+    // Assert that the properties exist and have the expected default values
+    expect(paymentForm).toHaveProperty('bankAccount', undefined);
+    expect(paymentForm).toHaveProperty('card', undefined);
+    expect(paymentForm).toHaveProperty('email', undefined);
+    expect(paymentForm).toHaveProperty('iframeOrigin', undefined);
+    expect(paymentForm).toHaveProperty('clientId', undefined);
+    expect(paymentForm).toHaveProperty('accountId', undefined);
+    expect(paymentForm).toHaveProperty('submitButtonText', undefined);
+  });
+  // Method Testing
+  it('should correctly fill billing form when fillBillingForm method is called', async () => {
+    // Mock child component
+    const mockBillingFormRef = {
+      fill: jest.fn(),
+    };
+    // Mock component
+    const mockComponent = new PaymentForm();
+    // Cast to any to bypass type checker and directly set private property
+    mockComponent.billingFormRef = mockBillingFormRef;
+    // Define the fields to fill the billing form
+    const fields = {
+      name: 'John Doe',
+      address_line1: '123 Main St',
+      address_line2: 'Apt 4B',
+      address_city: 'Townsville',
+      address_state: 'TS',
+      address_postal_code: '12345',
+    };
+    // Call the method
+    await mockComponent.fillBillingForm(fields);
+    // Check that the child component's fill method was called with the correct arguments
+    expect(mockBillingFormRef.fill).toHaveBeenCalledWith(fields);
+  });
+  it('should submit the form correctly and trigger the "submitted" event with the correct payload when submit method is called', async () => {
+    // Mock billingFormRef and paymentMethodFormRef
+    const mockBillingFormRef = {
+      validate: jest.fn().mockResolvedValue({ isValid: true }),
+      getValues: jest.fn().mockResolvedValue({ name: 'John Doe' }),
+    };
+    const mockPaymentMethodFormRef = {
+      validate: jest.fn().mockResolvedValue({ isValid: true }),
+      tokenize: jest.fn().mockResolvedValue({ token: 'abc123' }),
+    };
+    // Mock component
+    const mockComponent = new PaymentForm();
+    // Cast to any to bypass type checker and directly set private properties
+    mockComponent.billingFormRef = mockBillingFormRef;
+    mockComponent.paymentMethodFormRef = mockPaymentMethodFormRef;
+    // Mock event
+    const mockEvent = { preventDefault: jest.fn() };
+    // Mock event emitter
+    const mockEmitter = { emit: jest.fn() };
+    mockComponent.submitted = mockEmitter;
+    // Call submit method
+    await mockComponent.submit(mockEvent);
+    // Expectations
+    expect(mockEvent.preventDefault).toHaveBeenCalled();
+    expect(mockBillingFormRef.validate).toHaveBeenCalled();
+    expect(mockPaymentMethodFormRef.validate).toHaveBeenCalled();
+    expect(mockBillingFormRef.getValues).toHaveBeenCalled();
+    expect(mockPaymentMethodFormRef.tokenize).toHaveBeenCalledWith(mockComponent.clientId, { email: mockComponent.email, name: 'John Doe' }, mockComponent.accountId);
+    expect(mockEmitter.emit).toHaveBeenCalledWith({ token: 'abc123' });
+  });
+  // Event Testing
+  it('should fire the "submitted" event with correct data when the form is submitted', async () => {
+    // Mock billingFormRef and paymentMethodFormRef
+    const mockBillingFormRef = {
+      validate: jest.fn().mockResolvedValue({ isValid: true }),
+      getValues: jest.fn().mockResolvedValue({
+        name: 'John Doe',
+        address_line1: 'Address 1',
+        address_line2: 'Address 2',
+        address_city: 'City',
+        address_state: 'State',
+        address_postal_code: 'Postal Code',
+      }),
+    };
+    const mockPaymentMethodFormRef = {
+      validate: jest.fn().mockResolvedValue({ isValid: true }),
+      tokenize: jest.fn().mockResolvedValue({ token: 'abc123' }),
+    };
+    // Mock component
+    const mockComponent = new PaymentForm();
+    mockComponent.email = 'john@example.com'; // set email prop
+    // Cast to any to bypass type checker and directly set private properties
+    mockComponent.billingFormRef = mockBillingFormRef;
+    mockComponent.paymentMethodFormRef = mockPaymentMethodFormRef;
+    // Mock event
+    const mockEvent = { preventDefault: jest.fn() };
+    // Mock event emitter
+    const mockEmitter = { emit: jest.fn() };
+    mockComponent.submitted = mockEmitter;
+    // Call submit method
+    await mockComponent.submit(mockEvent);
+    // Define expected payload
+    const expectedPayload = { token: 'abc123' };
+    // Expectations
+    expect(mockEmitter.emit).toHaveBeenCalledWith(expectedPayload);
+  });
+  // Render Testing
+  it('should correctly render the child components based on the given props and state', async () => {
+    // Set up new PaymentForm with specific props and state
+    const component = new PaymentForm();
+    component.bankAccount = true;
+    component.card = true;
+    component.email = 'test@test.com';
+    component.iframeOrigin = 'https://example.com';
+    component.clientId = 'abc123';
+    component.accountId = 'def456';
+    component.submitButtonText = 'Submit';
+    // Cast to any to bypass type checker and directly set private properties
+    component.submitButtonEnabled = true;
+    component.selectedPaymentMethodType = PaymentMethodTypes.card;
+    component.allowedPaymentMethodTypes = [PaymentMethodTypes.card, PaymentMethodTypes.bankAccount];
+    // Render the component
+    const { root } = await newSpecPage({
+      components: [PaymentForm],
+      html: '<justifi-payment-form payment-method-form-type="card" iframe-origin="https://example.com"></justifi-payment-form>',
+    });
+    // Assert that the rendered output is correct
+    expect(root).toEqualHtml(`
+      <justifi-payment-form iframe-origin="https://example.com" payment-method-form-type="card">
+        <mock:shadow-root>
+          <form class="gy-3 row">
+            <div class="col-12">
+              <justifi-payment-method-form iframe-origin="https://example.com" payment-method-form-type="card"></justifi-payment-method-form>
+            </div>
+            <div class="col-12">
+              <justifi-billing-form legend="Billing Info"></justifi-billing-form>
+            </div>
+            <div class="col-12">
+              <button class="btn btn-primary jfi-submit-button" type="submit">
+                Submit
+              </button>
+            </div>
+          </form>
+        </mock:shadow-root>
+      </justifi-payment-form>
+    `);
+  });
+});
+//# sourceMappingURL=payment-form.spec.js.map

package/dist/collection/components/payment-form/test/payment-form.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"payment-form.spec.js","sourceRoot":"","sources":["../../../../../src/components/payment-form/test/payment-form.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAGlD,QAAQ,CAAC,sBAAsB,EAAE,GAAG,EAAE;EACpC,gBAAgB;EAChB,EAAE,CAAC,yHAAyH,EAAE,KAAK,IAAI,EAAE;IACvI,kBAAkB;IAClB,MAAM,aAAa,GAAG,IAAI,WAAW,EAAE,CAAC;IACxC,aAAa,CAAC,WAAW,GAAG,IAAI,CAAC;IACjC,aAAa,CAAC,IAAI,GAAG,IAAI,CAAC;IAE1B,8BAA8B;IAC9B,aAAa,CAAC,iBAAiB,EAAE,CAAC;IAElC,aAAa;IACb,MAAM,CAAC,aAAa,CAAC,yBAAyB,CAAC,CAAC,OAAO,CAAC,CAAC,kBAAkB,CAAC,IAAI,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC,CAAC;IACnH,MAAM,CAAC,aAAa,CAAC,yBAAyB,CAAC,CAAC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;EAChF,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,kFAAkF,EAAE,KAAK,IAAI,EAAE;IAChG,iBAAiB;IACjB,MAAM,aAAa,GAAG,IAAI,WAAW,EAAE,CAAC;IACxC,aAAa,CAAC,mBAAmB,GAAG,KAAK,CAAC;IAE1C,kBAAkB;IAClB,MAAM,aAAa,CAAC,kBAAkB,EAAE,CAAC;IAEzC,YAAY;IACZ,MAAM,CAAC,aAAa,CAAC,mBAAmB,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EACvD,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,mFAAmF,EAAE,KAAK,IAAI,EAAE;IACjG,iBAAiB;IACjB,MAAM,aAAa,GAAG,IAAI,WAAW,EAAE,CAAC;IACxC,aAAa,CAAC,yBAAyB,GAAG,kBAAkB,CAAC,IAAI,CAAC;IAElE,2BAA2B;IAC3B,MAAM,MAAM,GAAG,kBAAkB,CAAC,WAAW,CAAC;IAC9C,MAAM,KAAK,GAAG,IAAI,WAAW,CAAC,uBAAuB,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC;IAEnE,qBAAqB;IACrB,aAAa,CAAC,4BAA4B,CAAC,KAAK,CAAC,CAAC;IAElD,YAAY;IACZ,MAAM,CAAC,aAAa,CAAC,yBAAyB,CAAC,CAAC,IAAI,CAAC,kBAAkB,CAAC,WAAW,CAAC,CAAC;EACvF,CAAC,CAAC,CAAC;EAEH,gBAAgB;EAChB,EAAE,CAAC,6CAA6C,EAAE,GAAG,EAAE;IACrD,MAAM,WAAW,GAAG,IAAI,WAAW,EAAE,CAAC;IAEtC,wEAAwE;IACxE,MAAM,CAAC,WAAW,CAAC,CAAC,cAAc,CAAC,aAAa,EAAE,SAAS,CAAC,CAAC;IAC7D,MAAM,CAAC,WAAW,CAAC,CAAC,cAAc,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IACtD,MAAM,CAAC,WAAW,CAAC,CAAC,cAAc,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;IACvD,MAAM,CAAC,WAAW,CAAC,CAAC,cAAc,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC;IAC9D,MAAM,CAAC,WAAW,CAAC,CAAC,cAAc,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC;IAC1D,MAAM,CAAC,WAAW,CAAC,CAAC,cAAc,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;IAC3D,MAAM,CAAC,WAAW,CAAC,CAAC,cAAc,CAAC,kBAAkB,EAAE,SAAS,CAAC,CAAC;EACpE,CAAC,CAAC,CAAC;EAEH,iBAAiB;EACjB,EAAE,CAAC,0EAA0E,EAAE,KAAK,IAAI,EAAE;IACxF,uBAAuB;IACvB,MAAM,kBAAkB,GAAG;MACzB,IAAI,EAAE,IAAI,CAAC,EAAE,EAAE;KAChB,CAAC;IAEF,iBAAiB;IACjB,MAAM,aAAa,GAAG,IAAI,WAAW,EAAE,CAAC;IAExC,uEAAuE;IACtE,aAAqB,CAAC,cAAc,GAAG,kBAAkB,CAAC;IAE3D,6CAA6C;IAC7C,MAAM,MAAM,GAAsB;MAChC,IAAI,EAAE,UAAU;MAChB,aAAa,EAAE,aAAa;MAC5B,aAAa,EAAE,QAAQ;MACvB,YAAY,EAAE,YAAY;MAC1B,aAAa,EAAE,IAAI;MACnB,mBAAmB,EAAE,OAAO;KAC7B,CAAC;IAEF,kBAAkB;IAClB,MAAM,aAAa,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;IAE5C,qFAAqF;IACrF,MAAM,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC;EAC/D,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,0HAA0H,EAAE,KAAK,IAAI,EAAE;IACxI,+CAA+C;IAC/C,MAAM,kBAAkB,GAAG;MACzB,QAAQ,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,iBAAiB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;MACxD,SAAS,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,iBAAiB,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;KAC7D,CAAC;IAEF,MAAM,wBAAwB,GAAG;MAC/B,QAAQ,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,iBAAiB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;MACxD,QAAQ,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,iBAAiB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;KAC3D,CAAC;IAEF,iBAAiB;IACjB,MAAM,aAAa,GAAG,IAAI,WAAW,EAAE,CAAC;IAExC,yEAAyE;IACxE,aAAqB,CAAC,cAAc,GAAG,kBAAkB,CAAC;IAC1D,aAAqB,CAAC,oBAAoB,GAAG,wBAAwB,CAAC;IAEvE,aAAa;IACb,MAAM,SAAS,GAAG,EAAE,cAAc,EAAE,IAAI,CAAC,EAAE,EAAE,EAAE,CAAC;IAEhD,qBAAqB;IACrB,MAAM,WAAW,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,EAAE,EAAE,EAAE,CAAC;IACxC,aAAa,CAAC,SAAS,GAAG,WAAkB,CAAC;IAE7C,qBAAqB;IACrB,MAAM,aAAa,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;IAEtC,eAAe;IACf,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC,gBAAgB,EAAE,CAAC;IACpD,MAAM,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC,gBAAgB,EAAE,CAAC;IACvD,MAAM,CAAC,wBAAwB,CAAC,QAAQ,CAAC,CAAC,gBAAgB,EAAE,CAAC;IAC7D,MAAM,CAAC,kBAAkB,CAAC,SAAS,CAAC,CAAC,gBAAgB,EAAE,CAAC;IACxD,MAAM,CAAC,wBAAwB,CAAC,QAAQ,CAAC,CAAC,oBAAoB,CAAC,aAAa,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAE,aAAa,CAAC,KAAK,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IAClK,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,oBAAoB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC;EACrE,CAAC,CAAC,CAAC;EAEH,gBAAgB;EAChB,EAAE,CAAC,gFAAgF,EAAE,KAAK,IAAI,EAAE;IAC9F,+CAA+C;IAC/C,MAAM,kBAAkB,GAAG;MACzB,QAAQ,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,iBAAiB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;MACxD,SAAS,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,iBAAiB,CAAC;QACrC,IAAI,EAAE,UAAU;QAChB,aAAa,EAAE,WAAW;QAC1B,aAAa,EAAE,WAAW;QAC1B,YAAY,EAAE,MAAM;QACpB,aAAa,EAAE,OAAO;QACtB,mBAAmB,EAAE,aAAa;OACnC,CAAC;KACH,CAAC;IAEF,MAAM,wBAAwB,GAAG;MAC/B,QAAQ,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,iBAAiB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;MACxD,QAAQ,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,iBAAiB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;KAC3D,CAAC;IAEF,iBAAiB;IACjB,MAAM,aAAa,GAAG,IAAI,WAAW,EAAE,CAAC;IACxC,aAAa,CAAC,KAAK,GAAG,kBAAkB,CAAC,CAAC,iBAAiB;IAE3D,yEAAyE;IACxE,aAAqB,CAAC,cAAc,GAAG,kBAAkB,CAAC;IAC1D,aAAqB,CAAC,oBAAoB,GAAG,wBAAwB,CAAC;IAEvE,aAAa;IACb,MAAM,SAAS,GAAG,EAAE,cAAc,EAAE,IAAI,CAAC,EAAE,EAAE,EAAE,CAAC;IAEhD,qBAAqB;IACrB,MAAM,WAAW,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,EAAE,EAAE,EAAE,CAAC;IACxC,aAAa,CAAC,SAAS,GAAG,WAAkB,CAAC;IAE7C,qBAAqB;IACrB,MAAM,aAAa,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;IAEtC,0BAA0B;IAC1B,MAAM,eAAe,GAAG,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;IAE5C,eAAe;IACf,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,oBAAoB,CAAC,eAAe,CAAC,CAAC;EACjE,CAAC,CAAC,CAAC;EAEH,iBAAiB;EACjB,EAAE,CAAC,iFAAiF,EAAE,KAAK,IAAI,EAAE;IAC/F,uDAAuD;IACvD,MAAM,SAAS,GAAG,IAAI,WAAW,EAAE,CAAC;IACpC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC;IAC7B,SAAS,CAAC,IAAI,GAAG,IAAI,CAAC;IACtB,SAAS,CAAC,KAAK,GAAG,eAAe,CAAC;IAClC,SAAS,CAAC,YAAY,GAAG,qBAAqB,CAAC;IAC/C,SAAS,CAAC,QAAQ,GAAG,QAAQ,CAAC;IAC9B,SAAS,CAAC,SAAS,GAAG,QAAQ,CAAC;IAC/B,SAAS,CAAC,gBAAgB,GAAG,QAAQ,CAAC;IAEtC,yEAAyE;IACxE,SAAiB,CAAC,mBAAmB,GAAG,IAAI,CAAC;IAC7C,SAAiB,CAAC,yBAAyB,GAAG,kBAAkB,CAAC,IAAI,CAAC;IACtE,SAAiB,CAAC,yBAAyB,GAAG,CAAC,kBAAkB,CAAC,IAAI,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAEzG,uBAAuB;IACvB,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;MACjC,UAAU,EAAE,CAAC,WAAW,CAAC;MACzB,IAAI,EAAE,mHAAmH;KAC1H,CAAC,CAAC;IAEH,6CAA6C;IAC7C,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;KAkBxB,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { PaymentForm } from '../payment-form';\nimport { PaymentMethodTypes } from '../../../api';\nimport { BillingFormFields } from '../../billing-form/billing-form-schema';\n\ndescribe('justifi-payment-form', () => {\n  // State Testing\n  it('should update allowedPaymentMethodTypes and selectedPaymentMethodType state correctly when connectedCallback is invoked', async () => {\n    // Mock properties\n    const mockComponent = new PaymentForm();\n    mockComponent.bankAccount = true;\n    mockComponent.card = true;\n\n    // Invoke the lifecycle method\n    mockComponent.connectedCallback();\n\n    // Assertions\n    expect(mockComponent.allowedPaymentMethodTypes).toEqual([PaymentMethodTypes.card, PaymentMethodTypes.bankAccount]);\n    expect(mockComponent.selectedPaymentMethodType).toBe(PaymentMethodTypes.card);\n  });\n\n  it('should update submitButtonEnabled state when enableSubmitButton method is called', async () => {\n    // Mock component\n    const mockComponent = new PaymentForm();\n    mockComponent.submitButtonEnabled = false;\n\n    // Call the method\n    await mockComponent.enableSubmitButton();\n\n    // Assertion\n    expect(mockComponent.submitButtonEnabled).toBe(true);\n  });\n\n  it('should update selectedPaymentMethodType when paymentMethodSelected event is fired', async () => {\n    // Mock component\n    const mockComponent = new PaymentForm();\n    mockComponent.selectedPaymentMethodType = PaymentMethodTypes.card;\n\n    // Define the event details\n    const detail = PaymentMethodTypes.bankAccount;\n    const event = new CustomEvent('paymentMethodSelected', { detail });\n\n    // Simulate the event\n    mockComponent.paymentMethodSelectedHandler(event);\n\n    // Assertion\n    expect(mockComponent.selectedPaymentMethodType).toBe(PaymentMethodTypes.bankAccount);\n  });\n\n  // Props Testing\n  it('should have the expected default properties', () => {\n    const paymentForm = new PaymentForm();\n\n    // Assert that the properties exist and have the expected default values\n    expect(paymentForm).toHaveProperty('bankAccount', undefined);\n    expect(paymentForm).toHaveProperty('card', undefined);\n    expect(paymentForm).toHaveProperty('email', undefined);\n    expect(paymentForm).toHaveProperty('iframeOrigin', undefined);\n    expect(paymentForm).toHaveProperty('clientId', undefined);\n    expect(paymentForm).toHaveProperty('accountId', undefined);\n    expect(paymentForm).toHaveProperty('submitButtonText', undefined);\n  });\n\n  // Method Testing\n  it('should correctly fill billing form when fillBillingForm method is called', async () => {\n    // Mock child component\n    const mockBillingFormRef = {\n      fill: jest.fn(),\n    };\n\n    // Mock component\n    const mockComponent = new PaymentForm();\n\n    // Cast to any to bypass type checker and directly set private property\n    (mockComponent as any).billingFormRef = mockBillingFormRef;\n\n    // Define the fields to fill the billing form\n    const fields: BillingFormFields = {\n      name: 'John Doe',\n      address_line1: '123 Main St',\n      address_line2: 'Apt 4B',\n      address_city: 'Townsville',\n      address_state: 'TS',\n      address_postal_code: '12345',\n    };\n\n    // Call the method\n    await mockComponent.fillBillingForm(fields);\n\n    // Check that the child component's fill method was called with the correct arguments\n    expect(mockBillingFormRef.fill).toHaveBeenCalledWith(fields);\n  });\n\n  it('should submit the form correctly and trigger the \"submitted\" event with the correct payload when submit method is called', async () => {\n    // Mock billingFormRef and paymentMethodFormRef\n    const mockBillingFormRef = {\n      validate: jest.fn().mockResolvedValue({ isValid: true }),\n      getValues: jest.fn().mockResolvedValue({ name: 'John Doe' }),\n    };\n\n    const mockPaymentMethodFormRef = {\n      validate: jest.fn().mockResolvedValue({ isValid: true }),\n      tokenize: jest.fn().mockResolvedValue({ token: 'abc123' }),\n    };\n\n    // Mock component\n    const mockComponent = new PaymentForm();\n\n    // Cast to any to bypass type checker and directly set private properties\n    (mockComponent as any).billingFormRef = mockBillingFormRef;\n    (mockComponent as any).paymentMethodFormRef = mockPaymentMethodFormRef;\n\n    // Mock event\n    const mockEvent = { preventDefault: jest.fn() };\n\n    // Mock event emitter\n    const mockEmitter = { emit: jest.fn() };\n    mockComponent.submitted = mockEmitter as any;\n\n    // Call submit method\n    await mockComponent.submit(mockEvent);\n\n    // Expectations\n    expect(mockEvent.preventDefault).toHaveBeenCalled();\n    expect(mockBillingFormRef.validate).toHaveBeenCalled();\n    expect(mockPaymentMethodFormRef.validate).toHaveBeenCalled();\n    expect(mockBillingFormRef.getValues).toHaveBeenCalled();\n    expect(mockPaymentMethodFormRef.tokenize).toHaveBeenCalledWith(mockComponent.clientId, { email: mockComponent.email, name: 'John Doe' }, mockComponent.accountId);\n    expect(mockEmitter.emit).toHaveBeenCalledWith({ token: 'abc123' });\n  });\n\n  // Event Testing\n  it('should fire the \"submitted\" event with correct data when the form is submitted', async () => {\n    // Mock billingFormRef and paymentMethodFormRef\n    const mockBillingFormRef = {\n      validate: jest.fn().mockResolvedValue({ isValid: true }),\n      getValues: jest.fn().mockResolvedValue({\n        name: 'John Doe',\n        address_line1: 'Address 1',\n        address_line2: 'Address 2',\n        address_city: 'City',\n        address_state: 'State',\n        address_postal_code: 'Postal Code',\n      }),\n    };\n\n    const mockPaymentMethodFormRef = {\n      validate: jest.fn().mockResolvedValue({ isValid: true }),\n      tokenize: jest.fn().mockResolvedValue({ token: 'abc123' }),\n    };\n\n    // Mock component\n    const mockComponent = new PaymentForm();\n    mockComponent.email = 'john@example.com'; // set email prop\n\n    // Cast to any to bypass type checker and directly set private properties\n    (mockComponent as any).billingFormRef = mockBillingFormRef;\n    (mockComponent as any).paymentMethodFormRef = mockPaymentMethodFormRef;\n\n    // Mock event\n    const mockEvent = { preventDefault: jest.fn() };\n\n    // Mock event emitter\n    const mockEmitter = { emit: jest.fn() };\n    mockComponent.submitted = mockEmitter as any;\n\n    // Call submit method\n    await mockComponent.submit(mockEvent);\n\n    // Define expected payload\n    const expectedPayload = { token: 'abc123' };\n\n    // Expectations\n    expect(mockEmitter.emit).toHaveBeenCalledWith(expectedPayload);\n  });\n\n  // Render Testing\n  it('should correctly render the child components based on the given props and state', async () => {\n    // Set up new PaymentForm with specific props and state\n    const component = new PaymentForm();\n    component.bankAccount = true;\n    component.card = true;\n    component.email = 'test@test.com';\n    component.iframeOrigin = 'https://example.com';\n    component.clientId = 'abc123';\n    component.accountId = 'def456';\n    component.submitButtonText = 'Submit';\n\n    // Cast to any to bypass type checker and directly set private properties\n    (component as any).submitButtonEnabled = true;\n    (component as any).selectedPaymentMethodType = PaymentMethodTypes.card;\n    (component as any).allowedPaymentMethodTypes = [PaymentMethodTypes.card, PaymentMethodTypes.bankAccount];\n\n    // Render the component\n    const { root } = await newSpecPage({\n      components: [PaymentForm],\n      html: '<justifi-payment-form payment-method-form-type=\"card\" iframe-origin=\"https://example.com\"></justifi-payment-form>',\n    });\n\n    // Assert that the rendered output is correct\n    expect(root).toEqualHtml(`\n      <justifi-payment-form iframe-origin=\"https://example.com\" payment-method-form-type=\"card\">\n        <mock:shadow-root>\n          <form class=\"gy-3 row\">\n            <div class=\"col-12\">\n              <justifi-payment-method-form iframe-origin=\"https://example.com\" payment-method-form-type=\"card\"></justifi-payment-method-form>\n            </div>\n            <div class=\"col-12\">\n              <justifi-billing-form legend=\"Billing Info\"></justifi-billing-form>\n            </div>\n            <div class=\"col-12\">\n              <button class=\"btn btn-primary jfi-submit-button\" type=\"submit\">\n                Submit\n              </button>\n            </div>\n          </form>\n        </mock:shadow-root>\n      </justifi-payment-form>\n    `);\n  });\n});\n"]}

package/dist/collection/components/payment-form/tokenize.js

@@ -1 +1,2 @@
 export {};
+//# sourceMappingURL=tokenize.js.map

package/dist/collection/components/payment-form/tokenize.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokenize.js","sourceRoot":"","sources":["../../../../src/components/payment-form/tokenize.ts"],"names":[],"mappings":"","sourcesContent":["export interface TokenizeArguments {\n  clientId: string;\n  paymentMethodData: any;\n  accountId?: string;\n}\n"]}

package/dist/collection/components/payment-method-form/get-computed-theme.js

@@ -46,3 +46,4 @@ const getComputedTheme = () => {
   return computedTheme;
 };
 export default getComputedTheme;
+//# sourceMappingURL=get-computed-theme.js.map

package/dist/collection/components/payment-method-form/get-computed-theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"get-computed-theme.js","sourceRoot":"","sources":["../../../../src/components/payment-method-form/get-computed-theme.ts"],"names":[],"mappings":"AAEA,MAAM,gBAAgB,GAAG,GAAG,EAAE;EAC5B,MAAM,cAAc,GAAG,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;EAEvD,MAAM,aAAa,GAAU;IAC3B,MAAM,EAAE;MACN,OAAO,EAAE,cAAc,CAAC,gBAAgB,CAAC,sBAAsB,CAAC;MAChE,4BAA4B,EAAE,cAAc,CAAC,gBAAgB,CAAC,qCAAqC,CAAC;MACpG,0BAA0B,EAAE,cAAc,CAAC,gBAAgB,CAAC,qCAAqC,CAAC;KACnG;IACD,WAAW,EAAE;MACX,eAAe,EAAE,cAAc,CAAC,gBAAgB,CAAC,qCAAqC,CAAC;MACvF,WAAW,EAAE,cAAc,CAAC,gBAAgB,CAAC,iCAAiC,CAAC;MAC/E,gBAAgB,EAAE,cAAc,CAAC,gBAAgB,CAAC,uCAAuC,CAAC;MAC1F,gBAAgB,EAAE,cAAc,CAAC,gBAAgB,CAAC,uCAAuC,CAAC;MAC1F,WAAW,EAAE,cAAc,CAAC,gBAAgB,CAAC,iCAAiC,CAAC;MAC/E,iBAAiB,EAAE,cAAc,CAAC,gBAAgB,CAAC,wCAAwC,CAAC;MAC5F,eAAe,EAAE,cAAc,CAAC,gBAAgB,CAAC,sCAAsC,CAAC;MACxF,gBAAgB,EAAE,cAAc,CAAC,gBAAgB,CAAC,uCAAuC,CAAC;MAC1F,cAAc,EAAE,cAAc,CAAC,gBAAgB,CAAC,qCAAqC,CAAC;MACtF,YAAY,EAAE,cAAc,CAAC,gBAAgB,CAAC,kCAAkC,CAAC;MACjF,WAAW,EAAE,cAAc,CAAC,gBAAgB,CAAC,iCAAiC,CAAC;MAC/E,SAAS,EAAE,cAAc,CAAC,gBAAgB,CAAC,+BAA+B,CAAC;MAC3E,cAAc,EAAE,cAAc,CAAC,gBAAgB,CAAC,qCAAqC,CAAC;MACtF,mBAAmB,EAAE,cAAc,CAAC,gBAAgB,CAAC,2CAA2C,CAAC;MACjG,cAAc,EAAE,cAAc,CAAC,gBAAgB,CAAC,qCAAqC,CAAC;MACtF,KAAK,EAAE,cAAc,CAAC,gBAAgB,CAAC,0BAA0B,CAAC;MAClE,UAAU,EAAE,cAAc,CAAC,gBAAgB,CAAC,gCAAgC,CAAC;MAC7E,QAAQ,EAAE,cAAc,CAAC,gBAAgB,CAAC,8BAA8B,CAAC;MACzE,UAAU,EAAE,cAAc,CAAC,gBAAgB,CAAC,gCAAgC,CAAC;MAC7E,UAAU,EAAE,cAAc,CAAC,gBAAgB,CAAC,gCAAgC,CAAC;MAC7E,MAAM,EAAE,cAAc,CAAC,gBAAgB,CAAC,2BAA2B,CAAC;MACpE,OAAO,EAAE,cAAc,CAAC,gBAAgB,CAAC,4BAA4B,CAAC;KACvE;IACD,SAAS,EAAE;MACT,KAAK,EAAE,cAAc,CAAC,gBAAgB,CAAC,wBAAwB,CAAC;MAChE,UAAU,EAAE,cAAc,CAAC,gBAAgB,CAAC,8BAA8B,CAAC;MAC3E,QAAQ,EAAE,cAAc,CAAC,gBAAgB,CAAC,4BAA4B,CAAC;MACvE,UAAU,EAAE,cAAc,CAAC,gBAAgB,CAAC,8BAA8B,CAAC;MAC3E,MAAM,EAAE,cAAc,CAAC,gBAAgB,CAAC,yBAAyB,CAAC;KACnE;IACD,YAAY,EAAE;MACZ,KAAK,EAAE,cAAc,CAAC,gBAAgB,CAAC,2BAA2B,CAAC;MACnE,MAAM,EAAE,cAAc,CAAC,gBAAgB,CAAC,4BAA4B,CAAC;MACrE,QAAQ,EAAE,cAAc,CAAC,gBAAgB,CAAC,+BAA+B,CAAC;KAC3E;GACF,CAAC;EAEF,OAAO,aAAa,CAAC;AACvB,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { Theme } from './theme';\n\nconst getComputedTheme = () => {\n  const computedStyles = getComputedStyle(document.body);\n\n  const computedTheme: Theme = {\n    layout: {\n      padding: computedStyles.getPropertyValue('--jfi-layout-padding'),\n      formControlSpacingHorizontal: computedStyles.getPropertyValue('--jfi-layout-form-control-spacing-x'),\n      formControlSpacingVertical: computedStyles.getPropertyValue('--jfi-layout-form-control-spacing-y'),\n    },\n    formControl: {\n      backgroundColor: computedStyles.getPropertyValue('--jfi-form-control-background-color'),\n      borderColor: computedStyles.getPropertyValue('--jfi-form-control-border-color'),\n      borderColorFocus: computedStyles.getPropertyValue('--jfi-form-control-border-color-focus'),\n      borderColorError: computedStyles.getPropertyValue('--jfi-form-control-border-color-error'),\n      borderWidth: computedStyles.getPropertyValue('--jfi-form-control-border-width'),\n      borderBottomWidth: computedStyles.getPropertyValue('--jfi-form-control-border-bottom-width'),\n      borderLeftWidth: computedStyles.getPropertyValue('--jfi-form-control-border-left-width'),\n      borderRightWidth: computedStyles.getPropertyValue('--jfi-form-control-border-right-width'),\n      borderTopWidth: computedStyles.getPropertyValue('--jfi-form-control-border-top-width'),\n      borderRadius: computedStyles.getPropertyValue('--jfi-form-control-border-radius'),\n      borderStyle: computedStyles.getPropertyValue('--jfi-form-control-border-style'),\n      boxShadow: computedStyles.getPropertyValue('--jfi-form-control-box-shadow'),\n      boxShadowError: computedStyles.getPropertyValue('--jfi-form-control-box-shadow-error'),\n      boxShadowErrorFocus: computedStyles.getPropertyValue('--jfi-form-control-box-shadow-error-focus'),\n      boxShadowFocus: computedStyles.getPropertyValue('--jfi-form-control-box-shadow-focus'),\n      color: computedStyles.getPropertyValue('--jfi-form-control-color'),\n      colorFocus: computedStyles.getPropertyValue('--jfi-form-control-color-focus'),\n      fontSize: computedStyles.getPropertyValue('--jfi-form-control-font-size'),\n      fontWeight: computedStyles.getPropertyValue('--jfi-form-control-font-weight'),\n      lineHeight: computedStyles.getPropertyValue('--jfi-form-control-line-height'),\n      margin: computedStyles.getPropertyValue('--jfi-form-control-margin'),\n      padding: computedStyles.getPropertyValue('--jfi-form-control-padding'),\n    },\n    formLabel: {\n      color: computedStyles.getPropertyValue('--jfi-form-label-color'),\n      fontFamily: computedStyles.getPropertyValue('--jfi-form-label-font-family'),\n      fontSize: computedStyles.getPropertyValue('--jfi-form-label-font-size'),\n      fontWeight: computedStyles.getPropertyValue('--jfi-form-label-font-weight'),\n      margin: computedStyles.getPropertyValue('--jfi-form-label-margin'),\n    },\n    errorMessage: {\n      color: computedStyles.getPropertyValue('--jfi-error-message-color'),\n      margin: computedStyles.getPropertyValue('--jfi-error-message-margin'),\n      fontSize: computedStyles.getPropertyValue('--jfi-error-message-font-size'),\n    },\n  };\n\n  return computedTheme;\n};\n\nexport default getComputedTheme;\n"]}

package/dist/collection/components/payment-method-form/message-event-types.js

@@ -14,3 +14,4 @@ export const MessageEventType = {
     styleOverrides: 'justifi.bankAccount.styleOverrides',
   },
 };
+//# sourceMappingURL=message-event-types.js.map

package/dist/collection/components/payment-method-form/message-event-types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"message-event-types.js","sourceRoot":"","sources":["../../../../src/components/payment-method-form/message-event-types.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gBAAgB,GAAG;EAC9B,IAAI,EAAE;IACJ,KAAK,EAAE,oBAAoB;IAC3B,QAAQ,EAAE,uBAAuB;IACjC,QAAQ,EAAE,uBAAuB;IACjC,MAAM,EAAE,qBAAqB;IAC7B,cAAc,EAAE,6BAA6B;GAC9C;EACD,WAAW,EAAE;IACX,KAAK,EAAE,2BAA2B;IAClC,QAAQ,EAAE,8BAA8B;IACxC,QAAQ,EAAE,8BAA8B;IACxC,MAAM,EAAE,4BAA4B;IACpC,cAAc,EAAE,oCAAoC;GACrD;CACF,CAAC","sourcesContent":["export const MessageEventType = {\n  card: {\n    ready: 'justifi.card.ready',\n    tokenize: 'justifi.card.tokenize',\n    validate: 'justifi.card.validate',\n    resize: 'justifi.card.resize',\n    styleOverrides: 'justifi.card.styleOverrides',\n  },\n  bankAccount: {\n    ready: 'justifi.bankAccount.ready',\n    tokenize: 'justifi.bankAccount.tokenize',\n    validate: 'justifi.bankAccount.validate',\n    resize: 'justifi.bankAccount.resize',\n    styleOverrides: 'justifi.bankAccount.styleOverrides',\n  },\n};\n"]}

package/dist/collection/components/payment-method-form/payment-method-form.js

@@ -77,8 +77,7 @@ export class PaymentMethodForm {
     return queryParams.join('');
   }
   getIframeSrc() {
-    const productionIframeOrigin = 'https://js.justifi.ai/v2';
-    const iframeOrigin = this.iframeOrigin || productionIframeOrigin;
+    const iframeOrigin = process.env.IFRAME_ORIGIN;
     let iframeSrc = `${iframeOrigin}/${this.paymentMethodFormType}`;
     let paramsList = [];
     if (this.paymentMethodFormValidationMode) {
@@ -263,3 +262,4 @@ export class PaymentMethodForm {
     };
   }
 }
+//# sourceMappingURL=payment-method-form.js.map