rebill-web-components-sdk 1.8.33 → 1.8.34-beta.0

package/dist/collection/components/checkout/discount-coupon/discount-coupon.js

@@ -13,6 +13,10 @@ var ACTION_STATUS;
 export class DiscountCoupon {
     el;
     hideLabel = false;
+    displayMode = 'editable';
+    readonlyCouponCode;
+    readonlyDiscountAmount;
+    readonlyCurrency;
     couponCode = '';
     actionStatus = ACTION_STATUS.NOT_APPLIED;
     isLoading = false;
@@ -25,6 +29,9 @@ export class DiscountCoupon {
         this.unsubscribeCurrentLocaleStore = SessionStore.onChange('currentLocale', () => {
             this.currentLocale = sessionState.currentLocale;
         });
+        if (this.readonlyCouponCode) {
+            return;
+        }
         if (sessionState.data.pricing.discountCouponCode &&
             sessionState.data.pricing.discountAmount > 0) {
             this.actionStatus = ACTION_STATUS.APPLIED;
@@ -37,6 +44,9 @@ export class DiscountCoupon {
         }
     }
     componentDidUpdate() {
+        if (this.readonlyCouponCode) {
+            return;
+        }
         if (this.actionStatus === ACTION_STATUS.EDITING && this.inputRef) {
             setTimeout(async () => {
                 const inputElement = await this.inputRef.getInputElement();
@@ -47,6 +57,8 @@ export class DiscountCoupon {
         }
     }
     async onApplyCoupon() {
+        if (this.readonlyCouponCode)
+            return;
         const sessionId = sessionState.data.sessionId;
         if (!sessionId) {
             return;
@@ -81,15 +93,26 @@ export class DiscountCoupon {
         }
     }
     onCancelCoupon() {
+        if (this.readonlyCouponCode)
+            return;
         this.actionStatus = ACTION_STATUS.NOT_APPLIED;
         this.couponCode = '';
         this.isError = false;
     }
+    renderReadonlyView() {
+        if (!this.readonlyCouponCode && this.readonlyDiscountAmount) {
+            return null;
+        }
+        return (h("div", { class: "coupon-chip coupon-chip--readonly" }, h("rebill-icon", { name: "tag-sale", size: "16px" }), h("div", { class: "coupon-content" }, h("rebill-typography", { variant: "overline", color: COLORS_ENUM.PRIMARY_DARK_TEXT }, this.readonlyCouponCode), this.readonlyDiscountAmount && (h("rebill-typography", { variant: "overline", color: COLORS_ENUM.GREEN }, "-$", formatAmountWithoutCurrency(this.readonlyDiscountAmount, this.readonlyCurrency))))));
+    }
     render() {
-        return (h("div", { key: '366d010b25c95f9151cab93b7ab0179ab063918e' }, h("div", { key: '341105a1170a0b823c2c3338dafe3b1d8f628119', class: "summary-row", style: {
+        if (this.readonlyCouponCode) {
+            return this.renderReadonlyView();
+        }
+        return (h("div", null, h("div", { class: "summary-row", style: {
                 alignItems: this.actionStatus === ACTION_STATUS.EDITING ? 'flex-start' : 'center',
                 display: 'flex',
-            } }, !this.hideLabel && (h("rebill-typography", { key: '2b6a9fa53506c0c80a7e59c258f3ea80e4fa0b31', variant: "body2", style: { marginTop: this.actionStatus === ACTION_STATUS.EDITING ? '7px' : '0px' } }, I18nService.translate('discountCoupons.discount'))), this.actionStatus === ACTION_STATUS.NOT_APPLIED && (h("rebill-button", { key: '2259ac442f6dba32bf0a1442670f51a1f3a55332', variant: "filled", size: "small", theme: "primary-dark", onClick: () => (this.actionStatus = ACTION_STATUS.EDITING) }, I18nService.translate('discountCoupons.addDiscount'))), this.actionStatus === ACTION_STATUS.EDITING && (h("div", { key: '008458abeaaf911a86dc451576dd2833cef3687b', class: "summary-row", style: { alignItems: 'flex-start', display: 'flex' } }, h("rebill-input-text", { key: 'd77c4576379dcd8d31d443a63350680894ea8605', ref: el => (this.inputRef = el), id: "discountCoupon", value: this.couponCode, placeholder: I18nService.translate('discountCoupons.addDiscount'), disabled: this.isLoading, error: this.isError ? I18nService.translate('discountCoupons.error') : '', clearable: true, uppercase: true, onInput: e => {
+            } }, !this.hideLabel && (h("rebill-typography", { variant: "body2", style: { marginTop: this.actionStatus === ACTION_STATUS.EDITING ? '7px' : '0px' } }, I18nService.translate('discountCoupons.discount'))), this.actionStatus === ACTION_STATUS.NOT_APPLIED && (h("rebill-button", { variant: "filled", size: "small", theme: "primary-dark", onClick: () => (this.actionStatus = ACTION_STATUS.EDITING) }, I18nService.translate('discountCoupons.addDiscount'))), this.actionStatus === ACTION_STATUS.EDITING && (h("div", { class: "summary-row", style: { alignItems: 'flex-start', display: 'flex' } }, h("rebill-input-text", { ref: el => (this.inputRef = el), id: "discountCoupon", value: this.couponCode, placeholder: I18nService.translate('discountCoupons.addDiscount'), disabled: this.isLoading, error: this.isError ? I18nService.translate('discountCoupons.error') : '', clearable: true, uppercase: true, onInput: e => {
                 e.stopPropagation();
                 if (e.detail && e.detail.value !== undefined) {
                     this.couponCode = e.detail.value;
@@ -98,12 +121,12 @@ export class DiscountCoupon {
                 if (!this.couponCode.trim()) {
                     this.onCancelCoupon();
                 }
-            } }), h("rebill-button", { key: 'c443f099eaa744021781e71eefb311431cc98bc6', variant: "filled", theme: "primary-dark", size: "small", loading: this.isLoading, disabled: this.isLoading || !this.couponCode.trim(), onClick: () => this.onApplyCoupon(), style: { marginTop: this.actionStatus === ACTION_STATUS.EDITING ? '3px' : '0px' } }, I18nService.translate('discountCoupons.apply')))), this.actionStatus === ACTION_STATUS.APPLIED && (h("div", { key: 'db15499dd129d7135ee34794aadacde986e54068', class: "coupon-chip" }, h("rebill-icon", { key: 'cf1ec0d39155845385c14e98734b0d6cf12eb10a', name: "tag-sale", size: "16px" }), h("div", { key: '69643045112e2867e0fa940fbd960e351fa22395', class: "coupon-content", onClick: () => (this.actionStatus = ACTION_STATUS.EDITING) }, h("rebill-typography", { key: '317e333aa0bd3ffba9958972743e339dac26d7d0', variant: "overline", color: COLORS_ENUM.PRIMARY_DARK_TEXT }, sessionState.data.pricing.discountCouponCode), h("rebill-typography", { key: '2b1e784de8842f3b224e3d53e2a8b4281d29a3fb', variant: "overline", color: COLORS_ENUM.GREEN }, "-$", formatAmountWithoutCurrency(sessionState.data.pricing.discountAmount, sessionState.data.pricing.currency))), h("div", { key: '5f539771bef0794592c23cbe15be07b8d11ee9ae', class: "coupon-close", onClick: () => {
+            } }), h("rebill-button", { variant: "filled", theme: "primary-dark", size: "small", loading: this.isLoading, disabled: this.isLoading || !this.couponCode.trim(), onClick: () => this.onApplyCoupon(), style: { marginTop: this.actionStatus === ACTION_STATUS.EDITING ? '3px' : '0px' } }, I18nService.translate('discountCoupons.apply')))), this.actionStatus === ACTION_STATUS.APPLIED && (h("div", { class: "coupon-chip" }, h("rebill-icon", { name: "tag-sale", size: "16px" }), h("div", { class: "coupon-content", onClick: () => (this.actionStatus = ACTION_STATUS.EDITING) }, h("rebill-typography", { variant: "overline", color: COLORS_ENUM.PRIMARY_DARK_TEXT }, sessionState.data.pricing.discountCouponCode), h("rebill-typography", { variant: "overline", color: COLORS_ENUM.GREEN }, "-$", formatAmountWithoutCurrency(sessionState.data.pricing.discountAmount, sessionState.data.pricing.currency))), h("div", { class: "coupon-close", onClick: () => {
                 this.actionStatus = ACTION_STATUS.NOT_APPLIED;
                 this.couponCode = '';
                 SessionStore.setDiscount(null);
                 this.discountApplied.emit(false);
-            } }, h("rebill-icon", { key: '00137566f4c61517a10aa86374f9359a1e291051', name: "x", size: "20px", color: COLORS_ENUM.PRIMARY_DARK_TEXT })))))));
+            } }, h("rebill-icon", { name: "x", size: "20px", color: COLORS_ENUM.PRIMARY_DARK_TEXT })))))));
     }
     static get is() { return "discount-coupon"; }
     static get originalStyleUrls() {
@@ -137,6 +160,83 @@ export class DiscountCoupon {
                 "reflect": false,
                 "attribute": "hide-label",
                 "defaultValue": "false"
+            },
+            "displayMode": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'editable' | 'readonly'",
+                    "resolved": "\"editable\" | \"readonly\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "display-mode",
+                "defaultValue": "'editable'"
+            },
+            "readonlyCouponCode": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "readonly-coupon-code"
+            },
+            "readonlyDiscountAmount": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "readonly-discount-amount"
+            },
+            "readonlyCurrency": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "readonly-currency"
             }
         };
     }

package/dist/collection/components/checkout/discount-coupon/discount-coupon.js.map

@@ -1 +1 @@
-{"version":3,"file":"discount-coupon.js","sourceRoot":"","sources":["../../../../src/components/checkout/discount-coupon/discount-coupon.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Prop, State } from '@stencil/core';\nimport { api } from '../../../api';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { sessionState, SessionStore } from '../../../store/session.store';\nimport { formatAmountWithoutCurrency } from '../../../utils';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\n\nenum ACTION_STATUS {\n  EDITING = 'editing',\n  APPLIED = 'applied',\n  NOT_APPLIED = 'not_applied',\n}\n\n@Component({\n  tag: 'discount-coupon',\n  styleUrl: 'discount-coupon.css',\n  shadow: false,\n})\nexport class DiscountCoupon {\n  @Element() el: HTMLElement;\n  @Prop() hideLabel: boolean = false;\n  @State() couponCode: string = '';\n  @State() actionStatus: ACTION_STATUS = ACTION_STATUS.NOT_APPLIED;\n  @State() isLoading: boolean = false;\n  @State() isError: boolean = false;\n  @State() currentLocale: string = sessionState.currentLocale;\n  @Event() discountApplied: EventEmitter<boolean>;\n  private inputRef: HTMLRebillInputTextElement;\n  private unsubscribeCurrentLocaleStore?: () => void;\n\n  componentWillLoad() {\n    this.unsubscribeCurrentLocaleStore = SessionStore.onChange('currentLocale', () => {\n      this.currentLocale = sessionState.currentLocale;\n    });\n\n    if (\n      sessionState.data.pricing.discountCouponCode &&\n      sessionState.data.pricing.discountAmount > 0\n    ) {\n      this.actionStatus = ACTION_STATUS.APPLIED;\n      this.couponCode = sessionState.data.pricing.discountCouponCode;\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.unsubscribeCurrentLocaleStore) {\n      this.unsubscribeCurrentLocaleStore();\n    }\n  }\n  componentDidUpdate() {\n    if (this.actionStatus === ACTION_STATUS.EDITING && this.inputRef) {\n      setTimeout(async () => {\n        const inputElement = await this.inputRef.getInputElement();\n        if (inputElement) {\n          inputElement.focus();\n        }\n      }, 0);\n    }\n  }\n\n  private async onApplyCoupon() {\n    const sessionId = sessionState.data.sessionId;\n    if (!sessionId) {\n      return;\n    }\n    this.isLoading = true;\n    try {\n      const response = await api.discountCoupon.applyDiscountCoupon({\n        couponCode: this.couponCode,\n        quantity: 1,\n        sessionId: sessionId,\n        organizationId: sessionState.data.organization.id,\n      });\n      this.actionStatus = ACTION_STATUS.APPLIED;\n      SessionStore.setDiscount({\n        couponCode: this.couponCode,\n        amount: response.amount,\n        discountType: response.discountType,\n        discountAmount: response.discountedAmount,\n        discountedPercentage: response?.discountedPercentage || 0,\n        discountDuration: response?.discountDuration || null,\n      });\n      this.discountApplied.emit(true);\n    } catch (error) {\n      this.actionStatus = ACTION_STATUS.EDITING;\n      this.discountApplied.emit(false);\n      this.isError = true;\n      SessionStore.setDiscount(null);\n    } finally {\n      this.isLoading = false;\n    }\n  }\n\n  private onCancelCoupon() {\n    this.actionStatus = ACTION_STATUS.NOT_APPLIED;\n    this.couponCode = '';\n    this.isError = false;\n  }\n\n  render() {\n    return (\n      <div>\n        <div\n          class=\"summary-row\"\n          style={{\n            alignItems: this.actionStatus === ACTION_STATUS.EDITING ? 'flex-start' : 'center',\n            display: 'flex',\n          }}\n        >\n          {!this.hideLabel && (\n            <rebill-typography\n              variant=\"body2\"\n              style={{ marginTop: this.actionStatus === ACTION_STATUS.EDITING ? '7px' : '0px' }}\n            >\n              {I18nService.translate('discountCoupons.discount')}\n            </rebill-typography>\n          )}\n          {this.actionStatus === ACTION_STATUS.NOT_APPLIED && (\n            <rebill-button\n              variant=\"filled\"\n              size=\"small\"\n              theme=\"primary-dark\"\n              onClick={() => (this.actionStatus = ACTION_STATUS.EDITING)}\n            >\n              {I18nService.translate('discountCoupons.addDiscount')}\n            </rebill-button>\n          )}\n          {this.actionStatus === ACTION_STATUS.EDITING && (\n            <div class=\"summary-row\" style={{ alignItems: 'flex-start', display: 'flex' }}>\n              <rebill-input-text\n                ref={el => (this.inputRef = el)}\n                id=\"discountCoupon\"\n                value={this.couponCode}\n                placeholder={I18nService.translate('discountCoupons.addDiscount')}\n                disabled={this.isLoading}\n                error={this.isError ? I18nService.translate('discountCoupons.error') : ''}\n                clearable={true}\n                uppercase={true}\n                onInput={e => {\n                  e.stopPropagation();\n                  if (e.detail && e.detail.value !== undefined) {\n                    this.couponCode = e.detail.value;\n                  }\n                }}\n                onBlur={() => {\n                  if (!this.couponCode.trim()) {\n                    this.onCancelCoupon();\n                  }\n                }}\n              />\n              <rebill-button\n                variant=\"filled\"\n                theme=\"primary-dark\"\n                size=\"small\"\n                loading={this.isLoading}\n                disabled={this.isLoading || !this.couponCode.trim()}\n                onClick={() => this.onApplyCoupon()}\n                style={{ marginTop: this.actionStatus === ACTION_STATUS.EDITING ? '3px' : '0px' }}\n              >\n                {I18nService.translate('discountCoupons.apply')}\n              </rebill-button>\n            </div>\n          )}\n          {this.actionStatus === ACTION_STATUS.APPLIED && (\n            <div class=\"coupon-chip\">\n              <rebill-icon name=\"tag-sale\" size=\"16px\" />\n              <div\n                class=\"coupon-content\"\n                onClick={() => (this.actionStatus = ACTION_STATUS.EDITING)}\n              >\n                <rebill-typography variant=\"overline\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n                  {sessionState.data.pricing.discountCouponCode}\n                </rebill-typography>\n                <rebill-typography variant=\"overline\" color={COLORS_ENUM.GREEN}>\n                  -$\n                  {formatAmountWithoutCurrency(\n                    sessionState.data.pricing.discountAmount,\n                    sessionState.data.pricing.currency,\n                  )}\n                </rebill-typography>\n              </div>\n              <div\n                class=\"coupon-close\"\n                onClick={() => {\n                  this.actionStatus = ACTION_STATUS.NOT_APPLIED;\n                  this.couponCode = '';\n                  SessionStore.setDiscount(null);\n                  this.discountApplied.emit(false);\n                }}\n              >\n                <rebill-icon name=\"x\" size=\"20px\" color={COLORS_ENUM.PRIMARY_DARK_TEXT} />\n              </div>\n            </div>\n          )}\n        </div>\n      </div>\n    );\n  }\n}\n"]}
+{"version":3,"file":"discount-coupon.js","sourceRoot":"","sources":["../../../../src/components/checkout/discount-coupon/discount-coupon.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Prop, State } from '@stencil/core';\nimport { api } from '../../../api';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { sessionState, SessionStore } from '../../../store/session.store';\nimport { formatAmountWithoutCurrency } from '../../../utils';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\n\nenum ACTION_STATUS {\n  EDITING = 'editing',\n  APPLIED = 'applied',\n  NOT_APPLIED = 'not_applied',\n}\n\n@Component({\n  tag: 'discount-coupon',\n  styleUrl: 'discount-coupon.css',\n  shadow: false,\n})\nexport class DiscountCoupon {\n  @Element() el: HTMLElement;\n  @Prop() hideLabel: boolean = false;\n  @Prop() displayMode: 'editable' | 'readonly' = 'editable';\n  @Prop() readonlyCouponCode?: string;\n  @Prop() readonlyDiscountAmount?: number;\n  @Prop() readonlyCurrency?: string;\n  @State() couponCode: string = '';\n  @State() actionStatus: ACTION_STATUS = ACTION_STATUS.NOT_APPLIED;\n  @State() isLoading: boolean = false;\n  @State() isError: boolean = false;\n  @State() currentLocale: string = sessionState.currentLocale;\n  @Event() discountApplied: EventEmitter<boolean>;\n  private inputRef: HTMLRebillInputTextElement;\n  private unsubscribeCurrentLocaleStore?: () => void;\n\n  componentWillLoad() {\n    this.unsubscribeCurrentLocaleStore = SessionStore.onChange('currentLocale', () => {\n      this.currentLocale = sessionState.currentLocale;\n    });\n\n    if (this.readonlyCouponCode) {\n      return;\n    }\n\n    if (\n      sessionState.data.pricing.discountCouponCode &&\n      sessionState.data.pricing.discountAmount > 0\n    ) {\n      this.actionStatus = ACTION_STATUS.APPLIED;\n      this.couponCode = sessionState.data.pricing.discountCouponCode;\n    }\n  }\n\n  disconnectedCallback() {\n    if (this.unsubscribeCurrentLocaleStore) {\n      this.unsubscribeCurrentLocaleStore();\n    }\n  }\n  componentDidUpdate() {\n    if (this.readonlyCouponCode) {\n      return;\n    }\n\n    if (this.actionStatus === ACTION_STATUS.EDITING && this.inputRef) {\n      setTimeout(async () => {\n        const inputElement = await this.inputRef.getInputElement();\n        if (inputElement) {\n          inputElement.focus();\n        }\n      }, 0);\n    }\n  }\n\n  private async onApplyCoupon() {\n    if (this.readonlyCouponCode) return;\n    const sessionId = sessionState.data.sessionId;\n    if (!sessionId) {\n      return;\n    }\n    this.isLoading = true;\n    try {\n      const response = await api.discountCoupon.applyDiscountCoupon({\n        couponCode: this.couponCode,\n        quantity: 1,\n        sessionId: sessionId,\n        organizationId: sessionState.data.organization.id,\n      });\n      this.actionStatus = ACTION_STATUS.APPLIED;\n      SessionStore.setDiscount({\n        couponCode: this.couponCode,\n        amount: response.amount,\n        discountType: response.discountType,\n        discountAmount: response.discountedAmount,\n        discountedPercentage: response?.discountedPercentage || 0,\n        discountDuration: response?.discountDuration || null,\n      });\n      this.discountApplied.emit(true);\n    } catch (error) {\n      this.actionStatus = ACTION_STATUS.EDITING;\n      this.discountApplied.emit(false);\n      this.isError = true;\n      SessionStore.setDiscount(null);\n    } finally {\n      this.isLoading = false;\n    }\n  }\n\n  private onCancelCoupon() {\n    if (this.readonlyCouponCode) return;\n    this.actionStatus = ACTION_STATUS.NOT_APPLIED;\n    this.couponCode = '';\n    this.isError = false;\n  }\n\n  private renderReadonlyView() {\n    if (!this.readonlyCouponCode && this.readonlyDiscountAmount) {\n      return null;\n    }\n\n    return (\n      <div class=\"coupon-chip coupon-chip--readonly\">\n        <rebill-icon name=\"tag-sale\" size=\"16px\" />\n        <div class=\"coupon-content\">\n          <rebill-typography variant=\"overline\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n            {this.readonlyCouponCode}\n          </rebill-typography>\n          {this.readonlyDiscountAmount && (\n            <rebill-typography variant=\"overline\" color={COLORS_ENUM.GREEN}>\n              -$\n              {formatAmountWithoutCurrency(\n                this.readonlyDiscountAmount,\n                this.readonlyCurrency as any,\n              )}\n            </rebill-typography>\n          )}\n        </div>\n      </div>\n    );\n  }\n\n  render() {\n    if (this.readonlyCouponCode) {\n      return this.renderReadonlyView();\n    }\n\n    return (\n      <div>\n        <div\n          class=\"summary-row\"\n          style={{\n            alignItems: this.actionStatus === ACTION_STATUS.EDITING ? 'flex-start' : 'center',\n            display: 'flex',\n          }}\n        >\n          {!this.hideLabel && (\n            <rebill-typography\n              variant=\"body2\"\n              style={{ marginTop: this.actionStatus === ACTION_STATUS.EDITING ? '7px' : '0px' }}\n            >\n              {I18nService.translate('discountCoupons.discount')}\n            </rebill-typography>\n          )}\n          {this.actionStatus === ACTION_STATUS.NOT_APPLIED && (\n            <rebill-button\n              variant=\"filled\"\n              size=\"small\"\n              theme=\"primary-dark\"\n              onClick={() => (this.actionStatus = ACTION_STATUS.EDITING)}\n            >\n              {I18nService.translate('discountCoupons.addDiscount')}\n            </rebill-button>\n          )}\n          {this.actionStatus === ACTION_STATUS.EDITING && (\n            <div class=\"summary-row\" style={{ alignItems: 'flex-start', display: 'flex' }}>\n              <rebill-input-text\n                ref={el => (this.inputRef = el)}\n                id=\"discountCoupon\"\n                value={this.couponCode}\n                placeholder={I18nService.translate('discountCoupons.addDiscount')}\n                disabled={this.isLoading}\n                error={this.isError ? I18nService.translate('discountCoupons.error') : ''}\n                clearable={true}\n                uppercase={true}\n                onInput={e => {\n                  e.stopPropagation();\n                  if (e.detail && e.detail.value !== undefined) {\n                    this.couponCode = e.detail.value;\n                  }\n                }}\n                onBlur={() => {\n                  if (!this.couponCode.trim()) {\n                    this.onCancelCoupon();\n                  }\n                }}\n              />\n              <rebill-button\n                variant=\"filled\"\n                theme=\"primary-dark\"\n                size=\"small\"\n                loading={this.isLoading}\n                disabled={this.isLoading || !this.couponCode.trim()}\n                onClick={() => this.onApplyCoupon()}\n                style={{ marginTop: this.actionStatus === ACTION_STATUS.EDITING ? '3px' : '0px' }}\n              >\n                {I18nService.translate('discountCoupons.apply')}\n              </rebill-button>\n            </div>\n          )}\n          {this.actionStatus === ACTION_STATUS.APPLIED && (\n            <div class=\"coupon-chip\">\n              <rebill-icon name=\"tag-sale\" size=\"16px\" />\n              <div\n                class=\"coupon-content\"\n                onClick={() => (this.actionStatus = ACTION_STATUS.EDITING)}\n              >\n                <rebill-typography variant=\"overline\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n                  {sessionState.data.pricing.discountCouponCode}\n                </rebill-typography>\n                <rebill-typography variant=\"overline\" color={COLORS_ENUM.GREEN}>\n                  -$\n                  {formatAmountWithoutCurrency(\n                    sessionState.data.pricing.discountAmount,\n                    sessionState.data.pricing.currency,\n                  )}\n                </rebill-typography>\n              </div>\n              <div\n                class=\"coupon-close\"\n                onClick={() => {\n                  this.actionStatus = ACTION_STATUS.NOT_APPLIED;\n                  this.couponCode = '';\n                  SessionStore.setDiscount(null);\n                  this.discountApplied.emit(false);\n                }}\n              >\n                <rebill-icon name=\"x\" size=\"20px\" color={COLORS_ENUM.PRIMARY_DARK_TEXT} />\n              </div>\n            </div>\n          )}\n        </div>\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/checkout/otp/otp.js

@@ -94,17 +94,17 @@ export class Otp {
         }
     };
     render() {
-        return (h("div", { key: '695c2a67abc70a6805f405f6e126551b1e39ded5', class: "otp__otp-container" }, h("div", { key: '083a89be24155bfaa7dd475e845dd7c392df68e2', class: "otp__user-information" }, h("div", { key: '4b0448680cd90d58278c60b504d54e3f920fdd33', class: "otp__otp-description-container" }, h("rebill-typography", { key: '6906f8348b6bbf4d8af6395b02b2ef3993f8999f', variant: "body2", class: "otp__otp-description" }, I18nService.translate('otp.description')), h("rebill-typography", { key: '03eced252bddbc83c80703b65ea0822fdc8f1286', variant: "subtitle-bold", class: "otp__otp-description-digits" }, ' ', h("strong", { key: 'be96707f15ba5e32bb7d542bd6e145b250b22bd5' }, I18nService.translate('otp.descriptionDigits')), ' '), h("rebill-typography", { key: 'c071f971e41a1000ca623e6bc86fd63d796d29b9', variant: "body2", class: "otp__otp-description-email" }, I18nService.translate('otp.descriptionEmail'))), h("rebill-typography", { key: '05830f22306e4ff106f39da5ec3d273502393047', variant: "body2", class: "otp__otp-email-line" }, sessionState.data.userInformation.email, ' ', !sessionState.data.prefilledData?.email && (h("span", { key: '2a0abb0311e9f6d468c76a18ce54670711ea58e8', class: "otp__change-email", onClick: () => {
+        return (h("div", { key: 'a60f4778e7b8c9d12db4f91f1052efb529421f61', class: "otp__otp-container" }, h("div", { key: '27f07a33bb7f89884e9f7c7451dde4d45ec70fa0', class: "otp__user-information" }, h("div", { key: 'dff426cbad1d5104cb190b577b62ace1f80c0397', class: "otp__otp-description-container" }, h("rebill-typography", { key: '46056e3d98013ec69b2f94ce09453741393a84d5', variant: "body2", class: "otp__otp-description" }, I18nService.translate('otp.description')), h("rebill-typography", { key: '1ce410c937cc81a6d3d94ba9ba324463c17d2e1a', variant: "subtitle-bold", class: "otp__otp-description-digits" }, ' ', h("strong", { key: '5cb7f9fc7dc6bcb884719bc6dfb36d46d67e7c3b' }, I18nService.translate('otp.descriptionDigits')), ' '), h("rebill-typography", { key: '08374eda7ff4ae8deadfec171a086d31c4c9160d', variant: "body2", class: "otp__otp-description-email" }, I18nService.translate('otp.descriptionEmail'))), h("rebill-typography", { key: '3bca7a94df9819bd9a235c0963b2190a0f7dcb2f', variant: "body2", class: "otp__otp-email-line" }, sessionState.data.userInformation.email, ' ', !sessionState.data.prefilledData?.email && (h("span", { key: '53ac959b54950773538dbce0c236bbd2a75fa906', class: "otp__change-email", onClick: () => {
                 this.otpValue = '';
                 this.error = false;
                 this.returnForm.emit(false);
-            } }, I18nService.translate('otp.change'))))), h("input-otp", { key: 'ea265a435d31d7074aa2f97c10e47f44d50d0a3c', otp: this.otpValue, onOtpChange: event => this.handleOtpChange(event.detail), error: this.error ? I18nService.translate('otp.error') : '' }), this.isVerifying && (h("div", { key: '367501f575edf463b9055785dfb3c72475ce449d', class: "otp__verifying-container" }, h("rebill-typography", { key: '5dd504a759d6dbcb47aa98b2ae2c27b30ce9e96c', variant: "subtitle2", color: COLORS_ENUM.PRIMARY }, I18nService.translate('otp.verifyingCode')), h("div", { key: 'e5b194da4c703af89cada396bd9ada053507cbe5', class: "otp__spinner" }))), h("rebill-button", { key: '96cd7a684d0d51d8d3e0d47291fd2ab413f6a424', type: "button", variant: "outline", theme: this.isTimerRunning ? 'secondary' : 'primary', disabled: this.isTimerRunning, onClick: this.handleResendCode, size: "small", style: { height: '24px', marginBottom: '8px' } }, this.isTimerRunning
+            } }, I18nService.translate('otp.change'))))), h("input-otp", { key: '53416598d254b6f42b1771136d43f8ac612f3b43', otp: this.otpValue, onOtpChange: event => this.handleOtpChange(event.detail), error: this.error ? I18nService.translate('otp.error') : '' }), this.isVerifying && (h("div", { key: '41c766a5e21c9d810dca97de5c720450df6924af', class: "otp__verifying-container" }, h("rebill-typography", { key: '93ba72b7c85cb622f8fd3d1b1175817a736c7ede', variant: "subtitle2", color: COLORS_ENUM.PRIMARY }, I18nService.translate('otp.verifyingCode')), h("div", { key: 'd8b11cf317c4d8cbbb3f840fe8c411738c8f095c', class: "otp__spinner" }))), h("rebill-button", { key: 'c07d1abbce11ca0a2f1f139d9b93c6808c85bfd0', type: "button", variant: "outline", theme: this.isTimerRunning ? 'secondary' : 'primary', disabled: this.isTimerRunning, onClick: this.handleResendCode, size: "small", style: { height: '24px', marginBottom: '8px' } }, this.isTimerRunning
             ? `${I18nService.translate('otp.resendCodeIn')} (${this.timer.getFormattedTime()})`
-            : I18nService.translate('otp.resendCode')), this.codeResent && (h("div", { key: '9958622dcf2e3e7bdfbc3601c6a0dcc056a704d2', class: "otp__code-resent-container" }, h("rebill-typography", { key: 'e1fedeb2c1bcdefb2d2540eb0a1a1ee1aca8602b', variant: "subtitle2", color: COLORS_ENUM.GREEN }, h("rebill-icon", { key: 'bd5268ce74cf92d2df6c0c05af90f667a7cfc8ac', name: "check-radio" }), I18nService.translate('otp.codeResent')))), h("rebill-alert", { key: 'fbe9a4975a9f59c8dc13ad31fdd282b67065a738', class: "otp__rebill-alert", type: "secure", variant: "variant-info", message: I18nService.translate('otp.infoMessage'), icon: "circle-info", alertTitle: I18nService.translate('otp.infoTitle'), colorIcon: COLORS_ENUM.PRIMARY_DARK_LIGHT }), h("div", { key: 'b897d0409df69be27b7ee403d96eb7af1e714f67', class: "otp__alternative" }, h("rebill-typography", { key: 'c823a4a3b01e46352b10c05d5aa4caf88aa751b9', variant: "body2", color: COLORS_ENUM.PRIMARY_DARK }, "o")), h("div", { key: 'cf74b097bd2ce9846f6f848109e44698de57e128', class: "otp__guest-options" }, h("rebill-button", { key: '3c61d047f6f1c77ade4936e23afbadd1674c9d10', type: "button", variant: "outline", theme: "secondary", size: "medium", onClick: () => {
+            : I18nService.translate('otp.resendCode')), this.codeResent && (h("div", { key: '04892ba96af1f0cc56e8a662b4e758f8539d8181', class: "otp__code-resent-container" }, h("rebill-typography", { key: 'd5406c0cb371a85f796bb33950db186703aa2a96', variant: "subtitle2", color: COLORS_ENUM.GREEN }, h("rebill-icon", { key: 'd125a0363f9b5b584638b148e285323d57c507ee', name: "check-radio" }), I18nService.translate('otp.codeResent')))), h("rebill-alert", { key: '00f6d0350530b1ec22027a91dcafa7bd6de2887d', class: "otp__rebill-alert", type: "secure", variant: "variant-info", message: I18nService.translate('otp.infoMessage'), icon: "circle-info", alertTitle: I18nService.translate('otp.infoTitle'), colorIcon: COLORS_ENUM.PRIMARY_DARK_LIGHT }), h("div", { key: '9a8c49f2d07459f11f447a430c5addf11da5d68c', class: "otp__alternative" }, h("rebill-typography", { key: 'aa6421edade435a60f2086666aadee7059c4381b', variant: "body2", color: COLORS_ENUM.PRIMARY_DARK }, "o")), h("div", { key: 'cd8efa383a62cc1362e50dd854812bf80c3a930c', class: "otp__guest-options" }, h("rebill-button", { key: '95db9dfa82140c9de4fcf22d513f8401779d0bb5', type: "button", variant: "outline", theme: "secondary", size: "medium", onClick: () => {
                 this.otpValue = '';
                 this.error = false;
                 this.returnForm.emit(false);
-            } }, I18nService.translate('otp.continueAsGuest')), h("rebill-alert", { key: 'd301de3043c187804f7bea48eeb49e9ac4967480', type: "secure", variant: "variant-secure", icon: "lock-outline", message: I18nService.translate('otp.secureMessage') }))));
+            } }, I18nService.translate('otp.continueAsGuest')), h("rebill-alert", { key: 'd1f56385971910aed328b740498945e05d6a91ac', type: "secure", variant: "variant-secure", icon: "lock-outline", message: I18nService.translate('otp.secureMessage') }))));
     }
     static get is() { return "otp-component"; }
     static get originalStyleUrls() {

package/dist/collection/components/checkout/payment-method-selector/card-fields/card-fields-wrapper.js

@@ -9,9 +9,9 @@ export class CardFieldsWrapper {
     showDocument;
     customCSS;
     render() {
-        return (h("div", { key: '5136861b53a04501727e77298fd35c3e3dc35ddb', style: { display: 'flex', flexDirection: 'column', gap: '16px' } }, h("card-iframe", { key: 'd9305c548cdfcfc5a89a4a9cea4abe320655ce93', customCSS: this.customCSS }), !renewalState.isInitialized &&
+        return (h("div", { key: '5f1248723599b981c30f9a54124b5a94a5f53dad', style: { display: 'flex', flexDirection: 'column', gap: '16px' } }, h("card-iframe", { key: '8bfe7e4a7b26c30bf1de8c4d937690a429429f3a', customCSS: this.customCSS }), !renewalState.isInitialized &&
             sessionState.data?.itemInformation?.type !== SESSION_ITEM_TYPE_ENUM.PLAN &&
-            sessionState.data.cardInformation?.installments?.installments.length > 0 && (h("rebill-installments", { key: '4dbd0ba36b3c99a857636201498f4186c71b1a28', error: this.installmentsError })), this.showDocument && (h("card-identification", { key: '58f62d19b4c5c5cfd1a6ad7437f767b054917741', documentTypeError: this.documentTypeError, documentNumberError: this.documentNumberError }))));
+            sessionState.data.cardInformation?.installments?.installments.length > 0 && (h("rebill-installments", { key: 'd95b4b20414db198f5483cb1dc1ac070e0204009', error: this.installmentsError })), this.showDocument && (h("card-identification", { key: '11d048b3a791db2061befd07a4b33a039e03de24', documentTypeError: this.documentTypeError, documentNumberError: this.documentNumberError }))));
     }
     static get is() { return "card-fields-wrapper"; }
     static get properties() {

package/dist/collection/components/checkout/payment-method-selector/card-fields/identification/identification.js

@@ -62,7 +62,7 @@ export class Identification {
             label: documentType.value,
             value: documentType.value,
         }));
-        return (h(h.Fragment, null, h("rebill-input-combo", { key: '6823049ae91bcbbf61c0b0e9b913ae4b581e21b9', "select-id": "documentType", "input-id": "documentNumber", "on-input": this.handleInputChange, "select-placeholder": I18nService.translate('document.typePlaceholder'), "input-placeholder": I18nService.translate('document.numberPlaceholder'), error: I18nService.translate(error), options: options, disabled: this.disabled })));
+        return (h(h.Fragment, null, h("rebill-input-combo", { key: '075b874873f297d3e2e72e54625db2d5cc49c619', "select-id": "documentType", "input-id": "documentNumber", "on-input": this.handleInputChange, "select-placeholder": I18nService.translate('document.typePlaceholder'), "input-placeholder": I18nService.translate('document.numberPlaceholder'), error: I18nService.translate(error), options: options, disabled: this.disabled })));
     }
     static get is() { return "card-identification"; }
     static get properties() {

package/dist/collection/components/checkout/payment-method-selector/card-fields/iframe/CardIframe.js

@@ -326,12 +326,12 @@ export class CardIframe {
         }
     };
     render() {
-        return (h("div", { key: 'e6b649919e417b6766f8b57c4b14200973fbffbc', style: {
+        return (h("div", { key: '21cee6426b31b15e214272bed3b893a89cfebdc3', style: {
                 width: '100%',
                 height: this.iframeHeight,
                 position: 'relative',
                 overflow: 'hidden',
-            } }, !this.iframeLoaded && h("card-skeleton", { key: '0188319bd207a9b6bc7d81d0812550b1788e1bb4' }), h("iframe", { key: '7fd8a416e1d52a0a303ad14048cdc7e2803da0c7', ref: el => (this.iframeRef = el), src: this.getIframeURL(), style: {
+            } }, !this.iframeLoaded && h("card-skeleton", { key: '66bbb20d750975f5e6a15a72c55f21ac209c9a10' }), h("iframe", { key: '8f9c689ea04b5b88511cbcc69b792454460b2a48', ref: el => (this.iframeRef = el), src: this.getIframeURL(), style: {
                 width: '100%',
                 height: '100%',
                 border: 'none',

package/dist/collection/components/checkout/payment-method-selector/card-fields/iframe/skeleton/CardSkeleton.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class CardSkeleton {
     render() {
-        return (h("div", { key: 'd87e835e37bd5986d77a45a98237a8dd3a7b3682', class: "iframe-skeleton" }, h("div", { key: '3a31614b30459c736eb66f29bc998d9aee635a6b', class: "input-skeleton" }), h("div", { key: '9149d975b4da18fa231e434520f278632c39e38b', class: "input-skeleton" })));
+        return (h("div", { key: '76c432f43c597f9ff92b949c16d70b1b6840e378', class: "iframe-skeleton" }, h("div", { key: '9c77a9eeda10a23004890c934f30f8d25be7fbf1', class: "input-skeleton" }), h("div", { key: 'd26032fe4bbb41dd0107e9fa5d8bd041da401351', class: "input-skeleton" })));
     }
     static get is() { return "card-skeleton"; }
     static get originalStyleUrls() {

package/dist/collection/components/checkout/payment-method-selector/card-fields/installments/installments.js

@@ -40,11 +40,11 @@ export class Installments {
         });
     }
     render() {
-        return (h("div", { key: '6a5c00fc287b609ed3bd074d3c9ea028e5770190' }, h("rebill-input-select", { key: this.isDisabled.toString(), id: "installments", variant: "outlined", value: this.value, options: sessionState.data.cardInformation?.installments?.installments.map(installment => ({
+        return (h("div", { key: 'a7e2147789a5664d4b5857c86652c85f78a88872' }, h("rebill-input-select", { key: this.isDisabled.toString(), id: "installments", variant: "outlined", value: this.value, options: sessionState.data.cardInformation?.installments?.installments.map(installment => ({
                 label: getInstallmentLabel(installment.installment, getRecalculatedInstallmentAmount(installment.installmentAmount), sessionState.data.pricing?.currency, installment.cft, installment.model),
                 value: installment?.installment?.toString(),
             })) || [], loading: sessionState.data.fetchingInstallments, placeholder: this.placeholder, disabled: this.isDisabled, "on-input": this.handleInstallments, error: I18nService.translate(this.error) }), sessionState.data.cardInformation?.installments?.installments.find(installment => installment.installment ===
-            sessionState.data.cardInformation?.installments?.selectedInstallment?.installment)?.model === ENUM_INSTALLMENT_MODEL.CUSTOMER_FINANCED && (h("rebill-typography", { key: '0e3cc1cbf51fd540b927d64d16c8d2107c98f06f', variant: "italic", color: COLORS_ENUM.SECONDARY }, I18nService.translate('installments.interest')))));
+            sessionState.data.cardInformation?.installments?.selectedInstallment?.installment)?.model === ENUM_INSTALLMENT_MODEL.CUSTOMER_FINANCED && (h("rebill-typography", { key: '77b18f5f22cf47c79a6a2f30655117f4aaa60987', variant: "italic", color: COLORS_ENUM.SECONDARY }, I18nService.translate('installments.interest')))));
     }
     static get is() { return "rebill-installments"; }
     static get originalStyleUrls() {

package/dist/collection/components/checkout/rebill-footer/rebill-footer.css

@@ -9,7 +9,7 @@
   justify-content: space-between;
   align-items: center;
   width: 100%;
-  margin-bottom: 18px;
+  margin: 18px;
 }
 
 .terms-and-conditions {

package/dist/collection/components/checkout/rebill-footer/rebill-footer.js

@@ -23,7 +23,7 @@ export class RebillFooter {
         SessionStore.changeLanguage(event.detail.value);
     };
     render() {
-        return (h("div", { key: '6184f1b631f0bd63fe4ddf9b47b9335de954c641', class: "rebill-footer__footer-content" }, h("div", { key: '5be0cec48aaed80636c0aab759c7ce22938ec6c6', class: "terms-and-conditions" }, !isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP) && (h("rebill-typography", { key: '914acad894e0d153f74f47bd710fd65bf24bf86e', variant: "subtitle3", color: COLORS_ENUM.SECONDARY, class: "footer-powered" }, I18nService.translate('footer.poweredBy'))), h("rebill-icon", { key: 'f2ed4de21b518f929462489b444b4d8c5998193c', name: "rebill-logo", color: COLORS_ENUM.SECONDARY }), h("rebill-icon", { key: '58e6c325324f039bb33cad67f27e4c58acdf0080', name: "rebill", color: COLORS_ENUM.SECONDARY }), h("rebill-typography", { key: '1514eaca2c60fcf957aa5b05173f81f40c223cfa', variant: "subtitle3", color: COLORS_ENUM.SECONDARY, class: "footer-separator" }, "|"), h("rebill-typography", { key: 'a78a37f1969abe1e529dad9840ce184cc3a26512', variant: "subtitle3", color: COLORS_ENUM.SECONDARY, class: "footer-link" }, h("a", { key: 'b84b14ddb73d9c3892b28f3d7d33b918b6039509', href: "https://www.rebill.com/terminos-y-condiciones-usuarios-finales", target: "_blank" }, I18nService.translate('footer.termsAndConditions')))), h("div", { key: '90d6827e3a52bd91e168acbaef0af9d5c4437748', class: "language-selector" }, h("rebill-icon", { key: 'fac513520ee23f8151289056344fbce934aa95e3', name: "world" }), h("rebill-input-select", { key: 'c8383318408ffd09fd13526072fba6fc39dadf59', id: "language-selector", variant: "underlined", backgroundColor: isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP)
+        return (h("div", { key: '2bf71ea419e16951f8ba3e1d9a74d460ea234271', class: "rebill-footer__footer-content" }, h("div", { key: '5d475f95f2e99d14bcb5ac94807403b47c746955', class: "terms-and-conditions" }, !isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP) && (h("rebill-typography", { key: 'e32913e5ff5be1045650d32607319fc704eb08fd', variant: "subtitle3", color: COLORS_ENUM.SECONDARY, class: "footer-powered" }, I18nService.translate('footer.poweredBy'))), h("rebill-icon", { key: '98445973ff58f009ef8530ee5b85b82cee2ebbf5', name: "rebill-logo", color: COLORS_ENUM.SECONDARY }), h("rebill-icon", { key: '2a3e9923ff4587db6d7f98f60c7a63b435cbe041', name: "rebill", color: COLORS_ENUM.SECONDARY }), h("rebill-typography", { key: 'a13ace0f701b6039a142cef96784940fedc57a42', variant: "subtitle3", color: COLORS_ENUM.SECONDARY, class: "footer-separator" }, "|"), h("rebill-typography", { key: 'bf4d69c5b8b2fedf56c6acb21a406e823bc12778', variant: "subtitle3", color: COLORS_ENUM.SECONDARY, class: "footer-link" }, h("a", { key: 'a17ff0764546610bd2d1bb14a44e54b947794a8f', href: "https://www.rebill.com/terminos-y-condiciones-usuarios-finales", target: "_blank" }, I18nService.translate('footer.termsAndConditions')))), h("div", { key: '76611d3afd818621460a0ca43ded9da3ee69bbc6', class: "language-selector" }, h("rebill-icon", { key: 'ea078f2e51059969e8a94a6f13239d214ef8b26a', name: "world" }), h("rebill-input-select", { key: 'ff844420ba1b8d754c0d75c80993203bd5931486', id: "language-selector", variant: "underlined", backgroundColor: isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP)
                 ? ''
                 : 'var(--rebill-color-background-left)', options: [
                 { label: 'EN', value: LOCALES_ENUM.EN },

package/dist/collection/components/checkout/user-information/user-information-phone.js

@@ -56,7 +56,7 @@ export class UserInformationPhone {
         }
     }
     render() {
-        return (h(Host, { key: '58047d7c4a5be632008532c3579106baa102ac8d' }, h("div", { key: 'aa120414d1b730bb782aa3e41c243678137383a2' }, h("rebill-input-phone", { key: '31ff24440e54d19cc4c0fc2ed5c4e22e47be6f4e', disabled: this.disabled, validationErrorId: "isValidPhoneNumber", phoneNumberId: "phoneNumber", countryCodeId: "countryCodePhoneNumber", placeholder: I18nService.translate('userInformation.phoneNumberPlaceholder'), "initial-country": this.countryCode?.toLowerCase() || 'ar', error: this.error, required: true, searchable: true, searchPlaceholder: I18nService.translate('userInformation.searchCountriesPlaceholder') }))));
+        return (h(Host, { key: 'f5a7cde227c1bd554c5010b50704f3fb6b6502d9' }, h("div", { key: '4f9c6dfb9105d29d0b7d7368e333b8ecf6951fba' }, h("rebill-input-phone", { key: '23e25f0cf70d3fedf4f94fa5ff8041e77402b732', disabled: this.disabled, validationErrorId: "isValidPhoneNumber", phoneNumberId: "phoneNumber", countryCodeId: "countryCodePhoneNumber", placeholder: I18nService.translate('userInformation.phoneNumberPlaceholder'), "initial-country": this.countryCode?.toLowerCase() || 'ar', error: this.error, required: true, searchable: true, searchPlaceholder: I18nService.translate('userInformation.searchCountriesPlaceholder') }))));
     }
     static get is() { return "user-information-phone"; }
     static get originalStyleUrls() {

package/dist/collection/components/checkout/user-information/user-information.js

@@ -77,15 +77,15 @@ export class UserInformation {
             } }, inputs)) : null;
     }
     render() {
-        const customerExistsButton = (h("div", { key: '04ed326d91a904cf1147270b4f6a613e1f010324', class: "customer-exists" }, h("rebill-button", { key: 'ad838f2f5ef47759d4a143813981c88f929462e6', style: {
+        const customerExistsButton = (h("div", { key: 'd8dc2e7c9eb4eda6f95ccd4d5472c068730cdfd5', class: "customer-exists" }, h("rebill-button", { key: '1b7ae09782e0fcbcb98f2fb6f140b5a9113092c7', style: {
                 visibility: this.customerExists ? 'visible' : 'hidden',
                 opacity: this.customerExists ? '1' : '0',
                 transition: 'opacity 0.3s ease-in-out',
-            }, variant: "text", size: "small", onClick: () => this.handleRebillAccountClick(), icon: "lock" }, I18nService.translate('userInformation.rebillAccount'), h("rebill-icon", { key: '9a123da3f51e87597f6508a214e111fdea5a9bca', name: "arrow-right" }))));
+            }, variant: "text", size: "small", onClick: () => this.handleRebillAccountClick(), icon: "lock" }, I18nService.translate('userInformation.rebillAccount'), h("rebill-icon", { key: '697b2e05137658b4f427bce9533d2506ce5ee87f', name: "arrow-right" }))));
         const hasPrefilledEmail = sessionState.data.prefilledData.email;
         const hasPrefilledName = sessionState.data.prefilledData.fullName;
         const hasAnyPrefilled = hasPrefilledEmail || hasPrefilledName;
-        return (h(Host, { key: '696af08bf88e367acb57e2577a5036ebfd0b29b2' }, customerExistsButton, hasAnyPrefilled && (h("rebill-card", { key: '292fb5bf3d22274530e6844035f3fb58a5f2ee0d', cardTitle: I18nService.translate('userInformation.personalInformation'), cardLabels: this.getCardLabels() })), this.renderInputs()));
+        return (h(Host, { key: '94cb7e47341a7bd014a69b172e9cf807349d4a59' }, customerExistsButton, hasAnyPrefilled && (h("rebill-card", { key: 'd69d87bbd3733b0be65251b2eaf8f974933ebf1b', cardTitle: I18nService.translate('userInformation.personalInformation'), cardLabels: this.getCardLabels() })), this.renderInputs()));
     }
     static get is() { return "user-information"; }
     static get originalStyleUrls() {

package/dist/collection/components/renewal/rebill-renewal.js

@@ -445,7 +445,7 @@ export class RebillRenewal {
         if (!renewalState.isInitialized) {
             return h("div", { class: "loading" }, I18nService.translate('renewal.loading'));
         }
-        const renderRenewalSummary = props => (h("renewal-summary", { totalAmount: renewalState.data.price.amount, currency: renewalState.data.price.currency, subscriptionTitle: renewalState.data.subscription.name[0]?.text || 'Subscription', subscriptionAmount: renewalState.data.subscription.amount, nextChargeDate: renewalState.data.subscription.nextChargeDate, frequency: renewalState.data.subscription.frequency, ...props }));
+        const renderRenewalSummary = props => (h("renewal-summary", { totalAmount: renewalState.data.price.amount, currency: renewalState.data.price.currency, subscriptionTitle: renewalState.data.subscription.name[0]?.text || 'Subscription', subscriptionAmount: renewalState.data.subscription.amount, nextChargeDate: renewalState.data.subscription.nextChargeDate, frequency: renewalState.data.subscription.frequency, couponCode: renewalState.data.price.couponCode, discountAmount: renewalState.data.price.discountedAmount, discountPercentage: renewalState.data.price.discountPercentage, ...props }));
         return (h(h.Fragment, null, h("rebill-processing-payment", { style: { display: this.isCardSubmitting ? 'block' : 'none' } }), this.isCardSuccess ? (h("renewal-success-page", { typePaymentMethod: this.currentPaymentMethod, paymentDate: this.getPaymentDate(), referenceNumber: this.getReferenceNumber(), cardLastFour: renewalState.data.subscription.cardLastFour, country: renewalState.data.price.country, paymentMethodName: PaymentMethodMapper.mapToAPMPaymentMethod(this.currentPaymentMethod, renewalState.data?.price?.country), bank: renewalState.form?.selectedBankId || '' })) : (h("rebill-checkout-form", { style: { display: this.isCardSubmitting || this.isCardSuccess ? 'none' : 'block' }, validationSchema: this.validationSchema, initialData: this.initialData, onSubmit: (args) => this.handleSubmit(args), renderForm: ({ submit, formData, errors }) => (h("div", { class: "rebill-checkout-renewal" }, h("div", { class: "left-section" }, h("div", { class: "left-section-container" }, h("organization-logo", { organization: renewalState.data.organization }), h("div", { class: "checkout-form-section" }, h("user-information-static", { userInfo: {
                     customerName: renewalState.data.subscription.customerName,
                     customerEmail: renewalState.data.subscription.customerEmail,