@primer-io/primer-js 0.8.2 → 0.10.0

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/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @primer-io/primer-js
2
2
 
3
+ ## 0.10.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 54c7c8c: Deep Comparison for options
8
+
9
+ ## 0.9.0
10
+
11
+ ### Minor Changes
12
+
13
+ - 25e2cc5: Headless Vault and bug fixes
14
+
3
15
  ## 0.8.2
4
16
 
5
17
  ### Patch Changes
@@ -49,23 +49,23 @@
49
49
  },
50
50
  {
51
51
  "kind": "variable",
52
- "name": "Qa",
52
+ "name": "Xa",
53
53
  "default": "class{constructor(t){this._methods=t}get(t){return this._methods.get(t)}toArray(){return Array.from(this._methods.values())}size(){return this._methods.size}}"
54
54
  },
55
55
  {
56
56
  "kind": "variable",
57
- "name": "Xa",
57
+ "name": "er",
58
58
  "default": "class{constructor(t){this._methods=t}get(t){return this._methods.get(t)}toArray(){return Array.from(this._methods.values())}size(){return this._methods.size}}"
59
59
  },
60
60
  {
61
61
  "kind": "variable",
62
62
  "name": "ce",
63
- "default": "class extends v{constructor(){super(...arguments);this.size=\"large\";this.showCloseButton=!1;this.open=!1}openDialog(){this.open=!0}closeDialog(){let e=document.querySelector(\"primer-dialog\");if(e){e.startExitAnimation();let a=()=>{this.open=!1,this.removeEventListener(\"primer-dialog-close\",a)};this.addEventListener(\"primer-dialog-close\",a)}else this.open=!1}renderContent(){return p`<div class=\"content-container\"><slot></slot>${this.renderSecureHtmlContent()}</div>`}renderSecureHtmlContent(){return this.secureHtmlContent?Oi(this.secureHtmlContent)?p`${Vo(this.secureHtmlContent.content)}`:(E.warn(\"PortalDialogComponent: Invalid access token provided for htmlContent. Content will not be rendered.\"),g):g}renderDialog(){return this.open?p`<primer-portal><primer-dialog .open=${this.open} size=${this.size} .showCloseButton=${!1} @primer-dialog-close=\"${()=>this.closeDialog()}\" >${this.renderContent()}</primer-dialog></primer-portal>`:g}connectedCallback(){super.connectedCallback(),this.open||this.openDialog()}updated(e){if(super.updated(e),e.has(\"secureHtmlContent\")){let a=this.secureHtmlContent;a&&!Oi(a)&&(E.errorWithDatadog(\"PortalDialogComponent: Invalid access token provided for htmlContent. Content will not be rendered.\"),this.secureHtmlContent=void 0)}e.has(\"open\")&&this.open&&this.onOpen&&this.onOpen(),e.has(\"open\")&&this.open&&this.onContentRendered&&this.updateComplete.then(()=>{requestAnimationFrame(()=>{this.onContentRendered?.()})})}render(){return p`${this.renderDialog()}`}}"
63
+ "default": "class extends v{constructor(){super(...arguments);this.size=\"large\";this.showCloseButton=!1;this.open=!1}openDialog(){this.open=!0}closeDialog(){let e=document.querySelector(\"primer-dialog\");if(e){e.startExitAnimation();let a=()=>{this.open=!1,this.removeEventListener(\"primer-dialog-close\",a)};this.addEventListener(\"primer-dialog-close\",a)}else this.open=!1}renderContent(){return p`<div class=\"content-container\"><slot></slot>${this.renderSecureHtmlContent()}</div>`}renderSecureHtmlContent(){return this.secureHtmlContent?Gi(this.secureHtmlContent)?p`${Vo(this.secureHtmlContent.content)}`:(E.warn(\"PortalDialogComponent: Invalid access token provided for htmlContent. Content will not be rendered.\"),g):g}renderDialog(){return this.open?p`<primer-portal><primer-dialog .open=${this.open} size=${this.size} .showCloseButton=${!1} @primer-dialog-close=\"${()=>this.closeDialog()}\" >${this.renderContent()}</primer-dialog></primer-portal>`:g}connectedCallback(){super.connectedCallback(),this.open||this.openDialog()}updated(e){if(super.updated(e),e.has(\"secureHtmlContent\")){let a=this.secureHtmlContent;a&&!Gi(a)&&(E.errorWithDatadog(\"PortalDialogComponent: Invalid access token provided for htmlContent. Content will not be rendered.\"),this.secureHtmlContent=void 0)}e.has(\"open\")&&this.open&&this.onOpen&&this.onOpen(),e.has(\"open\")&&this.open&&this.onContentRendered&&this.updateComplete.then(()=>{requestAnimationFrame(()=>{this.onContentRendered?.()})})}render(){return p`${this.renderDialog()}`}}"
64
64
  },
65
65
  {
66
66
  "kind": "variable",
67
67
  "name": "Ee",
68
- "default": "class extends v{constructor(){super();this.customStyles=\"\";this.clientToken=\"\";this.options={};this.disableLoader=!1;this._jsInitialized=!1;this.previousLoadingState=!0;this.hasAssignedContent=!1;this._loadingTimeoutId=null;this._eventListenerController=null;this.locale=\"en-GB\";this.onSlotChange=e=>{let i=e.target.assignedNodes({flatten:!0});this.hasAssignedContent=i.length>0,this.requestUpdate()};this.sdkContextController=new $a(this),this.sdkStateController=new Ya(this),this.primerEventsController=new Ft(this),this.styleProcessingController=new za(this),this.vaultManagerController=new ia(this),this.cardNetworkController=new Ma(this),this.achPaymentEventsController=new br(this),this.headlessSdkController=new Sr(this)}set jsInitialized(e){this.requestUpdate(),this._jsInitialized=e}get jsInitialized(){return this._jsInitialized}get primerJS(){return this.headlessSdkController?.primerJSInstance??void 0}connectedCallback(){super.connectedCallback(),this.sdkContextController.setEventsController(this.primerEventsController),this._eventListenerController=new AbortController,document.addEventListener(\"primer:card-submit\",this.handleExternalCardSubmit.bind(this),{signal:this._eventListenerController.signal}),document.addEventListener(\"primer:vault-submit\",this.handleExternalVaultSubmit.bind(this),{signal:this._eventListenerController.signal}),document.addEventListener(\"primer:show-other-payments-toggle\",this.handleExternalShowOtherPaymentsToggle.bind(this),{signal:this._eventListenerController.signal})}attributeChangedCallback(e,a,i){e===fu.CUSTOM_STYLES?this.styleProcessingController.processCustomStyles(i):super.attributeChangedCallback(e,a,i)}disconnectedCallback(){this._loadingTimeoutId&&(window.clearTimeout(this._loadingTimeoutId),this._loadingTimeoutId=null),this.sdkStateController?.currentState.isLoading&&this.sdkStateController.forceCompleteLoading(),this._eventListenerController&&(this._eventListenerController.abort(),this._eventListenerController=null),super.disconnectedCallback()}willUpdate(e){e.has(\"options\")&&(this.options?.locale&&(Ni(this.options?.locale)?this.locale=Ii(this.options?.locale):E.warn(\"\\u{1F30E}\\u2757 Unsupported locale provided:\",this.options?.locale,\"- Falling back to default locale `en-GB`\")),Pi(this.locale||\"en-GB\"))}updated(){let e=getComputedStyle(this);this.sdkContextController.setComputedStyles(e),this.checkLoadingStateChange()}handleExternalCardSubmit(e){this._eventListenerController?.signal.aborted||e.target!==this&&this.primerEventsController.dispatchEvent(\"primer:card-submit\",e.detail)}handleExternalVaultSubmit(e){this._eventListenerController?.signal.aborted||e.target!==this&&this.primerEventsController.dispatchEvent(\"primer:vault-submit\",e.detail)}handleExternalShowOtherPaymentsToggle(e){this._eventListenerController?.signal.aborted||e.target!==this&&this.primerEventsController.dispatchEvent(\"primer:show-other-payments-toggle\",e.detail)}checkLoadingStateChange(){let e=this.sdkStateController?.currentState.isLoading||!1;this.previousLoadingState&&!e&&(this.jsInitialized=!0,Q({eventName:\"CHECKOUT_FLOW_STARTED\"})),this.previousLoadingState=e,e&&!this._loadingTimeoutId?this._loadingTimeoutId=window.setTimeout(()=>{this.sdkStateController?.currentState.isLoading&&(E.warn(\"Loading timeout in component, forcing completion\"),this.sdkStateController.forceCompleteLoading(),this.jsInitialized=!0),this._loadingTimeoutId=null},1e4):!e&&this._loadingTimeoutId&&(window.clearTimeout(this._loadingTimeoutId),this._loadingTimeoutId=null)}render(){let e=this.sdkStateController.currentState,a=e.isLoading,i=e.primerJsError,n=!a&&!i;return p` ${L(a,()=>g)} ${L(i,()=>p`<primer-checkout-error></primer-checkout-error>`)} ${L(n,()=>p`<slot name=\"main\" @slotchange=${this.onSlotChange}></slot>${L(this.hasAssignedContent,()=>g,()=>p`<primer-main></primer-main>`)} `,()=>g)} `}addEventListener(e,a,i){super.addEventListener(e,a,i)}removeEventListener(e,a,i){super.removeEventListener(e,a,i)}}"
68
+ "default": "class extends v{constructor(){super();this.customStyles=\"\";this.clientToken=\"\";this.options={};this.disableLoader=!1;this._jsInitialized=!1;this.previousLoadingState=!0;this.hasAssignedContent=!1;this._loadingTimeoutId=null;this._eventListenerController=null;this.locale=\"en-GB\";this.onSlotChange=e=>{let i=e.target.assignedNodes({flatten:!0});this.hasAssignedContent=i.length>0,this.requestUpdate()};this.sdkContextController=new za(this),this.sdkStateController=new $a(this),this.primerEventsController=new Ft(this),this.styleProcessingController=new ja(this),this.vaultManagerController=new ia(this),this.cardNetworkController=new Ma(this),this.achPaymentEventsController=new Cr(this),this.headlessSdkController=new br(this)}set jsInitialized(e){this.requestUpdate(),this._jsInitialized=e}get jsInitialized(){return this._jsInitialized}get primerJS(){return this.headlessSdkController?.primerJSInstance??void 0}connectedCallback(){super.connectedCallback(),this.sdkContextController.setEventsController(this.primerEventsController),this._eventListenerController=new AbortController,document.addEventListener(\"primer:card-submit\",this.handleExternalCardSubmit.bind(this),{signal:this._eventListenerController.signal}),document.addEventListener(\"primer:vault-submit\",this.handleExternalVaultSubmit.bind(this),{signal:this._eventListenerController.signal}),document.addEventListener(\"primer:show-other-payments-toggle\",this.handleExternalShowOtherPaymentsToggle.bind(this),{signal:this._eventListenerController.signal})}attributeChangedCallback(e,a,i){e===fu.CUSTOM_STYLES?this.styleProcessingController.processCustomStyles(i):super.attributeChangedCallback(e,a,i)}disconnectedCallback(){this._loadingTimeoutId&&(window.clearTimeout(this._loadingTimeoutId),this._loadingTimeoutId=null),this.sdkStateController?.currentState.isLoading&&this.sdkStateController.forceCompleteLoading(),this._eventListenerController&&(this._eventListenerController.abort(),this._eventListenerController=null),super.disconnectedCallback()}willUpdate(e){e.has(\"options\")&&(this.options?.locale&&(Ii(this.options?.locale)?this.locale=Li(this.options?.locale):E.warn(\"\\u{1F30E}\\u2757 Unsupported locale provided:\",this.options?.locale,\"- Falling back to default locale `en-GB`\")),ki(this.locale||\"en-GB\"))}updated(){let e=getComputedStyle(this);this.sdkContextController.setComputedStyles(e),this.checkLoadingStateChange()}handleExternalCardSubmit(e){this._eventListenerController?.signal.aborted||e.target!==this&&this.primerEventsController.dispatchEvent(\"primer:card-submit\",e.detail)}handleExternalVaultSubmit(e){this._eventListenerController?.signal.aborted||e.target!==this&&this.primerEventsController.dispatchEvent(\"primer:vault-submit\",e.detail)}handleExternalShowOtherPaymentsToggle(e){this._eventListenerController?.signal.aborted||e.target!==this&&this.primerEventsController.dispatchEvent(\"primer:show-other-payments-toggle\",e.detail)}checkLoadingStateChange(){let e=this.sdkStateController?.currentState.isLoading||!1;this.previousLoadingState&&!e&&(this.jsInitialized=!0,Q({eventName:\"CHECKOUT_FLOW_STARTED\"})),this.previousLoadingState=e,e&&!this._loadingTimeoutId?this._loadingTimeoutId=window.setTimeout(()=>{this.sdkStateController?.currentState.isLoading&&(E.warn(\"Loading timeout in component, forcing completion\"),this.sdkStateController.forceCompleteLoading(),this.jsInitialized=!0),this._loadingTimeoutId=null},1e4):!e&&this._loadingTimeoutId&&(window.clearTimeout(this._loadingTimeoutId),this._loadingTimeoutId=null)}render(){let e=this.sdkStateController.currentState,a=e.isLoading,i=e.primerJsError,n=!a&&!i;return p` ${L(a,()=>g)} ${L(i,()=>p`<primer-checkout-error></primer-checkout-error>`)} ${L(n,()=>p`<slot name=\"main\" @slotchange=${this.onSlotChange}></slot>${L(this.hasAssignedContent,()=>g,()=>p`<primer-main></primer-main>`)} `,()=>g)} `}addEventListener(e,a,i){super.addEventListener(e,a,i)}removeEventListener(e,a,i){super.removeEventListener(e,a,i)}}"
69
69
  },
