@justifi/webcomponents 4.23.1 → 5.0.0-rc-2

package/dist/module/dispute-management-core.js

@@ -1,20 +1,19 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { S as StyledHost } from './styled-host.js';
-import { d as defineCustomElement$9, D as DisputeManagementClickEvents } from './counter-dispute.js';
-import { d as defineCustomElement$k } from './custom-popper2.js';
-import { d as defineCustomElement$j } from './form-control-date2.js';
-import { d as defineCustomElement$i } from './form-control-error-text2.js';
-import { d as defineCustomElement$h } from './form-control-file2.js';
-import { d as defineCustomElement$g } from './form-control-help-text2.js';
-import { d as defineCustomElement$f } from './form-control-radio2.js';
+import { D as DisputeManagementClickActions } from './event-types3.js';
+import { D as Dispute, a as DisputeStatus } from './Payment.js';
+import { d as defineCustomElement$i } from './custom-popper2.js';
+import { d as defineCustomElement$h } from './form-control-date2.js';
+import { d as defineCustomElement$g } from './form-control-file-v22.js';
+import { d as defineCustomElement$f } from './form-control-help-text3.js';
 import { d as defineCustomElement$e } from './form-control-text2.js';
 import { d as defineCustomElement$d } from './form-control-textarea2.js';
 import { d as defineCustomElement$c } from './form-control-tooltip2.js';
 import { d as defineCustomElement$b } from './additional-statement.js';
 import { d as defineCustomElement$a } from './cancellation-policy.js';
-import { d as defineCustomElement$8 } from './customer-details.js';
-import { d as defineCustomElement$7 } from './dispute-notification.js';
-import { d as defineCustomElement$6 } from './dispute-reason.js';
+import { d as defineCustomElement$9 } from './customer-details.js';
+import { d as defineCustomElement$8 } from './dispute-notification.js';
+import { d as defineCustomElement$7 } from './dispute-response.js';
+import { d as defineCustomElement$6 } from './dispute-response-core.js';
 import { d as defineCustomElement$5 } from './duplicate-charge.js';
 import { d as defineCustomElement$4 } from './electronic-evidence.js';
 import { d as defineCustomElement$3 } from './product-or-service.js';
