@justifi/webcomponents 4.7.3 → 4.7.5
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.
- package/LICENSE +1 -1
- package/dist/cjs/{Api-548eaa62.js → Api-a06b996e.js} +35 -35
- package/dist/cjs/{Pagination-cae1dcbd.js → Pagination-0da8f095.js} +5 -5
- package/dist/cjs/Payout-7821eb61.js +183 -0
- package/dist/cjs/SubAccount-b9487cbb.js +107 -0
- package/dist/cjs/additional-questions-details_5.cjs.entry.js +50 -50
- package/dist/cjs/business-form-schema-a2b87e77.js +148 -0
- package/dist/cjs/config-ff2dda66.js +15 -0
- package/dist/cjs/exported-parts-b18c68c2.js +9 -0
- package/dist/cjs/{form-1e732a9d.js → form-2ad3d374.js} +84 -84
- package/dist/cjs/form-control-datepart_2.cjs.entry.js +108 -108
- package/dist/cjs/form-control-monetary.cjs.entry.js +50 -50
- package/dist/cjs/form-control-number_3.cjs.entry.js +108 -108
- package/dist/cjs/helpers-b254d050.js +26 -0
- package/dist/cjs/{index-c5ace247.js → index-4286ac32.js} +189 -51
- package/dist/cjs/{index-5a880722.js → index-fc5339a5.js} +406 -195
- package/dist/cjs/{index.esm-91ec051e.js → index.esm-c08c2adc.js} +61 -30
- package/dist/cjs/justifi-additional-questions_6.cjs.entry.js +372 -372
- package/dist/cjs/justifi-bank-account-form.cjs.entry.js +56 -56
- package/dist/cjs/justifi-billing-form_2.cjs.entry.js +79 -79
- package/dist/cjs/justifi-business-details.cjs.entry.js +61 -61
- package/dist/cjs/justifi-business-form-stepped.cjs.entry.js +110 -110
- package/dist/cjs/justifi-business-form.cjs.entry.js +71 -71
- package/dist/cjs/justifi-business-list.cjs.entry.js +128 -128
- package/dist/cjs/justifi-card-form.cjs.entry.js +57 -57
- package/dist/cjs/justifi-details.cjs.entry.js +13 -13
- package/dist/cjs/justifi-gross-payment-chart.cjs.entry.js +125 -125
- package/dist/cjs/justifi-payment-balance-transactions.cjs.entry.js +72 -72
- package/dist/cjs/justifi-payment-details.cjs.entry.js +53 -53
- package/dist/cjs/justifi-payment-form.cjs.entry.js +89 -89
- package/dist/cjs/justifi-payment-method-form.cjs.entry.js +171 -188
- package/dist/cjs/justifi-payments-list.cjs.entry.js +97 -97
- package/dist/cjs/justifi-payout-details.cjs.entry.js +54 -54
- package/dist/cjs/justifi-payouts-list.cjs.entry.js +120 -119
- package/dist/cjs/justifi-proceeds-list.cjs.entry.js +135 -135
- package/dist/cjs/justifi-refund-form.cjs.entry.js +85 -85
- package/dist/cjs/justifi-subaccount-details.cjs.entry.js +62 -62
- package/dist/cjs/justifi-subaccounts-list.cjs.entry.js +84 -84
- package/dist/cjs/justifi-table_2.cjs.entry.js +62 -61
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/select-input_2.cjs.entry.js +38 -38
- package/dist/cjs/state-options-96d05a98.js +246 -0
- package/dist/cjs/subaccount-account-details_4.cjs.entry.js +41 -41
- package/dist/cjs/subaccount-bank-details.cjs.entry.js +11 -11
- package/dist/cjs/subaccount-terms-details.cjs.entry.js +11 -11
- package/dist/cjs/{utils-13d069be.js → utils-36bf8b3e.js} +108 -108
- package/dist/cjs/utils-a2ee48ca.js +35 -0
- package/dist/cjs/webcomponents.cjs.js +3 -3
- package/dist/collection/api/Api.js +34 -34
- package/dist/collection/api/Business.js +39 -39
- package/dist/collection/api/Pagination.js +5 -5
- package/dist/collection/api/Payment.js +108 -108
- package/dist/collection/api/Payout.js +33 -33
- package/dist/collection/api/Proceed.js +33 -33
- package/dist/collection/api/SubAccount.js +78 -78
- package/dist/collection/api/mockData/MockOnboardingData.js +108 -108
- package/dist/collection/api/mockData/MockPayments.js +207 -207
- package/dist/collection/api/mockData/MockSubAccount.js +96 -96
- package/dist/collection/api/mockData/mockGrossVolumeReport.js +123 -123
- package/dist/collection/collection-manifest.json +4 -4
- package/dist/collection/components/bank-account-form/bank-account-form.js +260 -259
- package/dist/collection/components/bank-account-form/test/bank-account-form.e2e.js +10 -10
- package/dist/collection/components/bank-account-form/test/bank-account-form.spec.js +38 -38
- package/dist/collection/components/billing-form/billing-form-schema.js +6 -6
- package/dist/collection/components/billing-form/billing-form.css +16 -12
- package/dist/collection/components/billing-form/billing-form.js +177 -179
- package/dist/collection/components/billing-form/state-options.js +240 -240
- package/dist/collection/components/billing-form/test/billing-form.spec.js +50 -50
- package/dist/collection/components/business-details/additional-questions-details/additional-questions-details.css +23 -16
- package/dist/collection/components/business-details/additional-questions-details/additional-questions-details.js +43 -43
- package/dist/collection/components/business-details/business-details.css +11 -4
- package/dist/collection/components/business-details/business-details.js +107 -107
- package/dist/collection/components/business-details/generic-info-details/generic-info-details.css +23 -16
- package/dist/collection/components/business-details/generic-info-details/generic-info-details.js +43 -43
- package/dist/collection/components/business-details/legal-address-details/legal-address-details.css +23 -16
- package/dist/collection/components/business-details/legal-address-details/legal-address-details.js +43 -43
- package/dist/collection/components/business-details/owner-details/owner-details.css +23 -16
- package/dist/collection/components/business-details/owner-details/owner-details.js +45 -45
- package/dist/collection/components/business-details/representative-details/representative-details.css +23 -16
- package/dist/collection/components/business-details/representative-details/representative-details.js +43 -43
- package/dist/collection/components/business-form/additional-questions/additional-questions.js +49 -49
- package/dist/collection/components/business-form/business-address/business-address-form-schema.js +8 -8
- package/dist/collection/components/business-form/business-address/business-address-form.css +16 -12
- package/dist/collection/components/business-form/business-address/business-address-form.js +93 -93
- package/dist/collection/components/business-form/business-address/test/business-address.e2e.js +6 -6
- package/dist/collection/components/business-form/business-address/test/business-address.spec.js +21 -21
- package/dist/collection/components/business-form/business-form-schema.js +137 -137
- package/dist/collection/components/business-form/business-form-stepped.css +23 -16
- package/dist/collection/components/business-form/business-form-stepped.js +203 -203
- package/dist/collection/components/business-form/business-form.css +23 -16
- package/dist/collection/components/business-form/business-form.js +111 -111
- package/dist/collection/components/business-form/business-generic-info/business-generic-info.css +16 -12
- package/dist/collection/components/business-form/business-generic-info/business-generic-info.js +57 -57
- package/dist/collection/components/business-form/business-owners/business-owners.css +23 -16
- package/dist/collection/components/business-form/business-owners/business-owners.js +117 -117
- package/dist/collection/components/business-form/business-representative/business-representative.css +16 -12
- package/dist/collection/components/business-form/business-representative/business-representative.js +65 -65
- package/dist/collection/components/business-form/helpers.js +19 -19
- package/dist/collection/components/business-form/legal-address-form/legal-address-form-schema.js +6 -6
- package/dist/collection/components/business-form/legal-address-form/legal-address-form.css +16 -12
- package/dist/collection/components/business-form/legal-address-form/legal-address-form.js +61 -61
- package/dist/collection/components/business-form/test/business-form.spec.js +35 -35
- package/dist/collection/components/business-list/business-list.css +3 -0
- package/dist/collection/components/business-list/business-list.js +160 -160
- package/dist/collection/components/business-list/business-list.stories.js +10 -10
- package/dist/collection/components/card-form/card-form.js +278 -277
- package/dist/collection/components/card-form/test/card-form.e2e.js +10 -10
- package/dist/collection/components/card-form/test/card-form.spec.js +45 -45
- package/dist/collection/components/details/details.css +38 -31
- package/dist/collection/components/details/details.js +42 -42
- package/dist/collection/components/form/form-control-datepart.js +224 -224
- package/dist/collection/components/form/form-control-monetary.js +177 -177
- package/dist/collection/components/form/form-control-number-masked.js +208 -208
- package/dist/collection/components/form/form-control-number.css +7 -2
- package/dist/collection/components/form/form-control-number.js +188 -188
- package/dist/collection/components/form/form-control-select.css +7 -2
- package/dist/collection/components/form/form-control-select.js +196 -196
- package/dist/collection/components/form/form-control-text.css +7 -2
- package/dist/collection/components/form/form-control-text.js +188 -188
- package/dist/collection/components/form/form.js +80 -80
- package/dist/collection/components/gross-payment-chart/chart-utils.js +52 -52
- package/dist/collection/components/gross-payment-chart/gross-payment-chart.css +3 -0
- package/dist/collection/components/gross-payment-chart/gross-payment-chart.js +125 -125
- package/dist/collection/components/gross-payment-chart/test/gross-payment-chart.spec.js +7 -7
- package/dist/collection/components/pagination-menu/pagination-menu.js +72 -72
- package/dist/collection/components/payment-balance-transactions/payment-balance-transactions.js +144 -144
- package/dist/collection/components/payment-balance-transactions/payment-balance-transactions.stories.js +10 -10
- package/dist/collection/components/payment-details/payment-details.css +38 -31
- package/dist/collection/components/payment-details/payment-details.js +106 -106
- package/dist/collection/components/payment-form/payment-form.css +16 -12
- package/dist/collection/components/payment-form/payment-form.js +319 -318
- package/dist/collection/components/payment-form/payment-method-selector.css +6 -2
- package/dist/collection/components/payment-form/payment-method-selector.js +90 -90
- package/dist/collection/components/payment-form/test/payment-form.e2e.js +9 -9
- package/dist/collection/components/payment-form/test/payment-form.spec.js +157 -157
- package/dist/collection/components/payment-method-form/get-computed-theme.js +47 -47
- package/dist/collection/components/payment-method-form/message-event-types.js +14 -14
- package/dist/collection/components/payment-method-form/payment-method-form.js +288 -262
- package/dist/collection/components/payment-method-form/test/payment-method-form.e2e.js +16 -16
- package/dist/collection/components/payment-method-form/test/payment-method-form.spec.js +43 -43
- package/dist/collection/components/payments-list/payments-list.css +3 -0
- package/dist/collection/components/payments-list/payments-list.js +177 -177
- package/dist/collection/components/payments-list/test/payments-list.spec.js +21 -21
- package/dist/collection/components/payout-details/payout-details.css +38 -31
- package/dist/collection/components/payout-details/payout-details.js +107 -107
- package/dist/collection/components/payouts-list/payouts-list.css +3 -0
- package/dist/collection/components/payouts-list/payouts-list.js +200 -199
- package/dist/collection/components/proceeds-list/proceeds-list.css +3 -0
- package/dist/collection/components/proceeds-list/proceeds-list.js +182 -182
- package/dist/collection/components/proceeds-list/proceeds-list.stories.js +12 -12
- package/dist/collection/components/refund-form/refund-form-schema.js +9 -9
- package/dist/collection/components/refund-form/refund-form.css +23 -16
- package/dist/collection/components/refund-form/refund-form.js +216 -216
- package/dist/collection/components/refund-form/refund-form.stories.js +27 -27
- package/dist/collection/components/select-input/select-input.css +7 -2
- package/dist/collection/components/select-input/select-input.js +139 -139
- package/dist/collection/components/select-input/test/select-input.spec.js +38 -38
- package/dist/collection/components/subaccount-details/subaccount-account-details/subaccount-account-details.css +23 -16
- package/dist/collection/components/subaccount-details/subaccount-account-details/subaccount-account-details.js +65 -65
- package/dist/collection/components/subaccount-details/subaccount-bank-details/subaccount-bank-details.css +23 -16
- package/dist/collection/components/subaccount-details/subaccount-bank-details/subaccount-bank-details.js +43 -43
- package/dist/collection/components/subaccount-details/subaccount-details.css +38 -31
- package/dist/collection/components/subaccount-details/subaccount-details.js +132 -132
- package/dist/collection/components/subaccount-details/subaccount-details.stories.js +9 -9
- package/dist/collection/components/subaccount-details/subaccount-merchant-details/subaccount-merchant-details.css +23 -16
- package/dist/collection/components/subaccount-details/subaccount-merchant-details/subaccount-merchant-details.js +43 -44
- package/dist/collection/components/subaccount-details/subaccount-owners-details/subaccount-owners-details.css +23 -16
- package/dist/collection/components/subaccount-details/subaccount-owners-details/subaccount-owners-details.js +44 -43
- package/dist/collection/components/subaccount-details/subaccount-representative-details/subaccount-representative-details.css +23 -16
- package/dist/collection/components/subaccount-details/subaccount-representative-details/subaccount-representative-details.js +43 -43
- package/dist/collection/components/subaccount-details/subaccount-terms-details/subaccount-terms-details.css +23 -16
- package/dist/collection/components/subaccount-details/subaccount-terms-details/subaccount-terms-details.js +43 -43
- package/dist/collection/components/subaccount-details/test/subaccount-details.spec.js +7 -7
- package/dist/collection/components/subaccounts-list/subaccounts-list.js +164 -164
- package/dist/collection/components/subaccounts-list/subaccounts-list.stories.js +12 -12
- package/dist/collection/components/subaccounts-list/test/subaccounts-list.e2e.js +6 -6
- package/dist/collection/components/subaccounts-list/test/subaccounts-list.spec.js +21 -21
- package/dist/collection/components/table/exported-parts.js +5 -0
- package/dist/collection/components/table/table.css +38 -31
- package/dist/collection/components/table/table.js +225 -224
- package/dist/collection/components/table/test/table.spec.js +48 -48
- package/dist/collection/components/text-input/test/text-input.spec.js +31 -31
- package/dist/collection/components/text-input/text-input.css +7 -2
- package/dist/collection/components/text-input/text-input.js +122 -122
- package/dist/collection/utils/country-options.js +198 -198
- package/dist/collection/utils/phone-masks.js +1 -1
- package/dist/collection/utils/utils.js +107 -107
- package/dist/config.js +9 -9
- package/dist/docs.d.ts +401 -0
- package/dist/docs.json +6506 -0
- package/dist/esm/{Api-c65d3ed8.js → Api-0e88671c.js} +35 -35
- package/dist/esm/{Pagination-31f770d6.js → Pagination-afc8f96d.js} +5 -5
- package/dist/esm/Payout-c42e3877.js +179 -0
- package/dist/esm/SubAccount-b3ce8720.js +105 -0
- package/dist/esm/additional-questions-details_5.entry.js +50 -50
- package/dist/esm/business-form-schema-997c585c.js +144 -0
- package/dist/esm/config-476c7241.js +13 -0
- package/dist/esm/exported-parts-abd4c027.js +7 -0
- package/dist/esm/{form-32cf3d1e.js → form-5279c05a.js} +84 -84
- package/dist/esm/form-control-datepart_2.entry.js +108 -108
- package/dist/esm/form-control-monetary.entry.js +50 -50
- package/dist/esm/form-control-number_3.entry.js +108 -108
- package/dist/esm/helpers-d8a6a0f1.js +24 -0
- package/dist/esm/{index-5ed53c20.js → index-5eb05747.js} +406 -195
- package/dist/esm/{index-7471ed60.js → index-ff8194f9.js} +189 -51
- package/dist/esm/{index.esm-9397ffa0.js → index.esm-8ae36d07.js} +61 -30
- package/dist/esm/justifi-additional-questions_6.entry.js +372 -372
- package/dist/esm/justifi-bank-account-form.entry.js +56 -56
- package/dist/esm/justifi-billing-form_2.entry.js +79 -79
- package/dist/esm/justifi-business-details.entry.js +61 -61
- package/dist/esm/justifi-business-form-stepped.entry.js +110 -110
- package/dist/esm/justifi-business-form.entry.js +71 -71
- package/dist/esm/justifi-business-list.entry.js +128 -128
- package/dist/esm/justifi-card-form.entry.js +57 -57
- package/dist/esm/justifi-details.entry.js +13 -13
- package/dist/esm/justifi-gross-payment-chart.entry.js +125 -125
- package/dist/esm/justifi-payment-balance-transactions.entry.js +72 -72
- package/dist/esm/justifi-payment-details.entry.js +53 -53
- package/dist/esm/justifi-payment-form.entry.js +89 -89
- package/dist/esm/justifi-payment-method-form.entry.js +171 -188
- package/dist/esm/justifi-payments-list.entry.js +97 -97
- package/dist/esm/justifi-payout-details.entry.js +54 -54
- package/dist/esm/justifi-payouts-list.entry.js +120 -119
- package/dist/esm/justifi-proceeds-list.entry.js +135 -135
- package/dist/esm/justifi-refund-form.entry.js +85 -85
- package/dist/esm/justifi-subaccount-details.entry.js +62 -62
- package/dist/esm/justifi-subaccounts-list.entry.js +84 -84
- package/dist/esm/justifi-table_2.entry.js +62 -61
- package/dist/esm/loader.js +3 -3
- package/dist/esm/polyfills/core-js.js +0 -0
- package/dist/esm/polyfills/dom.js +0 -0
- package/dist/esm/polyfills/es5-html-element.js +0 -0
- package/dist/esm/polyfills/index.js +0 -0
- package/dist/esm/polyfills/system.js +0 -0
- package/dist/esm/select-input_2.entry.js +38 -38
- package/dist/esm/state-options-fc1daf67.js +244 -0
- package/dist/esm/subaccount-account-details_4.entry.js +41 -41
- package/dist/esm/subaccount-bank-details.entry.js +11 -11
- package/dist/esm/subaccount-terms-details.entry.js +11 -11
- package/dist/esm/{utils-40b7002c.js → utils-26c7dd12.js} +108 -108
- package/dist/esm/utils-7c6bd149.js +27 -0
- package/dist/esm/webcomponents.js +4 -4
- package/{loader → dist/loader}/cdn.js +1 -1
- package/{loader → dist/loader}/index.cjs.js +1 -1
- package/{loader → dist/loader}/index.d.ts +1 -1
- package/dist/loader/index.es2017.js +3 -0
- package/{loader → dist/loader}/index.js +2 -2
- package/dist/{components → module}/Api.js +35 -35
- package/dist/{components → module}/Pagination.js +5 -5
- package/dist/module/Payout.js +179 -0
- package/dist/module/SubAccount.js +105 -0
- package/dist/{components → module}/additional-questions-details.d.ts +2 -2
- package/dist/module/additional-questions-details2.js +36 -0
- package/dist/module/additional-questions.js +50 -0
- package/dist/module/billing-form.js +113 -0
- package/dist/module/business-address-form.js +72 -0
- package/dist/module/business-generic-info.js +212 -0
- package/dist/module/business-owners.js +116 -0
- package/dist/module/business-representative.js +90 -0
- package/dist/module/config.js +13 -0
- package/dist/module/details.js +38 -0
- package/dist/{components → module}/form-control-datepart.d.ts +2 -2
- package/dist/module/form-control-datepart2.js +98 -0
- package/dist/{components → module}/form-control-monetary.d.ts +2 -2
- package/dist/module/form-control-monetary2.js +83 -0
- package/dist/{components → module}/form-control-number-masked.d.ts +2 -2
- package/dist/module/form-control-number-masked2.js +82 -0
- package/dist/{components → module}/form-control-number.d.ts +2 -2
- package/dist/module/form-control-number2.js +71 -0
- package/dist/{components → module}/form-control-select.d.ts +2 -2
- package/dist/module/form-control-select2.js +67 -0
- package/dist/{components → module}/form-control-text.d.ts +2 -2
- package/dist/module/form-control-text2.js +71 -0
- package/dist/{components → module}/form.js +84 -84
- package/dist/{components → module}/generic-info-details.d.ts +2 -2
- package/dist/module/generic-info-details2.js +37 -0
- package/dist/module/helpers.js +24 -0
- package/dist/{components → module}/index.esm.js +61 -30
- package/dist/{components → module}/index2.js +406 -195
- package/dist/{components → module}/justifi-additional-questions.d.ts +2 -2
- package/dist/{components → module}/justifi-bank-account-form.d.ts +2 -2
- package/dist/module/justifi-bank-account-form.js +96 -0
- package/dist/{components → module}/justifi-billing-form.d.ts +2 -2
- package/dist/{components → module}/justifi-business-address-form.d.ts +2 -2
- package/dist/{components → module}/justifi-business-details.d.ts +2 -2
- package/dist/module/justifi-business-details.js +130 -0
- package/dist/{components → module}/justifi-business-form-stepped.d.ts +2 -2
- package/dist/module/justifi-business-form-stepped.js +228 -0
- package/dist/{components → module}/justifi-business-form.d.ts +2 -2
- package/dist/{components/justifi-payment-details.js → module/justifi-business-form.js} +161 -79
- package/dist/{components → module}/justifi-business-generic-info.d.ts +2 -2
- package/dist/{components → module}/justifi-business-list.d.ts +2 -2
- package/dist/module/justifi-business-list.js +197 -0
- package/dist/{components → module}/justifi-business-owners.d.ts +2 -2
- package/dist/{components → module}/justifi-business-representative.d.ts +2 -2
- package/dist/{components → module}/justifi-card-form.d.ts +2 -2
- package/dist/module/justifi-card-form.js +98 -0
- package/dist/{components → module}/justifi-details.d.ts +2 -2
- package/dist/{components → module}/justifi-gross-payment-chart.d.ts +2 -2
- package/dist/{components → module}/justifi-gross-payment-chart.js +146 -142
- package/dist/{components → module}/justifi-legal-address-form.d.ts +2 -2
- package/dist/{components → module}/justifi-payment-balance-transactions.d.ts +2 -2
- package/dist/module/justifi-payment-balance-transactions.js +125 -0
- package/dist/{components → module}/justifi-payment-details.d.ts +2 -2
- package/dist/module/justifi-payment-details.js +98 -0
- package/dist/{components → module}/justifi-payment-form.d.ts +2 -2
- package/dist/module/justifi-payment-form.js +169 -0
- package/dist/{components → module}/justifi-payment-method-form.d.ts +2 -2
- package/dist/{components → module}/justifi-payment-method-selector.d.ts +2 -2
- package/dist/{components → module}/justifi-payments-list.d.ts +2 -2
- package/dist/module/justifi-payments-list.js +154 -0
- package/dist/{components → module}/justifi-payout-details.d.ts +2 -2
- package/dist/module/justifi-payout-details.js +99 -0
- package/dist/{components → module}/justifi-payouts-list.d.ts +2 -2
- package/dist/module/justifi-payouts-list.js +176 -0
- package/dist/{components → module}/justifi-proceeds-list.d.ts +2 -2
- package/dist/module/justifi-proceeds-list.js +199 -0
- package/dist/{components → module}/justifi-refund-form.d.ts +2 -2
- package/dist/module/justifi-refund-form.js +139 -0
- package/dist/{components → module}/justifi-subaccount-details.d.ts +2 -2
- package/dist/module/justifi-subaccount-details.js +134 -0
- package/dist/{components → module}/justifi-subaccounts-list.d.ts +2 -2
- package/dist/module/justifi-subaccounts-list.js +142 -0
- package/dist/{components → module}/justifi-table.d.ts +2 -2
- package/dist/{components → module}/legal-address-details.d.ts +2 -2
- package/dist/module/legal-address-details2.js +36 -0
- package/dist/module/legal-address-form.js +268 -0
- package/dist/{components → module}/owner-details.d.ts +2 -2
- package/dist/module/owner-details2.js +39 -0
- package/dist/{components → module}/pagination-menu.d.ts +2 -2
- package/dist/module/pagination-menu2.js +43 -0
- package/dist/{components → module}/payment-method-form.js +191 -207
- package/dist/module/payment-method-selector.js +44 -0
- package/dist/{components → module}/phone-masks.js +1 -1
- package/dist/{components → module}/representative-details.d.ts +2 -2
- package/dist/module/representative-details2.js +37 -0
- package/dist/{components → module}/select-input.d.ts +2 -2
- package/dist/module/select-input2.js +50 -0
- package/dist/module/state-options.js +244 -0
- package/dist/{components → module}/subaccount-account-details.d.ts +2 -2
- package/dist/module/subaccount-account-details2.js +38 -0
- package/dist/{components → module}/subaccount-bank-details.d.ts +2 -2
- package/dist/module/subaccount-bank-details.js +39 -0
- package/dist/{components → module}/subaccount-merchant-details.d.ts +2 -2
- package/dist/module/subaccount-merchant-details2.js +37 -0
- package/dist/{components → module}/subaccount-owners-details.d.ts +2 -2
- package/dist/module/subaccount-owners-details2.js +37 -0
- package/dist/{components → module}/subaccount-representative-details.d.ts +2 -2
- package/dist/module/subaccount-representative-details2.js +37 -0
- package/dist/{components → module}/subaccount-terms-details.d.ts +2 -2
- package/dist/{webcomponents/p-98e4eae3.entry.js → module/subaccount-terms-details.js} +39 -1
- package/dist/module/table.js +90 -0
- package/dist/{components → module}/text-input.d.ts +2 -2
- package/dist/module/text-input2.js +48 -0
- package/dist/module/utils.js +27 -0
- package/dist/{components → module}/utils2.js +108 -108
- package/dist/types/api/Api.d.ts +14 -14
- package/dist/types/api/Business.d.ts +120 -120
- package/dist/types/api/GrossVolume.d.ts +4 -4
- package/dist/types/api/Pagination.d.ts +12 -12
- package/dist/types/api/Payment.d.ts +134 -134
- package/dist/types/api/Payout.d.ts +51 -51
- package/dist/types/api/Proceed.d.ts +51 -51
- package/dist/types/api/SubAccount.d.ts +130 -130
- package/dist/types/api/mockData/MockOnboardingData.d.ts +5 -5
- package/dist/types/api/mockData/mockGrossVolumeReport.d.ts +5 -5
- package/dist/types/api/shared.d.ts +9 -9
- package/dist/types/components/bank-account-form/bank-account-form.d.ts +58 -0
- package/dist/types/components/billing-form/billing-form-schema.d.ts +18 -18
- package/dist/types/components/billing-form/billing-form.d.ts +25 -25
- package/dist/types/components/billing-form/state-options.d.ts +2 -2
- package/dist/types/components/business-details/additional-questions-details/additional-questions-details.d.ts +2 -2
- package/dist/types/components/business-details/business-details.d.ts +13 -13
- package/dist/types/components/business-details/generic-info-details/generic-info-details.d.ts +2 -2
- package/dist/types/components/business-details/legal-address-details/legal-address-details.d.ts +2 -2
- package/dist/types/components/business-details/owner-details/owner-details.d.ts +2 -2
- package/dist/types/components/business-details/representative-details/representative-details.d.ts +2 -2
- package/dist/types/components/business-form/additional-questions/additional-questions.d.ts +7 -7
- package/dist/types/components/business-form/business-address/business-address-form-schema.d.ts +16 -16
- package/dist/types/components/business-form/business-address/business-address-form.d.ts +7 -7
- package/dist/types/components/business-form/business-form-schema.d.ts +102 -102
- package/dist/types/components/business-form/business-form-stepped.d.ts +23 -23
- package/dist/types/components/business-form/business-form.d.ts +11 -11
- package/dist/types/components/business-form/business-generic-info/business-generic-info.d.ts +6 -6
- package/dist/types/components/business-form/business-owners/business-owners.d.ts +22 -22
- package/dist/types/components/business-form/business-representative/business-representative-schema.d.ts +13 -13
- package/dist/types/components/business-form/business-representative/business-representative.d.ts +8 -8
- package/dist/types/components/business-form/legal-address-form/legal-address-form-schema.d.ts +12 -12
- package/dist/types/components/business-form/legal-address-form/legal-address-form.d.ts +7 -7
- package/dist/types/components/business-list/business-list.d.ts +27 -27
- package/dist/types/components/business-list/business-list.stories.d.ts +3 -3
- package/dist/types/components/card-form/card-form.d.ts +68 -0
- package/dist/types/components/details/details.d.ts +2 -2
- package/dist/types/components/details/utils.d.ts +10 -10
- package/dist/types/components/form/form-control-datepart.d.ts +16 -16
- package/dist/types/components/form/form-control-monetary.d.ts +14 -14
- package/dist/types/components/form/form-control-number-masked.d.ts +16 -16
- package/dist/types/components/form/form-control-number.d.ts +15 -15
- package/dist/types/components/form/form-control-select.d.ts +17 -17
- package/dist/types/components/form/form-control-text.d.ts +15 -15
- package/dist/types/components/form/form.d.ts +18 -18
- package/dist/types/components/gross-payment-chart/chart-utils.d.ts +39 -39
- package/dist/types/components/gross-payment-chart/gross-payment-chart.d.ts +16 -16
- package/dist/types/components/pagination-menu/pagination-menu.d.ts +5 -5
- package/dist/types/components/payment-balance-transactions/payment-balance-transactions.d.ts +14 -14
- package/dist/types/components/payment-balance-transactions/payment-balance-transactions.stories.d.ts +3 -3
- package/dist/types/components/payment-details/payment-details.d.ts +9 -9
- package/dist/types/components/payment-form/payment-form.d.ts +22 -22
- package/dist/types/components/payment-form/payment-method-selector.d.ts +6 -6
- package/dist/types/components/payment-form/tokenize.d.ts +3 -3
- package/dist/types/components/payment-method-form/message-event-types.d.ts +14 -14
- package/dist/types/components/payment-method-form/payment-method-form.d.ts +21 -22
- package/dist/types/components/payment-method-form/payment-method-responses.d.ts +40 -40
- package/dist/types/components/payment-method-form/theme.d.ts +45 -45
- package/dist/types/components/payments-list/payments-list.d.ts +14 -14
- package/dist/types/components/payout-details/payout-details.d.ts +9 -9
- package/dist/types/components/payouts-list/payouts-list.d.ts +15 -15
- package/dist/types/components/proceeds-list/proceeds-list.d.ts +15 -15
- package/dist/types/components/proceeds-list/proceeds-list.stories.d.ts +4 -4
- package/dist/types/components/refund-form/refund-form-schema.d.ts +4 -4
- package/dist/types/components/refund-form/refund-form.d.ts +54 -54
- package/dist/types/components/refund-form/refund-form.stories.d.ts +21 -21
- package/dist/types/components/select-input/select-input.d.ts +14 -14
- package/dist/types/components/subaccount-details/subaccount-account-details/subaccount-account-details.d.ts +3 -3
- package/dist/types/components/subaccount-details/subaccount-bank-details/subaccount-bank-details.d.ts +2 -2
- package/dist/types/components/subaccount-details/subaccount-details.d.ts +13 -13
- package/dist/types/components/subaccount-details/subaccount-details.stories.d.ts +3 -3
- package/dist/types/components/subaccount-details/subaccount-merchant-details/subaccount-merchant-details.d.ts +2 -2
- package/dist/types/components/subaccount-details/subaccount-owners-details/subaccount-owners-details.d.ts +2 -2
- package/dist/types/components/subaccount-details/subaccount-representative-details/subaccount-representative-details.d.ts +2 -2
- package/dist/types/components/subaccount-details/subaccount-terms-details/subaccount-terms-details.d.ts +2 -2
- package/dist/types/components/subaccounts-list/subaccounts-list.d.ts +14 -14
- package/dist/types/components/subaccounts-list/subaccounts-list.stories.d.ts +4 -4
- package/dist/types/components/table/exported-parts.d.ts +1 -0
- package/dist/types/components/table/table.d.ts +19 -19
- package/dist/types/components/text-input/text-input.d.ts +10 -10
- package/dist/types/components.d.ts +228 -15
- package/dist/types/home/runner/work/web-component-library/web-component-library/packages/webcomponents/.stencil/config.d.ts +11 -0
- package/dist/types/stencil-public-runtime.d.ts +32 -3
- package/dist/types/utils/country-options.d.ts +2 -2
- package/dist/types/utils/phone-masks.d.ts +1 -1
- package/dist/webcomponents/p-04817850.entry.js +1 -0
- package/dist/webcomponents/{p-b157f6ae.js → p-04c7f8f8.js} +1 -1
- package/dist/webcomponents/p-0a351e24.entry.js +1 -0
- package/dist/webcomponents/{p-ed8c9b88.entry.js → p-0ad353cc.entry.js} +1 -1
- package/dist/webcomponents/{p-f0051cff.entry.js → p-0f5206f0.entry.js} +1 -1
- package/dist/{components/subaccount-terms-details.js → webcomponents/p-173fb8ef.entry.js} +1 -38
- package/dist/webcomponents/p-1e2a98bf.js +1 -0
- package/dist/webcomponents/{p-86c23e1e.js → p-210677e3.js} +1 -1
- package/dist/webcomponents/p-22c2a11e.entry.js +1 -0
- package/dist/webcomponents/p-2b6c9c4f.js +1 -0
- package/dist/webcomponents/p-2cab231e.entry.js +1 -0
- package/dist/webcomponents/p-2ea68b03.entry.js +1 -0
- package/dist/{components/additional-questions-details2.js → webcomponents/p-33e74da7.entry.js} +1 -35
- package/dist/webcomponents/p-34430db2.entry.js +1 -0
- package/dist/webcomponents/p-377303af.entry.js +1 -0
- package/dist/webcomponents/{p-988191bf.js → p-3bef762a.js} +1 -1
- package/dist/webcomponents/p-42bc8e53.entry.js +1 -0
- package/dist/webcomponents/p-439a79c7.entry.js +1 -0
- package/dist/webcomponents/p-57efe345.entry.js +1 -0
- package/dist/webcomponents/p-59ecc2d7.entry.js +1 -0
- package/dist/webcomponents/p-650eb614.entry.js +1 -0
- package/dist/webcomponents/p-68427454.entry.js +1 -0
- package/dist/webcomponents/{p-59860ac8.js → p-78baff54.js} +1 -1
- package/dist/webcomponents/p-7d922421.entry.js +1 -0
- package/dist/webcomponents/{p-311250e2.entry.js → p-8302a5e2.entry.js} +1 -1
- package/dist/webcomponents/p-862f38cc.entry.js +1 -0
- package/dist/webcomponents/p-93579716.js +1 -0
- package/dist/webcomponents/p-b2dc938f.entry.js +1 -0
- package/dist/webcomponents/p-c8099443.entry.js +1 -0
- package/dist/webcomponents/p-c8916484.entry.js +1 -0
- package/dist/webcomponents/{p-c0f9f6a8.entry.js → p-cb5352a3.entry.js} +2 -2
- package/dist/webcomponents/p-cf656598.entry.js +1 -0
- package/dist/webcomponents/p-d84cd3a5.entry.js +1 -0
- package/dist/webcomponents/p-da00d9bf.js +2 -0
- package/dist/webcomponents/p-dd4e8fa1.entry.js +1 -0
- package/dist/webcomponents/p-df8f6a0f.entry.js +1 -0
- package/dist/webcomponents/p-e8f41c84.entry.js +1 -0
- package/dist/webcomponents/p-e9589e45.entry.js +1 -0
- package/dist/webcomponents/webcomponents.css +1 -1
- package/dist/webcomponents/webcomponents.esm.js +1 -1
- package/package.json +18 -41
- package/dist/cjs/Payout-f8240e9c.js +0 -183
- package/dist/cjs/SubAccount-f47c8522.js +0 -107
- package/dist/cjs/business-form-schema-fe831c30.js +0 -148
- package/dist/cjs/config-a156df17.js +0 -15
- package/dist/cjs/helpers-c505d861.js +0 -26
- package/dist/cjs/state-options-83b52cd1.js +0 -246
- package/dist/cjs/utils-a47b2e73.js +0 -35
- package/dist/collection/components/bank-account-form/bank-account-form.stories.js +0 -132
- package/dist/collection/components/bank-account-form/example.js +0 -54
- package/dist/collection/components/billing-form/billing-form.stories.js +0 -61
- package/dist/collection/components/billing-form/example.js +0 -26
- package/dist/collection/components/business-details/business-details.stories.js +0 -23
- package/dist/collection/components/business-form/business-form-example.js +0 -12
- package/dist/collection/components/business-form/business-form-stepped-example.js +0 -12
- package/dist/collection/components/business-form/business-form-stepped.stories.js +0 -132
- package/dist/collection/components/business-form/business-form.stories.js +0 -127
- package/dist/collection/components/card-form/card-form.stories.js +0 -137
- package/dist/collection/components/card-form/example.js +0 -59
- package/dist/collection/components/gross-payment-chart/example.js +0 -12
- package/dist/collection/components/gross-payment-chart/gross-payment-chart.stories.js +0 -22
- package/dist/collection/components/payment-details/example.js +0 -12
- package/dist/collection/components/payment-details/payment-details.stories.js +0 -47
- package/dist/collection/components/payment-form/example.js +0 -23
- package/dist/collection/components/payment-form/payment-form.stories.js +0 -129
- package/dist/collection/components/payments-list/example.js +0 -12
- package/dist/collection/components/payments-list/payments-list.stories.js +0 -78
- package/dist/collection/components/payout-details/example.js +0 -12
- package/dist/collection/components/payout-details/payout-details.stories.js +0 -47
- package/dist/collection/components/payouts-list/example.js +0 -12
- package/dist/collection/components/payouts-list/payouts-list.stories.js +0 -69
- package/dist/components/Payout.js +0 -179
- package/dist/components/SubAccount.js +0 -105
- package/dist/components/additional-questions.js +0 -49
- package/dist/components/billing-form.js +0 -112
- package/dist/components/business-address-form.js +0 -69
- package/dist/components/business-generic-info.js +0 -211
- package/dist/components/business-owners.js +0 -115
- package/dist/components/business-representative.js +0 -89
- package/dist/components/config.js +0 -13
- package/dist/components/details.js +0 -37
- package/dist/components/form-control-datepart2.js +0 -95
- package/dist/components/form-control-monetary2.js +0 -80
- package/dist/components/form-control-number-masked2.js +0 -79
- package/dist/components/form-control-number2.js +0 -68
- package/dist/components/form-control-select2.js +0 -64
- package/dist/components/form-control-text2.js +0 -68
- package/dist/components/generic-info-details2.js +0 -36
- package/dist/components/helpers.js +0 -24
- package/dist/components/justifi-bank-account-form.js +0 -95
- package/dist/components/justifi-business-details.js +0 -129
- package/dist/components/justifi-business-form-stepped.js +0 -227
- package/dist/components/justifi-business-form.js +0 -175
- package/dist/components/justifi-business-list.js +0 -192
- package/dist/components/justifi-card-form.js +0 -97
- package/dist/components/justifi-payment-balance-transactions.js +0 -122
- package/dist/components/justifi-payment-form.js +0 -168
- package/dist/components/justifi-payments-list.js +0 -149
- package/dist/components/justifi-payout-details.js +0 -95
- package/dist/components/justifi-payouts-list.js +0 -171
- package/dist/components/justifi-proceeds-list.js +0 -194
- package/dist/components/justifi-refund-form.js +0 -138
- package/dist/components/justifi-subaccount-details.js +0 -130
- package/dist/components/justifi-subaccounts-list.js +0 -137
- package/dist/components/legal-address-details2.js +0 -35
- package/dist/components/legal-address-form.js +0 -267
- package/dist/components/owner-details2.js +0 -38
- package/dist/components/pagination-menu2.js +0 -42
- package/dist/components/payment-method-selector.js +0 -43
- package/dist/components/representative-details2.js +0 -36
- package/dist/components/select-input2.js +0 -49
- package/dist/components/state-options.js +0 -244
- package/dist/components/subaccount-account-details2.js +0 -37
- package/dist/components/subaccount-bank-details.js +0 -38
- package/dist/components/subaccount-merchant-details2.js +0 -36
- package/dist/components/subaccount-owners-details2.js +0 -36
- package/dist/components/subaccount-representative-details2.js +0 -36
- package/dist/components/table.js +0 -83
- package/dist/components/text-input2.js +0 -47
- package/dist/components/utils.js +0 -27
- package/dist/esm/Payout-586f06a3.js +0 -179
- package/dist/esm/SubAccount-128190e9.js +0 -105
- package/dist/esm/business-form-schema-30a3eadd.js +0 -144
- package/dist/esm/config-ceb0f902.js +0 -13
- package/dist/esm/helpers-1d5ecdc8.js +0 -24
- package/dist/esm/state-options-ece00aa2.js +0 -244
- package/dist/esm/utils-d19c2778.js +0 -27
- package/dist/types/components/bank-account-form/bank-account-form.stories.d.ts +0 -23
- package/dist/types/components/billing-form/billing-form.stories.d.ts +0 -8
- package/dist/types/components/business-details/business-details.stories.d.ts +0 -7
- package/dist/types/components/business-form/business-form-stepped.stories.d.ts +0 -27
- package/dist/types/components/business-form/business-form.stories.d.ts +0 -27
- package/dist/types/components/card-form/card-form.stories.d.ts +0 -17
- package/dist/types/components/gross-payment-chart/gross-payment-chart.stories.d.ts +0 -7
- package/dist/types/components/payment-details/payment-details.stories.d.ts +0 -8
- package/dist/types/components/payment-form/payment-form.stories.d.ts +0 -8
- package/dist/types/components/payments-list/payments-list.stories.d.ts +0 -10
- package/dist/types/components/payout-details/payout-details.stories.d.ts +0 -8
- package/dist/types/components/payouts-list/payouts-list.stories.d.ts +0 -9
- package/dist/types/home/runner/work/web-component-library/web-component-library/stencil-library/.stencil/config.d.ts +0 -11
- package/dist/webcomponents/p-14f7229e.entry.js +0 -1
- package/dist/webcomponents/p-2c2cde2d.js +0 -1
- package/dist/webcomponents/p-3501b0e8.entry.js +0 -1
- package/dist/webcomponents/p-3ee831ac.entry.js +0 -1
- package/dist/webcomponents/p-4214dbb8.entry.js +0 -1
- package/dist/webcomponents/p-46d5f717.entry.js +0 -1
- package/dist/webcomponents/p-4852ce94.entry.js +0 -1
- package/dist/webcomponents/p-4ec00b55.entry.js +0 -1
- package/dist/webcomponents/p-4fb653a8.entry.js +0 -1
- package/dist/webcomponents/p-586c8a4f.entry.js +0 -1
- package/dist/webcomponents/p-5e6726a8.entry.js +0 -1
- package/dist/webcomponents/p-77a8bcea.entry.js +0 -1
- package/dist/webcomponents/p-8f37e3ee.js +0 -1
- package/dist/webcomponents/p-91757d9f.entry.js +0 -1
- package/dist/webcomponents/p-9e012e33.entry.js +0 -1
- package/dist/webcomponents/p-a1ef6b4c.entry.js +0 -1
- package/dist/webcomponents/p-ac8ee442.entry.js +0 -1
- package/dist/webcomponents/p-af771964.entry.js +0 -1
- package/dist/webcomponents/p-b60a58f4.entry.js +0 -1
- package/dist/webcomponents/p-b86f7c95.entry.js +0 -1
- package/dist/webcomponents/p-bb70152e.entry.js +0 -1
- package/dist/webcomponents/p-bc91044c.entry.js +0 -1
- package/dist/webcomponents/p-c29c587f.entry.js +0 -1
- package/dist/webcomponents/p-cbb60191.js +0 -2
- package/dist/webcomponents/p-d0e4eca5.entry.js +0 -1
- package/dist/webcomponents/p-d4b66d74.entry.js +0 -1
- package/dist/webcomponents/p-e7ef2455.entry.js +0 -1
- package/dist/webcomponents/p-f2f0aa6e.entry.js +0 -1
- package/loader/index.es2017.js +0 -3
- /package/{loader → dist/loader}/package.json +0 -0
- /package/dist/{components → module}/additional-questions-details.js +0 -0
- /package/dist/{components → module}/form-control-datepart.js +0 -0
- /package/dist/{components → module}/form-control-monetary.js +0 -0
- /package/dist/{components → module}/form-control-number-masked.js +0 -0
- /package/dist/{components → module}/form-control-number.js +0 -0
- /package/dist/{components → module}/form-control-select.js +0 -0
- /package/dist/{components → module}/form-control-text.js +0 -0
- /package/dist/{components → module}/generic-info-details.js +0 -0
- /package/dist/{components → module}/index.d.ts +0 -0
- /package/dist/{components → module}/index.js +0 -0
- /package/dist/{components → module}/justifi-additional-questions.js +0 -0
- /package/dist/{components → module}/justifi-billing-form.js +0 -0
- /package/dist/{components → module}/justifi-business-address-form.js +0 -0
- /package/dist/{components → module}/justifi-business-generic-info.js +0 -0
- /package/dist/{components → module}/justifi-business-owners.js +0 -0
- /package/dist/{components → module}/justifi-business-representative.js +0 -0
- /package/dist/{components → module}/justifi-details.js +0 -0
- /package/dist/{components → module}/justifi-legal-address-form.js +0 -0
- /package/dist/{components → module}/justifi-payment-method-form.js +0 -0
- /package/dist/{components → module}/justifi-payment-method-selector.js +0 -0
- /package/dist/{components → module}/justifi-table.js +0 -0
- /package/dist/{components → module}/legal-address-details.js +0 -0
- /package/dist/{components → module}/owner-details.js +0 -0
- /package/dist/{components → module}/pagination-menu.js +0 -0
- /package/dist/{components → module}/representative-details.js +0 -0
- /package/dist/{components → module}/select-input.js +0 -0
- /package/dist/{components → module}/subaccount-account-details.js +0 -0
- /package/dist/{components → module}/subaccount-merchant-details.js +0 -0
- /package/dist/{components → module}/subaccount-owners-details.js +0 -0
- /package/dist/{components → module}/subaccount-representative-details.js +0 -0
- /package/dist/{components → module}/text-input.js +0 -0
- /package/dist/webcomponents/{p-0d5d02d7.js → p-56f6ce4c.js} +0 -0
- /package/dist/webcomponents/{p-e12ab547.js → p-71679a41.js} +0 -0
- /package/dist/webcomponents/{p-47bc59b5.js → p-8e2a88a8.js} +0 -0
- /package/dist/webcomponents/{p-d6b5793d.js → p-9a6e4749.js} +0 -0
- /package/dist/webcomponents/{p-526cb161.js → p-9b4b91ba.js} +0 -0
- /package/dist/webcomponents/{p-9b6dcac5.js → p-ae263544.js} +0 -0
- /package/dist/webcomponents/{p-7d58db66.js → p-bedada09.js} +0 -0
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
export default {
|
|
2
|
-
title: 'dev/Components/BillingForm',
|
|
3
|
-
component: 'justifi-billing-form',
|
|
4
|
-
parameters: {},
|
|
5
|
-
};
|
|
6
|
-
const Template = (args) => {
|
|
7
|
-
return `
|
|
8
|
-
<div>
|
|
9
|
-
<style>
|
|
10
|
-
:root {
|
|
11
|
-
${args['css-variables'] || ''}
|
|
12
|
-
}
|
|
13
|
-
</style>
|
|
14
|
-
<justifi-billing-form
|
|
15
|
-
data-testid="billing-form-iframe"
|
|
16
|
-
legend="${args['legend'] || ''}"
|
|
17
|
-
|
|
18
|
-
/>
|
|
19
|
-
</div>
|
|
20
|
-
`;
|
|
21
|
-
};
|
|
22
|
-
export const Basic = Template.bind({});
|
|
23
|
-
Basic.args = {
|
|
24
|
-
legend: 'Billing Form',
|
|
25
|
-
};
|
|
26
|
-
export const Styled = Template.bind({});
|
|
27
|
-
Styled.args = {
|
|
28
|
-
'legend': 'Styled Billing Form',
|
|
29
|
-
'css-variables': `
|
|
30
|
-
--jfi-layout-padding: 0;
|
|
31
|
-
--jfi-layout-form-control-spacing-x: .5rem;
|
|
32
|
-
--jfi-layout-form-control-spacing-y: 1rem;
|
|
33
|
-
--jfi-form-label-font-weight: 700;
|
|
34
|
-
--jfi-form-label-font-family: sans-serif;
|
|
35
|
-
--jfi-form-label-margin: 0 0 .5rem 0;
|
|
36
|
-
--jfi-form-control-background-color: #F4F4F6;
|
|
37
|
-
--jfi-form-control-background-color-hover: #EEEEF5;
|
|
38
|
-
--jfi-form-control-border-color: rgba(0, 0, 0, 0.42);
|
|
39
|
-
--jfi-form-control-border-color-hover: rgba(0, 0, 0, 0.62);
|
|
40
|
-
--jfi-form-control-border-color-focus: #fccc32;
|
|
41
|
-
--jfi-form-control-border-color-error: #C12727;
|
|
42
|
-
--jfi-form-control-border-top-width: 0;
|
|
43
|
-
--jfi-form-control-border-left-width: 0;
|
|
44
|
-
--jfi-form-control-border-bottom-width: 1px;
|
|
45
|
-
--jfi-form-control-border-right-width: 0;
|
|
46
|
-
--jfi-form-control-border-radius: 4px 4px 0 0;
|
|
47
|
-
--jfi-form-control-border-style: solid;
|
|
48
|
-
--jfi-form-control-box-shadow-focus: none;
|
|
49
|
-
--jfi-form-control-box-shadow-error-focus: none;
|
|
50
|
-
--jfi-form-control-border-style: solid;
|
|
51
|
-
--jfi-form-control-color: #212529;
|
|
52
|
-
--jfi-form-control-font-size: 1rem;
|
|
53
|
-
--jfi-form-control-font-weight: 400;
|
|
54
|
-
--jfi-form-control-line-height: 2;
|
|
55
|
-
--jfi-form-control-margin: 0;
|
|
56
|
-
--jfi-form-control-padding: .5rem .875rem;
|
|
57
|
-
--jfi-error-message-color: #C12727;
|
|
58
|
-
--jfi-error-message-margin: .25rem 0 0 0;
|
|
59
|
-
--jfi-error-message-font-size: .875rem;
|
|
60
|
-
`,
|
|
61
|
-
};
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { head } from '../../../storybook-pages/example-parts';
|
|
2
|
-
|
|
3
|
-
export default `<!DOCTYPE html>
|
|
4
|
-
<html dir="ltr" lang="en">
|
|
5
|
-
|
|
6
|
-
${head('justifi-billing-form')}
|
|
7
|
-
|
|
8
|
-
<body>
|
|
9
|
-
<justifi-billing-form></justifi-billing-form>
|
|
10
|
-
<button id="justifi-billing-form-submit">Submit</button>
|
|
11
|
-
</body>
|
|
12
|
-
|
|
13
|
-
<script>
|
|
14
|
-
(async () => {
|
|
15
|
-
await customElements.whenDefined('justifi-billing-form');
|
|
16
|
-
|
|
17
|
-
// Billing form component
|
|
18
|
-
var billingForm = document.querySelector('justifi-billing-form');
|
|
19
|
-
var billingFormSubmitButton = document.querySelector('#justifi-billing-form-submit');
|
|
20
|
-
billingFormSubmitButton.addEventListener('click', async (event) => {
|
|
21
|
-
const billingFormValidation = await billingForm.validate();
|
|
22
|
-
});
|
|
23
|
-
})();
|
|
24
|
-
</script>
|
|
25
|
-
|
|
26
|
-
</html>`;
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { config } from "../../../config";
|
|
2
|
-
export default {
|
|
3
|
-
title: 'Components/BusinessDetails',
|
|
4
|
-
component: 'justifi-business-details',
|
|
5
|
-
parameters: {},
|
|
6
|
-
};
|
|
7
|
-
class BusinessDetailsArgs {
|
|
8
|
-
constructor(args) {
|
|
9
|
-
this['businessId'] = args['businessId'] || config.exampleBusinessId;
|
|
10
|
-
this['authToken'] = args['authToken'] || config.proxyAuthToken;
|
|
11
|
-
}
|
|
12
|
-
}
|
|
13
|
-
;
|
|
14
|
-
const Template = (args) => {
|
|
15
|
-
return `
|
|
16
|
-
<justifi-business-details
|
|
17
|
-
business-id="${args['businessId']}"
|
|
18
|
-
auth-token="${args['authToken']}"
|
|
19
|
-
/>
|
|
20
|
-
`;
|
|
21
|
-
};
|
|
22
|
-
export const Basic = Template.bind({});
|
|
23
|
-
Basic.args = new BusinessDetailsArgs({});
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { head } from '../../../storybook-pages/example-parts';
|
|
2
|
-
|
|
3
|
-
export default `<!DOCTYPE html>
|
|
4
|
-
<html dir="ltr" lang="en">
|
|
5
|
-
|
|
6
|
-
${head('justifi-business-form-stepped')}
|
|
7
|
-
|
|
8
|
-
<body>
|
|
9
|
-
<justifi-business-form-stepped></justifi-business-form-stepped>
|
|
10
|
-
</body>
|
|
11
|
-
|
|
12
|
-
</html>`;
|
|
@@ -1,132 +0,0 @@
|
|
|
1
|
-
import { config } from "../../../config";
|
|
2
|
-
class BusinessFormSteppedStoryArgs {
|
|
3
|
-
constructor(args) {
|
|
4
|
-
this['auth-token'] = args['auth-token'] || config.proxyAuthToken;
|
|
5
|
-
this['business-id'] = args['business-id'] || '';
|
|
6
|
-
this['account-id'] = args['account-id'] || config.exampleAccountId;
|
|
7
|
-
this['css-variables'] = args['css-variables'] || '';
|
|
8
|
-
}
|
|
9
|
-
}
|
|
10
|
-
export default {
|
|
11
|
-
title: 'Components/BusinessFormStepped',
|
|
12
|
-
component: 'justifi-business-form',
|
|
13
|
-
argTypes: {
|
|
14
|
-
'auth-token': {
|
|
15
|
-
control: 'text',
|
|
16
|
-
table: {
|
|
17
|
-
category: 'props',
|
|
18
|
-
},
|
|
19
|
-
},
|
|
20
|
-
'account-id': {
|
|
21
|
-
control: 'text',
|
|
22
|
-
table: {
|
|
23
|
-
category: 'props',
|
|
24
|
-
},
|
|
25
|
-
},
|
|
26
|
-
'business-id': {
|
|
27
|
-
control: 'text',
|
|
28
|
-
table: {
|
|
29
|
-
category: 'props',
|
|
30
|
-
},
|
|
31
|
-
}
|
|
32
|
-
},
|
|
33
|
-
};
|
|
34
|
-
const Template = (args) => {
|
|
35
|
-
const authToken = args['auth-token'];
|
|
36
|
-
const businessId = args['business-id'];
|
|
37
|
-
const accountId = args['account-id'] || config.exampleAccountId;
|
|
38
|
-
// The <div> here should be replaced by a `display` property in the cardForm potentially
|
|
39
|
-
return `
|
|
40
|
-
<div>
|
|
41
|
-
<justifi-business-form-stepped
|
|
42
|
-
auth-token="${authToken}"
|
|
43
|
-
business-id="${businessId}"
|
|
44
|
-
account-id="${accountId}"
|
|
45
|
-
test-mode="true"
|
|
46
|
-
/>
|
|
47
|
-
</div>
|
|
48
|
-
<style>
|
|
49
|
-
:root {
|
|
50
|
-
${args['css-variables']}
|
|
51
|
-
}
|
|
52
|
-
</style>
|
|
53
|
-
`;
|
|
54
|
-
};
|
|
55
|
-
export const Basic = Template.bind({});
|
|
56
|
-
Basic.args = new BusinessFormSteppedStoryArgs({});
|
|
57
|
-
export const Styled = Template.bind({});
|
|
58
|
-
Styled.args = new BusinessFormSteppedStoryArgs({
|
|
59
|
-
'auth-token': '',
|
|
60
|
-
'business-id': '',
|
|
61
|
-
'account-id': '',
|
|
62
|
-
'cssVariables': `
|
|
63
|
-
--jfi-primary-color: #212529;
|
|
64
|
-
--jfi-load-google-font: 'Roboto Mono:wght@200;400;700;900';
|
|
65
|
-
--jfi-layout-font-family: Roboto Mono, Calibri, sans-serif;
|
|
66
|
-
--jfi-layout-padding: 4px;
|
|
67
|
-
--jfi-layout-form-control-spacing-x: .5rem;
|
|
68
|
-
--jfi-layout-form-control-spacing-y: 1rem;
|
|
69
|
-
--jfi-form-label-font-weight: 700;
|
|
70
|
-
--jfi-form-label-font-family: Calibri, sans-serif;
|
|
71
|
-
--jfi-form-label-margin: 0 0 .5rem 0;
|
|
72
|
-
--jfi-form-control-background-color: #F4F4F6;
|
|
73
|
-
--jfi-form-control-background-color-hover: #EEEEF5;
|
|
74
|
-
--jfi-form-control-border-color: rgba(0, 0, 0, 0.42);
|
|
75
|
-
--jfi-form-control-border-color-hover: rgba(0, 0, 0, 0.62);
|
|
76
|
-
--jfi-form-control-border-color-focus: #fccc32;
|
|
77
|
-
--jfi-form-control-border-color-error: #C12727;
|
|
78
|
-
--jfi-form-control-border-top-width: 0;
|
|
79
|
-
--jfi-form-control-border-left-width: 0;
|
|
80
|
-
--jfi-form-control-border-bottom-width: 1px;
|
|
81
|
-
--jfi-form-control-border-right-width: 0;
|
|
82
|
-
--jfi-form-control-border-radius: 4px 4px 0 0;
|
|
83
|
-
--jfi-form-control-border-style: solid;
|
|
84
|
-
--jfi-form-control-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
|
|
85
|
-
--jfi-form-control-box-shadow-focus: none;
|
|
86
|
-
--jfi-form-control-box-shadow-error-focus: none;
|
|
87
|
-
--jfi-form-control-border-style: solid;
|
|
88
|
-
--jfi-form-control-color: #212529;
|
|
89
|
-
--jfi-form-control-font-size: 1rem;
|
|
90
|
-
--jfi-form-control-font-weight: 400;
|
|
91
|
-
--jfi-form-control-line-height: 2;
|
|
92
|
-
--jfi-form-control-margin: 0;
|
|
93
|
-
--jfi-form-control-padding: .5rem .875rem;
|
|
94
|
-
--jfi-error-message-color: #C12727;
|
|
95
|
-
--jfi-error-message-margin: .25rem 0 0 0;
|
|
96
|
-
--jfi-error-message-font-size: .875rem;
|
|
97
|
-
|
|
98
|
-
--jfi-submit-button-color: white;
|
|
99
|
-
--jfi-submit-button-background-color: #3F3F47;
|
|
100
|
-
--jfi-submit-button-border-color: var(--jfi-primary-color);
|
|
101
|
-
--jfi-submit-button-padding: 0.375rem 0.75rem;
|
|
102
|
-
--jfi-submit-button-font-size: 1rem;
|
|
103
|
-
--jfi-submit-button-border-radius: 1px;
|
|
104
|
-
--jfi-submit-button-color-hover: white;
|
|
105
|
-
--jfi-submit-button-background-color-hover: var(--jfi-primary-color);
|
|
106
|
-
--jfi-submit-button-border-color-hover: var(--jfi-primary-color);
|
|
107
|
-
--jfi-submit-button-color-focus: white;
|
|
108
|
-
--jfi-submit-button-background-color-focus: var(--jfi-primary-color);
|
|
109
|
-
--jfi-submit-button-border-color-focus: var(--jfi-primary-color);
|
|
110
|
-
--jfi-submit-button-color-active: white;
|
|
111
|
-
--jfi-submit-button-background-color-active: var(--jfi-primary-color);
|
|
112
|
-
--jfi-submit-button-border-color-active: var(--jfi-primary-color);
|
|
113
|
-
--jfi-submit-button-width: 100%;
|
|
114
|
-
--jfi-submit-button-box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 1px 5px 0px;
|
|
115
|
-
|
|
116
|
-
--jfi-radio-button-color: var(--jfi-primary-color);
|
|
117
|
-
--jfi-radio-button-background-color: transparent;
|
|
118
|
-
--jfi-radio-button-color-selected: white;
|
|
119
|
-
--jfi-radio-button-background-color-selected: var(--jfi-primary-color);
|
|
120
|
-
--jfi-radio-button-border-color: var(--jfi-primary-color);
|
|
121
|
-
--jfi-radio-button-border-color-selected: var(--jfi-primary-color);
|
|
122
|
-
--jfi-radio-button-padding: 0.375rem 0.75rem;
|
|
123
|
-
--jfi-radio-button-font-size: 1rem;
|
|
124
|
-
--jfi-radio-button-color-hover: var(--jfi-primary-color);
|
|
125
|
-
--jfi-radio-button-color-selected-hover: white;
|
|
126
|
-
--jfi-radio-button-background-color-hover: transparent;
|
|
127
|
-
--jfi-radio-button-background-color-selected-hover: var(--jfi-primary-color);
|
|
128
|
-
--jfi-radio-button-border-color-selected-hover: var(--jfi-primary-color);
|
|
129
|
-
--jfi-radio-button-border-color-hover: var(--jfi-primary-color);
|
|
130
|
-
--jfi-radio-button-group-width: 100%;
|
|
131
|
-
`,
|
|
132
|
-
});
|
|
@@ -1,127 +0,0 @@
|
|
|
1
|
-
import { config } from "../../../config";
|
|
2
|
-
class BusinessFormStoryArgs {
|
|
3
|
-
constructor(args) {
|
|
4
|
-
this['auth-token'] = args['auth-token'] || '';
|
|
5
|
-
this['business-id'] = args['business-id'] || '';
|
|
6
|
-
this['account-id'] = args['account-id'] || config.exampleAccountId;
|
|
7
|
-
this['cssVariables'] = args['cssVariables'] || '';
|
|
8
|
-
}
|
|
9
|
-
}
|
|
10
|
-
export default {
|
|
11
|
-
title: 'Components/BusinessForm',
|
|
12
|
-
component: 'justifi-business-form',
|
|
13
|
-
argTypes: {
|
|
14
|
-
'auth-token': {
|
|
15
|
-
control: 'text',
|
|
16
|
-
table: {
|
|
17
|
-
category: 'props',
|
|
18
|
-
},
|
|
19
|
-
},
|
|
20
|
-
'account-id': {
|
|
21
|
-
control: 'text',
|
|
22
|
-
table: {
|
|
23
|
-
category: 'props',
|
|
24
|
-
},
|
|
25
|
-
},
|
|
26
|
-
'business-id': {
|
|
27
|
-
control: 'text',
|
|
28
|
-
table: {
|
|
29
|
-
category: 'props',
|
|
30
|
-
},
|
|
31
|
-
},
|
|
32
|
-
},
|
|
33
|
-
};
|
|
34
|
-
const Template = (args) => {
|
|
35
|
-
// The <div> here should be replaced by a `display` property in the cardForm potentially
|
|
36
|
-
return `
|
|
37
|
-
<div>
|
|
38
|
-
<justifi-business-form
|
|
39
|
-
auth-token="${args['auth-token']}"
|
|
40
|
-
account-id="${args['account-id']}"
|
|
41
|
-
business-id="${args['business-id']}"
|
|
42
|
-
/>
|
|
43
|
-
</div>
|
|
44
|
-
<style>
|
|
45
|
-
:root {
|
|
46
|
-
${args.cssVariables}
|
|
47
|
-
}
|
|
48
|
-
</style>
|
|
49
|
-
`;
|
|
50
|
-
};
|
|
51
|
-
export const Basic = Template.bind({});
|
|
52
|
-
Basic.args = new BusinessFormStoryArgs({});
|
|
53
|
-
export const Styled = Template.bind({});
|
|
54
|
-
Styled.args = new BusinessFormStoryArgs({
|
|
55
|
-
'auth-token': '',
|
|
56
|
-
'business-id': '',
|
|
57
|
-
cssVariables: `
|
|
58
|
-
--jfi-primary-color: #212529;
|
|
59
|
-
--jfi-load-google-font: 'Roboto Mono:wght@200;400;700;900';
|
|
60
|
-
--jfi-layout-font-family: Roboto Mono, Calibri, sans-serif;
|
|
61
|
-
--jfi-layout-padding: 4px;
|
|
62
|
-
--jfi-layout-form-control-spacing-x: .5rem;
|
|
63
|
-
--jfi-layout-form-control-spacing-y: 1rem;
|
|
64
|
-
--jfi-form-label-font-weight: 700;
|
|
65
|
-
--jfi-form-label-font-family: Calibri, sans-serif;
|
|
66
|
-
--jfi-form-label-margin: 0 0 .5rem 0;
|
|
67
|
-
--jfi-form-control-background-color: #F4F4F6;
|
|
68
|
-
--jfi-form-control-background-color-hover: #EEEEF5;
|
|
69
|
-
--jfi-form-control-border-color: rgba(0, 0, 0, 0.42);
|
|
70
|
-
--jfi-form-control-border-color-hover: rgba(0, 0, 0, 0.62);
|
|
71
|
-
--jfi-form-control-border-color-focus: #fccc32;
|
|
72
|
-
--jfi-form-control-border-color-error: #C12727;
|
|
73
|
-
--jfi-form-control-border-top-width: 0;
|
|
74
|
-
--jfi-form-control-border-left-width: 0;
|
|
75
|
-
--jfi-form-control-border-bottom-width: 1px;
|
|
76
|
-
--jfi-form-control-border-right-width: 0;
|
|
77
|
-
--jfi-form-control-border-radius: 4px 4px 0 0;
|
|
78
|
-
--jfi-form-control-border-style: solid;
|
|
79
|
-
--jfi-form-control-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
|
|
80
|
-
--jfi-form-control-box-shadow-focus: none;
|
|
81
|
-
--jfi-form-control-box-shadow-error-focus: none;
|
|
82
|
-
--jfi-form-control-border-style: solid;
|
|
83
|
-
--jfi-form-control-color: #212529;
|
|
84
|
-
--jfi-form-control-font-size: 1rem;
|
|
85
|
-
--jfi-form-control-font-weight: 400;
|
|
86
|
-
--jfi-form-control-line-height: 2;
|
|
87
|
-
--jfi-form-control-margin: 0;
|
|
88
|
-
--jfi-form-control-padding: .5rem .875rem;
|
|
89
|
-
--jfi-error-message-color: #C12727;
|
|
90
|
-
--jfi-error-message-margin: .25rem 0 0 0;
|
|
91
|
-
--jfi-error-message-font-size: .875rem;
|
|
92
|
-
|
|
93
|
-
--jfi-submit-button-color: white;
|
|
94
|
-
--jfi-submit-button-background-color: #3F3F47;
|
|
95
|
-
--jfi-submit-button-border-color: var(--jfi-primary-color);
|
|
96
|
-
--jfi-submit-button-padding: 0.375rem 0.75rem;
|
|
97
|
-
--jfi-submit-button-font-size: 1rem;
|
|
98
|
-
--jfi-submit-button-border-radius: 1px;
|
|
99
|
-
--jfi-submit-button-color-hover: white;
|
|
100
|
-
--jfi-submit-button-background-color-hover: var(--jfi-primary-color);
|
|
101
|
-
--jfi-submit-button-border-color-hover: var(--jfi-primary-color);
|
|
102
|
-
--jfi-submit-button-color-focus: white;
|
|
103
|
-
--jfi-submit-button-background-color-focus: var(--jfi-primary-color);
|
|
104
|
-
--jfi-submit-button-border-color-focus: var(--jfi-primary-color);
|
|
105
|
-
--jfi-submit-button-color-active: white;
|
|
106
|
-
--jfi-submit-button-background-color-active: var(--jfi-primary-color);
|
|
107
|
-
--jfi-submit-button-border-color-active: var(--jfi-primary-color);
|
|
108
|
-
--jfi-submit-button-width: 100%;
|
|
109
|
-
--jfi-submit-button-box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 1px 5px 0px;
|
|
110
|
-
|
|
111
|
-
--jfi-radio-button-color: var(--jfi-primary-color);
|
|
112
|
-
--jfi-radio-button-background-color: transparent;
|
|
113
|
-
--jfi-radio-button-color-selected: white;
|
|
114
|
-
--jfi-radio-button-background-color-selected: var(--jfi-primary-color);
|
|
115
|
-
--jfi-radio-button-border-color: var(--jfi-primary-color);
|
|
116
|
-
--jfi-radio-button-border-color-selected: var(--jfi-primary-color);
|
|
117
|
-
--jfi-radio-button-padding: 0.375rem 0.75rem;
|
|
118
|
-
--jfi-radio-button-font-size: 1rem;
|
|
119
|
-
--jfi-radio-button-color-hover: var(--jfi-primary-color);
|
|
120
|
-
--jfi-radio-button-color-selected-hover: white;
|
|
121
|
-
--jfi-radio-button-background-color-hover: transparent;
|
|
122
|
-
--jfi-radio-button-background-color-selected-hover: var(--jfi-primary-color);
|
|
123
|
-
--jfi-radio-button-border-color-selected-hover: var(--jfi-primary-color);
|
|
124
|
-
--jfi-radio-button-border-color-hover: var(--jfi-primary-color);
|
|
125
|
-
--jfi-radio-button-group-width: 100%;
|
|
126
|
-
`,
|
|
127
|
-
});
|
|
@@ -1,137 +0,0 @@
|
|
|
1
|
-
import { config } from "../../../config";
|
|
2
|
-
export default {
|
|
3
|
-
title: 'Components/CardForm',
|
|
4
|
-
component: 'justifi-card-form',
|
|
5
|
-
argTypes: {
|
|
6
|
-
'resize': {
|
|
7
|
-
description: 'Deprecated: This method will be removed in future releases.',
|
|
8
|
-
table: {
|
|
9
|
-
category: 'methods',
|
|
10
|
-
},
|
|
11
|
-
},
|
|
12
|
-
},
|
|
13
|
-
decorators: [
|
|
14
|
-
story => `
|
|
15
|
-
<!-- Deprecated Notice -->
|
|
16
|
-
<p style="color: red; font-family: 'Roboto Mono', monospace;">Note: The 'resize' method is deprecated and will be removed in future releases.</p>
|
|
17
|
-
${story()}
|
|
18
|
-
<script>${addEvents()}</script>
|
|
19
|
-
`,
|
|
20
|
-
],
|
|
21
|
-
};
|
|
22
|
-
const handleValidateClick = async (cardForm) => {
|
|
23
|
-
const valid = await cardForm.validate();
|
|
24
|
-
console.log(valid);
|
|
25
|
-
};
|
|
26
|
-
const handleTokenizeClick = async (cardForm, paymentMethodData) => {
|
|
27
|
-
const tokenizeResponse = await cardForm.tokenize('CLIENT_ID', paymentMethodData);
|
|
28
|
-
console.log(tokenizeResponse);
|
|
29
|
-
};
|
|
30
|
-
const handleResizeClick = async (cardForm) => {
|
|
31
|
-
await cardForm.resize();
|
|
32
|
-
};
|
|
33
|
-
const handleReady = () => {
|
|
34
|
-
console.log('card form is ready');
|
|
35
|
-
const cardForm = document.querySelector('justifi-card-form');
|
|
36
|
-
const validateBtn = document.querySelector('#validate-btn');
|
|
37
|
-
const tokenizeBtn = document.querySelector('#tokenize-btn');
|
|
38
|
-
const resizeBtn = document.querySelector('#resize-btn');
|
|
39
|
-
validateBtn === null || validateBtn === void 0 ? void 0 : validateBtn.addEventListener('click', () => {
|
|
40
|
-
handleValidateClick(cardForm);
|
|
41
|
-
});
|
|
42
|
-
tokenizeBtn === null || tokenizeBtn === void 0 ? void 0 : tokenizeBtn.addEventListener('click', () => {
|
|
43
|
-
handleTokenizeClick(cardForm, {});
|
|
44
|
-
});
|
|
45
|
-
resizeBtn === null || resizeBtn === void 0 ? void 0 : resizeBtn.addEventListener('click', () => {
|
|
46
|
-
handleResizeClick(cardForm);
|
|
47
|
-
});
|
|
48
|
-
};
|
|
49
|
-
const addEvents = () => {
|
|
50
|
-
addEventListener('cardFormReady', handleReady);
|
|
51
|
-
};
|
|
52
|
-
const FormButtons = `
|
|
53
|
-
<style>
|
|
54
|
-
.button-bar {
|
|
55
|
-
display: flex;
|
|
56
|
-
aligin-items: center;
|
|
57
|
-
padding: 10px;
|
|
58
|
-
}
|
|
59
|
-
.button-bar button {
|
|
60
|
-
margin-right: 10px;
|
|
61
|
-
border-radius: 3px;
|
|
62
|
-
border: 1px solid black;
|
|
63
|
-
}
|
|
64
|
-
</style>
|
|
65
|
-
<div class="button-bar">
|
|
66
|
-
<button id="validate-btn">Validate</button>
|
|
67
|
-
<button id="tokenize-btn">Tokenize</button>
|
|
68
|
-
<button id="resize-btn">Resize</button>
|
|
69
|
-
</div>`;
|
|
70
|
-
const Template = (args) => {
|
|
71
|
-
const includeButtons = true;
|
|
72
|
-
return `
|
|
73
|
-
<div>
|
|
74
|
-
<style>
|
|
75
|
-
:root {
|
|
76
|
-
${args['css-variables'] || ''}
|
|
77
|
-
}
|
|
78
|
-
</style>
|
|
79
|
-
<justifi-card-form
|
|
80
|
-
data-testid="card-form-iframe"
|
|
81
|
-
validation-mode='${args['validation-mode'] || 'onSubmit'}'
|
|
82
|
-
iframe-origin='${config.iframeOrigin}'
|
|
83
|
-
single-line='${args['single-line']}'
|
|
84
|
-
/>
|
|
85
|
-
</div>
|
|
86
|
-
${includeButtons ? FormButtons : ''}
|
|
87
|
-
`;
|
|
88
|
-
};
|
|
89
|
-
export const Basic = Template.bind({});
|
|
90
|
-
Basic.args = {
|
|
91
|
-
'validation-mode': 'onSubmit',
|
|
92
|
-
'single-line': false,
|
|
93
|
-
};
|
|
94
|
-
export const SingleLine = Template.bind({});
|
|
95
|
-
SingleLine.args = {
|
|
96
|
-
'single-line': true,
|
|
97
|
-
};
|
|
98
|
-
const styledVariables = `
|
|
99
|
-
--jfi-load-google-font: 'Inter:wght@200;400;700;900&family=Agdasima';
|
|
100
|
-
--jfi-layout-font-family: Agdasima;
|
|
101
|
-
--jfi-layout-padding: 4px;
|
|
102
|
-
--jfi-layout-form-control-spacing-x: .5rem;
|
|
103
|
-
--jfi-layout-form-control-spacing-y: 1rem;
|
|
104
|
-
--jfi-form-label-font-weight: 100;
|
|
105
|
-
--jfi-form-label-font-family: Inter;
|
|
106
|
-
--jfi-form-label-margin: 0 0 .5rem 0;
|
|
107
|
-
--jfi-form-control-background-color: #F4F4F6;
|
|
108
|
-
--jfi-form-control-background-color-hover: #EEEEF5;
|
|
109
|
-
--jfi-form-control-border-color: rgba(0, 0, 0, 0.42);
|
|
110
|
-
--jfi-form-control-border-color-hover: rgba(0, 0, 0, 0.62);
|
|
111
|
-
--jfi-form-control-border-color-focus: #fccc32;
|
|
112
|
-
--jfi-form-control-border-color-error: #C12727;
|
|
113
|
-
--jfi-form-control-border-top-width: 0;
|
|
114
|
-
--jfi-form-control-border-left-width: 0;
|
|
115
|
-
--jfi-form-control-border-bottom-width: 1px;
|
|
116
|
-
--jfi-form-control-border-right-width: 0;
|
|
117
|
-
--jfi-form-control-border-radius: 4px 4px 0 0;
|
|
118
|
-
--jfi-form-control-border-style: solid;
|
|
119
|
-
--jfi-form-control-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
|
|
120
|
-
--jfi-form-control-box-shadow-focus: none;
|
|
121
|
-
--jfi-form-control-box-shadow-error-focus: none;
|
|
122
|
-
--jfi-form-control-border-style: solid;
|
|
123
|
-
--jfi-form-control-color: #212529;
|
|
124
|
-
--jfi-form-control-font-size: 1rem;
|
|
125
|
-
--jfi-form-control-font-weight: 400;
|
|
126
|
-
--jfi-form-control-line-height: 2;
|
|
127
|
-
--jfi-form-control-margin: 0;
|
|
128
|
-
--jfi-form-control-padding: .5rem .875rem;
|
|
129
|
-
--jfi-error-message-color: #C12727;
|
|
130
|
-
--jfi-error-message-margin: .25rem 0 0 0;
|
|
131
|
-
--jfi-error-message-font-size: .875rem;
|
|
132
|
-
`;
|
|
133
|
-
export const Styled = Template.bind({});
|
|
134
|
-
Styled.args = {
|
|
135
|
-
'single-line': false,
|
|
136
|
-
'css-variables': styledVariables,
|
|
137
|
-
};
|
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
import { head } from '../../../storybook-pages/example-parts';
|
|
2
|
-
|
|
3
|
-
export default `<!DOCTYPE html>
|
|
4
|
-
<html dir="ltr" lang="en">
|
|
5
|
-
|
|
6
|
-
${head('justifi-card-form')}
|
|
7
|
-
|
|
8
|
-
<body>
|
|
9
|
-
<justifi-card-form></justifi-card-form>
|
|
10
|
-
<button type="submit" id="card-submit-button">Tokenize</button>
|
|
11
|
-
<button type="submit" id="card-validate-button">Validate</button>
|
|
12
|
-
</body>
|
|
13
|
-
|
|
14
|
-
<script>
|
|
15
|
-
(function () {
|
|
16
|
-
// Card form component
|
|
17
|
-
var cardForm = document.querySelector('justifi-card-form');
|
|
18
|
-
var cardSubmitButton = document.querySelector('#card-submit-button');
|
|
19
|
-
var cardValidateButton = document.querySelector('#card-validate-button');
|
|
20
|
-
|
|
21
|
-
cardForm.addEventListener('cardFormReady', function () {
|
|
22
|
-
console.log('justifi-card-form ready');
|
|
23
|
-
});
|
|
24
|
-
|
|
25
|
-
cardSubmitButton.addEventListener('click', (event) => {
|
|
26
|
-
console.log('card form tokenize button clicked');
|
|
27
|
-
// All of this information would come from your form instead of being hard coded
|
|
28
|
-
// Card number, expiration and cvv are collected on our iframe
|
|
29
|
-
const paymentMethodData = {
|
|
30
|
-
name: 'John Doe',
|
|
31
|
-
address_line1: '123 Broadway', // optional
|
|
32
|
-
address_line2: '', // optional
|
|
33
|
-
address_city: 'Minneapolis', // optional
|
|
34
|
-
address_state: 'MN', // optional
|
|
35
|
-
address_postal_code: '55413',
|
|
36
|
-
address_country: 'US', // optional
|
|
37
|
-
metadata: { something: "somevalue" } // optional
|
|
38
|
-
};
|
|
39
|
-
// ACCOUNT_ID is optional, currently required for platforms
|
|
40
|
-
// ACCOUNT_ID is the seller account for which you are tokenizing
|
|
41
|
-
cardForm.tokenize('CLIENT_ID', paymentMethodData, 'ACCOUNT_ID')
|
|
42
|
-
.then((data) => {
|
|
43
|
-
// This is where you can submit the form and use the payment method token
|
|
44
|
-
// on your backend
|
|
45
|
-
console.log('justifi-card-form tokenized: ', data);
|
|
46
|
-
});
|
|
47
|
-
});
|
|
48
|
-
|
|
49
|
-
cardValidateButton.addEventListener('click', (event) => {
|
|
50
|
-
console.log('card validate button clicked');
|
|
51
|
-
cardForm.validate()
|
|
52
|
-
.then((data) => {
|
|
53
|
-
console.log('justifi-card-form validated. Is valid? ', data.isValid);
|
|
54
|
-
});
|
|
55
|
-
});
|
|
56
|
-
})();
|
|
57
|
-
</script>
|
|
58
|
-
|
|
59
|
-
</html>`;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { head } from '../../../storybook-pages/example-parts';
|
|
2
|
-
|
|
3
|
-
export default `<DOCTYPE html>
|
|
4
|
-
<html dir="ltr" lang="en">
|
|
5
|
-
|
|
6
|
-
${head('justifi-gross-payment-chart')}
|
|
7
|
-
|
|
8
|
-
<body>
|
|
9
|
-
<justifi-gross-payment-chart></justifi-gross-payment-chart>
|
|
10
|
-
</body>
|
|
11
|
-
|
|
12
|
-
</html>`;
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import { config } from "../../../config";
|
|
2
|
-
export default {
|
|
3
|
-
title: 'Components/GrossPaymentChart',
|
|
4
|
-
component: 'justifi-gross-payment-chart',
|
|
5
|
-
parameters: {}
|
|
6
|
-
};
|
|
7
|
-
class GrossChartArgs {
|
|
8
|
-
constructor(args) {
|
|
9
|
-
this['auth-token'] = args['auth-token'] || config.proxyAuthToken;
|
|
10
|
-
this['account-id'] = args['account-id'] || config.exampleAccountId;
|
|
11
|
-
}
|
|
12
|
-
}
|
|
13
|
-
const Template = (args) => {
|
|
14
|
-
return (`
|
|
15
|
-
<justifi-gross-payment-chart
|
|
16
|
-
auth-token="${args['auth-token']}"
|
|
17
|
-
account-id="${args['account-id']}"
|
|
18
|
-
/>
|
|
19
|
-
`);
|
|
20
|
-
};
|
|
21
|
-
export const Basic = Template.bind({});
|
|
22
|
-
Basic.args = new GrossChartArgs({});
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { head } from '../../../storybook-pages/example-parts';
|
|
2
|
-
|
|
3
|
-
export default `<!DOCTYPE html>
|
|
4
|
-
<html dir="ltr" lang="en">
|
|
5
|
-
|
|
6
|
-
${head('justifi-payment-details')}
|
|
7
|
-
|
|
8
|
-
<body>
|
|
9
|
-
<justifi-payment-details></justifi-payment-details>
|
|
10
|
-
</body>
|
|
11
|
-
|
|
12
|
-
</html>`;
|