70
70
  {
71
71
  "kind": "function",
@@ -86,7 +86,7 @@
86
86
  {
87
87
  "kind": "variable",
88
88
  "name": "He",
89
- "default": "class extends v{constructor(){super(...arguments);this.color=\"var(--primer-color-loader)\";this.size=\"medium\";this.compact=!1}getSize(){if(this.size in Ui)return Ui[this.size];let e=parseInt(this.size,10);return isNaN(e)?Ui.medium:e}render(){let e=this.getSize(),a=20,i=`0 0 ${a} ${a}`;return this.style.setProperty(\"--spinner-color\",this.color),this.style.setProperty(\"--spinner-size\",`${e}px`),p`<div class=\"spinner-container ${this.compact?\"compact\":\"\"}\"><svg class=\"spinner\" width=\"${e}\" height=\"${e}\" viewBox=\"${i}\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" role=\"status\" aria-label=\"Loading\" ><path d=\"M4.27827 10.002C4.27827 6.84166 6.84019 4.27973 10.0005 4.27973C10.7676 4.27973 11.3894 3.6579 11.3894 2.89084C11.3894 2.12378 10.7676 1.50195 10.0005 1.50195C5.30607 1.50195 1.50049 5.30753 1.50049 10.002C1.50049 14.6964 5.30607 18.502 10.0005 18.502C14.6949 18.502 18.5005 14.6964 18.5005 10.002C18.5005 9.23489 17.8787 8.61306 17.1116 8.61306C16.3445 8.61306 15.7227 9.23489 15.7227 10.002C15.7227 13.1622 13.1608 15.7242 10.0005 15.7242C6.84019 15.7242 4.27827 13.1622 4.27827 10.002Z\" fill=\"currentColor\" class=\"path\" /></svg></div>`}}"
89
+ "default": "class extends v{constructor(){super(...arguments);this.color=\"var(--primer-color-loader)\";this.size=\"medium\";this.compact=!1}getSize(){if(this.size in Fi)return Fi[this.size];let e=parseInt(this.size,10);return isNaN(e)?Fi.medium:e}render(){let e=this.getSize(),a=20,i=`0 0 ${a} ${a}`;return this.style.setProperty(\"--spinner-color\",this.color),this.style.setProperty(\"--spinner-size\",`${e}px`),p`<div class=\"spinner-container ${this.compact?\"compact\":\"\"}\"><svg class=\"spinner\" width=\"${e}\" height=\"${e}\" viewBox=\"${i}\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" role=\"status\" aria-label=\"Loading\" ><path d=\"M4.27827 10.002C4.27827 6.84166 6.84019 4.27973 10.0005 4.27973C10.7676 4.27973 11.3894 3.6579 11.3894 2.89084C11.3894 2.12378 10.7676 1.50195 10.0005 1.50195C5.30607 1.50195 1.50049 5.30753 1.50049 10.002C1.50049 14.6964 5.30607 18.502 10.0005 18.502C14.6949 18.502 18.5005 14.6964 18.5005 10.002C18.5005 9.23489 17.8787 8.61306 17.1116 8.61306C16.3445 8.61306 15.7227 9.23489 15.7227 10.002C15.7227 13.1622 13.1608 15.7242 10.0005 15.7242C6.84019 15.7242 4.27827 13.1622 4.27827 10.002Z\" fill=\"currentColor\" class=\"path\" /></svg></div>`}}"
90
90
  },
91
91
  {
92
92
  "kind": "variable",
@@ -156,17 +156,17 @@
156
156
  {
157
157
  "kind": "variable",
158
158
  "name": "je",
159
- "default": "class extends v{constructor(){super();this.paymentManagers=new Map;this.disabled=!1;this.loadManagerTask=new D(this,{args:()=>[this.paymentMethod?.type],task:([e])=>{if(!e)return _;let a=this.paymentManagers.get(e);if(!a)throw new Error(`No manager found for payment method type ${e}`);if(a.type!==\"GOOGLE_PAY\")throw new Error(\"Invalid payment method type for Google Pay component\");return a.manager}}),this.renderButtonTask=new D(this,{args:()=>[this.loadManagerTask.value],task:async([e])=>{if(!e)return _;await this.updateComplete;let a=e.createButton();return await a.render(this.shadowRoot?.getRootNode(),{style:{shadowRoot:!0}}),this.disabled&&await a.setDisabled(this.disabled),this.disabled&&this.shadowRoot&&(await this.updateComplete,Ar(this.disabled,this.shadowRoot)),a}})}attributeChangedCallback(e,a,i){if(super.attributeChangedCallback(e,a,i),e===\"disabled\"&&a!==i){let n=i!==null,o=this.renderButtonTask.value;o&&o.setDisabled(n)}}updated(e){e.has(\"disabled\")&&this.shadowRoot&&Ar(this.disabled,this.shadowRoot)}render(){return g}}"
159
+ "default": "class extends v{constructor(){super();this.paymentManagers=new Map;this.disabled=!1;this.loadManagerTask=new D(this,{args:()=>[this.paymentMethod?.type],task:([e])=>{if(!e)return _;let a=this.paymentManagers.get(e);if(!a)throw new Error(`No manager found for payment method type ${e}`);if(a.type!==\"GOOGLE_PAY\")throw new Error(\"Invalid payment method type for Google Pay component\");return a.manager}}),this.renderButtonTask=new D(this,{args:()=>[this.loadManagerTask.value],task:async([e])=>{if(!e)return _;await this.updateComplete;let a=e.createButton();return await a.render(this.shadowRoot?.getRootNode(),{style:{shadowRoot:!0}}),this.disabled&&await a.setDisabled(this.disabled),this.disabled&&this.shadowRoot&&(await this.updateComplete,Mr(this.disabled,this.shadowRoot)),a}})}attributeChangedCallback(e,a,i){if(super.attributeChangedCallback(e,a,i),e===\"disabled\"&&a!==i){let n=i!==null,o=this.renderButtonTask.value;o&&o.setDisabled(n)}}updated(e){e.has(\"disabled\")&&this.shadowRoot&&Mr(this.disabled,this.shadowRoot)}render(){return g}}"
160
160
  },
161
161
  {
162
162
  "kind": "variable",
163
163
  "name": "We",
164
- "default": "class extends v{constructor(){super();this.paymentManagers=new Map;this.disabled=!1;this.buttonContainerRef=Bt();this.loadManagerTask=new D(this,{args:()=>[this.paymentMethod?.type],task:([e])=>{if(!e)return _;let a=this.paymentManagers.get(e);if(!a)throw new Error(`No manager found for payment method type ${e}`);if(a.type!==\"APPLE_PAY\")throw new Error(\"Invalid payment method type for Apple Pay component\");return a.manager}}),this.renderButtonTask=new D(this,{args:()=>[this.loadManagerTask.value],task:async([e])=>{if(!e)return _;await this.updateComplete;let a=this.buttonContainerRef.value;if(!a)throw new Error(\"Button container not found\");let i=e.createButton(),n=Er(a);return await i.render(a,{style:{buttonHeight:n}}),this.disabled&&await i.setDisabled(this.disabled),this.disabled&&(await this.updateComplete,Wt(this.disabled,this.buttonContainerRef)),i}})}attributeChangedCallback(e,a,i){if(super.attributeChangedCallback(e,a,i),e===\"disabled\"&&a!==i){let n=i!==null,o=this.renderButtonTask.value;o&&o.setDisabled(n)}}updated(e){e.has(\"disabled\")&&Wt(this.disabled,this.buttonContainerRef)}render(){return p`<div class=\"native-button-container\" ${bt(this.buttonContainerRef)} ></div>`}}"
164
+ "default": "class extends v{constructor(){super();this.paymentManagers=new Map;this.disabled=!1;this.buttonContainerRef=Bt();this.loadManagerTask=new D(this,{args:()=>[this.paymentMethod?.type],task:([e])=>{if(!e)return _;let a=this.paymentManagers.get(e);if(!a)throw new Error(`No manager found for payment method type ${e}`);if(a.type!==\"APPLE_PAY\")throw new Error(\"Invalid payment method type for Apple Pay component\");return a.manager}}),this.renderButtonTask=new D(this,{args:()=>[this.loadManagerTask.value],task:async([e])=>{if(!e)return _;await this.updateComplete;let a=this.buttonContainerRef.value;if(!a)throw new Error(\"Button container not found\");let i=e.createButton(),n=Tr(a);return await i.render(a,{style:{buttonHeight:n}}),this.disabled&&await i.setDisabled(this.disabled),this.disabled&&(await this.updateComplete,Wt(this.disabled,this.buttonContainerRef)),i}})}attributeChangedCallback(e,a,i){if(super.attributeChangedCallback(e,a,i),e===\"disabled\"&&a!==i){let n=i!==null,o=this.renderButtonTask.value;o&&o.setDisabled(n)}}updated(e){e.has(\"disabled\")&&Wt(this.disabled,this.buttonContainerRef)}render(){return p`<div class=\"native-button-container\" ${bt(this.buttonContainerRef)} ></div>`}}"
165
165
  },
166
166
  {
167
167
  "kind": "variable",
168
168
  "name": "Je",
169
- "default": "class extends v{constructor(){super();this.paymentManagers=new Map;this.disabled=!1;this.buttonContainerRef=Bt();this.loadManagerTask=new D(this,{args:()=>[this.paymentMethod?.type],task:([e])=>{if(!e)return _;let a=this.paymentManagers.get(e);if(!a)throw new Error(`No manager found for payment method type ${e}`);if(a.type!==\"PAYPAL\")throw new Error(\"Invalid payment method type for PayPal component\");return a.manager}}),this.renderButtonTask=new D(this,{args:()=>[this.loadManagerTask.value],task:async([e])=>{if(!e)return _;await this.updateComplete;let a=this.buttonContainerRef.value;if(!a)throw new Error(\"Button container not found\");let i=e.createButton(),n=Er(this),o=vs(n),s=55;return n>s&&E.warn(`PayPal button height (${n}px) exceeds maximum allowed height of ${s}px. Button will be capped at ${s}px. This is a PayPal SDK limitation.`),await i.render(a,{style:{buttonHeight:o}}),this.disabled&&await i.setDisabled(this.disabled),this.disabled&&(await this.updateComplete,Wt(this.disabled,this.buttonContainerRef)),i}})}attributeChangedCallback(e,a,i){if(super.attributeChangedCallback(e,a,i),e===\"disabled\"&&a!==i){let n=i!==null,o=this.renderButtonTask.value;o&&o.setDisabled(n)}}updated(e){e.has(\"disabled\")&&Wt(this.disabled,this.buttonContainerRef)}render(){return p`<div class=\"native-button-container\" ${bt(this.buttonContainerRef)} ></div>`}}"
169
+ "default": "class extends v{constructor(){super();this.paymentManagers=new Map;this.disabled=!1;this.buttonContainerRef=Bt();this.loadManagerTask=new D(this,{args:()=>[this.paymentMethod?.type],task:([e])=>{if(!e)return _;let a=this.paymentManagers.get(e);if(!a)throw new Error(`No manager found for payment method type ${e}`);if(a.type!==\"PAYPAL\")throw new Error(\"Invalid payment method type for PayPal component\");return a.manager}}),this.renderButtonTask=new D(this,{args:()=>[this.loadManagerTask.value],task:async([e])=>{if(!e)return _;await this.updateComplete;let a=this.buttonContainerRef.value;if(!a)throw new Error(\"Button container not found\");let i=e.createButton(),n=Tr(this),o=vs(n),s=55;return n>s&&E.warn(`PayPal button height (${n}px) exceeds maximum allowed height of ${s}px. Button will be capped at ${s}px. This is a PayPal SDK limitation.`),await i.render(a,{style:{buttonHeight:o}}),this.disabled&&await i.setDisabled(this.disabled),this.disabled&&(await this.updateComplete,Wt(this.disabled,this.buttonContainerRef)),i}})}attributeChangedCallback(e,a,i){if(super.attributeChangedCallback(e,a,i),e===\"disabled\"&&a!==i){let n=i!==null,o=this.renderButtonTask.value;o&&o.setDisabled(n)}}updated(e){e.has(\"disabled\")&&Wt(this.disabled,this.buttonContainerRef)}render(){return p`<div class=\"native-button-container\" ${bt(this.buttonContainerRef)} ></div>`}}"
170
170
  },
171
171
  {
172
172
  "kind": "variable",
@@ -186,7 +186,7 @@
186
186
  {
187
187
  "kind": "variable",
188
188
  "name": "Te",
189
- "default": "class extends v{constructor(){super(...arguments);this.formController=new Tr(this,e=>this._paymentMethodManagerTask.value.setAndValidate(e));this.paymentManagers=new Map;this.sdkState=void 0;this.clientOptions=void 0;this.screen=\"form\";this.isSubmitting=!1;this._paymentMethodManagerTask=new D(this,{task:([e])=>e!==\"STRIPE_ACH\"?_:this.paymentManagers.get(e)?.manager,args:()=>[this.paymentMethod?.type]})}_handleInput(e,a){let i=e.target;this.formController.setFieldValue(a,i.value)}_handleBlur(e){this.formController.setFieldTouched(e)}_handleError(e){this.dispatchEvent(new CustomEvent(\"primer-ach-error\",{bubbles:!0,composed:!0,detail:{error:e instanceof Error?e:new Error(typeof e==\"string\"?e:\"Unknown error occurred\")}}))}async _handleSubmitButtonClick(e){if(!this.isSubmitting){this.isSubmitting=!0;try{let a=await e.start(this.formController.formData);if(!a||a.valid)return await this._handleCollectBankAccountDetails(e);a&&this.formController.setValidation(a,!0)}catch(a){this._handleError(a)}finally{this.isSubmitting=!1}}}async _handleCollectBankAccountDetails(e){try{await e.collectBankAccountDetails(),this.screen=\"mandate\",this.dispatchEvent(new CustomEvent(\"primer-ach-bank-details-collected\",{bubbles:!0,composed:!0}))}catch(a){this._handleError(a)}}async _handleConfirmMandate(){if(this._paymentMethodManagerTask.value){this.isSubmitting=!0;try{await this._paymentMethodManagerTask.value.confirmMandate(),this.dispatchEvent(new CustomEvent(\"primer-ach-mandate-confirmed\",{bubbles:!0,composed:!0}))}catch(e){this._handleError(e)}finally{this.isSubmitting=!1}}}async _handleDeclineMandate(){if(this._paymentMethodManagerTask.value){this.isSubmitting=!0;try{await this._paymentMethodManagerTask.value.declineMandate(),this.dispatchEvent(new CustomEvent(\"primer-ach-mandate-declined\",{bubbles:!0,composed:!0}))}catch(e){this._handleError(e)}finally{this.isSubmitting=!1}}}renderForm(e){return p`<h2>${b(\"payWithAch\",{id:\"payWithAch\"})}</h2><p>${b(\"stripe_ach_user_details_collection_subtitle_label\",{id:\"stripe_ach_user_details_collection_subtitle_label\"})}</p><form @submit=${a=>a.preventDefault()}><div class=\"form-row\"><primer-input-wrapper .hasError=${this.formController.hasError.firstName} ><primer-input-label slot=\"label\">${b(\"stripe_ach_user_details_collection_first_name_label\",{id:\"stripe_ach_user_details_collection_first_name_label\"})}</primer-input-label><primer-input slot=\"input\" .value=${this.formController.formState.firstName.value} @input=${a=>this._handleInput(a,\"firstName\")} @blur=${()=>this._handleBlur(\"firstName\")} ?disabled=${this.isSubmitting} ></primer-input><primer-input-error slot=\"error\">${this.formController.hasError.firstName?this.formController.formState.firstName.error:g}</primer-input-error></primer-input-wrapper><primer-input-wrapper .hasError=${this.formController.hasError.lastName} ><primer-input-label slot=\"label\">${b(\"stripe_ach_user_details_collection_last_name_label\",{id:\"stripe_ach_user_details_collection_last_name_label\"})}</primer-input-label><primer-input slot=\"input\" .value=${this.formController.formState.lastName.value} @input=${a=>this._handleInput(a,\"lastName\")} @blur=${()=>this._handleBlur(\"lastName\")} ?disabled=${this.isSubmitting} ></primer-input><primer-input-error slot=\"error\">${this.formController.hasError.lastName?this.formController.formState.lastName.error:g}</primer-input-error></primer-input-wrapper></div><primer-input-wrapper .hasError=${this.formController.hasError.emailAddress} ><primer-input-label slot=\"label\">${b(\"stripe_ach_user_details_collection_email_address_label\",{id:\"stripe_ach_user_details_collection_email_address_label\"})}</primer-input-label><primer-input slot=\"input\" type=\"email\" .value=${this.formController.formState.emailAddress.value} @input=${a=>this._handleInput(a,\"emailAddress\")} @blur=${()=>this._handleBlur(\"emailAddress\")} ?disabled=${this.isSubmitting} ></primer-input><primer-input-error slot=\"error\">${this.formController.hasError.emailAddress?this.formController.formState.emailAddress.error:g}</primer-input-error></primer-input-wrapper><p>${b(\"stripe_ach_user_details_collection_data_usage_label\",{id:\"stripe_ach_user_details_collection_data_usage_label\"})}</p><primer-button buttonType=\"submit\" variant=\"primary\" @click=${()=>this._handleSubmitButtonClick(e)} ?disabled=${this.isSubmitting} ?loading=${this.isSubmitting} >${b(\"stripe_ach_user_details_collection_continue_button\",{id:\"stripe_ach_user_details_collection_continue_button\"})}</primer-button></form>`}renderMandate(){return p`<h2>${b(\"payWithAch\",{id:\"payWithAch\"})}</h2><p>${this.clientOptions?.stripe?.mandateData.fullMandateText??b(\"stripe_ach_mandate_template_web\",{id:\"stripe_ach_mandate_template_web\"}).replace(/\\{merchantName\\}/g,this.clientOptions?.stripe?.mandateData.merchantName??\"Merchant\")}</p><div class=\"button-group\"><primer-button variant=\"primary\" @click=${this._handleConfirmMandate.bind(this)} ?disabled=${this.isSubmitting} ?loading=${this.isSubmitting} >${b(\"stripe_ach_mandate_accept_button\",{id:\"stripe_ach_mandate_accept_button\"})}</primer-button><primer-button variant=\"tertiary\" @click=${this._handleDeclineMandate.bind(this)} ?disabled=${this.isSubmitting} >${b(\"stripe_ach_mandate_cancel_payment_button\",{id:\"stripe_ach_mandate_cancel_payment_button\"})}</primer-button></div>`}render(){return this._paymentMethodManagerTask.render({complete:e=>e?this.screen===\"form\"?this.renderForm(e):this.renderMandate():g})}}"
189
+ "default": "class extends v{constructor(){super(...arguments);this.formController=new Pr(this,e=>this._paymentMethodManagerTask.value.setAndValidate(e));this.paymentManagers=new Map;this.sdkState=void 0;this.clientOptions=void 0;this.screen=\"form\";this.isSubmitting=!1;this._paymentMethodManagerTask=new D(this,{task:([e])=>e!==\"STRIPE_ACH\"?_:this.paymentManagers.get(e)?.manager,args:()=>[this.paymentMethod?.type]})}_handleInput(e,a){let i=e.target;this.formController.setFieldValue(a,i.value)}_handleBlur(e){this.formController.setFieldTouched(e)}_handleError(e){this.dispatchEvent(new CustomEvent(\"primer-ach-error\",{bubbles:!0,composed:!0,detail:{error:e instanceof Error?e:new Error(typeof e==\"string\"?e:\"Unknown error occurred\")}}))}async _handleSubmitButtonClick(e){if(!this.isSubmitting){this.isSubmitting=!0;try{let a=await e.start(this.formController.formData);if(!a||a.valid)return await this._handleCollectBankAccountDetails(e);a&&this.formController.setValidation(a,!0)}catch(a){this._handleError(a)}finally{this.isSubmitting=!1}}}async _handleCollectBankAccountDetails(e){try{await e.collectBankAccountDetails(),this.screen=\"mandate\",this.dispatchEvent(new CustomEvent(\"primer-ach-bank-details-collected\",{bubbles:!0,composed:!0}))}catch(a){this._handleError(a)}}async _handleConfirmMandate(){if(this._paymentMethodManagerTask.value){this.isSubmitting=!0;try{await this._paymentMethodManagerTask.value.confirmMandate(),this.dispatchEvent(new CustomEvent(\"primer-ach-mandate-confirmed\",{bubbles:!0,composed:!0}))}catch(e){this._handleError(e)}finally{this.isSubmitting=!1}}}async _handleDeclineMandate(){if(this._paymentMethodManagerTask.value){this.isSubmitting=!0;try{await this._paymentMethodManagerTask.value.declineMandate(),this.dispatchEvent(new CustomEvent(\"primer-ach-mandate-declined\",{bubbles:!0,composed:!0}))}catch(e){this._handleError(e)}finally{this.isSubmitting=!1}}}renderForm(e){return p`<h2>${b(\"payWithAch\",{id:\"payWithAch\"})}</h2><p>${b(\"stripe_ach_user_details_collection_subtitle_label\",{id:\"stripe_ach_user_details_collection_subtitle_label\"})}</p><form @submit=${a=>a.preventDefault()}><div class=\"form-row\"><primer-input-wrapper .hasError=${this.formController.hasError.firstName} ><primer-input-label slot=\"label\">${b(\"stripe_ach_user_details_collection_first_name_label\",{id:\"stripe_ach_user_details_collection_first_name_label\"})}</primer-input-label><primer-input slot=\"input\" .value=${this.formController.formState.firstName.value} @input=${a=>this._handleInput(a,\"firstName\")} @blur=${()=>this._handleBlur(\"firstName\")} ?disabled=${this.isSubmitting} ></primer-input><primer-input-error slot=\"error\">${this.formController.hasError.firstName?this.formController.formState.firstName.error:g}</primer-input-error></primer-input-wrapper><primer-input-wrapper .hasError=${this.formController.hasError.lastName} ><primer-input-label slot=\"label\">${b(\"stripe_ach_user_details_collection_last_name_label\",{id:\"stripe_ach_user_details_collection_last_name_label\"})}</primer-input-label><primer-input slot=\"input\" .value=${this.formController.formState.lastName.value} @input=${a=>this._handleInput(a,\"lastName\")} @blur=${()=>this._handleBlur(\"lastName\")} ?disabled=${this.isSubmitting} ></primer-input><primer-input-error slot=\"error\">${this.formController.hasError.lastName?this.formController.formState.lastName.error:g}</primer-input-error></primer-input-wrapper></div><primer-input-wrapper .hasError=${this.formController.hasError.emailAddress} ><primer-input-label slot=\"label\">${b(\"stripe_ach_user_details_collection_email_address_label\",{id:\"stripe_ach_user_details_collection_email_address_label\"})}</primer-input-label><primer-input slot=\"input\" type=\"email\" .value=${this.formController.formState.emailAddress.value} @input=${a=>this._handleInput(a,\"emailAddress\")} @blur=${()=>this._handleBlur(\"emailAddress\")} ?disabled=${this.isSubmitting} ></primer-input><primer-input-error slot=\"error\">${this.formController.hasError.emailAddress?this.formController.formState.emailAddress.error:g}</primer-input-error></primer-input-wrapper><p>${b(\"stripe_ach_user_details_collection_data_usage_label\",{id:\"stripe_ach_user_details_collection_data_usage_label\"})}</p><primer-button buttonType=\"submit\" variant=\"primary\" @click=${()=>this._handleSubmitButtonClick(e)} ?disabled=${this.isSubmitting} ?loading=${this.isSubmitting} >${b(\"stripe_ach_user_details_collection_continue_button\",{id:\"stripe_ach_user_details_collection_continue_button\"})}</primer-button></form>`}renderMandate(){return p`<h2>${b(\"payWithAch\",{id:\"payWithAch\"})}</h2><p>${this.clientOptions?.stripe?.mandateData.fullMandateText??b(\"stripe_ach_mandate_template_web\",{id:\"stripe_ach_mandate_template_web\"}).replace(/\\{merchantName\\}/g,this.clientOptions?.stripe?.mandateData.merchantName??\"Merchant\")}</p><div class=\"button-group\"><primer-button variant=\"primary\" @click=${this._handleConfirmMandate.bind(this)} ?disabled=${this.isSubmitting} ?loading=${this.isSubmitting} >${b(\"stripe_ach_mandate_accept_button\",{id:\"stripe_ach_mandate_accept_button\"})}</primer-button><primer-button variant=\"tertiary\" @click=${this._handleDeclineMandate.bind(this)} ?disabled=${this.isSubmitting} >${b(\"stripe_ach_mandate_cancel_payment_button\",{id:\"stripe_ach_mandate_cancel_payment_button\"})}</primer-button></div>`}render(){return this._paymentMethodManagerTask.render({complete:e=>e?this.screen===\"form\"?this.renderForm(e):this.renderMandate():g})}}"
190
190
  },
191
191
  {
192
192
  "kind": "variable",
@@ -201,17 +201,17 @@
201
201
  {
202
202
  "kind": "variable",
203
203
  "name": "oe",
204
- "default": "class extends v{constructor(){super(...arguments);this.configuration=null;this.headlessUtils=null;this.formData={};this.errors={};this.touchedFields=new Set;this.dirtyFields=new Set;this.focusedField=null;this.submitted=!1;this.countryOptions=[];this._initializationTask=new D(this,{task:async([e,a])=>{if(!e||!a)return _;let i=this.extractFieldConfig(e);return await this.initializeCountryOptions(),i},args:()=>[this.configuration,this.headlessUtils]})}connectedCallback(){super.connectedCallback(),this._initializationTask.value}extractFieldConfig(e){if(e?.checkoutModules){let a=e.checkoutModules.find(i=>i.type===\"BILLING_ADDRESS\");if(a?.options){let i=a.options;return Object.keys(ji).reduce((n,o)=>({...n,[o]:i[o]??!1}),{})}}return this.defaultFieldConfig}async initializeCountryOptions(){try{let e=zi(\"en\");this.countryOptions=[...e.map(([n,o])=>({value:n,label:o}))],this.requestUpdate(\"countryOptions\");let a=ki();if(a===\"en\"||a===\"en-GB\"||a.startsWith(\"en-\"))return;if(await dl(a)){let n=zi(a);this.countryOptions=[...n.map(([o,s])=>({value:o,label:s}))],this.requestUpdate(\"countryOptions\")}}catch(e){E.errorWithDatadog(\"Failed to load country locale\",{error:e})}}get fieldConfig(){return this.extractFieldConfig(this.configuration)}get defaultFieldConfig(){return Object.keys(ji).reduce((e,a)=>({...e,[a]:!1}),{})}get shouldShowForm(){return this.fieldConfig.postalCode}handleInput(e,a){this.formData={...this.formData,[e]:a},this.dirtyFields.add(e),(this.submitted||this.dirtyFields.has(e)&&this.touchedFields.has(e))&&this.validateField(e),this.dispatchEvent(new CustomEvent(\"primer-billing-address-change\",{detail:this.formData,bubbles:!0,composed:!0}))}handleFocus(e){this.focusedField=e}handleBlur(e){this.focusedField=null,this.touchedFields.add(e),this.validateField(e)}validateField(e){let a=this.formData[e],i=this.fieldConfig[e];if(!i){delete this.errors[e];return}if(i&&(!a||a.trim()===\"\")){let n=`${e}ErrorRequired`;this.errors={...this.errors,[e]:b(\"This field is required\",{id:n})}}else{let n={...this.errors};delete n[e],this.errors=n}}validateForm(){return Object.keys(ji).forEach(e=>{let a=e;this.fieldConfig[a]&&this.validateField(a)}),Object.keys(this.errors).length===0}async validateForSubmission(){if(!this.shouldShowForm)return!0;this.submitted=!0,Object.keys(this.fieldConfig).forEach(a=>{this.fieldConfig[a]&&this.touchedFields.add(a)});let e=this.validateForm();return this.requestUpdate(),await this.updateComplete,e}async submitToSDK(){if(this.headlessUtils?.setBillingAddress)try{return await this.headlessUtils.setBillingAddress(this.formData),this.dispatchEvent(new CustomEvent(\"primer-billing-address-submit\",{detail:this.formData,bubbles:!0,composed:!0})),!0}catch(e){return E.errorWithDatadog(\"Failed to set billing address\",{error:e}),!1}return!0}shouldShowError(e){let a=!!this.errors[e],i=this.dirtyFields.has(e),n=this.touchedFields.has(e);return a&&(this.submitted||i&&n)}render(){return this._initializationTask.render({pending:()=>g,error:()=>g,complete:()=>this.shouldShowForm?(this.removeAttribute(\"hidden\"),p`<div class=\"billing-address-form\"><div class=\"billing-address-title\">${b(\"Billing address\",{id:\"billingAddressLabel\"})}</div>${L(this.fieldConfig.countryCode,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"countryCode\"} .hasError=${this.shouldShowError(\"countryCode\")} ><primer-input-label slot=\"label\">${b(\"Country code\",{id:\"countryCodeLabel\"})}</primer-input-label><primer-select slot=\"input\" id=\"countryCode\" name=\"countryCode\" .value=${this.formData.countryCode||\"\"} .options=${this.countryOptions} .hasError=${this.shouldShowError(\"countryCode\")} placeholder=${b(\"Select a country\",{id:\"countrySelectPlaceholder\"})} @input=${e=>this.handleInput(\"countryCode\",e.detail)} @focus=${()=>this.handleFocus(\"countryCode\")} @blur=${()=>this.handleBlur(\"countryCode\")} ></primer-select>${L(this.shouldShowError(\"countryCode\"),()=>p`<primer-input-error slot=\"error\">${this.errors.countryCode}</primer-input-error>`)}</primer-input-wrapper>`)} ${L(this.fieldConfig.firstName||this.fieldConfig.lastName,()=>p`<div class=\"billing-address-row\">${L(this.fieldConfig.firstName,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"firstName\"} .hasError=${this.shouldShowError(\"firstName\")} ><primer-input-label slot=\"label\">${b(\"First name\",{id:\"firstNameLabel\"})}</primer-input-label><primer-input slot=\"input\" id=\"firstName\" name=\"firstName\" type=\"text\" .value=${this.formData.firstName||\"\"} placeholder=${b(\"First name\",{id:\"firstNamePlaceholder\"})} @input=${e=>this.handleInput(\"firstName\",e.detail)} @focus=${()=>this.handleFocus(\"firstName\")} @blur=${()=>this.handleBlur(\"firstName\")} ></primer-input>${L(this.shouldShowError(\"firstName\"),()=>p`<primer-input-error slot=\"error\">${this.errors.firstName}</primer-input-error>`)}</primer-input-wrapper>`)} ${L(this.fieldConfig.lastName,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"lastName\"} .hasError=${this.shouldShowError(\"lastName\")} ><primer-input-label slot=\"label\">${b(\"Last name\",{id:\"lastNameLabel\"})}</primer-input-label><primer-input slot=\"input\" id=\"lastName\" name=\"lastName\" type=\"text\" .value=${this.formData.lastName||\"\"} placeholder=${b(\"Last name\",{id:\"lastNamePlaceholder\"})} @input=${e=>this.handleInput(\"lastName\",e.detail)} @focus=${()=>this.handleFocus(\"lastName\")} @blur=${()=>this.handleBlur(\"lastName\")} ></primer-input>${L(this.shouldShowError(\"lastName\"),()=>p`<primer-input-error slot=\"error\">${this.errors.lastName}</primer-input-error>`)}</primer-input-wrapper>`)}</div>`)} ${L(this.fieldConfig.addressLine1,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"addressLine1\"} .hasError=${this.shouldShowError(\"addressLine1\")} ><primer-input-label slot=\"label\">${b(\"Address line 1\",{id:\"addressLine1\"})}</primer-input-label><primer-input slot=\"input\" id=\"addressLine1\" name=\"addressLine1\" type=\"text\" .value=${this.formData.addressLine1||\"\"} placeholder=${b(\"Address line 1\",{id:\"addressLine1Placeholder\"})} @input=${e=>this.handleInput(\"addressLine1\",e.detail)} @focus=${()=>this.handleFocus(\"addressLine1\")} @blur=${()=>this.handleBlur(\"addressLine1\")} ></primer-input>${L(this.shouldShowError(\"addressLine1\"),()=>p`<primer-input-error slot=\"error\">${this.errors.addressLine1}</primer-input-error>`)}</primer-input-wrapper>`)} ${L(this.fieldConfig.addressLine2,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"addressLine2\"} .hasError=${this.shouldShowError(\"addressLine2\")} ><primer-input-label slot=\"label\">${b(\"Address line 2\",{id:\"addressLine2\"})}</primer-input-label><primer-input slot=\"input\" id=\"addressLine2\" name=\"addressLine2\" type=\"text\" .value=${this.formData.addressLine2||\"\"} placeholder=${b(\"Address line 2\",{id:\"addressLine2Placeholder\"})} @input=${e=>this.handleInput(\"addressLine2\",e.detail)} @focus=${()=>this.handleFocus(\"addressLine2\")} @blur=${()=>this.handleBlur(\"addressLine2\")} ></primer-input>${L(this.shouldShowError(\"addressLine2\"),()=>p`<primer-input-error slot=\"error\">${this.errors.addressLine2}</primer-input-error>`)}</primer-input-wrapper>`)} ${L(this.fieldConfig.postalCode||this.fieldConfig.city,()=>p`<div class=\"billing-address-row\">${L(this.fieldConfig.postalCode,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"postalCode\"} .hasError=${this.shouldShowError(\"postalCode\")} ><primer-input-label slot=\"label\">${b(\"Postal code\",{id:\"postalCodeLabel\"})}</primer-input-label><primer-input slot=\"input\" id=\"postalCode\" name=\"postalCode\" type=\"text\" .value=${this.formData.postalCode||\"\"} placeholder=${b(\"90210\",{id:\"postalCodePlaceholder\"})} @input=${e=>this.handleInput(\"postalCode\",e.detail)} @focus=${()=>this.handleFocus(\"postalCode\")} @blur=${()=>this.handleBlur(\"postalCode\")} ></primer-input>${L(this.shouldShowError(\"postalCode\"),()=>p`<primer-input-error slot=\"error\">${this.errors.postalCode}</primer-input-error>`)}</primer-input-wrapper>`)} ${L(this.fieldConfig.city,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"city\"} .hasError=${this.shouldShowError(\"city\")} ><primer-input-label slot=\"label\">${b(\"City\",{id:\"cityLabel\"})}</primer-input-label><primer-input slot=\"input\" id=\"city\" name=\"city\" type=\"text\" .value=${this.formData.city||\"\"} placeholder=${b(\"Cape Town\",{id:\"cityPlaceholder\"})} @input=${e=>this.handleInput(\"city\",e.detail)} @focus=${()=>this.handleFocus(\"city\")} @blur=${()=>this.handleBlur(\"city\")} ></primer-input>${L(this.shouldShowError(\"city\"),()=>p`<primer-input-error slot=\"error\">${this.errors.city}</primer-input-error>`)}</primer-input-wrapper>`)}</div>`)} ${L(this.fieldConfig.state,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"state\"} .hasError=${this.shouldShowError(\"state\")} ><primer-input-label slot=\"label\">${b(\"State / Region / County\",{id:\"stateLabel\"})}</primer-input-label><primer-input slot=\"input\" id=\"state\" name=\"state\" type=\"text\" .value=${this.formData.state||\"\"} placeholder=${b(\"State / Region / County\",{id:\"statePlaceholder\"})} @input=${e=>this.handleInput(\"state\",e.detail)} @focus=${()=>this.handleFocus(\"state\")} @blur=${()=>this.handleBlur(\"state\")} ></primer-input>${L(this.shouldShowError(\"state\"),()=>p`<primer-input-error slot=\"error\">${this.errors.state}</primer-input-error>`)}</primer-input-wrapper>`)}</div>`):(this.setAttribute(\"hidden\",\"\"),g)})}}"
204
+ "default": "class extends v{constructor(){super(...arguments);this.configuration=null;this.headlessUtils=null;this.formData={};this.errors={};this.touchedFields=new Set;this.dirtyFields=new Set;this.focusedField=null;this.submitted=!1;this.countryOptions=[];this._initializationTask=new D(this,{task:async([e,a])=>{if(!e||!a)return _;let i=this.extractFieldConfig(e);return await this.initializeCountryOptions(),i},args:()=>[this.configuration,this.headlessUtils]})}connectedCallback(){super.connectedCallback(),this._initializationTask.value}extractFieldConfig(e){if(e?.checkoutModules){let a=e.checkoutModules.find(i=>i.type===\"BILLING_ADDRESS\");if(a?.options){let i=a.options;return Object.keys(Wi).reduce((n,o)=>({...n,[o]:i[o]??!1}),{})}}return this.defaultFieldConfig}async initializeCountryOptions(){try{let e=ji(\"en\");this.countryOptions=[...e.map(([n,o])=>({value:n,label:o}))],this.requestUpdate(\"countryOptions\");let a=Ni();if(a===\"en\"||a===\"en-GB\"||a.startsWith(\"en-\"))return;if(await dl(a)){let n=ji(a);this.countryOptions=[...n.map(([o,s])=>({value:o,label:s}))],this.requestUpdate(\"countryOptions\")}}catch(e){E.errorWithDatadog(\"Failed to load country locale\",{error:e})}}get fieldConfig(){return this.extractFieldConfig(this.configuration)}get defaultFieldConfig(){return Object.keys(Wi).reduce((e,a)=>({...e,[a]:!1}),{})}get shouldShowForm(){return this.fieldConfig.postalCode}handleInput(e,a){this.formData={...this.formData,[e]:a},this.dirtyFields.add(e),(this.submitted||this.dirtyFields.has(e)&&this.touchedFields.has(e))&&this.validateField(e),this.dispatchEvent(new CustomEvent(\"primer-billing-address-change\",{detail:this.formData,bubbles:!0,composed:!0}))}handleFocus(e){this.focusedField=e}handleBlur(e){this.focusedField=null,this.touchedFields.add(e),this.validateField(e)}validateField(e){let a=this.formData[e],i=this.fieldConfig[e];if(!i){delete this.errors[e];return}if(i&&(!a||a.trim()===\"\")){let n=`${e}ErrorRequired`;this.errors={...this.errors,[e]:b(\"This field is required\",{id:n})}}else{let n={...this.errors};delete n[e],this.errors=n}}validateForm(){return Object.keys(Wi).forEach(e=>{let a=e;this.fieldConfig[a]&&this.validateField(a)}),Object.keys(this.errors).length===0}async validateForSubmission(){if(!this.shouldShowForm)return!0;this.submitted=!0,Object.keys(this.fieldConfig).forEach(a=>{this.fieldConfig[a]&&this.touchedFields.add(a)});let e=this.validateForm();return this.requestUpdate(),await this.updateComplete,e}async submitToSDK(){if(this.headlessUtils?.setBillingAddress)try{return await this.headlessUtils.setBillingAddress(this.formData),this.dispatchEvent(new CustomEvent(\"primer-billing-address-submit\",{detail:this.formData,bubbles:!0,composed:!0})),!0}catch(e){return E.errorWithDatadog(\"Failed to set billing address\",{error:e}),!1}return!0}shouldShowError(e){let a=!!this.errors[e],i=this.dirtyFields.has(e),n=this.touchedFields.has(e);return a&&(this.submitted||i&&n)}render(){return this._initializationTask.render({pending:()=>g,error:()=>g,complete:()=>this.shouldShowForm?(this.removeAttribute(\"hidden\"),p`<div class=\"billing-address-form\"><div class=\"billing-address-title\">${b(\"Billing address\",{id:\"billingAddressLabel\"})}</div>${L(this.fieldConfig.countryCode,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"countryCode\"} .hasError=${this.shouldShowError(\"countryCode\")} ><primer-input-label slot=\"label\">${b(\"Country code\",{id:\"countryCodeLabel\"})}</primer-input-label><primer-select slot=\"input\" id=\"countryCode\" name=\"countryCode\" .value=${this.formData.countryCode||\"\"} .options=${this.countryOptions} .hasError=${this.shouldShowError(\"countryCode\")} placeholder=${b(\"Select a country\",{id:\"countrySelectPlaceholder\"})} @input=${e=>this.handleInput(\"countryCode\",e.detail)} @focus=${()=>this.handleFocus(\"countryCode\")} @blur=${()=>this.handleBlur(\"countryCode\")} ></primer-select>${L(this.shouldShowError(\"countryCode\"),()=>p`<primer-input-error slot=\"error\">${this.errors.countryCode}</primer-input-error>`)}</primer-input-wrapper>`)} ${L(this.fieldConfig.firstName||this.fieldConfig.lastName,()=>p`<div class=\"billing-address-row\">${L(this.fieldConfig.firstName,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"firstName\"} .hasError=${this.shouldShowError(\"firstName\")} ><primer-input-label slot=\"label\">${b(\"First name\",{id:\"firstNameLabel\"})}</primer-input-label><primer-input slot=\"input\" id=\"firstName\" name=\"firstName\" type=\"text\" .value=${this.formData.firstName||\"\"} placeholder=${b(\"First name\",{id:\"firstNamePlaceholder\"})} @input=${e=>this.handleInput(\"firstName\",e.detail)} @focus=${()=>this.handleFocus(\"firstName\")} @blur=${()=>this.handleBlur(\"firstName\")} ></primer-input>${L(this.shouldShowError(\"firstName\"),()=>p`<primer-input-error slot=\"error\">${this.errors.firstName}</primer-input-error>`)}</primer-input-wrapper>`)} ${L(this.fieldConfig.lastName,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"lastName\"} .hasError=${this.shouldShowError(\"lastName\")} ><primer-input-label slot=\"label\">${b(\"Last name\",{id:\"lastNameLabel\"})}</primer-input-label><primer-input slot=\"input\" id=\"lastName\" name=\"lastName\" type=\"text\" .value=${this.formData.lastName||\"\"} placeholder=${b(\"Last name\",{id:\"lastNamePlaceholder\"})} @input=${e=>this.handleInput(\"lastName\",e.detail)} @focus=${()=>this.handleFocus(\"lastName\")} @blur=${()=>this.handleBlur(\"lastName\")} ></primer-input>${L(this.shouldShowError(\"lastName\"),()=>p`<primer-input-error slot=\"error\">${this.errors.lastName}</primer-input-error>`)}</primer-input-wrapper>`)}</div>`)} ${L(this.fieldConfig.addressLine1,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"addressLine1\"} .hasError=${this.shouldShowError(\"addressLine1\")} ><primer-input-label slot=\"label\">${b(\"Address line 1\",{id:\"addressLine1\"})}</primer-input-label><primer-input slot=\"input\" id=\"addressLine1\" name=\"addressLine1\" type=\"text\" .value=${this.formData.addressLine1||\"\"} placeholder=${b(\"Address line 1\",{id:\"addressLine1Placeholder\"})} @input=${e=>this.handleInput(\"addressLine1\",e.detail)} @focus=${()=>this.handleFocus(\"addressLine1\")} @blur=${()=>this.handleBlur(\"addressLine1\")} ></primer-input>${L(this.shouldShowError(\"addressLine1\"),()=>p`<primer-input-error slot=\"error\">${this.errors.addressLine1}</primer-input-error>`)}</primer-input-wrapper>`)} ${L(this.fieldConfig.addressLine2,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"addressLine2\"} .hasError=${this.shouldShowError(\"addressLine2\")} ><primer-input-label slot=\"label\">${b(\"Address line 2\",{id:\"addressLine2\"})}</primer-input-label><primer-input slot=\"input\" id=\"addressLine2\" name=\"addressLine2\" type=\"text\" .value=${this.formData.addressLine2||\"\"} placeholder=${b(\"Address line 2\",{id:\"addressLine2Placeholder\"})} @input=${e=>this.handleInput(\"addressLine2\",e.detail)} @focus=${()=>this.handleFocus(\"addressLine2\")} @blur=${()=>this.handleBlur(\"addressLine2\")} ></primer-input>${L(this.shouldShowError(\"addressLine2\"),()=>p`<primer-input-error slot=\"error\">${this.errors.addressLine2}</primer-input-error>`)}</primer-input-wrapper>`)} ${L(this.fieldConfig.postalCode||this.fieldConfig.city,()=>p`<div class=\"billing-address-row\">${L(this.fieldConfig.postalCode,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"postalCode\"} .hasError=${this.shouldShowError(\"postalCode\")} ><primer-input-label slot=\"label\">${b(\"Postal code\",{id:\"postalCodeLabel\"})}</primer-input-label><primer-input slot=\"input\" id=\"postalCode\" name=\"postalCode\" type=\"text\" .value=${this.formData.postalCode||\"\"} placeholder=${b(\"90210\",{id:\"postalCodePlaceholder\"})} @input=${e=>this.handleInput(\"postalCode\",e.detail)} @focus=${()=>this.handleFocus(\"postalCode\")} @blur=${()=>this.handleBlur(\"postalCode\")} ></primer-input>${L(this.shouldShowError(\"postalCode\"),()=>p`<primer-input-error slot=\"error\">${this.errors.postalCode}</primer-input-error>`)}</primer-input-wrapper>`)} ${L(this.fieldConfig.city,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"city\"} .hasError=${this.shouldShowError(\"city\")} ><primer-input-label slot=\"label\">${b(\"City\",{id:\"cityLabel\"})}</primer-input-label><primer-input slot=\"input\" id=\"city\" name=\"city\" type=\"text\" .value=${this.formData.city||\"\"} placeholder=${b(\"Cape Town\",{id:\"cityPlaceholder\"})} @input=${e=>this.handleInput(\"city\",e.detail)} @focus=${()=>this.handleFocus(\"city\")} @blur=${()=>this.handleBlur(\"city\")} ></primer-input>${L(this.shouldShowError(\"city\"),()=>p`<primer-input-error slot=\"error\">${this.errors.city}</primer-input-error>`)}</primer-input-wrapper>`)}</div>`)} ${L(this.fieldConfig.state,()=>p`<primer-input-wrapper .focusWithin=${this.focusedField===\"state\"} .hasError=${this.shouldShowError(\"state\")} ><primer-input-label slot=\"label\">${b(\"State / Region / County\",{id:\"stateLabel\"})}</primer-input-label><primer-input slot=\"input\" id=\"state\" name=\"state\" type=\"text\" .value=${this.formData.state||\"\"} placeholder=${b(\"State / Region / County\",{id:\"statePlaceholder\"})} @input=${e=>this.handleInput(\"state\",e.detail)} @focus=${()=>this.handleFocus(\"state\")} @blur=${()=>this.handleBlur(\"state\")} ></primer-input>${L(this.shouldShowError(\"state\"),()=>p`<primer-input-error slot=\"error\">${this.errors.state}</primer-input-error>`)}</primer-input-wrapper>`)}</div>`):(this.setAttribute(\"hidden\",\"\"),g)})}}"
205
205
  },
206
206
  {
207
207
  "kind": "variable",
208
208
  "name": "W",
209
- "default": "class extends v{constructor(){super();this.vaultManagerContext=null;this.vaultItemContext=null;this.headlessUtils=null;this.contextEventsController=null;this.hasSlottedSubmit=!1;this.isEditMode=!1;this.deletePaymentMethodId=null;this.isDeleting=!1;this.errorMessage=\"\";this.animationDuration=300;this._isHandlingContextEvent=!1;this._contextVaultSubmitListener=null;this.deleteAssetConfig=null;this.handleSubmitSlotChange=e=>{let i=e.target.assignedNodes({flatten:!0});this.hasSlottedSubmit=i.length>0};this.handleToggleEditMode=e=>{this.isEditMode=e.detail,this.deletePaymentMethodId=null,this.isEditMode&&this.vaultItemContext&&this.vaultItemContext.setSelectedVaultedPaymentMethod(null)};this.handleDeletePaymentMethod=async e=>{if(this.deletePaymentMethodId=e.detail,this.deletePaymentMethodId&&this.vaultManagerContext&&this.headlessUtils){let a=this.vaultManagerContext.vaultedPaymentMethods.find(i=>i.id===this.deletePaymentMethodId);a&&(this.deleteAssetConfig=await kr(a,this.headlessUtils,this.vaultManagerContext))}};this.handleCancelDelete=()=>{this.deletePaymentMethodId=null,this.deleteAssetConfig=null};this.handleConfirmDelete=async()=>{if(!this.vaultManagerContext?.deleteVaultedPaymentMethod||!this.deletePaymentMethodId){this.errorMessage=b(\"something_went_wrong_error\",{id:\"something_went_wrong_error\"});return}try{this.isDeleting=!0,await this.vaultManagerContext.deleteVaultedPaymentMethod(this.deletePaymentMethodId),this.deletePaymentMethodId=null,this.deleteAssetConfig=null}catch(e){this.errorMessage=e instanceof Error?e.message:b(\"something_went_wrong_error\",{id:\"something_went_wrong_error\"})}finally{this.isDeleting=!1}};this.handlePaymentError=e=>{let a=e.detail?.error;this.errorMessage=a instanceof Error?a.message:b(\"payment_processing_error\",{id:\"payment_processing_error\"})};this.handleCloseError=()=>{this.errorMessage=\"\"};this.handleSlotButtonClick=e=>{let i=e.target.closest(\"button, primer-button\");if(!i)return;let n=i;this.isSubmitButton(n)&&(e.preventDefault(),this.submitVaultPayment())};this.handleDirectSubmit=()=>{this.submitVaultPayment()};this.handleContextVaultSubmit=e=>{if(!this._isHandlingContextEvent){this._isHandlingContextEvent=!0;try{e.target!==this&&(e.stopPropagation(),this.submitVaultPayment())}finally{this._isHandlingContextEvent=!1}}};new Jt(this,{defaultOptions:{keyframeOptions:{duration:Number(getComputedStyle(document.documentElement).getPropertyValue(\"--primer-animation-duration\").trim().replace(\"ms\",\"\")),easing:getComputedStyle(document.documentElement).getPropertyValue(\"--primer-animation-easing\").trim()}}})}getAnimationConfig(){return{keyframeOptions:{duration:this.animationDuration,easing:getComputedStyle(document.documentElement).getPropertyValue(\"--primer-animation-easing\").trim(),fill:\"both\"}}}isSubmitButton(e){let a=e.tagName.toLowerCase(),i=a===\"button\",n=a===\"primer-button\";return i&&(e.getAttribute(\"type\")===\"submit\"||e.hasAttribute(\"data-submit\"))||n&&(e.getAttribute(\"type\")===\"submit\"||e.hasAttribute(\"data-submit\"))}async submitVaultPayment(){if(this.vaultManagerContext)try{await this.vaultManagerContext.startVaultedPaymentFlow()}catch(e){this.dispatchEvent(new CustomEvent(\"primer-vault-payment-error\",{detail:{error:e},bubbles:!0,composed:!0}))}}getPaymentMethodName(e){if(!this.vaultManagerContext)return\"\";let a=this.vaultManagerContext.vaultedPaymentMethods.find(i=>i.id===e);if(!a)return\"\";try{return Wi(a).description||\"\"}catch{return\"\"}}setupContextEventListeners(){this.contextEventsController?.host&&this._contextVaultSubmitListener&&this.contextEventsController.host.addEventListener(\"primer:vault-submit\",this._contextVaultSubmitListener)}cleanupContextEventListeners(){this.contextEventsController?.host&&this._contextVaultSubmitListener&&this.contextEventsController.host.removeEventListener(\"primer:vault-submit\",this._contextVaultSubmitListener)}connectedCallback(){super.connectedCallback(),this.addEventListener(\"click\",this.handleSlotButtonClick),this.addEventListener(\"primer:vault-submit\",this.handleDirectSubmit),this._contextVaultSubmitListener=e=>{this.handleContextVaultSubmit(e)},this.setupContextEventListeners()}disconnectedCallback(){this.removeEventListener(\"click\",this.handleSlotButtonClick),this.removeEventListener(\"primer:vault-submit\",this.handleDirectSubmit),this.cleanupContextEventListeners(),super.disconnectedCallback()}renderLoadingOverlay(){return p`<div class=\"loading-overlay\" ${Ct({...this.getAnimationConfig(),properties:[\"opacity\"],in:[{opacity:0},{opacity:1}],out:[{opacity:1},{opacity:0}]})} ><primer-spinner size=\"medium\" color=\"var(--primer-color-loader)\" ></primer-spinner></div>`}renderDeleteConfirmation(){if(!this.deletePaymentMethodId||!this.deleteAssetConfig)return g;let e=this.getPaymentMethodName(this.deletePaymentMethodId);return p`<div class=\"delete-confirmation-container\"><primer-button disabled variant=\"secondary\"><primer-payment-method-content .assetConfig=${this.deleteAssetConfig} ></primer-payment-method-content></primer-button><primer-vault-delete-confirmation .isDeleting=${this.isDeleting} .paymentMethodId=${this.deletePaymentMethodId} .paymentMethodName=${e} @confirm-delete=${this.handleConfirmDelete} @cancel-delete=${this.handleCancelDelete} ${Ct({...this.getAnimationConfig(),properties:[\"opacity\"],in:[{opacity:0},{opacity:1}],out:[{opacity:1},{opacity:0}]})} ></primer-vault-delete-confirmation></div>`}renderPaymentMethodItem(e){return this.deletePaymentMethodId===e.id?g:p`<primer-vault-payment-method-item .paymentMethod=${e} .isEditMode=${this.isEditMode} @delete-payment-method=${this.handleDeletePaymentMethod} ${Ct({...this.getAnimationConfig(),properties:[\"opacity\"],in:[{opacity:0},{opacity:1}],out:[{opacity:1},{opacity:0}]})} ></primer-vault-payment-method-item>`}renderPaymentMethodList(){let e=this.vaultManagerContext?.vaultedPaymentMethods||[],a=!this.isEditMode&&e.length>0&&!this.deletePaymentMethodId;return p`<div class=\"payment-methods-list\">${e.map(i=>this.renderPaymentMethodItem(i))} ${L(a,()=>p`<div class=\"submit-button-container\"><slot name=\"submit-button\" @slotchange=${this.handleSubmitSlotChange} ${Ct({...this.getAnimationConfig(),properties:[\"opacity\"],in:[{opacity:0},{opacity:1}],out:[{opacity:1},{opacity:0}]})} ></slot>${L(!this.hasSlottedSubmit,()=>p`<primer-vault-payment-submit class=\"submit-button\" @primer-vault-payment-error=${this.handlePaymentError} ></primer-vault-payment-submit>`)}</div>`,()=>g)}</div>`}render(){if(!this.vaultManagerContext?.enabled)return g;let e=this.vaultManagerContext.vaultedPaymentMethods.length>0,a=this.vaultManagerContext.isLoading,i=this.vaultManagerContext.isUpdating;return p` ${L(!this.vaultManagerContext?.showEmptyState&&!e,()=>g,()=>p`<slot name=\"vault-empty-state\"><div class=\"vault-manager ${i?\"is-updating\":\"\"}\"><primer-vault-manager-header .isEditMode=${this.isEditMode} .hasPaymentMethods=${e} @toggle-edit-mode=${this.handleToggleEditMode} ></primer-vault-manager-header>${L(this.errorMessage,()=>p`<primer-vault-error-message .errorMessage=${this.errorMessage} @close-error=${this.handleCloseError} ${Ct({...this.getAnimationConfig(),properties:[\"opacity\"],in:[{opacity:0},{opacity:1}],out:[{opacity:1},{opacity:0}]})} ></primer-vault-error-message>`,()=>g)}<div class=\"vault-manager-content\">${L(!a&&!e,()=>p`<div class=\"content-container\"><primer-vault-empty-state ${Ct({...this.getAnimationConfig(),properties:[\"opacity\"],in:[{opacity:0},{opacity:1}],out:[{opacity:1},{opacity:0}]})} ></primer-vault-empty-state></div>`,()=>g)} ${L(!a&&e,()=>p`<div class=\"content-container\">${L(this.deletePaymentMethodId,()=>this.renderDeleteConfirmation(),()=>this.renderPaymentMethodList())}</div>`,()=>g)}</div>${L(i,()=>this.renderLoadingOverlay(),()=>g)}</div></slot>`)} `}}"
209
+ "default": "class extends v{constructor(){super();this.vaultManagerContext=null;this.vaultItemContext=null;this.headlessUtils=null;this.contextEventsController=null;this.hasSlottedSubmit=!1;this.isEditMode=!1;this.deletePaymentMethodId=null;this.isDeleting=!1;this.errorMessage=\"\";this.animationDuration=300;this._isHandlingContextEvent=!1;this._contextVaultSubmitListener=null;this.deleteAssetConfig=null;this.handleSubmitSlotChange=e=>{let i=e.target.assignedNodes({flatten:!0});this.hasSlottedSubmit=i.length>0};this.handleToggleEditMode=e=>{this.isEditMode=e.detail,this.deletePaymentMethodId=null,this.isEditMode&&this.vaultItemContext&&this.vaultItemContext.setSelectedVaultedPaymentMethod(null)};this.handleDeletePaymentMethod=async e=>{if(this.deletePaymentMethodId=e.detail,this.deletePaymentMethodId&&this.vaultManagerContext&&this.headlessUtils){let a=this.vaultManagerContext.vaultedPaymentMethods.find(i=>i.id===this.deletePaymentMethodId);a&&(this.deleteAssetConfig=await Nr(a,this.headlessUtils,this.vaultManagerContext))}};this.handleCancelDelete=()=>{this.deletePaymentMethodId=null,this.deleteAssetConfig=null};this.handleConfirmDelete=async()=>{if(!this.vaultManagerContext?.deleteVaultedPaymentMethod||!this.deletePaymentMethodId){this.errorMessage=b(\"something_went_wrong_error\",{id:\"something_went_wrong_error\"});return}try{this.isDeleting=!0,await this.vaultManagerContext.deleteVaultedPaymentMethod(this.deletePaymentMethodId),this.deletePaymentMethodId=null,this.deleteAssetConfig=null}catch(e){this.errorMessage=e instanceof Error?e.message:b(\"something_went_wrong_error\",{id:\"something_went_wrong_error\"})}finally{this.isDeleting=!1}};this.handlePaymentError=e=>{let a=e.detail?.error;this.errorMessage=a instanceof Error?a.message:b(\"payment_processing_error\",{id:\"payment_processing_error\"})};this.handleCloseError=()=>{this.errorMessage=\"\"};this.handleSlotButtonClick=e=>{let i=e.target.closest(\"button, primer-button\");if(!i)return;let n=i;this.isSubmitButton(n)&&(e.preventDefault(),this.submitVaultPayment())};this.handleDirectSubmit=()=>{this.submitVaultPayment()};this.handleContextVaultSubmit=e=>{if(!this._isHandlingContextEvent){this._isHandlingContextEvent=!0;try{e.target!==this&&(e.stopPropagation(),this.submitVaultPayment())}finally{this._isHandlingContextEvent=!1}}};new Jt(this,{defaultOptions:{keyframeOptions:{duration:Number(getComputedStyle(document.documentElement).getPropertyValue(\"--primer-animation-duration\").trim().replace(\"ms\",\"\")),easing:getComputedStyle(document.documentElement).getPropertyValue(\"--primer-animation-easing\").trim()}}})}getAnimationConfig(){return{keyframeOptions:{duration:this.animationDuration,easing:getComputedStyle(document.documentElement).getPropertyValue(\"--primer-animation-easing\").trim(),fill:\"both\"}}}isSubmitButton(e){let a=e.tagName.toLowerCase(),i=a===\"button\",n=a===\"primer-button\";return i&&(e.getAttribute(\"type\")===\"submit\"||e.hasAttribute(\"data-submit\"))||n&&(e.getAttribute(\"type\")===\"submit\"||e.hasAttribute(\"data-submit\"))}async submitVaultPayment(){if(this.vaultManagerContext)try{await this.vaultManagerContext.startVaultedPaymentFlow()}catch(e){this.dispatchEvent(new CustomEvent(\"primer-vault-payment-error\",{detail:{error:e},bubbles:!0,composed:!0}))}}getPaymentMethodName(e){if(!this.vaultManagerContext)return\"\";let a=this.vaultManagerContext.vaultedPaymentMethods.find(i=>i.id===e);if(!a)return\"\";try{return Ji(a).description||\"\"}catch{return\"\"}}setupContextEventListeners(){this.contextEventsController?.host&&this._contextVaultSubmitListener&&this.contextEventsController.host.addEventListener(\"primer:vault-submit\",this._contextVaultSubmitListener)}cleanupContextEventListeners(){this.contextEventsController?.host&&this._contextVaultSubmitListener&&this.contextEventsController.host.removeEventListener(\"primer:vault-submit\",this._contextVaultSubmitListener)}connectedCallback(){super.connectedCallback(),this.addEventListener(\"click\",this.handleSlotButtonClick),this.addEventListener(\"primer:vault-submit\",this.handleDirectSubmit),this._contextVaultSubmitListener=e=>{this.handleContextVaultSubmit(e)},this.setupContextEventListeners()}disconnectedCallback(){this.removeEventListener(\"click\",this.handleSlotButtonClick),this.removeEventListener(\"primer:vault-submit\",this.handleDirectSubmit),this.cleanupContextEventListeners(),super.disconnectedCallback()}renderLoadingOverlay(){return p`<div class=\"loading-overlay\" ${Ct({...this.getAnimationConfig(),properties:[\"opacity\"],in:[{opacity:0},{opacity:1}],out:[{opacity:1},{opacity:0}]})} ><primer-spinner size=\"medium\" color=\"var(--primer-color-loader)\" ></primer-spinner></div>`}renderDeleteConfirmation(){if(!this.deletePaymentMethodId||!this.deleteAssetConfig)return g;let e=this.getPaymentMethodName(this.deletePaymentMethodId);return p`<div class=\"delete-confirmation-container\"><primer-button disabled variant=\"secondary\"><primer-payment-method-content .assetConfig=${this.deleteAssetConfig} ></primer-payment-method-content></primer-button><primer-vault-delete-confirmation .isDeleting=${this.isDeleting} .paymentMethodId=${this.deletePaymentMethodId} .paymentMethodName=${e} @confirm-delete=${this.handleConfirmDelete} @cancel-delete=${this.handleCancelDelete} ${Ct({...this.getAnimationConfig(),properties:[\"opacity\"],in:[{opacity:0},{opacity:1}],out:[{opacity:1},{opacity:0}]})} ></primer-vault-delete-confirmation></div>`}renderPaymentMethodItem(e){return this.deletePaymentMethodId===e.id?g:p`<primer-vault-payment-method-item .paymentMethod=${e} .isEditMode=${this.isEditMode} @delete-payment-method=${this.handleDeletePaymentMethod} ${Ct({...this.getAnimationConfig(),properties:[\"opacity\"],in:[{opacity:0},{opacity:1}],out:[{opacity:1},{opacity:0}]})} ></primer-vault-payment-method-item>`}renderPaymentMethodList(){let e=this.vaultManagerContext?.vaultedPaymentMethods||[],a=!this.isEditMode&&e.length>0&&!this.deletePaymentMethodId;return p`<div class=\"payment-methods-list\">${e.map(i=>this.renderPaymentMethodItem(i))} ${L(a,()=>p`<div class=\"submit-button-container\"><slot name=\"submit-button\" @slotchange=${this.handleSubmitSlotChange} ${Ct({...this.getAnimationConfig(),properties:[\"opacity\"],in:[{opacity:0},{opacity:1}],out:[{opacity:1},{opacity:0}]})} ></slot>${L(!this.hasSlottedSubmit,()=>p`<primer-vault-payment-submit class=\"submit-button\" @primer-vault-payment-error=${this.handlePaymentError} ></primer-vault-payment-submit>`)}</div>`,()=>g)}</div>`}render(){if(!this.vaultManagerContext?.enabled||this.vaultManagerContext?.headless)return g;let e=this.vaultManagerContext.vaultedPaymentMethods.length>0,a=this.vaultManagerContext.isLoading,i=this.vaultManagerContext.isUpdating;return p` ${L(!this.vaultManagerContext?.showEmptyState&&!e,()=>g,()=>p`<slot name=\"vault-empty-state\"><div class=\"vault-manager ${i?\"is-updating\":\"\"}\"><primer-vault-manager-header .isEditMode=${this.isEditMode} .hasPaymentMethods=${e} @toggle-edit-mode=${this.handleToggleEditMode} ></primer-vault-manager-header>${L(this.errorMessage,()=>p`<primer-vault-error-message .errorMessage=${this.errorMessage} @close-error=${this.handleCloseError} ${Ct({...this.getAnimationConfig(),properties:[\"opacity\"],in:[{opacity:0},{opacity:1}],out:[{opacity:1},{opacity:0}]})} ></primer-vault-error-message>`,()=>g)}<div class=\"vault-manager-content\">${L(!a&&!e,()=>p`<div class=\"content-container\"><primer-vault-empty-state ${Ct({...this.getAnimationConfig(),properties:[\"opacity\"],in:[{opacity:0},{opacity:1}],out:[{opacity:1},{opacity:0}]})} ></primer-vault-empty-state></div>`,()=>g)} ${L(!a&&e,()=>p`<div class=\"content-container\">${L(this.deletePaymentMethodId,()=>this.renderDeleteConfirmation(),()=>this.renderPaymentMethodList())}</div>`,()=>g)}</div>${L(i,()=>this.renderLoadingOverlay(),()=>g)}</div></slot>`)} `}}"
210
210
  },
211
211
  {
212
212
  "kind": "variable",
213
213
  "name": "Ce",
214
- "default": "class extends v{constructor(){super(...arguments);this.vaultManagerContext=null;this.vaultItemContext=null;this.headlessUtils=null;this.paymentMethod=null;this.isEditMode=!1;this._getAssetsTask=new D(this,{task:async([e,a,i])=>await kr(e,a,i),args:()=>[this.paymentMethod,this.headlessUtils,this.vaultManagerContext]});this.handleClick=()=>{this.isEditMode||!this.vaultManagerContext||!this.paymentMethod||(this.isSelected()?this.vaultItemContext?.setSelectedVaultedPaymentMethod(null):this.vaultItemContext?.setSelectedVaultedPaymentMethod(this.paymentMethod))};this.handleDeleteClick=e=>{e.stopPropagation(),this.dispatchEvent(new CustomEvent(\"delete-payment-method\",{detail:this.paymentMethod?.id,bubbles:!0,composed:!0}))}}isSelected(){if(!this.vaultManagerContext||!this.paymentMethod)return!1;let e=this.vaultItemContext?.selectedVaultedPaymentMethod;return!!e&&e.id===this.paymentMethod.id}render(){return this._getAssetsTask.render({error:()=>g,complete:e=>{let a=this.isSelected()?\"checked\":\"default\",i=!1,n=e?.description;return p`<div class=\"payment-method-wrapper\"><div class=\"payment-method-container\"><primer-button variant=\"secondary\" class=\"payment-method-button ${e.shouldShowCVV?\"with-cvv\":\"\"}\" selectable ?disabled=${this.isEditMode} selectionState=${a} .flex=${i} @click=${this.handleClick} ><primer-payment-method-content .assetConfig=${e} ></primer-payment-method-content>${L(e.shouldShowCVV&&this.isSelected()&&!this.isEditMode,()=>p`<div class=\"payment-method-row mt-2\"><span class=\"flex-center\"><primer-icon name=\"lock\" size=\"sm\"></primer-icon><span class=\"payment-method-subtitle\"> Input the card CVV for a secure payment</span ></span><span class=\"cell-2\"><primer-vault-cvv-input .paymentMethod=\"${this.paymentMethod}\" ><span slot=\"label\"></span></primer-vault-cvv-input></span></div>`,()=>g)}</primer-button>${this.isEditMode?p`<primer-button variant=\"tertiary\" class=\"delete-button\" @click=${this.handleDeleteClick} aria-label=${`${b(\"delete\",{id:\"delete\"})} ${n}`} ><primer-icon name=\"close\" size=\"sm\"></primer-icon></primer-button>`:g}</div></div>`}})}}"
214
+ "default": "class extends v{constructor(){super(...arguments);this.vaultManagerContext=null;this.vaultItemContext=null;this.headlessUtils=null;this.paymentMethod=null;this.isEditMode=!1;this._getAssetsTask=new D(this,{task:async([e,a,i])=>await Nr(e,a,i),args:()=>[this.paymentMethod,this.headlessUtils,this.vaultManagerContext]});this.handleClick=()=>{this.isEditMode||!this.vaultManagerContext||!this.paymentMethod||(this.isSelected()?this.vaultItemContext?.setSelectedVaultedPaymentMethod(null):this.vaultItemContext?.setSelectedVaultedPaymentMethod(this.paymentMethod))};this.handleDeleteClick=e=>{e.stopPropagation(),this.dispatchEvent(new CustomEvent(\"delete-payment-method\",{detail:this.paymentMethod?.id,bubbles:!0,composed:!0}))}}isSelected(){if(!this.vaultManagerContext||!this.paymentMethod)return!1;let e=this.vaultItemContext?.selectedVaultedPaymentMethod;return!!e&&e.id===this.paymentMethod.id}render(){return this._getAssetsTask.render({error:()=>g,complete:e=>{let a=this.isSelected()?\"checked\":\"default\",i=!1,n=e?.description;return p`<div class=\"payment-method-wrapper\"><div class=\"payment-method-container\"><primer-button variant=\"secondary\" class=\"payment-method-button ${e.shouldShowCVV?\"with-cvv\":\"\"}\" selectable ?disabled=${this.isEditMode} selectionState=${a} .flex=${i} @click=${this.handleClick} ><primer-payment-method-content .assetConfig=${e} ></primer-payment-method-content>${L(e.shouldShowCVV&&this.isSelected()&&!this.isEditMode,()=>p`<div class=\"payment-method-row mt-2\"><span class=\"flex-center\"><primer-icon name=\"lock\" size=\"sm\"></primer-icon><span class=\"payment-method-subtitle\"> Input the card CVV for a secure payment</span ></span><span class=\"cell-2\"><primer-vault-cvv-input .paymentMethod=\"${this.paymentMethod}\" ><span slot=\"label\"></span></primer-vault-cvv-input></span></div>`,()=>g)}</primer-button>${this.isEditMode?p`<primer-button variant=\"tertiary\" class=\"delete-button\" @click=${this.handleDeleteClick} aria-label=${`${b(\"delete\",{id:\"delete\"})} ${n}`} ><primer-icon name=\"close\" size=\"sm\"></primer-icon></primer-button>`:g}</div></div>`}})}}"
215
215
  },
216
216
  {
217
217
  "kind": "variable",
@@ -241,7 +241,7 @@
241
241
  {
242
242
  "kind": "variable",
243
243
  "name": "J",
244
- "default": "class extends v{constructor(){super();this.vaultManagerFormContext=null;this.vaultManagerCvvContext=null;this.computedStyles=null;this.paymentMethod=null;this.cvvError=null;this.cvvInputIsDirty=!1;this.cvvInputIsBlurred=!1;this.cvvInput=null;this.isFocused=!1;this._setupCVVIframe=new D(this,{task:([e,a])=>!e||!a||e.paymentMethodType!==\"PAYMENT_CARD\"||!e.paymentInstrumentData?.network||a.createCvvInput===null?_:{network:e.paymentInstrumentData.network,createCvvInput:a.createCvvInput},args:()=>[this.paymentMethod,this.vaultManagerFormContext]});this.cvvContainerId=`cvv-container-${Math.random().toString(36).substring(2,9)}`,new D(this,{task:async([e])=>{if(!e)return _;await this.updateComplete;let a=this.renderRoot.querySelector(`#${this.cvvContainerId}`);if(!a)return;let i=xr(this.computedStyles),n=i?{input:{base:i}}:void 0,o={cardNetwork:e.network,container:a,name:\"cvv\",placeholder:\"123\",style:n,ariaLabel:b(\"CVV\",{id:\"cardCVV\"})};this.cvvInput=await e.createCvvInput?.(o)??null,this.cvvInput&&(this.cvvInput.focus(),this.cvvError=this.cvvInput.metadata.errorCode||null,this.vaultManagerCvvContext?.setCvvInput(this.cvvInput),this.cvvInput.addListener(\"change\",()=>{this.onCvvInputChange()}),this.cvvInput.addListener(\"blur\",()=>{this.onBlur()}),this.cvvInput.addListener(\"focus\",()=>{this.onFocus()}))},args:()=>[this._setupCVVIframe.value]})}disconnectedCallback(){super.disconnectedCallback(),this.cvvInput&&(this.cvvInput.remove(),this.cvvInput=null,this.cvvError=null,this.vaultManagerCvvContext?.setCvvInput(null))}onCvvInputChange(){!this.cvvInput||!this.vaultManagerCvvContext||(this.cvvInputIsDirty=!0,this.cvvError=this.cvvInput.metadata.errorCode||null)}onBlur(){this.cvvInput&&(this.cvvInputIsBlurred=!0,this.cvvError=this.cvvInput.metadata.errorCode||null,this.isFocused=!1)}onFocus(){this.isFocused=!0}render(){return this._setupCVVIframe.render({error:()=>g,complete:()=>p`<div class=\"cvv-input-container\"><primer-input-wrapper .focusWithin=${this.isFocused} .hasError=${!!this.cvvError&&(this.vaultManagerCvvContext?.formIsDirty||this.cvvInputIsDirty&&this.cvvInputIsBlurred)} ><slot name=\"label\" slot=\"label\"><primer-input-label>CVV</primer-input-label></slot><div slot=\"input\" id=\"${this.cvvContainerId}\"></div>${L(this.cvvError&&(this.vaultManagerCvvContext?.formIsDirty||this.cvvInputIsDirty&&this.cvvInputIsBlurred),()=>p`<primer-input-error slot=\"error\">${b(this.cvvError,{id:this.cvvError})}</primer-input-error>`)}</primer-input-wrapper></div>`})}}"
244
+ "default": "class extends v{constructor(){super();this.vaultManagerFormContext=null;this.vaultManagerCvvContext=null;this.computedStyles=null;this.paymentMethod=null;this.cvvError=null;this.cvvInputIsDirty=!1;this.cvvInputIsBlurred=!1;this.cvvInput=null;this.isFocused=!1;this._setupCVVIframe=new D(this,{task:([e,a])=>!e||!a||e.paymentMethodType!==\"PAYMENT_CARD\"||!e.paymentInstrumentData?.network||a.createCvvInput===null?_:{network:e.paymentInstrumentData.network,createCvvInput:a.createCvvInput},args:()=>[this.paymentMethod,this.vaultManagerFormContext]});this.cvvContainerId=`cvv-container-${Math.random().toString(36).substring(2,9)}`,new D(this,{task:async([e])=>{if(!e)return _;await this.updateComplete;let a=this.renderRoot.querySelector(`#${this.cvvContainerId}`);if(!a)return;let i=_r(this.computedStyles),n=i?{input:{base:i}}:void 0,o={cardNetwork:e.network,container:a,name:\"cvv\",placeholder:\"123\",style:n,ariaLabel:b(\"CVV\",{id:\"cardCVV\"})};this.cvvInput=await e.createCvvInput?.(o)??null,this.cvvInput&&(this.cvvInput.focus(),this.cvvError=this.cvvInput.metadata.errorCode||null,this.vaultManagerCvvContext?.setCvvInput(this.cvvInput),this.cvvInput.addListener(\"change\",()=>{this.onCvvInputChange()}),this.cvvInput.addListener(\"blur\",()=>{this.onBlur()}),this.cvvInput.addListener(\"focus\",()=>{this.onFocus()}))},args:()=>[this._setupCVVIframe.value]})}disconnectedCallback(){super.disconnectedCallback(),this.cvvInput&&(this.cvvInput.remove(),this.cvvInput=null,this.cvvError=null,this.vaultManagerCvvContext?.setCvvInput(null))}onCvvInputChange(){!this.cvvInput||!this.vaultManagerCvvContext||(this.cvvInputIsDirty=!0,this.cvvError=this.cvvInput.metadata.errorCode||null)}onBlur(){this.cvvInput&&(this.cvvInputIsBlurred=!0,this.cvvError=this.cvvInput.metadata.errorCode||null,this.isFocused=!1)}onFocus(){this.isFocused=!0}render(){return this._setupCVVIframe.render({error:()=>g,complete:()=>p`<div class=\"cvv-input-container\"><primer-input-wrapper .focusWithin=${this.isFocused} .hasError=${!!this.cvvError&&(this.vaultManagerCvvContext?.formIsDirty||this.cvvInputIsDirty&&this.cvvInputIsBlurred)} ><slot name=\"label\" slot=\"label\"><primer-input-label>CVV</primer-input-label></slot><div slot=\"input\" id=\"${this.cvvContainerId}\"></div>${L(this.cvvError&&(this.vaultManagerCvvContext?.formIsDirty||this.cvvInputIsDirty&&this.cvvInputIsBlurred),()=>p`<primer-input-error slot=\"error\">${b(this.cvvError,{id:this.cvvError})}</primer-input-error>`)}</primer-input-wrapper></div>`})}}"
245
245
  },
246
246
  {
247
247
  "kind": "variable",
@@ -286,7 +286,7 @@
286
286
  {
287
287
  "kind": "variable",
288
288
  "name": "_e",
289
- "default": "class extends v{constructor(){super(...arguments);this.vaultManager=null;this.contextEventsController=null;this.hasSlottedToggle=!1;this.isExpanded=!1;this._isHandlingContextEvent=!1;this._contextToggleListener=null;this.handleToggleSlotChange=e=>{let i=e.target.assignedNodes({flatten:!0});this.hasSlottedToggle=i.length>0};this.handleSlotButtonClick=e=>{let i=e.target.closest(\"button, primer-button\");if(!i)return;let n=i;this.isToggleButton(n)&&(e.preventDefault(),this.toggleAccordion())};this.handleDirectToggle=e=>{let a=e.detail?.action;a===\"expand\"?this.expand():a===\"collapse\"?this.collapse():this.toggleAccordion()};this.handleContextToggle=e=>{if(!this._isHandlingContextEvent){this._isHandlingContextEvent=!0;try{if(e.target!==this){e.stopPropagation();let a=e.detail?.action;a===\"expand\"?this.expand():a===\"collapse\"?this.collapse():this.toggleAccordion()}}finally{this._isHandlingContextEvent=!1}}}}isToggleButton(e){let a=this.shadowRoot?.querySelector('slot[name=\"show-other-payments-toggle-button\"]');return a?a.assignedElements({flatten:!0}).some(n=>n===e||n.contains(e)):!1}toggleAccordion(){this.hasSlottedToggle?(this.isExpanded=!this.isExpanded,this.dispatchExpandedEvent(this.isExpanded)):this.collapsableElement&&(this.collapsableElement.isExpanded?this.collapsableElement.collapse():this.collapsableElement.expand())}dispatchExpandedEvent(e){this.dispatchEvent(new CustomEvent(\"primer:show-other-payments-toggled\",{bubbles:!0,composed:!0,detail:{expanded:e}}))}expand(){this.hasSlottedToggle?this.isExpanded||(this.isExpanded=!0,this.dispatchExpandedEvent(!0)):this.collapsableElement?.expand()}collapse(){this.hasSlottedToggle?this.isExpanded&&(this.isExpanded=!1,this.dispatchExpandedEvent(!1)):this.collapsableElement?.collapse()}setupContextEventListeners(){this.contextEventsController?.host&&this._contextToggleListener&&this.contextEventsController.host.addEventListener(\"primer:show-other-payments-toggle\",this._contextToggleListener)}cleanupContextEventListeners(){this.contextEventsController?.host&&this._contextToggleListener&&this.contextEventsController.host.removeEventListener(\"primer:show-other-payments-toggle\",this._contextToggleListener)}connectedCallback(){super.connectedCallback(),this.isExpanded=this.vaultManager?.vaultedPaymentMethods.length===0,this.addEventListener(\"click\",this.handleSlotButtonClick),this.addEventListener(\"primer:show-other-payments-toggle\",this.handleDirectToggle),this._contextToggleListener=e=>{this.handleContextToggle(e)},this.setupContextEventListeners()}disconnectedCallback(){this.removeEventListener(\"click\",this.handleSlotButtonClick),this.removeEventListener(\"primer:show-other-payments-toggle\",this.handleDirectToggle),this.cleanupContextEventListeners(),super.disconnectedCallback()}render(){if(this.vaultManager?.isLoading)return g;let e=this.vaultManager?.showEmptyState||this.vaultManager?.vaultedPaymentMethods.length;return!this.vaultManager||!this.vaultManager.enabled||!e?p`<slot name=\"other-payments\"></slot>`:p`<div class=\"other-payment-methods-container\"><slot name=\"show-other-payments-toggle-button\" @slotchange=${this.handleToggleSlotChange} ></slot>${L(!this.hasSlottedToggle,()=>p`<primer-collapsable buttonVariant=\"secondary\" .expanded=\"${this.vaultManager?.vaultedPaymentMethods.length===0}\" .header=\"${b(\"navigateToPaymentMethods\",{id:\"navigateToPaymentMethods\"})}\" ><div class=\"other-payment-methods-content\"><slot name=\"other-payments\"></slot></div></primer-collapsable>`,()=>p`<div class=\"collapsable-wrapper ${this.isExpanded?\"expanded\":\"\"}\" role=\"region\" aria-labelledby=\"custom-toggle-button\" ><div class=\"collapsable-content\"><div class=\"other-payment-methods-content\"><slot name=\"other-payments\"></slot></div></div></div>`)}</div>`}}"
289
+ "default": "class extends v{constructor(){super(...arguments);this.vaultManager=null;this.contextEventsController=null;this.hasSlottedToggle=!1;this.isExpanded=!1;this._isHandlingContextEvent=!1;this._contextToggleListener=null;this.handleToggleSlotChange=e=>{let i=e.target.assignedNodes({flatten:!0});this.hasSlottedToggle=i.length>0};this.handleSlotButtonClick=e=>{let i=e.target.closest(\"button, primer-button\");if(!i)return;let n=i;this.isToggleButton(n)&&(e.preventDefault(),this.toggleAccordion())};this.handleDirectToggle=e=>{let a=e.detail?.action;a===\"expand\"?this.expand():a===\"collapse\"?this.collapse():this.toggleAccordion()};this.handleContextToggle=e=>{if(!this._isHandlingContextEvent){this._isHandlingContextEvent=!0;try{if(e.target!==this){e.stopPropagation();let a=e.detail?.action;a===\"expand\"?this.expand():a===\"collapse\"?this.collapse():this.toggleAccordion()}}finally{this._isHandlingContextEvent=!1}}}}isToggleButton(e){let a=this.shadowRoot?.querySelector('slot[name=\"show-other-payments-toggle-button\"]');return a?a.assignedElements({flatten:!0}).some(n=>n===e||n.contains(e)):!1}toggleAccordion(){this.hasSlottedToggle?(this.isExpanded=!this.isExpanded,this.dispatchExpandedEvent(this.isExpanded)):this.collapsableElement&&(this.collapsableElement.isExpanded?this.collapsableElement.collapse():this.collapsableElement.expand())}dispatchExpandedEvent(e){this.dispatchEvent(new CustomEvent(\"primer:show-other-payments-toggled\",{bubbles:!0,composed:!0,detail:{expanded:e}}))}expand(){this.hasSlottedToggle?this.isExpanded||(this.isExpanded=!0,this.dispatchExpandedEvent(!0)):this.collapsableElement?.expand()}collapse(){this.hasSlottedToggle?this.isExpanded&&(this.isExpanded=!1,this.dispatchExpandedEvent(!1)):this.collapsableElement?.collapse()}setupContextEventListeners(){this.contextEventsController?.host&&this._contextToggleListener&&this.contextEventsController.host.addEventListener(\"primer:show-other-payments-toggle\",this._contextToggleListener)}cleanupContextEventListeners(){this.contextEventsController?.host&&this._contextToggleListener&&this.contextEventsController.host.removeEventListener(\"primer:show-other-payments-toggle\",this._contextToggleListener)}connectedCallback(){super.connectedCallback(),this.isExpanded=this.vaultManager?.vaultedPaymentMethods.length===0,this.addEventListener(\"click\",this.handleSlotButtonClick),this.addEventListener(\"primer:show-other-payments-toggle\",this.handleDirectToggle),this._contextToggleListener=e=>{this.handleContextToggle(e)},this.setupContextEventListeners()}disconnectedCallback(){this.removeEventListener(\"click\",this.handleSlotButtonClick),this.removeEventListener(\"primer:show-other-payments-toggle\",this.handleDirectToggle),this.cleanupContextEventListeners(),super.disconnectedCallback()}render(){if(this.vaultManager?.isLoading)return g;let e=this.vaultManager?.showEmptyState||this.vaultManager?.vaultedPaymentMethods.length;return!this.vaultManager||!this.vaultManager.enabled||this.vaultManager.headless||!e?p`<slot name=\"other-payments\"></slot>`:p`<div class=\"other-payment-methods-container\"><slot name=\"show-other-payments-toggle-button\" @slotchange=${this.handleToggleSlotChange} ></slot>${L(!this.hasSlottedToggle,()=>p`<primer-collapsable buttonVariant=\"secondary\" .expanded=\"${this.vaultManager?.vaultedPaymentMethods.length===0}\" .header=\"${b(\"navigateToPaymentMethods\",{id:\"navigateToPaymentMethods\"})}\" ><div class=\"other-payment-methods-content\"><slot name=\"other-payments\"></slot></div></primer-collapsable>`,()=>p`<div class=\"collapsable-wrapper ${this.isExpanded?\"expanded\":\"\"}\" role=\"region\" aria-labelledby=\"custom-toggle-button\" ><div class=\"collapsable-content\"><div class=\"other-payment-methods-content\"><slot name=\"other-payments\"></slot></div></div></div>`)}</div>`}}"
290
290
  },
291
291
  {
292
292
  "kind": "variable",
@@ -310,7 +310,7 @@
310
310
  },
311
311
  {
312
312
  "kind": "function",
313
- "name": "zw"
313
+ "name": "jw"
314
314
  }
315
315
  ],
316
316
  "exports": [
@@ -486,7 +486,7 @@
486
486
  "kind": "js",
487
487
  "name": "InitializedPayments",
488
488
  "declaration": {
489
- "name": "Qa",
489
+ "name": "Xa",
490
490
  "module": "dist/primer-loader.js"
491
491
  }
492
492
  },
@@ -494,7 +494,7 @@
494
494
  "kind": "js",
495
495
  "name": "InitializedVaultedPayments",
496
496
  "declaration": {
497
- "name": "Xa",
497
+ "name": "er",
498
498
  "module": "dist/primer-loader.js"
499
499
  }
500
500
  },
@@ -758,7 +758,7 @@
758
758
  "kind": "js",
759
759
  "name": "loadPrimer",
760
760
  "declaration": {
761
- "name": "zw",
761
+ "name": "jw",
762
762
  "module": "dist/primer-loader.js"
763
763
  }
764
764
  }
@@ -1048,8 +1048,7 @@
1048
1048
  "type": {
1049
1049
  "text": "PrimerCheckoutOptions"
1050
1050
  },
1051
- "default": "{}",
1052
- "attribute": "options"
1051
+ "default": "{}"
1053
1052
  },
1054
1053
  {
1055
1054
  "kind": "field",
@@ -1578,14 +1577,6 @@
1578
1577
  "default": "''",
1579
1578
  "fieldName": "clientToken"
1580
1579
  },
1581
- {
1582
- "name": "options",
1583
- "type": {
1584
- "text": "PrimerCheckoutOptions"
1585
- },
1586
- "default": "{}",
1587
- "fieldName": "options"
1588
- },
1589
1580
  {
1590
1581
  "name": "loader-disabled",
1591
1582
  "type": {
@@ -4892,6 +4883,15 @@
4892
4883
  "privacy": "private",
4893
4884
  "default": "null"
4894
4885
  },
4886
+ {
4887
+ "kind": "field",
4888
+ "name": "vaultController",
4889
+ "type": {
4890
+ "text": "VaultManagerController | null"
4891
+ },
4892
+ "privacy": "private",
4893
+ "default": "null"
4894
+ },
4895
4895
  {
4896
4896
  "kind": "field",
4897
4897
  "name": "onPaymentStart",
@@ -4957,14 +4957,64 @@
4957
4957
  "text": "(data: VaultedMethodsUpdateData) => void | undefined"
4958
4958
  },
4959
4959
  "privacy": "public",
4960
- "description": "Called when vaulted payment methods are loaded or updated.\nReceives filtered vaulted payment method data with minimal PII exposure.\n\nUse for:\n- Building custom vault UI\n- Analytics tracking for vault usage\n- Syncing vault state with backend",
4960
+ "description": "Called when vaulted payment methods are loaded or updated.\nReceives filtered vaulted payment method data with minimal PII exposure.\n\nUse for:\n- Building custom vault UI\n- Determining if CVV recapture is required (check cvvRecapture flag)\n- Analytics tracking for vault usage\n- Syncing vault state with backend",
4961
4961
  "parameters": [
4962
4962
  {
4963
- "description": "Vault methods update data with filtered payment methods",
4963
+ "description": "Vault methods update data with filtered payment methods and cvvRecapture flag",
4964
4964
  "name": "data"
4965
4965
  }
4966
4966
  ]
4967
4967
  },
4968
+ {
4969
+ "kind": "method",
4970
+ "name": "createCvvInput",
4971
+ "return": {
4972
+ "type": {
4973
+ "text": ""
4974
+ }
4975
+ },
4976
+ "parameters": [
4977
+ {
4978
+ "name": "options",
4979
+ "type": {
4980
+ "text": "CardSecurityCodeInputOptions"
4981
+ },
4982
+ "description": "CVV input configuration"
4983
+ }
4984
+ ],
4985
+ "description": "Creates a CVV input for vaulted payment method CVV recapture.\n\n⚠️ Requires vault to be initialized. Check vault availability via\nthe onVaultedMethodsUpdate callback before calling."
4986
+ },
4987
+ {
4988
+ "kind": "method",
4989
+ "name": "startVaultPayment",
4990
+ "return": {
4991
+ "type": {
4992
+ "text": ""
4993
+ }
4994
+ },
4995
+ "parameters": [
4996
+ {
4997
+ "name": "paymentMethodId",
4998
+ "type": {
4999
+ "text": "string"
5000
+ },
5001
+ "description": "The ID of the vaulted payment method"
5002
+ },
5003
+ {
5004
+ "name": "options",
5005
+ "optional": true,
5006
+ "type": {
5007
+ "text": "{ cvv?: string }"
5008
+ },
5009
+ "description": "Optional payment options"
5010
+ },
5011
+ {
5012
+ "description": "CVV value token (required if cvvRecapture is true)",
5013
+ "name": "options.cvv"
5014
+ }
5015
+ ],
5016
+ "description": "Initiates payment using a vaulted payment method.\n\nEnables headless vault flows where merchants build custom vault UIs.\nMirrors the legacy SDK's vaultManager.startPaymentFlow()."
5017
+ },
4968
5018
  {
4969
5019
  "kind": "method",
4970
5020
  "name": "refreshSession",
@@ -6347,9 +6397,9 @@
6347
6397
  "kind": "variable",
6348
6398
  "name": "PaymentMethodType",
6349
6399
  "type": {
6350
- "text": "{\n WORLDPAY_IDEAL: 'WORLDPAY_IDEAL',\n STRIPE_ACH: 'STRIPE_ACH',\n STRIPE_IDEAL: 'STRIPE_IDEAL',\n ADYEN_KLARNA: 'ADYEN_KLARNA',\n ADYEN_BANCONTACT_CARD: 'ADYEN_BANCONTACT_CARD',\n PAY_NL_KAARTDIRECT: 'PAY_NL_KAARTDIRECT',\n ADYEN_EPS: 'ADYEN_EPS',\n ADYEN_BANCONTACT_PAYCONIQ: 'ADYEN_BANCONTACT_PAYCONIQ',\n OMISE_PROMPTPAY: 'OMISE_PROMPTPAY',\n OMISE_TRUEMONEY: 'OMISE_TRUEMONEY',\n ADYEN_MULTIBANCO: 'ADYEN_MULTIBANCO',\n PACYPAY_WECHAT: 'PACYPAY_WECHAT',\n PACYPAY_ALIPAY: 'PACYPAY_ALIPAY',\n ADYEN_MBWAY: 'ADYEN_MBWAY',\n XENDIT_DANA: 'XENDIT_DANA',\n XENDIT_SHOPEEPAY: 'XENDIT_SHOPEEPAY',\n ADYEN_PAYSHOP: 'ADYEN_PAYSHOP',\n ADYEN_PAYTRAIL: 'ADYEN_PAYTRAIL',\n CLEARPAY: 'CLEARPAY',\n RAPYD_FAST: 'RAPYD_FAST',\n RAPYD_PROMPTPAY: 'RAPYD_PROMPTPAY',\n RAPYD_GCASH: 'RAPYD_GCASH',\n RAPYD_POLI: 'RAPYD_POLI',\n RAPYD_GRABPAY: 'RAPYD_GRABPAY',\n PRIMER_PAYPAL: 'PRIMER_PAYPAL',\n TWOC2P: 'TWOC2P',\n NETS: 'NETS',\n STRIPE_GIROPAY: 'STRIPE_GIROPAY',\n MOLLIE_GIROPAY: 'MOLLIE_GIROPAY',\n MOLLIE_EPS: 'MOLLIE_EPS',\n PAY_NL_EPS: 'PAY_NL_EPS',\n PAY_NL_P24: 'PAY_NL_P24',\n MOLLIE_P24: 'MOLLIE_P24',\n MOLLIE_SOFORT: 'MOLLIE_SOFORT',\n COINBASE: 'COINBASE',\n OPENNODE: 'OPENNODE',\n MOLLIE_GIFT_CARD: 'MOLLIE_GIFTCARD',\n XFERS_PAYNOW: 'XFERS_PAYNOW',\n PAYMENT_CARD: 'PAYMENT_CARD',\n APPLE_PAY: 'APPLE_PAY',\n GOOGLE_PAY: 'GOOGLE_PAY',\n PAYPAL: 'PAYPAL',\n GO_CARDLESS: 'GOCARDLESS',\n KLARNA: 'KLARNA',\n PAY_NL_IDEAL: 'PAY_NL_IDEAL',\n PAY_NL_SOFORT_BANKING: 'PAY_NL_SOFORT_BANKING',\n PAY_NL_BANCONTACT: 'PAY_NL_BANCONTACT',\n PAY_NL_PAYPAL: 'PAY_NL_PAYPAL',\n PAY_NL_CREDIT_TRANSFER: 'PAY_NL_CREDIT_TRANSFER',\n PAY_NL_DIRECT_DEBIT: 'PAY_NL_DIRECT_DEBIT',\n PAY_NL_GIROPAY: 'PAY_NL_GIROPAY',\n PAY_NL_PAYCONIQ: 'PAY_NL_PAYCONIQ',\n PAY_NL_RIVERTY: 'PAY_NL_RIVERTY',\n HOOLAH: 'HOOLAH',\n ADYEN_BLIK: 'ADYEN_BLIK',\n ADYEN_MOBILEPAY: 'ADYEN_MOBILEPAY',\n ADYEN_VIPPS: 'ADYEN_VIPPS',\n ADYEN_GIROPAY: 'ADYEN_GIROPAY',\n ADYEN_SOFORT: 'ADYEN_SOFORT',\n ADYEN_IDEAL: 'ADYEN_IDEAL',\n ADYEN_TRUSTLY: 'ADYEN_TRUSTLY',\n ADYEN_ALIPAY: 'ADYEN_ALIPAY',\n ADYEN_TWINT: 'ADYEN_TWINT',\n ADYEN_BANK_TRANSFER: 'ADYEN_BANK_TRANSFER',\n MOLLIE_BANCONTACT: 'MOLLIE_BANCONTACT',\n MOLLIE_IDEAL: 'MOLLIE_IDEAL',\n BUCKAROO_GIROPAY: 'BUCKAROO_GIROPAY',\n BUCKAROO_EPS: 'BUCKAROO_EPS',\n BUCKAROO_SOFORT: 'BUCKAROO_SOFORT',\n BUCKAROO_BANCONTACT: 'BUCKAROO_BANCONTACT',\n BUCKAROO_IDEAL: 'BUCKAROO_IDEAL',\n ATOME: 'ATOME',\n DLOCAL_PIX: 'DLOCAL_PIX',\n ALMA: 'ALMA',\n}"
6400
+ "text": "{\n WORLDPAY_IDEAL: 'WORLDPAY_IDEAL',\n STRIPE_ACH: 'STRIPE_ACH',\n STRIPE_IDEAL: 'STRIPE_IDEAL',\n ADYEN_KLARNA: 'ADYEN_KLARNA',\n ADYEN_BANCONTACT_CARD: 'ADYEN_BANCONTACT_CARD',\n PAY_NL_KAARTDIRECT: 'PAY_NL_KAARTDIRECT',\n ADYEN_EPS: 'ADYEN_EPS',\n ADYEN_BANCONTACT_PAYCONIQ: 'ADYEN_BANCONTACT_PAYCONIQ',\n OMISE_PROMPTPAY: 'OMISE_PROMPTPAY',\n OMISE_TRUEMONEY: 'OMISE_TRUEMONEY',\n ADYEN_MULTIBANCO: 'ADYEN_MULTIBANCO',\n PACYPAY_WECHAT: 'PACYPAY_WECHAT',\n PACYPAY_ALIPAY: 'PACYPAY_ALIPAY',\n ADYEN_MBWAY: 'ADYEN_MBWAY',\n XENDIT_DANA: 'XENDIT_DANA',\n XENDIT_SHOPEEPAY: 'XENDIT_SHOPEEPAY',\n ADYEN_PAYSHOP: 'ADYEN_PAYSHOP',\n ADYEN_PAYTRAIL: 'ADYEN_PAYTRAIL',\n CLEARPAY: 'CLEARPAY',\n RAPYD_FAST: 'RAPYD_FAST',\n RAPYD_PROMPTPAY: 'RAPYD_PROMPTPAY',\n RAPYD_GCASH: 'RAPYD_GCASH',\n RAPYD_POLI: 'RAPYD_POLI',\n RAPYD_GRABPAY: 'RAPYD_GRABPAY',\n PRIMER_PAYPAL: 'PRIMER_PAYPAL',\n TWOC2P: 'TWOC2P',\n NETS: 'NETS',\n STRIPE_GIROPAY: 'STRIPE_GIROPAY',\n MOLLIE_GIROPAY: 'MOLLIE_GIROPAY',\n MOLLIE_EPS: 'MOLLIE_EPS',\n PAY_NL_EPS: 'PAY_NL_EPS',\n PAY_NL_P24: 'PAY_NL_P24',\n MOLLIE_P24: 'MOLLIE_P24',\n MOLLIE_SOFORT: 'MOLLIE_SOFORT',\n COINBASE: 'COINBASE',\n OPENNODE: 'OPENNODE',\n MOLLIE_GIFT_CARD: 'MOLLIE_GIFTCARD',\n XFERS_PAYNOW: 'XFERS_PAYNOW',\n PAYMENT_CARD: 'PAYMENT_CARD',\n APPLE_PAY: 'APPLE_PAY',\n GOOGLE_PAY: 'GOOGLE_PAY',\n PAYPAL: 'PAYPAL',\n GO_CARDLESS: 'GOCARDLESS',\n KLARNA: 'KLARNA',\n PAY_NL_IDEAL: 'PAY_NL_IDEAL',\n PAY_NL_SOFORT_BANKING: 'PAY_NL_SOFORT_BANKING',\n PAY_NL_BANCONTACT: 'PAY_NL_BANCONTACT',\n PAY_NL_PAYPAL: 'PAY_NL_PAYPAL',\n PAY_NL_CREDIT_TRANSFER: 'PAY_NL_CREDIT_TRANSFER',\n PAY_NL_DIRECT_DEBIT: 'PAY_NL_DIRECT_DEBIT',\n PAY_NL_GIROPAY: 'PAY_NL_GIROPAY',\n PAY_NL_PAYCONIQ: 'PAY_NL_PAYCONIQ',\n PAY_NL_RIVERTY: 'PAY_NL_RIVERTY',\n HOOLAH: 'HOOLAH',\n ADYEN_BLIK: 'ADYEN_BLIK',\n ADYEN_MOBILEPAY: 'ADYEN_MOBILEPAY',\n ADYEN_VIPPS: 'ADYEN_VIPPS',\n ADYEN_GIROPAY: 'ADYEN_GIROPAY',\n ADYEN_SOFORT: 'ADYEN_SOFORT',\n ADYEN_IDEAL: 'ADYEN_IDEAL',\n ADYEN_TRUSTLY: 'ADYEN_TRUSTLY',\n ADYEN_ALIPAY: 'ADYEN_ALIPAY',\n ADYEN_TWINT: 'ADYEN_TWINT',\n ADYEN_BANK_TRANSFER: 'ADYEN_BANK_TRANSFER',\n MOLLIE_BANCONTACT: 'MOLLIE_BANCONTACT',\n MOLLIE_IDEAL: 'MOLLIE_IDEAL',\n BUCKAROO_GIROPAY: 'BUCKAROO_GIROPAY',\n BUCKAROO_EPS: 'BUCKAROO_EPS',\n BUCKAROO_SOFORT: 'BUCKAROO_SOFORT',\n BUCKAROO_BANCONTACT: 'BUCKAROO_BANCONTACT',\n BUCKAROO_IDEAL: 'BUCKAROO_IDEAL',\n ATOME: 'ATOME',\n DLOCAL_PIX: 'DLOCAL_PIX',\n ALMA: 'ALMA',\n ADYEN_CASHAPP: 'ADYEN_CASHAPP',\n ADYEN_AFFIRM: 'ADYEN_AFFIRM',\n}"
6351
6401
  },
6352
- "default": "{ WORLDPAY_IDEAL: 'WORLDPAY_IDEAL', STRIPE_ACH: 'STRIPE_ACH', STRIPE_IDEAL: 'STRIPE_IDEAL', ADYEN_KLARNA: 'ADYEN_KLARNA', ADYEN_BANCONTACT_CARD: 'ADYEN_BANCONTACT_CARD', PAY_NL_KAARTDIRECT: 'PAY_NL_KAARTDIRECT', ADYEN_EPS: 'ADYEN_EPS', ADYEN_BANCONTACT_PAYCONIQ: 'ADYEN_BANCONTACT_PAYCONIQ', OMISE_PROMPTPAY: 'OMISE_PROMPTPAY', OMISE_TRUEMONEY: 'OMISE_TRUEMONEY', ADYEN_MULTIBANCO: 'ADYEN_MULTIBANCO', PACYPAY_WECHAT: 'PACYPAY_WECHAT', PACYPAY_ALIPAY: 'PACYPAY_ALIPAY', ADYEN_MBWAY: 'ADYEN_MBWAY', XENDIT_DANA: 'XENDIT_DANA', XENDIT_SHOPEEPAY: 'XENDIT_SHOPEEPAY', ADYEN_PAYSHOP: 'ADYEN_PAYSHOP', ADYEN_PAYTRAIL: 'ADYEN_PAYTRAIL', CLEARPAY: 'CLEARPAY', RAPYD_FAST: 'RAPYD_FAST', RAPYD_PROMPTPAY: 'RAPYD_PROMPTPAY', RAPYD_GCASH: 'RAPYD_GCASH', RAPYD_POLI: 'RAPYD_POLI', RAPYD_GRABPAY: 'RAPYD_GRABPAY', PRIMER_PAYPAL: 'PRIMER_PAYPAL', TWOC2P: 'TWOC2P', NETS: 'NETS', STRIPE_GIROPAY: 'STRIPE_GIROPAY', MOLLIE_GIROPAY: 'MOLLIE_GIROPAY', MOLLIE_EPS: 'MOLLIE_EPS', PAY_NL_EPS: 'PAY_NL_EPS', PAY_NL_P24: 'PAY_NL_P24', MOLLIE_P24: 'MOLLIE_P24', MOLLIE_SOFORT: 'MOLLIE_SOFORT', COINBASE: 'COINBASE', OPENNODE: 'OPENNODE', MOLLIE_GIFT_CARD: 'MOLLIE_GIFTCARD', XFERS_PAYNOW: 'XFERS_PAYNOW', PAYMENT_CARD: 'PAYMENT_CARD', APPLE_PAY: 'APPLE_PAY', GOOGLE_PAY: 'GOOGLE_PAY', PAYPAL: 'PAYPAL', GO_CARDLESS: 'GOCARDLESS', KLARNA: 'KLARNA', PAY_NL_IDEAL: 'PAY_NL_IDEAL', PAY_NL_SOFORT_BANKING: 'PAY_NL_SOFORT_BANKING', PAY_NL_BANCONTACT: 'PAY_NL_BANCONTACT', PAY_NL_PAYPAL: 'PAY_NL_PAYPAL', PAY_NL_CREDIT_TRANSFER: 'PAY_NL_CREDIT_TRANSFER', PAY_NL_DIRECT_DEBIT: 'PAY_NL_DIRECT_DEBIT', PAY_NL_GIROPAY: 'PAY_NL_GIROPAY', PAY_NL_PAYCONIQ: 'PAY_NL_PAYCONIQ', PAY_NL_RIVERTY: 'PAY_NL_RIVERTY', HOOLAH: 'HOOLAH', ADYEN_BLIK: 'ADYEN_BLIK', ADYEN_MOBILEPAY: 'ADYEN_MOBILEPAY', ADYEN_VIPPS: 'ADYEN_VIPPS', ADYEN_GIROPAY: 'ADYEN_GIROPAY', ADYEN_SOFORT: 'ADYEN_SOFORT', ADYEN_IDEAL: 'ADYEN_IDEAL', ADYEN_TRUSTLY: 'ADYEN_TRUSTLY', ADYEN_ALIPAY: 'ADYEN_ALIPAY', ADYEN_TWINT: 'ADYEN_TWINT', ADYEN_BANK_TRANSFER: 'ADYEN_BANK_TRANSFER', MOLLIE_BANCONTACT: 'MOLLIE_BANCONTACT', MOLLIE_IDEAL: 'MOLLIE_IDEAL', BUCKAROO_GIROPAY: 'BUCKAROO_GIROPAY', BUCKAROO_EPS: 'BUCKAROO_EPS', BUCKAROO_SOFORT: 'BUCKAROO_SOFORT', BUCKAROO_BANCONTACT: 'BUCKAROO_BANCONTACT', BUCKAROO_IDEAL: 'BUCKAROO_IDEAL', ATOME: 'ATOME', DLOCAL_PIX: 'DLOCAL_PIX', ALMA: 'ALMA', }"
6402
+ "default": "{ WORLDPAY_IDEAL: 'WORLDPAY_IDEAL', STRIPE_ACH: 'STRIPE_ACH', STRIPE_IDEAL: 'STRIPE_IDEAL', ADYEN_KLARNA: 'ADYEN_KLARNA', ADYEN_BANCONTACT_CARD: 'ADYEN_BANCONTACT_CARD', PAY_NL_KAARTDIRECT: 'PAY_NL_KAARTDIRECT', ADYEN_EPS: 'ADYEN_EPS', ADYEN_BANCONTACT_PAYCONIQ: 'ADYEN_BANCONTACT_PAYCONIQ', OMISE_PROMPTPAY: 'OMISE_PROMPTPAY', OMISE_TRUEMONEY: 'OMISE_TRUEMONEY', ADYEN_MULTIBANCO: 'ADYEN_MULTIBANCO', PACYPAY_WECHAT: 'PACYPAY_WECHAT', PACYPAY_ALIPAY: 'PACYPAY_ALIPAY', ADYEN_MBWAY: 'ADYEN_MBWAY', XENDIT_DANA: 'XENDIT_DANA', XENDIT_SHOPEEPAY: 'XENDIT_SHOPEEPAY', ADYEN_PAYSHOP: 'ADYEN_PAYSHOP', ADYEN_PAYTRAIL: 'ADYEN_PAYTRAIL', CLEARPAY: 'CLEARPAY', RAPYD_FAST: 'RAPYD_FAST', RAPYD_PROMPTPAY: 'RAPYD_PROMPTPAY', RAPYD_GCASH: 'RAPYD_GCASH', RAPYD_POLI: 'RAPYD_POLI', RAPYD_GRABPAY: 'RAPYD_GRABPAY', PRIMER_PAYPAL: 'PRIMER_PAYPAL', TWOC2P: 'TWOC2P', NETS: 'NETS', STRIPE_GIROPAY: 'STRIPE_GIROPAY', MOLLIE_GIROPAY: 'MOLLIE_GIROPAY', MOLLIE_EPS: 'MOLLIE_EPS', PAY_NL_EPS: 'PAY_NL_EPS', PAY_NL_P24: 'PAY_NL_P24', MOLLIE_P24: 'MOLLIE_P24', MOLLIE_SOFORT: 'MOLLIE_SOFORT', COINBASE: 'COINBASE', OPENNODE: 'OPENNODE', MOLLIE_GIFT_CARD: 'MOLLIE_GIFTCARD', XFERS_PAYNOW: 'XFERS_PAYNOW', PAYMENT_CARD: 'PAYMENT_CARD', APPLE_PAY: 'APPLE_PAY', GOOGLE_PAY: 'GOOGLE_PAY', PAYPAL: 'PAYPAL', GO_CARDLESS: 'GOCARDLESS', KLARNA: 'KLARNA', PAY_NL_IDEAL: 'PAY_NL_IDEAL', PAY_NL_SOFORT_BANKING: 'PAY_NL_SOFORT_BANKING', PAY_NL_BANCONTACT: 'PAY_NL_BANCONTACT', PAY_NL_PAYPAL: 'PAY_NL_PAYPAL', PAY_NL_CREDIT_TRANSFER: 'PAY_NL_CREDIT_TRANSFER', PAY_NL_DIRECT_DEBIT: 'PAY_NL_DIRECT_DEBIT', PAY_NL_GIROPAY: 'PAY_NL_GIROPAY', PAY_NL_PAYCONIQ: 'PAY_NL_PAYCONIQ', PAY_NL_RIVERTY: 'PAY_NL_RIVERTY', HOOLAH: 'HOOLAH', ADYEN_BLIK: 'ADYEN_BLIK', ADYEN_MOBILEPAY: 'ADYEN_MOBILEPAY', ADYEN_VIPPS: 'ADYEN_VIPPS', ADYEN_GIROPAY: 'ADYEN_GIROPAY', ADYEN_SOFORT: 'ADYEN_SOFORT', ADYEN_IDEAL: 'ADYEN_IDEAL', ADYEN_TRUSTLY: 'ADYEN_TRUSTLY', ADYEN_ALIPAY: 'ADYEN_ALIPAY', ADYEN_TWINT: 'ADYEN_TWINT', ADYEN_BANK_TRANSFER: 'ADYEN_BANK_TRANSFER', MOLLIE_BANCONTACT: 'MOLLIE_BANCONTACT', MOLLIE_IDEAL: 'MOLLIE_IDEAL', BUCKAROO_GIROPAY: 'BUCKAROO_GIROPAY', BUCKAROO_EPS: 'BUCKAROO_EPS', BUCKAROO_SOFORT: 'BUCKAROO_SOFORT', BUCKAROO_BANCONTACT: 'BUCKAROO_BANCONTACT', BUCKAROO_IDEAL: 'BUCKAROO_IDEAL', ATOME: 'ATOME', DLOCAL_PIX: 'DLOCAL_PIX', ALMA: 'ALMA', ADYEN_CASHAPP: 'ADYEN_CASHAPP', ADYEN_AFFIRM: 'ADYEN_AFFIRM', }"
6353
6403
  }
6354
6404
  ],
6355
6405
  "exports": [
@@ -13632,6 +13682,48 @@
13632
13682
  }
13633
13683
  ]
