rebill-web-components-sdk 1.8.6 → 1.8.7
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/dist/cjs/rebill-button.cjs.entry.js +2 -2
- package/dist/cjs/rebill-button.entry.cjs.js.map +1 -1
- package/dist/cjs/rebill-checkout.cjs.entry.js +14 -13
- package/dist/cjs/rebill-checkout.entry.cjs.js.map +1 -1
- package/dist/collection/components/checkout/rebill-checkout.js +14 -13
- package/dist/collection/components/checkout/rebill-checkout.js.map +1 -1
- package/dist/collection/components/shared/button/button.css +8 -8
- package/dist/collection/components/shared/button/button.js +1 -1
- package/dist/collection/components/shared/button/button.js.map +1 -1
- package/dist/components/apm-checkout.js +1 -1
- package/dist/components/discount-coupon.js +1 -1
- package/dist/components/otp-component.js +1 -1
- package/dist/components/{p-DZI13wtJ.js → p-C9MOJKD4.js} +3 -3
- package/dist/components/{p-DZI13wtJ.js.map → p-C9MOJKD4.js.map} +1 -1
- package/dist/components/{p-BwpjM0Zf.js → p-CG7X0Z3m.js} +3 -3
- package/dist/components/{p-BwpjM0Zf.js.map → p-CG7X0Z3m.js.map} +1 -1
- package/dist/components/{p-CcZQGsZ8.js → p-CL6COaBj.js} +3 -3
- package/dist/components/{p-CcZQGsZ8.js.map → p-CL6COaBj.js.map} +1 -1
- package/dist/components/{p-C69QonMT.js → p-Cb9WV_NL.js} +3 -3
- package/dist/components/{p-C69QonMT.js.map → p-Cb9WV_NL.js.map} +1 -1
- package/dist/components/{p-C1THyrZh.js → p-D6oZSjpl.js} +3 -3
- package/dist/components/{p-C1THyrZh.js.map → p-D6oZSjpl.js.map} +1 -1
- package/dist/components/{p-W2zrB3tA.js → p-D6rWKLL8.js} +3 -3
- package/dist/components/{p-W2zrB3tA.js.map → p-D6rWKLL8.js.map} +1 -1
- package/dist/components/{p-ByRz5YWN.js → p-DavSndum.js} +3 -3
- package/dist/components/{p-ByRz5YWN.js.map → p-DavSndum.js.map} +1 -1
- package/dist/components/{p-Cp7iacZh.js → p-DgIOuUN1.js} +4 -4
- package/dist/components/p-DgIOuUN1.js.map +1 -0
- package/dist/components/{p-CHIajnDg.js → p-DljAUFZC.js} +3 -3
- package/dist/components/{p-CHIajnDg.js.map → p-DljAUFZC.js.map} +1 -1
- package/dist/components/{p-djD6Hoxd.js → p-Dum_FpHV.js} +3 -3
- package/dist/components/{p-djD6Hoxd.js.map → p-Dum_FpHV.js.map} +1 -1
- package/dist/components/{p-DJEotc3n.js → p-FFCF5_17.js} +4 -4
- package/dist/components/{p-DJEotc3n.js.map → p-FFCF5_17.js.map} +1 -1
- package/dist/components/{p-BBiYeY9C.js → p-LoXXimMi.js} +3 -3
- package/dist/components/{p-BBiYeY9C.js.map → p-LoXXimMi.js.map} +1 -1
- package/dist/components/payment-button.js +1 -1
- package/dist/components/rebill-button.js +1 -1
- package/dist/components/rebill-checkout.js +25 -24
- package/dist/components/rebill-checkout.js.map +1 -1
- package/dist/components/rebill-mode-sandbox-mobile.js +1 -1
- package/dist/components/rebill-mode-sandbox.js +1 -1
- package/dist/components/rebill-renewal.js +5 -5
- package/dist/components/rebill-summary.js +1 -1
- package/dist/components/renewal-success-page.js +1 -1
- package/dist/components/root-component.js +1 -1
- package/dist/components/success-page.js +1 -1
- package/dist/components/user-information-static.js +1 -1
- package/dist/components/user-information.js +1 -1
- package/dist/esm/rebill-button.entry.js +2 -2
- package/dist/esm/rebill-button.entry.js.map +1 -1
- package/dist/esm/rebill-checkout.entry.js +14 -13
- package/dist/esm/rebill-checkout.entry.js.map +1 -1
- package/dist/rebill-web-components-sdk/{p-91a86735.entry.js → p-297a5c76.entry.js} +2 -2
- package/dist/rebill-web-components-sdk/{p-91a86735.entry.js.map → p-297a5c76.entry.js.map} +1 -1
- package/dist/rebill-web-components-sdk/p-738fbc04.entry.js +2 -0
- package/dist/rebill-web-components-sdk/{p-b3837047.entry.js.map → p-738fbc04.entry.js.map} +1 -1
- package/dist/rebill-web-components-sdk/rebill-button.entry.esm.js.map +1 -1
- package/dist/rebill-web-components-sdk/rebill-checkout.entry.esm.js.map +1 -1
- package/dist/rebill-web-components-sdk/rebill-web-components-sdk.esm.js +1 -1
- package/package.json +1 -1
- package/dist/components/p-Cp7iacZh.js.map +0 -1
- package/dist/rebill-web-components-sdk/p-b3837047.entry.js +0 -2
|
@@ -2,7 +2,7 @@ import { proxyCustomElement, H, createEvent, h } from './p-8BpuJ_V5.js';
|
|
|
2
2
|
import { c as create$6 } from './p-MMCcKmy_.js';
|
|
3
3
|
import { a as api } from './p-Dh-yfb0D.js';
|
|
4
4
|
import { m as mapRequiredFields, i as isFieldRequired, g as generateIdempotencyKey, C as CheckoutStatusE, a as PaymentErrorMapper, b as getFieldValues } from './p-CfXDDNW3.js';
|
|
5
|
-
import { P as PaymentMethodMapper, a as PaymentMethodNameE, d as defineCustomElement$B } from './p-
|
|
5
|
+
import { P as PaymentMethodMapper, a as PaymentMethodNameE, d as defineCustomElement$B } from './p-Cb9WV_NL.js';
|
|
6
6
|
import { d as defineCustomElement$9 } from './p-DFtMrdcs.js';
|
|
7
7
|
import { P as PAYMENT_METHOD_ENUM, I as I18nService } from './p-DRQAoEdx.js';
|
|
8
8
|
import { r as renewalState, R as RenewalStore, o as onChange } from './p-DwuPUZ4H.js';
|
|
@@ -15,14 +15,14 @@ import { d as defineCustomElement$y } from './p-Bfdj_YPW.js';
|
|
|
15
15
|
import { d as defineCustomElement$x } from './p-DypoldDs.js';
|
|
16
16
|
import { d as defineCustomElement$w } from './p-D-dSMSHx.js';
|
|
17
17
|
import { d as defineCustomElement$v } from './p-DSgE2Das.js';
|
|
18
|
-
import { d as defineCustomElement$u } from './p-
|
|
18
|
+
import { d as defineCustomElement$u } from './p-Dum_FpHV.js';
|
|
19
19
|
import { d as defineCustomElement$t } from './p-CHFChfES.js';
|
|
20
20
|
import { d as defineCustomElement$s } from './p-fkYjxgpL.js';
|
|
21
21
|
import { d as defineCustomElement$r } from './p-CQSATXJ-.js';
|
|
22
22
|
import { d as defineCustomElement$q } from './p-DtCi6pm2.js';
|
|
23
23
|
import { d as defineCustomElement$o } from './p-Dnq2iRjk.js';
|
|
24
24
|
import { d as defineCustomElement$n } from './p-B8YfMPTn.js';
|
|
25
|
-
import { d as defineCustomElement$m } from './p-
|
|
25
|
+
import { d as defineCustomElement$m } from './p-DgIOuUN1.js';
|
|
26
26
|
import { d as defineCustomElement$l } from './p-N5kDm5Y3.js';
|
|
27
27
|
import { d as defineCustomElement$k } from './p-0Ns-UIj8.js';
|
|
28
28
|
import { d as defineCustomElement$j } from './p-DI3Ig2bh.js';
|
|
@@ -37,11 +37,11 @@ import { d as defineCustomElement$b } from './p-CCuYHwTH.js';
|
|
|
37
37
|
import { d as defineCustomElement$a } from './p-B9tMhFPq.js';
|
|
38
38
|
import { d as defineCustomElement$8 } from './p-DJX9uT_Q.js';
|
|
39
39
|
import { d as defineCustomElement$7 } from './p-DnaF5giI.js';
|
|
40
|
-
import { d as defineCustomElement$6 } from './p-
|
|
40
|
+
import { d as defineCustomElement$6 } from './p-C9MOJKD4.js';
|
|
41
41
|
import { d as defineCustomElement$5 } from './p-EwuVbv9Q.js';
|
|
42
42
|
import { d as defineCustomElement$4 } from './p-CJfuw7NA.js';
|
|
43
43
|
import { d as defineCustomElement$3 } from './p-DGFQ0O94.js';
|
|
44
|
-
import { d as defineCustomElement$2 } from './p-
|
|
44
|
+
import { d as defineCustomElement$2 } from './p-CL6COaBj.js';
|
|
45
45
|
|
|
46
46
|
const getRequiredFields = async (currency, method, organizationId) => {
|
|
47
47
|
const requiredFieldsResponse = await api.checkout.getRequiredFields({
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { R as RenewalSuccessPage$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { R as RenewalSuccessPage$1, d as defineCustomElement$1 } from './p-C9MOJKD4.js';
|
|
2
2
|
|
|
3
3
|
const RenewalSuccessPage = RenewalSuccessPage$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -2,7 +2,7 @@ import { proxyCustomElement, H, h } from './p-8BpuJ_V5.js';
|
|
|
2
2
|
import { I as I18nService, a as SessionStore } from './p-DRQAoEdx.js';
|
|
3
3
|
import { c as create$6 } from './p-MMCcKmy_.js';
|
|
4
4
|
import { L as LOCALES_ENUM } from './p-BzDRvtfU.js';
|
|
5
|
-
import { d as defineCustomElement$9 } from './p-
|
|
5
|
+
import { d as defineCustomElement$9 } from './p-DgIOuUN1.js';
|
|
6
6
|
import { d as defineCustomElement$8 } from './p-BYdcUe6z.js';
|
|
7
7
|
import { d as defineCustomElement$7 } from './p-Cna7Aj_R.js';
|
|
8
8
|
import { d as defineCustomElement$6 } from './p-CTgkZUJ9.js';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { U as UserInformationStatic$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { U as UserInformationStatic$1, d as defineCustomElement$1 } from './p-CL6COaBj.js';
|
|
2
2
|
|
|
3
3
|
const UserInformationStatic = UserInformationStatic$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { U as UserInformation$1, d as defineCustomElement$1 } from './p-
|
|
1
|
+
import { U as UserInformation$1, d as defineCustomElement$1 } from './p-DavSndum.js';
|
|
2
2
|
|
|
3
3
|
const UserInformation = UserInformation$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, h } from './index-D8cwEAmw.js';
|
|
2
2
|
|
|
3
|
-
const buttonCss = ".button{border:1px solid transparent;border-radius:0.375rem;padding:0.75rem 1.5rem;width:100%;font-size:1rem;font-family:inherit;box-shadow:0 2px 4px var(--rebill-color-shadow);cursor:pointer;transition:background 0.2s,\n color 0.2s,\n border-color 0.2s;position:relative;display:flex;align-items:center;justify-content:center}.button.small{padding:4px 8px;font-size:14px;min-height:2rem}.button.medium{padding:0.75rem 1.5rem;font-size:1rem;min-height:2.5rem}.button.large{padding:1rem 2rem;font-size:1.125rem;min-height:3rem}.button.filled.primary{background:var(--rebill-color-primary);color:var(--rebill-color-text-on-primary)}.button.filled.primary:hover{background:var(--rebill-color-primary-hover)}.button.filled.error{background:var(--rebill-color-error);color:var(--rebill-color-text-on-primary)}.button.filled.primary-dark{background:var(--rebill-color-primary-dark);color:var(--rebill-color-text-on-primary)}.button.filled.primary-dark:hover{background:var(--rebill-color-primary-dark-hover)}.button.filled.button.secondary{background:var(--rebill-color-border);color:var(--rebill-color-neutrals-700)}.button.outline{background:transparent;box-shadow:none}.button.outline.primary{border-color:var(--rebill-color-primary);color:var(--rebill-color-primary)}.button.outline.primary:hover{background:var(--rebill-color-primary-light)}.button.outline.primary-dark{border-color:var(--rebill-color-primary-dark);color:var(--rebill-color-primary-dark)}.button.outline.primary-dark:hover{background:var(--rebill-color-primary-dark-light)}.button.outline.error{border-color:var(--rebill-color-error);color:var(--rebill-color-error)}.button.outline.error:hover{background:var(--rebill-color-error-light)}.button.text{background:transparent;box-shadow:none}.button.text.primary{color:var(--rebill-color-primary)}.button.text.primary:hover{background:var(--rebill-color-background-secondary-light)}.button.text.primary-dark{color:var(--rebill-color-primary-dark)}.button.text.primary-dark:hover{background:var(--rebill-color-primary-dark-light)}.button.text.error{color:var(--rebill-color-error)}.button.text.error:hover{background:var(--rebill-color-error-light)}.button.secondary{background:var(--rebill-color-background);color:var(--rebill-color-text-primary);border:1px solid var(--rebill-color-border-primary);border-radius:6px;padding:4px 8px;font-weight:500;font-size:14px;box-sizing:border-box;box-shadow:0px 1px 2px rgba(0, 0, 0, 0.05);font-family:Inter, sans-serif}.button.secondary:hover{background:var(--rebill-color-background-secondary);border-color:var(--rebill-color-border)}.button.download{background:transparent;box-shadow:none;border:none;padding:4px 8px;font-family:Inter, semibold;font-size:12px;font-weight:600;line-height:16px;letter-spacing:0%;color:#000000;cursor:pointer;transition:none;min-height:auto;width:auto}.button.download:hover{background:transparent;color:#000000;transform:none}.button.download:focus{background:transparent;color:#000000;outline:none}.button.download:active{background:transparent;color:#000000;transform:none}.button:disabled{background:var(--rebill-color-disabled);color:var(--rebill-color-text-on-primary);opacity:0.7;cursor:not-allowed;box-shadow:none;border-color:transparent}.button:disabled:hover{background:var(--rebill-color-disabled)}.button.outline:disabled,.button.text:disabled{background:transparent;border-color:var(--rebill-color-disabled, #ccc);color:var(--rebill-color-disabled, #ccc)}.button.outline:disabled:hover,.button.text:disabled:hover{background:transparent}.
|
|
3
|
+
const buttonCss = ".button{border:1px solid transparent;border-radius:0.375rem;padding:0.75rem 1.5rem;width:100%;font-size:1rem;font-family:inherit;box-shadow:0 2px 4px var(--rebill-color-shadow);cursor:pointer;transition:background 0.2s,\n color 0.2s,\n border-color 0.2s;position:relative;display:flex;align-items:center;justify-content:center}.button.small{padding:4px 8px;font-size:14px;min-height:2rem}.button.medium{padding:0.75rem 1.5rem;font-size:1rem;min-height:2.5rem}.button.large{padding:1rem 2rem;font-size:1.125rem;min-height:3rem}.button.filled.primary{background:var(--rebill-color-primary);color:var(--rebill-color-text-on-primary)}.button.filled.primary:hover{background:var(--rebill-color-primary-hover)}.button.filled.error{background:var(--rebill-color-error);color:var(--rebill-color-text-on-primary)}.button.filled.primary-dark{background:var(--rebill-color-primary-dark);color:var(--rebill-color-text-on-primary)}.button.filled.primary-dark:hover{background:var(--rebill-color-primary-dark-hover)}.button.filled.button.secondary{background:var(--rebill-color-border);color:var(--rebill-color-neutrals-700)}.button.outline{background:transparent;box-shadow:none}.button.outline.primary{border-color:var(--rebill-color-primary);color:var(--rebill-color-primary)}.button.outline.primary:hover{background:var(--rebill-color-primary-light)}.button.outline.primary-dark{border-color:var(--rebill-color-primary-dark);color:var(--rebill-color-primary-dark)}.button.outline.primary-dark:hover{background:var(--rebill-color-primary-dark-light)}.button.outline.error{border-color:var(--rebill-color-error);color:var(--rebill-color-error)}.button.outline.error:hover{background:var(--rebill-color-error-light)}.button.text{background:transparent;box-shadow:none}.button.text.primary{color:var(--rebill-color-primary)}.button.text.primary:hover{background:var(--rebill-color-background-secondary-light)}.button.text.primary-dark{color:var(--rebill-color-primary-dark)}.button.text.primary-dark:hover{background:var(--rebill-color-primary-dark-light)}.button.text.error{color:var(--rebill-color-error)}.button.text.error:hover{background:var(--rebill-color-error-light)}.button.secondary{background:var(--rebill-color-background);color:var(--rebill-color-text-primary);border:1px solid var(--rebill-color-border-primary);border-radius:6px;padding:4px 8px;font-weight:500;font-size:14px;box-sizing:border-box;box-shadow:0px 1px 2px rgba(0, 0, 0, 0.05);font-family:Inter, sans-serif}.button.secondary:hover{background:var(--rebill-color-background-secondary);border-color:var(--rebill-color-border)}.button.download{background:transparent;box-shadow:none;border:none;padding:4px 8px;font-family:Inter, semibold;font-size:12px;font-weight:600;line-height:16px;letter-spacing:0%;color:#000000;cursor:pointer;transition:none;min-height:auto;width:auto}.button.download:hover{background:transparent;color:#000000;transform:none}.button.download:focus{background:transparent;color:#000000;outline:none}.button.download:active{background:transparent;color:#000000;transform:none}.button:disabled{background:var(--rebill-color-disabled);color:var(--rebill-color-text-on-primary);opacity:0.7;cursor:not-allowed;box-shadow:none;border-color:transparent}.button:disabled:hover{background:var(--rebill-color-disabled)}.button.outline:disabled,.button.text:disabled{background:transparent;border-color:var(--rebill-color-disabled, #ccc);color:var(--rebill-color-disabled, #ccc)}.button.outline:disabled:hover,.button.text:disabled:hover{background:transparent}.button__spinner{width:15px;height:15px;border:2px solid rgba(255, 255, 255, 0.3);border-radius:50%;border-top-color:white;animation:spin 1s linear infinite;display:inline-block;flex-shrink:0;vertical-align:middle}.button.outline .button__spinner,.button.text .button__spinner{border:2px solid var(--rebill-color-primary-light, rgba(0, 0, 0, 0.1));border-top-color:var(--rebill-color-primary)}.button.outline.primary-dark .button__spinner,.button.text.primary-dark .button__spinner{border:2px solid var(--rebill-color-primary-light, rgba(0, 0, 0, 0.1));border-top-color:var(--rebill-color-primary-dark)}.button.outline.error .button__spinner,.button.text.error .button__spinner{border:2px solid var(--rebill-color-error-light, rgba(0, 0, 0, 0.1));border-top-color:var(--rebill-color-error)}@keyframes spin{to{transform:rotate(360deg)}}.button.spinner-with-text{display:flex !important;align-items:center !important;justify-content:center !important;flex-direction:row !important}.button.spinner-with-text .button__spinner{margin-left:12px;vertical-align:middle}.button.with-icon{display:flex;align-items:center;justify-content:center;gap:0.5rem}.button.secondary.with-icon{font-weight:500}.button.non-clickable{cursor:not-allowed !important;pointer-events:none}";
|
|
4
4
|
|
|
5
5
|
const Button = class {
|
|
6
6
|
constructor(hostRef) {
|
|
@@ -27,7 +27,7 @@ const Button = class {
|
|
|
27
27
|
render() {
|
|
28
28
|
return (h("button", { key: 'fc87b19d501ec07d7729381fb5bca367a766fcab', class: `button ${this.variant} ${this.theme} ${this.size} ${this.loading ? 'loading' : ''} ${this.icon ? 'with-icon' : ''} ${this.showSpinnerWithText && this.loading ? 'spinner-with-text' : ''} ${this.nonClickable ? 'non-clickable' : ''}`, id: this.id, type: this.type, disabled: this.disabled || this.loading, onClick: this.handleClick, style: {
|
|
29
29
|
cursor: this.nonClickable ? 'not-allowed' : undefined,
|
|
30
|
-
} }, this.icon && h("rebill-icon", { key: '11d3d71070a883dd0d0c2528b06d5692aec5d634', name: this.icon, size: "16px", color: this.iconColor }), this.loading && !this.showSpinnerWithText ? (h("div", { class: "
|
|
30
|
+
} }, this.icon && h("rebill-icon", { key: '11d3d71070a883dd0d0c2528b06d5692aec5d634', name: this.icon, size: "16px", color: this.iconColor }), this.loading && !this.showSpinnerWithText ? (h("div", { class: "button__spinner" })) : this.loading && this.showSpinnerWithText ? (h(h.Fragment, null, h("slot", null), h("div", { class: "button__spinner" }))) : (h("slot", null))));
|
|
31
31
|
}
|
|
32
32
|
};
|
|
33
33
|
Button.style = buttonCss;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"rebill-button.entry.js","sources":["src/components/shared/button/button.css?tag=rebill-button","src/components/shared/button/button.tsx"],"sourcesContent":[".button {\n border: 1px solid transparent;\n border-radius: 0.375rem;\n padding: 0.75rem 1.5rem;\n width: 100%;\n font-size: 1rem;\n font-family: inherit;\n box-shadow: 0 2px 4px var(--rebill-color-shadow);\n cursor: pointer;\n transition:\n background 0.2s,\n color 0.2s,\n border-color 0.2s;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n/* Size variants */\n.button.small {\n padding: 4px 8px;\n font-size: 14px;\n min-height: 2rem;\n}\n\n.button.medium {\n padding: 0.75rem 1.5rem;\n font-size: 1rem;\n min-height: 2.5rem;\n}\n\n.button.large {\n padding: 1rem 2rem;\n font-size: 1.125rem;\n min-height: 3rem;\n}\n/* Filled variant */\n.button.filled.primary {\n background: var(--rebill-color-primary);\n color: var(--rebill-color-text-on-primary);\n}\n.button.filled.primary:hover {\n background: var(--rebill-color-primary-hover);\n}\n.button.filled.error {\n background: var(--rebill-color-error);\n color: var(--rebill-color-text-on-primary);\n}\n.button.filled.primary-dark {\n background: var(--rebill-color-primary-dark);\n color: var(--rebill-color-text-on-primary);\n}\n.button.filled.primary-dark:hover {\n background: var(--rebill-color-primary-dark-hover);\n}\n\n.button.filled.button.secondary {\n background: var(--rebill-color-border);\n color: var(--rebill-color-neutrals-700);\n}\n\n/* Outline variant */\n.button.outline {\n background: transparent;\n box-shadow: none;\n}\n.button.outline.primary {\n border-color: var(--rebill-color-primary);\n color: var(--rebill-color-primary);\n}\n.button.outline.primary:hover {\n background: var(--rebill-color-primary-light);\n}\n.button.outline.primary-dark {\n border-color: var(--rebill-color-primary-dark);\n color: var(--rebill-color-primary-dark);\n}\n.button.outline.primary-dark:hover {\n background: var(--rebill-color-primary-dark-light);\n}\n.button.outline.error {\n border-color: var(--rebill-color-error);\n color: var(--rebill-color-error);\n}\n.button.outline.error:hover {\n background: var(--rebill-color-error-light);\n}\n\n/* Text variant */\n.button.text {\n background: transparent;\n box-shadow: none;\n}\n.button.text.primary {\n color: var(--rebill-color-primary);\n}\n.button.text.primary:hover {\n background: var(--rebill-color-background-secondary-light);\n}\n.button.text.primary-dark {\n color: var(--rebill-color-primary-dark);\n}\n.button.text.primary-dark:hover {\n background: var(--rebill-color-primary-dark-light);\n}\n.button.text.error {\n color: var(--rebill-color-error);\n}\n.button.text.error:hover {\n background: var(--rebill-color-error-light);\n}\n\n/* Secundary variant */\n.button.secondary {\n background: var(--rebill-color-background);\n color: var(--rebill-color-text-primary);\n border: 1px solid var(--rebill-color-border-primary);\n border-radius: 6px;\n padding: 4px 8px;\n font-weight: 500;\n font-size: 14px;\n box-sizing: border-box;\n box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05);\n font-family: Inter, sans-serif;\n}\n.button.secondary:hover {\n background: var(--rebill-color-background-secondary);\n border-color: var(--rebill-color-border);\n}\n/* Download variant */\n.button.download {\n background: transparent;\n box-shadow: none;\n border: none;\n padding: 4px 8px;\n font-family: Inter, semibold;\n font-size: 12px;\n font-weight: 600;\n line-height: 16px;\n letter-spacing: 0%;\n color: #000000;\n cursor: pointer;\n transition: none;\n min-height: auto;\n width: auto;\n}\n\n.button.download:hover {\n background: transparent;\n color: #000000;\n transform: none;\n}\n\n.button.download:focus {\n background: transparent;\n color: #000000;\n outline: none;\n}\n\n.button.download:active {\n background: transparent;\n color: #000000;\n transform: none;\n}\n\n/* Button */\n.button:disabled {\n background: var(--rebill-color-disabled);\n color: var(--rebill-color-text-on-primary);\n opacity: 0.7;\n cursor: not-allowed;\n box-shadow: none;\n border-color: transparent;\n}\n\n.button:disabled:hover {\n background: var(--rebill-color-disabled);\n}\n\n.button.outline:disabled,\n.button.text:disabled {\n background: transparent;\n border-color: var(--rebill-color-disabled, #ccc);\n color: var(--rebill-color-disabled, #ccc);\n}\n\n.button.outline:disabled:hover,\n.button.text:disabled:hover {\n background: transparent;\n}\n\n.
|
|
1
|
+
{"version":3,"file":"rebill-button.entry.js","sources":["src/components/shared/button/button.css?tag=rebill-button","src/components/shared/button/button.tsx"],"sourcesContent":[".button {\n border: 1px solid transparent;\n border-radius: 0.375rem;\n padding: 0.75rem 1.5rem;\n width: 100%;\n font-size: 1rem;\n font-family: inherit;\n box-shadow: 0 2px 4px var(--rebill-color-shadow);\n cursor: pointer;\n transition:\n background 0.2s,\n color 0.2s,\n border-color 0.2s;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n/* Size variants */\n.button.small {\n padding: 4px 8px;\n font-size: 14px;\n min-height: 2rem;\n}\n\n.button.medium {\n padding: 0.75rem 1.5rem;\n font-size: 1rem;\n min-height: 2.5rem;\n}\n\n.button.large {\n padding: 1rem 2rem;\n font-size: 1.125rem;\n min-height: 3rem;\n}\n/* Filled variant */\n.button.filled.primary {\n background: var(--rebill-color-primary);\n color: var(--rebill-color-text-on-primary);\n}\n.button.filled.primary:hover {\n background: var(--rebill-color-primary-hover);\n}\n.button.filled.error {\n background: var(--rebill-color-error);\n color: var(--rebill-color-text-on-primary);\n}\n.button.filled.primary-dark {\n background: var(--rebill-color-primary-dark);\n color: var(--rebill-color-text-on-primary);\n}\n.button.filled.primary-dark:hover {\n background: var(--rebill-color-primary-dark-hover);\n}\n\n.button.filled.button.secondary {\n background: var(--rebill-color-border);\n color: var(--rebill-color-neutrals-700);\n}\n\n/* Outline variant */\n.button.outline {\n background: transparent;\n box-shadow: none;\n}\n.button.outline.primary {\n border-color: var(--rebill-color-primary);\n color: var(--rebill-color-primary);\n}\n.button.outline.primary:hover {\n background: var(--rebill-color-primary-light);\n}\n.button.outline.primary-dark {\n border-color: var(--rebill-color-primary-dark);\n color: var(--rebill-color-primary-dark);\n}\n.button.outline.primary-dark:hover {\n background: var(--rebill-color-primary-dark-light);\n}\n.button.outline.error {\n border-color: var(--rebill-color-error);\n color: var(--rebill-color-error);\n}\n.button.outline.error:hover {\n background: var(--rebill-color-error-light);\n}\n\n/* Text variant */\n.button.text {\n background: transparent;\n box-shadow: none;\n}\n.button.text.primary {\n color: var(--rebill-color-primary);\n}\n.button.text.primary:hover {\n background: var(--rebill-color-background-secondary-light);\n}\n.button.text.primary-dark {\n color: var(--rebill-color-primary-dark);\n}\n.button.text.primary-dark:hover {\n background: var(--rebill-color-primary-dark-light);\n}\n.button.text.error {\n color: var(--rebill-color-error);\n}\n.button.text.error:hover {\n background: var(--rebill-color-error-light);\n}\n\n/* Secundary variant */\n.button.secondary {\n background: var(--rebill-color-background);\n color: var(--rebill-color-text-primary);\n border: 1px solid var(--rebill-color-border-primary);\n border-radius: 6px;\n padding: 4px 8px;\n font-weight: 500;\n font-size: 14px;\n box-sizing: border-box;\n box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05);\n font-family: Inter, sans-serif;\n}\n.button.secondary:hover {\n background: var(--rebill-color-background-secondary);\n border-color: var(--rebill-color-border);\n}\n/* Download variant */\n.button.download {\n background: transparent;\n box-shadow: none;\n border: none;\n padding: 4px 8px;\n font-family: Inter, semibold;\n font-size: 12px;\n font-weight: 600;\n line-height: 16px;\n letter-spacing: 0%;\n color: #000000;\n cursor: pointer;\n transition: none;\n min-height: auto;\n width: auto;\n}\n\n.button.download:hover {\n background: transparent;\n color: #000000;\n transform: none;\n}\n\n.button.download:focus {\n background: transparent;\n color: #000000;\n outline: none;\n}\n\n.button.download:active {\n background: transparent;\n color: #000000;\n transform: none;\n}\n\n/* Button */\n.button:disabled {\n background: var(--rebill-color-disabled);\n color: var(--rebill-color-text-on-primary);\n opacity: 0.7;\n cursor: not-allowed;\n box-shadow: none;\n border-color: transparent;\n}\n\n.button:disabled:hover {\n background: var(--rebill-color-disabled);\n}\n\n.button.outline:disabled,\n.button.text:disabled {\n background: transparent;\n border-color: var(--rebill-color-disabled, #ccc);\n color: var(--rebill-color-disabled, #ccc);\n}\n\n.button.outline:disabled:hover,\n.button.text:disabled:hover {\n background: transparent;\n}\n\n.button__spinner {\n width: 15px;\n height: 15px;\n border: 2px solid rgba(255, 255, 255, 0.3);\n border-radius: 50%;\n border-top-color: white;\n animation: spin 1s linear infinite;\n display: inline-block;\n flex-shrink: 0;\n vertical-align: middle;\n}\n\n.button.outline .button__spinner,\n.button.text .button__spinner {\n border: 2px solid var(--rebill-color-primary-light, rgba(0, 0, 0, 0.1));\n border-top-color: var(--rebill-color-primary);\n}\n\n.button.outline.primary-dark .button__spinner,\n.button.text.primary-dark .button__spinner {\n border: 2px solid var(--rebill-color-primary-light, rgba(0, 0, 0, 0.1));\n border-top-color: var(--rebill-color-primary-dark);\n}\n\n.button.outline.error .button__spinner,\n.button.text.error .button__spinner {\n border: 2px solid var(--rebill-color-error-light, rgba(0, 0, 0, 0.1));\n border-top-color: var(--rebill-color-error);\n}\n\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n\n/* Spinner with text styles */\n.button.spinner-with-text {\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n\n flex-direction: row !important;\n}\n\n.button.spinner-with-text .button__spinner {\n margin-left: 12px;\n vertical-align: middle;\n}\n\n/* Icon styles */\n.button.with-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n}\n\n.button.secondary.with-icon {\n font-weight: 500;\n}\n\n.button.non-clickable {\n cursor: not-allowed !important;\n pointer-events: none;\n}\n","import { Component, h, Prop } from '@stencil/core';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\nimport '../icon/icon';\nimport './button.css';\n\n@Component({\n tag: 'rebill-button',\n styleUrl: 'button.css',\n shadow: false,\n})\nexport class Button {\n @Prop() type: 'button' | 'submit' | 'reset' = 'button';\n @Prop() disabled = false;\n @Prop() id: string;\n @Prop() loading = false;\n @Prop() showSpinnerWithText = false;\n @Prop() nonClickable = false;\n @Prop() variant: 'filled' | 'outline' | 'secondary' | 'text' | 'download' = 'filled';\n @Prop() theme: 'primary' | 'error' | 'primary-dark' | 'secondary' = 'primary';\n @Prop() size: 'small' | 'medium' | 'large' = 'medium';\n @Prop() icon?: string;\n @Prop() iconColor: COLORS_ENUM;\n\n private handleClick(event: Event) {\n if (this.nonClickable) {\n event.preventDefault();\n event.stopPropagation();\n return false;\n }\n }\n\n render() {\n return (\n <button\n class={`button ${this.variant} ${this.theme} ${this.size} ${this.loading ? 'loading' : ''} ${this.icon ? 'with-icon' : ''} ${this.showSpinnerWithText && this.loading ? 'spinner-with-text' : ''} ${this.nonClickable ? 'non-clickable' : ''}`}\n id={this.id}\n type={this.type}\n disabled={this.disabled || this.loading}\n onClick={this.handleClick}\n style={{\n cursor: this.nonClickable ? 'not-allowed' : undefined,\n }}\n >\n {this.icon && <rebill-icon name={this.icon} size=\"16px\" color={this.iconColor} />}\n {this.loading && !this.showSpinnerWithText ? (\n <div class=\"button__spinner\"></div>\n ) : this.loading && this.showSpinnerWithText ? (\n <>\n <slot></slot>\n <div class=\"button__spinner\"></div>\n </>\n ) : (\n <slot></slot>\n )}\n </button>\n );\n }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,SAAS,GAAG,ssJAAssJ;;MCU3sJ,MAAM,GAAA,MAAA;;;;IACT,IAAI,GAAkC,QAAQ;IAC9C,QAAQ,GAAG,KAAK;AAChB,IAAA,EAAE;IACF,OAAO,GAAG,KAAK;IACf,mBAAmB,GAAG,KAAK;IAC3B,YAAY,GAAG,KAAK;IACpB,OAAO,GAA6D,QAAQ;IAC5E,KAAK,GAAuD,SAAS;IACrE,IAAI,GAAiC,QAAQ;AAC7C,IAAA,IAAI;AACJ,IAAA,SAAS;AAET,IAAA,WAAW,CAAC,KAAY,EAAA;AAC9B,QAAA,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,KAAK,CAAC,cAAc,EAAE;YACtB,KAAK,CAAC,eAAe,EAAE;AACvB,YAAA,OAAO,KAAK;;;IAIhB,MAAM,GAAA;QACJ,QACE,+DACE,KAAK,EAAE,CAAU,OAAA,EAAA,IAAI,CAAC,OAAO,CAAI,CAAA,EAAA,IAAI,CAAC,KAAK,CAAA,CAAA,EAAI,IAAI,CAAC,IAAI,CAAA,CAAA,EAAI,IAAI,CAAC,OAAO,GAAG,SAAS,GAAG,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,IAAI,GAAG,WAAW,GAAG,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,mBAAmB,IAAI,IAAI,CAAC,OAAO,GAAG,mBAAmB,GAAG,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,YAAY,GAAG,eAAe,GAAG,EAAE,CAAA,CAAE,EAC9O,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,EACvC,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,KAAK,EAAE;gBACL,MAAM,EAAE,IAAI,CAAC,YAAY,GAAG,aAAa,GAAG,SAAS;aACtD,EAAA,EAEA,IAAI,CAAC,IAAI,IAAI,oEAAa,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,CAAC,SAAS,EAAI,CAAA,EAChF,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,mBAAmB,IACxC,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,iBAAiB,EAAO,CAAA,IACjC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,mBAAmB,IAC1C,CAAA,CAAA,CAAA,CAAA,QAAA,EAAA,IAAA,EACE,CAAa,CAAA,MAAA,EAAA,IAAA,CAAA,EACb,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,iBAAiB,EAAA,CAAO,CAClC,KAEH,CAAA,CAAA,MAAA,EAAA,IAAA,CAAa,CACd,CACM;;;;;;;"}
|
|
@@ -320,36 +320,36 @@ const RebillCheckout = class {
|
|
|
320
320
|
const customerInformation = this.parsedCustomerInformation;
|
|
321
321
|
return {
|
|
322
322
|
// Email
|
|
323
|
-
'email': formData
|
|
323
|
+
'email': formData?.email || customerInformation?.email || sessionUserInfo.email,
|
|
324
324
|
// Full name
|
|
325
|
-
'fullName': formData
|
|
325
|
+
'fullName': formData?.fullName || customerInformation?.fullName || sessionUserInfo.fullName,
|
|
326
326
|
// Phone
|
|
327
|
-
'countryCodePhoneNumber': formData
|
|
327
|
+
'countryCodePhoneNumber': formData?.countryCodePhoneNumber ||
|
|
328
328
|
customerInformation?.phoneNumber?.countryCode ||
|
|
329
329
|
customerInformation?.countryCode ||
|
|
330
330
|
sessionUserInfo.countryCode,
|
|
331
|
-
'phoneNumber': formData
|
|
331
|
+
'phoneNumber': formData?.phoneNumber ||
|
|
332
332
|
customerInformation?.phoneNumber?.number ||
|
|
333
333
|
sessionUserInfo.phoneNumber,
|
|
334
334
|
// Document
|
|
335
|
-
'documentType': formData
|
|
336
|
-
'documentNumber': formData
|
|
335
|
+
'documentType': formData?.documentType || customerInformation?.documentType || sessionUserInfo.documentType,
|
|
336
|
+
'documentNumber': formData?.documentNumber ||
|
|
337
337
|
customerInformation?.documentNumber ||
|
|
338
338
|
sessionUserInfo.documentNumber,
|
|
339
339
|
// Billing address
|
|
340
|
-
'billing-country': formData['billing-country'] ||
|
|
340
|
+
'billing-country': formData?.['billing-country'] ||
|
|
341
341
|
customerInformation?.address?.billingAddress?.country ||
|
|
342
342
|
sessionUserInfo.address?.billingAddress?.country,
|
|
343
|
-
'billing-state': formData['billing-state'] ||
|
|
343
|
+
'billing-state': formData?.['billing-state'] ||
|
|
344
344
|
customerInformation?.address?.billingAddress?.state ||
|
|
345
345
|
sessionUserInfo.address?.billingAddress?.state,
|
|
346
|
-
'billing-address': formData['billing-address'] ||
|
|
346
|
+
'billing-address': formData?.['billing-address'] ||
|
|
347
347
|
customerInformation?.address?.billingAddress?.address ||
|
|
348
348
|
sessionUserInfo.address?.billingAddress?.address,
|
|
349
|
-
'billing-city': formData['billing-city'] ||
|
|
349
|
+
'billing-city': formData?.['billing-city'] ||
|
|
350
350
|
customerInformation?.address?.billingAddress?.city ||
|
|
351
351
|
sessionUserInfo.address?.billingAddress?.city,
|
|
352
|
-
'billing-zip': formData['billing-zip'] ||
|
|
352
|
+
'billing-zip': formData?.['billing-zip'] ||
|
|
353
353
|
customerInformation?.address?.billingAddress?.zip ||
|
|
354
354
|
sessionUserInfo.address?.billingAddress?.zip,
|
|
355
355
|
};
|
|
@@ -713,6 +713,7 @@ const RebillCheckout = class {
|
|
|
713
713
|
}
|
|
714
714
|
async handleSubmitAPM(data) {
|
|
715
715
|
// Only handle cash and transfer payments for now
|
|
716
|
+
console.log('handleSubmitAPM', this.currentPaymentMethod);
|
|
716
717
|
if (this.currentPaymentMethod !== PAYMENT_METHOD_ENUM.CASH &&
|
|
717
718
|
this.currentPaymentMethod !== PAYMENT_METHOD_ENUM.BANK_TRANSFER) {
|
|
718
719
|
return;
|
|
@@ -1010,8 +1011,8 @@ const RebillCheckout = class {
|
|
|
1010
1011
|
label: country.country,
|
|
1011
1012
|
value: country.isoCountryCode,
|
|
1012
1013
|
}));
|
|
1013
|
-
const renderRebillSummary = (props = {}) => (h("rebill-summary", { key: '
|
|
1014
|
-
return (state.isInitialized && (h(h.Fragment, null, this.showRefreshModal && h("rebill-modal-overlay", { key: '
|
|
1014
|
+
const renderRebillSummary = (props = {}) => (h("rebill-summary", { key: '6b146657e3d9f93d213fafd3b09738ec48b89dd0', totalAmount: state.data.pricing.total, currency: state.data.pricing.currency, itemTitle: state._session?.getTitle(), itemDescription: state._session?.getDescription(), itemAmount: state.data.pricing.subtotal, subtotal: state.data.pricing.subtotal, allowCoupon: state._session?.getAllowCoupon(this.displayConfig), currentBreakpoint: this.breakpoint, planFrequency: state._session?.getPlanFrequency(), planFrequencyCount: state._session?.getPlanFrequencyCount(), discountType: state.data.discount.discountType, discountedPercentage: state.data.discount.discountedPercentage, discountDuration: state.data.discount.discountDuration, discountAmount: state.data.discount.discountAmount, ...props }));
|
|
1015
|
+
return (state.isInitialized && (h(h.Fragment, null, this.showRefreshModal && h("rebill-modal-overlay", { key: 'd13b30218fbe185f4971e58b5af195c5fda576d0' }), this.displayConfig.processingPayment && (h("rebill-processing-payment", { key: '18f514e8c1382affe1155ec74332d592a5d8ac39', style: { display: this.isCardSubmitting ? 'block' : 'none' } })), this.displayConfig.successPage &&
|
|
1015
1016
|
this.isPaymentApproved() &&
|
|
1016
1017
|
state.isInitialized ? (h("success-page", { typePaymentMethod: state.data.paymentMethodSelected, paymentMethodName: PaymentMethodMapper.mapToAPMPaymentMethod(state.data.paymentMethodSelected ||
|
|
1017
1018
|
state.data.payment?.paymentMethodType, state.data?.pricing?.country), country: state.data?.pricing?.country, bank: state.data.payment?.paymentMethodMetadata?.bank ||
|