@@ -25,28 +24,74 @@ const DisputeManagementCore = /*@__PURE__*/ proxyCustomElement(class DisputeMana
     constructor() {
         super();
         this.__registerHost();
-        this.submitted = createEvent(this, "submitted", 7);
-        this.showCounterDispute = false;
+        this.errorEvent = createEvent(this, "error-event", 7);
+        this.getDispute = undefined;
+        this.disputeId = undefined;
+        this.authToken = undefined;
+        this.dispute = undefined;
+        this.isLoading = true;
+        this.showDisputeResponseForm = false;
     }
-    counterDisputeHandler(event) {
-        if (event.detail.name === DisputeManagementClickEvents.counterDispute) {
-            this.showCounterDispute = true;
+    disputeResponseHandler(event) {
+        if (event.detail.name === DisputeManagementClickActions.respondToDispute) {
+            this.showDisputeResponseForm = true;
         }
-        if (event.detail.name === DisputeManagementClickEvents.cancelDispute) {
-            this.showCounterDispute = false;
+        if (event.detail.name === DisputeManagementClickActions.cancelDispute) {
+            this.showDisputeResponseForm = false;
         }
     }
+    disputeSubmittedHandler() {
+        this.fetchData();
+    }
+    componentWillLoad() {
+        if (this.getDispute) {
+            this.fetchData();
+        }
+    }
+    updateOnPropChange() {
+        this.fetchData();
+    }
+    fetchData() {
+        this.isLoading = true;
+        this.getDispute({
+            onSuccess: ({ dispute }) => {
+                this.dispute = new Dispute(dispute);
+                this.isLoading = false;
+                if (this.dispute.status !== DisputeStatus.needsResponse) {
+                    this.showDisputeResponseForm = false;
+                }
+            },
+            onError: ({ error, code, severity }) => {
+                this.errorEvent.emit({
+                    errorCode: code,
+                    message: error,
+                    severity,
+                });
+                this.isLoading = false;
+            },
+        });
+    }
     render() {
-        return (h(StyledHost, { key: '9bd815e88277ff5d96239bb6d005e1469f2762d2' }, this.showCounterDispute ? h("justifi-counter-dispute", null) : h("justifi-dispute-notification", null)));
+        return (h("div", { key: 'd147755d1f58c2ad2230f1afd511f03ee9053b75' }, this.showDisputeResponseForm ? (h("justifi-dispute-response", { disputeId: this.disputeId, disputeResponse: this.dispute.dispute_response, authToken: this.authToken })) : (h("justifi-dispute-notification", { dispute: this.dispute, authToken: this.authToken, isLoading: this.isLoading }))));
     }
+    static get watchers() { return {
+        "getDispute": ["updateOnPropChange"]
+    }; }
 }, [0, "justifi-dispute-management-core", {
-        "showCounterDispute": [32]
-    }, [[0, "clickEvent", "counterDisputeHandler"]]]);
+        "getDispute": [16],
+        "disputeId": [1, "dispute-id"],
+        "authToken": [1, "auth-token"],
+        "dispute": [32],
+        "isLoading": [32],
+        "showDisputeResponseForm": [32]
+    }, [[0, "click-event", "disputeResponseHandler"], [0, "submit-event", "disputeSubmittedHandler"]], {
+        "getDispute": ["updateOnPropChange"]
+    }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-dispute-management-core", "custom-popper", "form-control-date", "form-control-error-text", "form-control-file", "form-control-help-text", "form-control-radio", "form-control-text", "form-control-textarea", "form-control-tooltip", "justifi-additional-statement", "justifi-cancellation-policy", "justifi-counter-dispute", "justifi-customer-details", "justifi-dispute-notification", "justifi-dispute-reason", "justifi-duplicate-charge", "justifi-electronic-evidence", "justifi-product-or-service", "justifi-refund-policy", "justifi-shipping-details"];
+    const components = ["justifi-dispute-management-core", "custom-popper", "form-control-date", "form-control-file-v2", "form-control-help-text", "form-control-text", "form-control-textarea", "form-control-tooltip", "justifi-additional-statement", "justifi-cancellation-policy", "justifi-customer-details", "justifi-dispute-notification", "justifi-dispute-response", "justifi-dispute-response-core", "justifi-duplicate-charge", "justifi-electronic-evidence", "justifi-product-or-service", "justifi-refund-policy", "justifi-shipping-details"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-dispute-management-core":
             if (!customElements.get(tagName)) {
@@ -54,31 +99,21 @@ function defineCustomElement() {
             }
             break;
         case "custom-popper":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$k();
-            }
-            break;
-        case "form-control-date":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$j();
-            }
-            break;
-        case "form-control-error-text":
             if (!customElements.get(tagName)) {
                 defineCustomElement$i();
             }
             break;
-        case "form-control-file":
+        case "form-control-date":
             if (!customElements.get(tagName)) {
                 defineCustomElement$h();
             }
             break;
-        case "form-control-help-text":
+        case "form-control-file-v2":
             if (!customElements.get(tagName)) {
                 defineCustomElement$g();
             }
             break;
-        case "form-control-radio":
+        case "form-control-help-text":
             if (!customElements.get(tagName)) {
                 defineCustomElement$f();
             }
@@ -108,22 +143,22 @@ function defineCustomElement() {
                 defineCustomElement$a();
             }
             break;
-        case "justifi-counter-dispute":
+        case "justifi-customer-details":
             if (!customElements.get(tagName)) {
                 defineCustomElement$9();
             }
             break;
-        case "justifi-customer-details":
+        case "justifi-dispute-notification":
             if (!customElements.get(tagName)) {
                 defineCustomElement$8();
             }
             break;
-        case "justifi-dispute-notification":
+        case "justifi-dispute-response":
             if (!customElements.get(tagName)) {
                 defineCustomElement$7();
             }
             break;
-        case "justifi-dispute-reason":
+        case "justifi-dispute-response-core":
             if (!customElements.get(tagName)) {
                 defineCustomElement$6();
             }

package/dist/module/dispute-notification.js

@@ -1,23 +1,56 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { c as formatCurrency } from './utils2.js';
+import { t as text, S as heading4 } from './parts.js';
+import { B as Button } from './button.js';
+import { S as StyledHost } from './styled-host.js';
+import { S as Skeleton } from './skeleton.js';
+import './details.js';
+import { m as makeSubmitDisputeResponse, D as DisputeService } from './dispute-response-actions.js';
+import { D as DisputeManagementClickActions } from './event-types3.js';
 
 const DisputeNotification = /*@__PURE__*/ proxyCustomElement(class DisputeNotification extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
-        this.submitted = createEvent(this, "submitted", 7);
-        this.clickEvent = createEvent(this, "clickEvent", 7);
+        this.__attachShadow();
+        this.clickEvent = createEvent(this, "click-event", 7);
+        this.errorEvent = createEvent(this, "error-event", 7);
+        this.submitEvent = createEvent(this, "submit-event", 7);
+        this.dispute = undefined;
+        this.authToken = undefined;
+        this.isLoading = undefined;
     }
     acceptDispute() {
-        // submit the dispute as forfeited, then emit submit event
-        this.submitted.emit();
+        makeSubmitDisputeResponse({
+            disputeId: this.dispute.id,
+            authToken: this.authToken,
+            service: new DisputeService()
+        })({
+            payload: { forfeit: true },
+            onSuccess: (response) => {
+                this.submitEvent.emit({ response: response });
+            },
+            onError: ({ error, code, severity }) => {
+                this.errorEvent.emit({
+                    errorCode: code,
+                    message: error,
+                    severity,
+                });
+            },
+        });
     }
-    initiateCounterDispute() {
-        this.clickEvent.emit({ name: 'counterDispute' });
+    initiateRespondToDispute() {
+        this.clickEvent.emit({ name: DisputeManagementClickActions.respondToDispute });
     }
     render() {
-        return (h("div", { key: '0d0972438c4853aa287ec5fc3f6ac73065901cf8' }, h("h1", { key: '017c26575eb5896d2b4e14cacbe64ae03ee448d3', class: "h4" }, "This payment was disputed"), h("p", { key: 'e67a528f7776d024aa8637d1e698c28a089b29a4' }, "The cardholder for this payment claims that the product was not received."), h("p", { key: 'abefc2a97d6c97dc2b335eb056e51a41523b8a7e' }, "You can either counter the dispute by presenting proof of the product's delivery to or use by the cardholder, or you can choose to accept the dispute right away, refund the cardholder, and resolve the matter."), h("h2", { key: '8db22af9658f7bafefa08a8f7bb3d472ddb2031c', class: "h5" }, "Dispute details"), h("div", { key: '6a2fed3e4eeef95f234645d21204459a58f7361b', class: "d-table gap-2" }, h("div", { key: '728991225235e32591c7e06c92b268e64328f6d6', class: "d-table-row gap-2" }, h("span", { key: 'c86a018efc52559e2378c1be7b42bb8a135ab59d', part: "detail-section-item-title", class: "fw-bold d-table-cell pe-4" }, "Amount"), h("span", { key: '8e35d45cdaca9f6942e0198a0f048c25f4076cd3', part: "detail-section-item-data", class: "flex-1 d-table-cell text-wrap" }, "$50.00")), h("div", { key: 'd46174ef479090e4903ca7d31fe91200fc7801e2', class: "d-table-row gap-2" }, h("span", { key: '2fa646161979d79798a4a4de2e8b4d50c53eebda', part: "detail-section-item-title", class: "fw-bold d-table-cell pe-4" }, "Reason"), h("span", { key: 'a6685b45566eb217cc9354c52f21e250d19fac6f', part: "detail-section-item-data", class: "flex-1 d-table-cell text-wrap" }, "Product not received")), h("div", { key: '24cbc95215f43c523443b5987ac4759f4a151778', class: "d-table-row gap-2" }, h("span", { key: 'edff0d1c841ca687c82371c16978ce8b74f42a2f', part: "detail-section-item-title", class: "fw-bold d-table-cell pe-4" }, "Dispute ID"), h("span", { key: 'a9adf4c147677fc7e2fc30382b0943c6a4abb99f', part: "detail-section-item-data", class: "flex-1 d-table-cell text-wrap" }, "dis_1234567890"))), h("div", { key: '19038f6b2169c8cc09d386f19e5679275642671a', class: "d-flex gap-2 mt-4 justify-content-end" }, h("button", { key: '115bbcc4b0fcbc4d31b09445c5d7fb419394b5ff', class: "btn btn-secondary", onClick: () => this.acceptDispute() }, "Accept dispute"), h("button", { key: 'bb526454770114506239c1062e2d657ded4195e2', class: "btn btn-primary", onClick: () => this.initiateCounterDispute() }, "Counter dispute"))));
+        var _a, _b, _c, _d, _e, _f, _g;
+        return (h(StyledHost, { key: 'df45596c8b40c5665589e976405c38f05271812f' }, this.isLoading && (h("div", { key: '9c1f507799665e4297a9e76d24cf1656079bb146', style: { marginBottom: '8px' } }, h(Skeleton, { key: '6a6e2314fb16348e59d4ff9b4739d895b376303c', height: '28px', width: '70%', styles: { marginBottom: '16px' } }), h(Skeleton, { key: '286352f2b7da7f3b494add74fc332a3d2a6f4d42', height: '18px', styles: { marginBottom: '8px' } }), h(Skeleton, { key: 'bc3985914e7dbeecbe4ea9efea1fcdd592d2600e', height: '18px', styles: { marginBottom: '8px' } }))), ((_a = this.dispute) === null || _a === void 0 ? void 0 : _a.needsResponse) && (h("div", { key: 'e0371f22a67d7ebef374e2ad4ed0e0d151b2105b', part: text }, h("h1", { key: 'a85046d309d92aee9c6a01e0311fe23d0cc48b98', class: "h4", part: heading4 }, "This payment is disputed"), h("p", { key: '886223ea616ea99c76b7f0e719f2bec606e6796a' }, "The cardholder is disputing this payment. You may accept this dispute, or proceed to provide evidence in a counter dispute."), h("h2", { key: '3f12d0ded622ad0c844dee081b8eb3d444e2b4e3', class: "h5" }, "Dispute details"), h("div", { key: 'add2e0e67fcebcb484a2a30ea66a303693a95be8', class: "d-table gap-2" }, h("div", { key: '30b35751ab437971b2c0ef6ab003d7c348d3cc3f', class: "d-table-row gap-2" }, h("span", { key: '7b5ea6fdf2d644a2c31e0276185fb2a95b0ee85f', part: "detail-section-item-title", class: "fw-bold d-table-cell pe-4" }, "Amount"), h("span", { key: 'f91e37855056374a345a8a534c9343ed71180a1e', part: "detail-section-item-data", class: "flex-1 d-table-cell text-wrap" }, formatCurrency((_b = this.dispute) === null || _b === void 0 ? void 0 : _b.amount))), h("div", { key: '6d2ef3c07ee006eba74caae39e1c355c4f1d0e80', class: "d-table-row gap-2" }, h("span", { key: 'cb60ccb1855a7bc15b8e411986790c33419659c3', part: "detail-section-item-title", class: "fw-bold d-table-cell pe-4" }, "Reason"), h("span", { key: 'a2c21645bbba4529576062baacbdd1166e1b4f72', part: "detail-section-item-data", class: "flex-1 d-table-cell text-wrap" }, (_c = this.dispute) === null || _c === void 0 ? void 0 : _c.reason)), h("div", { key: '4f9bfc9fa68efc18032a9367938c82fef27f6dbe', class: "d-table-row gap-2" }, h("span", { key: 'c78b105e6e1bbe3332005c71e230609c9f2a65d9', part: "detail-section-item-title", class: "fw-bold d-table-cell pe-4" }, "Dispute ID"), h("span", { key: '0d75f20d0c665cf18eb6a91eb4a890df0e0a09be', part: "detail-section-item-data", class: "flex-1 d-table-cell text-wrap" }, (_d = this.dispute) === null || _d === void 0 ? void 0 : _d.id))), h("div", { key: '97801ea1983a7591d0c5aa933842fcce2eb12394', class: "d-flex gap-2 mt-4 justify-content-end" }, h(Button, { key: '8155accf40a4512506b18de08423da53cd3c2ff7', variant: "secondary", onClick: () => this.acceptDispute() }, "Accept dispute"), h(Button, { key: 'b23bd82c73ae7c8c020b7ad5c60223f9a1eae8d2', variant: "primary", onClick: () => this.initiateRespondToDispute() }, "Counter dispute")))), ((_e = this.dispute) === null || _e === void 0 ? void 0 : _e.underReview) && (h("div", { key: '2b3ee4c8f1b9b0100416c7804897530e001826d3' }, h("h1", { key: 'abdeb425738b1f0cd8b27836a885f9d9e31b1774', class: "h4" }, "This payment is disputed and under review"), h("p", { key: 'aa42c034af8bef20370aac9607065e6f15a87534' }, "The cardholder is disputing this payment. A counter dispute has been submitEvent and is under review."))), ((_f = this.dispute) === null || _f === void 0 ? void 0 : _f.won) && (h("div", { key: '2a75a70a3a45a0d42dc182b0782983220444c42b' }, h("h1", { key: '3e6c8aad4507bab77c6f0bf06c2ee26af382b8e8', class: "h4" }, "This payment was disputed"), h("p", { key: 'b1d2626f6c6529005676ead7776b988693334971' }, "The cardholder disputed this payment and the card issuer has settled it in your favor."))), ((_g = this.dispute) === null || _g === void 0 ? void 0 : _g.lost) && (h("div", { key: '1b9da576c01bd69842cd3d0b65e96997842461e8' }, h("h1", { key: 'c5521ef13d0f9437b90fd34b96e43f980ab7ceb8', class: "h4" }, "This payment was disputed"), h("p", { key: 'd5724f0fd2194621a908d803752dc1965d2f0043' }, "The cardholder disputed this payment and the card issuer has settled it their favor.")))));
     }
-}, [0, "justifi-dispute-notification"]);
+}, [1, "justifi-dispute-notification", {
+        "dispute": [16],
+        "authToken": [1, "auth-token"],
+        "isLoading": [4, "is-loading"]
+    }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;

package/dist/module/dispute-response-actions.js

@@ -0,0 +1,117 @@
+import { A as Api } from './Api.js';
+import './Checkout.js';
+import './Pagination.js';
+import './Payment.js';
+import './SubAccount.js';
+import { c as config } from './config.js';
+import { a as ComponentErrorSeverity } from './ComponentError.js';
+import { g as getErrorMessage, a as getErrorCode } from './utils3.js';
+
+class DisputeService {
+    async fetchDispute(disputeId, authToken) {
+        const endpoint = `disputes/${disputeId}`;
+        return Api({ authToken, apiOrigin: config.proxyApiOrigin }).get(endpoint);
+    }
+    async updateDisputeResponse(disputeId, authToken, payload) {
+        const endpoint = `disputes/${disputeId}/response`;
+        return Api({ authToken, apiOrigin: config.proxyApiOrigin }).patch(endpoint, payload);
+    }
+    async submitDisputeResponse(disputeId, authToken, payload) {
+        const endpoint = `disputes/${disputeId}/response`;
+        return Api({ authToken, apiOrigin: config.proxyApiOrigin }).post(endpoint, payload);
+    }
+    async createDisputeEvidence(disputeId, authToken, payload) {
+        const endpoint = `disputes/${disputeId}/evidence`;
+        return Api({ authToken, apiOrigin: config.proxyApiOrigin }).put(endpoint, payload);
+    }
+}
+
+const makeUpdateDisputeResponse = ({ authToken, disputeId, service }) => async ({ payload, onSuccess, onError, final = () => { } }) => {
+    var _a;
+    try {
+        const response = await service.updateDisputeResponse(disputeId, authToken, payload);
+        if (!response.error) {
+            onSuccess(response);
+        }
+        else {
+            const responseError = getErrorMessage(response.error);
+            const code = getErrorCode((_a = response.error) === null || _a === void 0 ? void 0 : _a.code);
+            return onError({
+                error: responseError,
+                code,
+                severity: ComponentErrorSeverity.ERROR,
+            });
+        }
+    }
+    catch (error) {
+        const code = getErrorCode(error === null || error === void 0 ? void 0 : error.code);
+        return onError({
+            error: error.message || error,
+            code,
+            severity: ComponentErrorSeverity.ERROR,
+        });
+    }
+    finally {
+        return final();
+    }
+};
+const makeSubmitDisputeResponse = ({ authToken, disputeId, service }) => async ({ payload, onSuccess, onError, final = () => { } }) => {
+    var _a;
+    try {
+        const response = await service.submitDisputeResponse(disputeId, authToken, payload);
+        if (!response.error) {
+            onSuccess(response);
+        }
+        else {
+            const responseError = getErrorMessage(response.error);
+            const code = getErrorCode((_a = response.error) === null || _a === void 0 ? void 0 : _a.code);
+            return onError({
+                error: responseError,
+                code,
+                severity: ComponentErrorSeverity.ERROR,
+            });
+        }
+    }
+    catch (error) {
+        const code = getErrorCode(error === null || error === void 0 ? void 0 : error.code);
+        return onError({
+            error: error.message || error,
+            code,
+            severity: ComponentErrorSeverity.ERROR,
+        });
+    }
+    finally {
+        return final();
+    }
+};
+const makeCreateDisputeEvidence = ({ authToken, disputeId, service }) => async ({ payload, onSuccess, onError, final = () => { } }) => {
+    var _a;
+    try {
+        const response = await service.createDisputeEvidence(disputeId, authToken, payload);
+        if (!response.error) {
+            onSuccess(response);
+        }
+        else {
+            const responseError = getErrorMessage(response.error);
+            const code = getErrorCode((_a = response.error) === null || _a === void 0 ? void 0 : _a.code);
+            return onError({
+                error: responseError,
+                code,
+                severity: ComponentErrorSeverity.ERROR,
+            });
+        }
+    }
+    catch (error) {
+        const code = getErrorCode(error === null || error === void 0 ? void 0 : error.code);
+        return onError({
+            error: error.message || error,
+            code,
+            severity: ComponentErrorSeverity.ERROR,
+        });
+    }
+    finally {
+        return final();
+    }
+};
+
+export { DisputeService as D, makeUpdateDisputeResponse as a, makeCreateDisputeEvidence as b, makeSubmitDisputeResponse as m };

package/dist/module/dispute-response-core.js

@@ -0,0 +1,280 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { D as DisputeManagementClickActions } from './event-types3.js';
+import { S as heading4 } from './parts.js';
+import { B as Button } from './button.js';
+import { d as defineCustomElement$f } from './custom-popper2.js';
+import { d as defineCustomElement$e } from './form-control-date2.js';
+import { d as defineCustomElement$d } from './form-control-file-v22.js';
+import { d as defineCustomElement$c } from './form-control-help-text3.js';
+import { d as defineCustomElement$b } from './form-control-text2.js';
+import { d as defineCustomElement$a } from './form-control-textarea2.js';
+import { d as defineCustomElement$9 } from './form-control-tooltip2.js';
+import { d as defineCustomElement$8 } from './additional-statement.js';
+import { d as defineCustomElement$7 } from './cancellation-policy.js';
+import { d as defineCustomElement$6 } from './customer-details.js';
+import { d as defineCustomElement$5 } from './duplicate-charge.js';
+import { d as defineCustomElement$4 } from './electronic-evidence.js';
+import { d as defineCustomElement$3 } from './product-or-service.js';
+import { d as defineCustomElement$2 } from './refund-policy.js';
+import { d as defineCustomElement$1 } from './shipping-details.js';
+
+const DisputeResponseCore = /*@__PURE__*/ proxyCustomElement(class DisputeResponseCore extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.clickEvent = createEvent(this, "click-event", 7);
+        this.errorEvent = createEvent(this, "error-event", 7);
+        this.stepCompleteEvent = createEvent(this, "complete-form-step-event", 7);
+        this.submitEvent = createEvent(this, "submit-event", 7);
+        this.componentStepMapping = [
+            () => h("justifi-product-or-service", { ref: (el) => this.currentStepComponentRef = el, disputeResponse: this.disputeResponse }),
+            () => h("justifi-customer-details", { ref: (el) => this.currentStepComponentRef = el, disputeResponse: this.disputeResponse }),
+            () => h("justifi-cancellation-policy", { ref: (el) => this.currentStepComponentRef = el, disputeResponse: this.disputeResponse }),
+            () => h("justifi-refund-policy", { ref: (el) => this.currentStepComponentRef = el, disputeResponse: this.disputeResponse }),
+            () => h("justifi-duplicate-charge", { ref: (el) => this.currentStepComponentRef = el, disputeResponse: this.disputeResponse }),
+            () => h("justifi-electronic-evidence", { ref: (el) => this.currentStepComponentRef = el, disputeResponse: this.disputeResponse }),
+            () => h("justifi-shipping-details", { ref: (el) => this.currentStepComponentRef = el, disputeResponse: this.disputeResponse }),
+            () => h("justifi-additional-statement", { ref: (el) => this.currentStepComponentRef = el, disputeResponse: this.disputeResponse }),
+        ];
+        this.saveData = async (formData, formStep) => {
+            const hasFormData = Object.keys(formData).length;
+            if (!hasFormData) {
+                this.stepCompleteEvent.emit({ response: null, formStep: formStep });
+                return;
+            }
+            if (this.isLastStep) {
+                return this.submitDisputeResponse({
+                    payload: formData,
+                    onSuccess: (response) => {
+                        this.submitEvent.emit({ response: response });
+                        this.stepCompleteEvent.emit({ response: response, formStep: formStep });
+                    },
+                    onError: ({ error, code, severity }) => {
+                        this.errorEvent.emit({
+                            errorCode: code,
+                            message: error,
+                            severity,
+                        });
+                    },
+                });
+            }
+            else {
+                return this.updateDisputeResponse({
+                    payload: formData,
+                    onSuccess: (response) => {
+                        this.disputeResponse = Object.assign({}, response.data);
+                        this.stepCompleteEvent.emit({ response: response, formStep: formStep });
+                    },
+                    onError: ({ error, code, severity }) => {
+                        this.errorEvent.emit({
+                            errorCode: code,
+                            message: error,
+                            severity,
+                        });
+                    },
+                });
+            }
+        };
+        this.initializeMakePresignedURLs = async () => {
+            const presignedUrlPromises = this.documentList.map((document) => {
+                return this.getPresignedFileUrl(document);
+            });
+            return await Promise.all(presignedUrlPromises);
+        };
+        this.initializeFileUploads = async () => {
+            const uploadDocumentPromises = this.documentList.map((document) => {
+                return this.uploadDocument(document);
+            });
+            return Promise.all(uploadDocumentPromises);
+        };
+        this.getPresignedFileUrl = async (document) => {
+            return this.createDisputeEvidence({
+                payload: {
+                    file_name: document.file_name,
+                    file_type: document.file_type,
+                    dispute_evidence_type: document.dispute_evidence_type,
+                },
+                onSuccess: (response) => {
+                    document.presignedUrl = response.data.presigned_url;
+                    this.isLoading = false;
+                },
+                onError: ({ error, code, severity }) => {
+                    this.errorEvent.emit({
+                        errorCode: code,
+                        message: error,
+                        severity,
+                    });
+                    this.isLoading = false;
+                },
+            });
+        };
+        this.uploadDocument = async (document) => {
+            const fileData = await document.getFileString();
+            if (!document.presignedUrl) {
+                throw new Error('Presigned URL is not set');
+            }
+            const response = await fetch(document.presignedUrl, {
+                method: 'PUT',
+                body: fileData,
+            });
+            return response;
+        };
+        this.onCancel = () => {
+            this.clickEvent.emit({ name: DisputeManagementClickActions.cancelDispute });
+        };
+        this.handleSubmit = async (formData, documentList, formStep) => {
+            this.isLoading = true;
+            if (documentList.length) {
+                this.documentList = documentList;
+                await this.initializeMakePresignedURLs();
+                await this.initializeFileUploads();
+            }
+            // this needs to happen last because it fires the 'submit-event' and 'complete-form-step-event' event
+            await this.saveData(formData, formStep);
+            this.isLoading = false;
+        };
+        // after each of these steps where validateAndSubmit is called, reload the dispute
+        // and set isLoading, and pass defaults into each step
+        this.onBack = async () => {
+            await this.currentStepComponentRef.validateAndSubmit(async (formData, documentList, formStep) => {
+                this.clickEvent.emit({ name: DisputeManagementClickActions.previousStep });
+                await this.handleSubmit(formData, documentList, formStep);
+                this.currentStep--;
+            });
+        };
+        this.onNext = async () => {
+            await this.currentStepComponentRef.validateAndSubmit(async (formData, documentList, formStep) => {
+                this.clickEvent.emit({ name: DisputeManagementClickActions.nextStep });
+                await this.handleSubmit(formData, documentList, formStep);
+                this.currentStep++;
+            });
+        };
+        this.onSubmit = async () => {
+            await this.currentStepComponentRef.validateAndSubmit(async (formData, documentList, formStep) => {
+                this.clickEvent.emit({ name: DisputeManagementClickActions.submit });
+                const submitData = Object.assign(Object.assign({}, formData), { forfeit: false });
+                await this.handleSubmit(submitData, documentList, formStep);
+            });
+        };
+        this.updateDisputeResponse = undefined;
+        this.submitDisputeResponse = undefined;
+        this.createDisputeEvidence = undefined;
+        this.disputeResponse = {};
+        this.isLoading = false;
+        this.documentList = [];
+        this.currentStep = 0;
+        this.currentStepComponentRef = undefined;
+    }
+    get currentStepComponent() {
+        return this.componentStepMapping[this.currentStep]();
+    }
+    get isLastStep() {
+        return this.currentStep === this.componentStepMapping.length - 1;
+    }
+    get isFirstStep() {
+        return this.currentStep === 0;
+    }
+    render() {
+        return (h("div", { key: '4c1c801c82506c50ee304934ec0c42efc986f07c', class: "row gy-3" }, h("div", { key: '27c27411ac45d0a20f5fd99e4a11eb0efe6b0007', class: "col-12" }, h("h1", { key: '48aa1635accfafe2ed76e733296bade6fdeeddf5', class: "h4", part: heading4 }, "Counter dispute")), h("div", { key: '79ca608ae5ba5a4249556754972216a82104c004', class: "col-12" }, this.currentStepComponent), h("div", { key: '39ecb37977d852c3528f09afced344d40e2022ac', class: "col-12" }, h("div", { key: '23d7523bffc81324b8e99b5f2354c75f52af9d52', class: "d-flex gap-2 mt-4 justify-content-end" }, this.isFirstStep ? (h(Button, { variant: "secondary", onClick: () => this.onCancel(), disabled: this.isLoading, isLoading: this.isLoading }, "Cancel")) : (h(Button, { variant: "secondary", onClick: () => this.onBack(), disabled: this.isLoading, isLoading: this.isLoading }, "Back")), this.isLastStep ? (h(Button, { variant: "primary", onClick: () => this.onSubmit(), disabled: this.isLoading, isLoading: this.isLoading }, "Submit Counter Dispute")) : (h(Button, { variant: "primary", onClick: () => this.onNext(), disabled: this.isLoading, isLoading: this.isLoading }, "Next"))))));
+    }
+}, [0, "justifi-dispute-response-core", {
+        "updateDisputeResponse": [16],
+        "submitDisputeResponse": [16],
+        "createDisputeEvidence": [16],
+        "disputeResponse": [8, "dispute-response"],
+        "isLoading": [32],
+        "documentList": [32],
+        "currentStep": [32],
+        "currentStepComponentRef": [32]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["justifi-dispute-response-core", "custom-popper", "form-control-date", "form-control-file-v2", "form-control-help-text", "form-control-text", "form-control-textarea", "form-control-tooltip", "justifi-additional-statement", "justifi-cancellation-policy", "justifi-customer-details", "justifi-duplicate-charge", "justifi-electronic-evidence", "justifi-product-or-service", "justifi-refund-policy", "justifi-shipping-details"];
+    components.forEach(tagName => { switch (tagName) {
+        case "justifi-dispute-response-core":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, DisputeResponseCore);
+            }
+            break;
+        case "custom-popper":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$f();
+            }
+            break;
+        case "form-control-date":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$e();
+            }
+            break;
+        case "form-control-file-v2":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$d();
+            }
+            break;
+        case "form-control-help-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$c();
+            }
+            break;
+        case "form-control-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$b();
+            }
+            break;
+        case "form-control-textarea":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$a();
+            }
+            break;
+        case "form-control-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$9();
+            }
+            break;
+        case "justifi-additional-statement":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$8();
+            }
+            break;
+        case "justifi-cancellation-policy":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "justifi-customer-details":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "justifi-duplicate-charge":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "justifi-electronic-evidence":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "justifi-product-or-service":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "justifi-refund-policy":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "justifi-shipping-details":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { DisputeResponseCore as D, defineCustomElement as d };