13634
13684
  },
13685
+ {
13686
+ "kind": "function",
13687
+ "name": "isDeepEqual",
13688
+ "return": {
13689
+ "type": {
13690
+ "text": ""
13691
+ }
13692
+ },
13693
+ "parameters": [
13694
+ {
13695
+ "name": "obj1",
13696
+ "type": {
13697
+ "text": "unknown"
13698
+ },
13699
+ "description": "First object to compare"
13700
+ },
13701
+ {
13702
+ "name": "obj2",
13703
+ "type": {
13704
+ "text": "unknown"
13705
+ },
13706
+ "description": "Second object to compare"
13707
+ },
13708
+ {
13709
+ "name": "depth",
13710
+ "default": "0",
13711
+ "type": {
13712
+ "text": "number"
13713
+ },
13714
+ "description": "Current recursion depth (internal parameter)"
13715
+ },
13716
+ {
13717
+ "name": "maxDepth",
13718
+ "default": "10",
13719
+ "type": {
13720
+ "text": "number"
13721
+ },
13722
+ "description": "Maximum recursion depth allowed"
13723
+ }
13724
+ ],
13725
+ "description": "Deep equality check for state objects.\nHandles primitives, null, undefined, and nested objects.\nOptimized for shallow state structures like SdkState (5 properties)."
13726
+ },
13635
13727
  {
13636
13728
  "kind": "function",
13637
13729
  "name": "createReducer",
@@ -13788,6 +13880,14 @@
13788
13880
  "module": "src/controllers/reactive-state/index.ts"
13789
13881
  }
13790
13882
  },
13883
+ {
13884
+ "kind": "js",
13885
+ "name": "isDeepEqual",
13886
+ "declaration": {
13887
+ "name": "isDeepEqual",
13888
+ "module": "src/controllers/reactive-state/index.ts"
13889
+ }
13890
+ },
13791
13891
  {
13792
13892
  "kind": "js",
13793
13893
  "name": "createReducer",
@@ -13824,7 +13924,7 @@
13824
13924
  "type": {
13825
13925
  "text": "VaultManagerState"
13826
13926
  },
13827
- "default": "{ enabled: false, isLoading: false, isUpdating: false, cvvRecapture: false, showEmptyState: true, vaultedPaymentMethods: [], createCvvInput: null, deleteVaultedPaymentMethod: () => Promise.resolve(), startVaultedPaymentFlow: () => Promise.resolve(), }",
13927
+ "default": "{ enabled: false, isLoading: false, isUpdating: false, cvvRecapture: false, showEmptyState: false, headless: false, vaultedPaymentMethods: [], createCvvInput: null, deleteVaultedPaymentMethod: () => Promise.resolve(), startVaultedPaymentFlow: () => Promise.resolve(), }",
13828
13928
  "description": "Initial state for the VaultManager (core functionality)"
13829
13929
  },
13830
13930
  {
@@ -14040,6 +14140,21 @@
14040
14140
  "name": "setSelectedVaultedPaymentMethod",
14041
14141
  "description": "Set the selected vaulted payment method - updates form state only"
14042
14142
  },
14143
+ {
14144
+ "kind": "field",
14145
+ "name": "startVaultPaymentById",
14146
+ "description": "Start vaulted payment flow by payment method ID",
14147
+ "parameters": [
14148
+ {
14149
+ "description": "The ID of the vaulted payment method",
14150
+ "name": "paymentMethodId"
14151
+ },
14152
+ {
14153
+ "description": "Optional payment options including CVV token",
14154
+ "name": "options"
14155
+ }
14156
+ ]
14157
+ },
14043
14158
  {
14044
14159
  "kind": "field",
14045
14160
  "name": "_controllers",
@@ -14218,7 +14333,7 @@
14218
14333
  "type": {
14219
14334
  "text": "VaultManagerState"
14220
14335
  },
14221
- "default": "{ enabled: false, isLoading: false, isUpdating: false, cvvRecapture: false, showEmptyState: true, vaultedPaymentMethods: [], createCvvInput: null, deleteVaultedPaymentMethod: () => Promise.resolve(), startVaultedPaymentFlow: () => Promise.resolve(), }",
14336
+ "default": "{ enabled: false, isLoading: false, isUpdating: false, cvvRecapture: false, showEmptyState: false, headless: false, vaultedPaymentMethods: [], createCvvInput: null, deleteVaultedPaymentMethod: () => Promise.resolve(), startVaultedPaymentFlow: () => Promise.resolve(), }",
14222
14337
  "description": "Initial state for the VaultManager (core functionality)"
14223
14338
  },
14224
14339
  {
@@ -66,8 +66,6 @@ export type PrimerCheckoutComponentProps = {
66
66
  /** */
67
67
  "client-token"?: string;
68
68
  /** */
69
- options?: PrimerCheckoutOptions;
70
- /** */
71
69
  "loader-disabled"?: boolean;
72
70
  /** Whether the component has completed initialization and loading
73
71
  This is used to control the CSS-only loader visibility */
@@ -77,6 +75,8 @@ This is used to control the CSS-only loader visibility */
77
75
  /** */
78
76
  primerJS?: PrimerJS | undefined;
79
77
  /** */
78
+ options?: PrimerCheckoutOptions;
79
+ /** */
80
80
  defaultSlot?: HTMLSlotElement;
81
81
  /** */
82
82
  locale?: LocaleCode | undefined;