@adyen/adyen-platform-experience-web 1.7.0 → 1.8.0

package/dist/es/components/external/DisputeManagement/components/DefendDisputeFlow/DefendDisputeReason.js

@@ -1,126 +1,139 @@
-import { jsx as i } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import q from "classnames";
+import { jsx as n } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import j from "classnames";
 import "../../../../../external/preact/compat/dist/compat.module.js";
-import { useState as I, useMemo as g, useCallback as p, useEffect as j } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import $ from "../../../../../core/Context/useCoreContext.js";
-import { useFetch as z } from "../../../../../hooks/useFetch.js";
-import { useResponsiveContainer as J, containerQueries as Q } from "../../../../../hooks/useResponsiveContainer.js";
-import { Alert as U } from "../../../../internal/Alert/Alert.js";
-import { AlertVariantOption as K, AlertTypeOption as W } from "../../../../internal/Alert/types.js";
-import X from "../../../../internal/Button/ButtonActions/ButtonActions.js";
-import { TypographyVariant as _, TypographyElement as b } from "../../../../internal/Typography/types.js";
-import v from "../../../../internal/Typography/Typography.js";
-import { useDisputeFlow as Z } from "../../context/dispute/context.js";
-import { getDefenseReasonContent as P } from "../../utils/index.js";
-import ee from "../../../../internal/FormFields/Select/Select.js";
-import { Fragment as te } from "../../../../../external/preact/dist/preact.module.js";
+import { useState as P, useMemo as _, useCallback as m, useEffect as $ } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import z from "../../../../../core/Context/useCoreContext.js";
+import { useFetch as J } from "../../../../../hooks/useFetch.js";
+import { useResponsiveContainer as Q, containerQueries as U } from "../../../../../hooks/useResponsiveContainer.js";
+import { Alert as K } from "../../../../internal/Alert/Alert.js";
+import { AlertVariantOption as W, AlertTypeOption as X } from "../../../../internal/Alert/types.js";
+import Z from "../../../../internal/Button/ButtonActions/ButtonActions.js";
+import { TypographyVariant as v, TypographyElement as R } from "../../../../internal/Typography/types.js";
+import A from "../../../../internal/Typography/Typography.js";
+import { useDisputeFlow as ee } from "../../context/dispute/context.js";
+import { getDefenseReasonContent as k } from "../../utils/index.js";
+import te from "../../../../internal/FormFields/Select/Select.js";
+import { Fragment as ne } from "../../../../../external/preact/dist/preact.module.js";
 import { useConfigContext as ie } from "../../../../../core/ConfigContext/context.js";
 import { EMPTY_OBJECT as oe } from "../../../../../utils/value/constants.js";
-const A = "adyen-pe-defend-dispute-reason", D = {
-  selector: A + "__selector",
-  description: A + "__description",
-  dropdownList: A + "__dropdown-list",
-  dropdownListMobile: A + "__dropdown-list--mobile"
+const b = "adyen-pe-defend-dispute-reason", D = {
+  selector: b + "__selector",
+  description: b + "__description",
+  dropdownList: b + "__dropdown-list",
+  dropdownListMobile: b + "__dropdown-list--mobile"
 }, we = () => {
-  var F, N, O, T;
-  const { i18n: o } = $(), { applicableDocuments: n, dispute: a, goBack: R, setFlowState: m, setSelectedDefenseReason: S, selectedDefenseReason: s, setApplicableDocuments: f } = Z(), c = (F = a == null ? void 0 : a.dispute) == null ? void 0 : F.allowedDefenseReasons, C = (N = a == null ? void 0 : a.dispute) == null ? void 0 : N.pspReference, [u, h] = I(!1), x = J(Q.down.xs), r = g(
+  var N, O, T, I;
+  const { i18n: i } = z(), {
+    applicableDocuments: o,
+    dispute: d,
+    goBack: S,
+    setFlowState: p,
+    setSelectedDefenseReason: C,
+    selectedDefenseReason: s,
+    setApplicableDocuments: f,
+    defenseReasonConfig: u
+  } = ee(), c = (N = d == null ? void 0 : d.dispute) == null ? void 0 : N.allowedDefenseReasons, B = (O = d == null ? void 0 : d.dispute) == null ? void 0 : O.pspReference, [g, h] = P(!1), x = Q(U.down.xs), a = _(
     () => Object.freeze(
       c == null ? void 0 : c.map((e) => {
         var t;
         return {
           id: e,
           disabled: c.length === 1,
-          name: ((t = P(o, e)) == null ? void 0 : t.title) ?? e
+          name: ((t = k(u, i, e)) == null ? void 0 : t.title) ?? e
         };
       })
     ) ?? [],
-    [o, c]
-  ), l = g(
+    [i, c, u]
+  ), l = _(
     () => {
       var e, t;
-      return s ? (e = r.find((G) => G.id === s)) == null ? void 0 : e.id : ((t = r == null ? void 0 : r[0]) == null ? void 0 : t.id) ?? null;
+      return s ? (e = a.find((q) => q.id === s)) == null ? void 0 : e.id : ((t = a == null ? void 0 : a[0]) == null ? void 0 : t.id) ?? null;
     },
-    [s, r]
-  ), { getApplicableDefenseDocuments: y } = ie().endpoints, L = p(async () => y == null ? void 0 : y(oe, {
+    [s, a]
+  ), { getApplicableDefenseDocuments: y } = ie().endpoints, L = m(async () => y == null ? void 0 : y(oe, {
     query: {
       defenseReason: s
     },
     path: {
-      disputePspReference: C
+      disputePspReference: B
     }
-  }), [s, C, y]), { error: k, isFetching: w } = z({
+  }), [s, B, y]), { error: E, isFetching: w } = J({
     queryFn: L,
     fetchOptions: {
-      enabled: u,
-      onSuccess: p(
+      enabled: g,
+      onSuccess: m(
         (e) => {
-          h(!1), f((e == null ? void 0 : e.data) ?? null), e != null && e.data && (e == null ? void 0 : e.data.length) > 0 && m("uploadDefenseFilesView");
+          h(!1), f((e == null ? void 0 : e.data) ?? null), e != null && e.data && (e == null ? void 0 : e.data.length) > 0 && p("uploadDefenseFilesView");
         },
-        [f, h, m]
+        [f, h, p]
       )
     }
   });
-  j(() => {
+  $(() => {
     h(!1);
-  }, [k]);
-  const B = p(() => {
-    if (n != null && n.length) return m("uploadDefenseFilesView");
+  }, [E]);
+  const F = m(() => {
+    if (o != null && o.length) return p("uploadDefenseFilesView");
     h(!0);
-  }, [n, m]), E = p(
+  }, [o, p]), M = m(
     (e) => {
       var t;
-      s !== e.target.value && (n != null && n.length) && f([]), (t = e == null ? void 0 : e.target) != null && t.value && S(e.target.value);
+      s !== e.target.value && (o != null && o.length) && f([]), (t = e == null ? void 0 : e.target) != null && t.value && C(e.target.value);
     },
-    [n, s, f, S]
-  ), M = g(() => [
+    [o, s, f, C]
+  ), H = _(() => [
     {
-      title: o.get("disputes.defend.continue"),
-      disabled: u || w,
-      event: B
+      title: i.get("disputes.management.defend.common.actions.continue"),
+      disabled: g || w,
+      event: F
     },
     {
-      title: o.get("disputes.goBack"),
-      disabled: u || w,
-      event: R
+      title: i.get("disputes.management.common.actions.goBack"),
+      disabled: g || w,
+      event: S
     }
-  ], [w, u, o, R, B]), [H, V] = I(!0), Y = p(() => {
-    V(!1);
-  }, []), d = g(() => l ? P(o, l) : void 0, [o, l]);
-  return !r || !l ? null : /* @__PURE__ */ i(te, { children: [
-    /* @__PURE__ */ i("div", { className: D.selector, children: [
-      /* @__PURE__ */ i(v, { className: "adyen-pe-defend-dispute__reason-description", variant: _.BODY, children: o.get("disputes.defend.selectDefenseReason") }),
-      /* @__PURE__ */ i(
-        ee,
+  ], [w, g, i, S, F]), [V, Y] = P(!0), G = m(() => {
+    Y(!1);
+  }, []), r = _(
+    () => l ? k(u, i, l) : void 0,
+    [u, i, l]
+  );
+  return !a || !l ? null : /* @__PURE__ */ n(ne, { children: [
+    /* @__PURE__ */ n("div", { className: D.selector, children: [
+      /* @__PURE__ */ n(A, { className: "adyen-pe-defend-dispute__reason-description", variant: v.BODY, children: i.get("disputes.management.defend.chargeback.selectDefenseReason") }),
+      /* @__PURE__ */ n(
+        te,
         {
-          items: r,
-          onChange: E,
+          items: a,
+          onChange: M,
           selected: l,
-          popoverClassNameModifiers: [q(D.dropdownList, { [D.dropdownListMobile]: x })],
+          "aria-label": i.get("disputes.management.defend.common.inputs.reasonSelect.a11y.label"),
+          popoverClassNameModifiers: [j(D.dropdownList, { [D.dropdownListMobile]: x })],
           fixedPopoverPositioning: !0
         }
       ),
-      (O = d == null ? void 0 : d.primaryDescriptionItems) == null ? void 0 : O.map((e, t) => /* @__PURE__ */ i(
-        v,
+      (T = r == null ? void 0 : r.primaryDescriptionItems) == null ? void 0 : T.map((e, t) => /* @__PURE__ */ n(
+        A,
         {
-          el: b.PARAGRAPH,
+          el: R.PARAGRAPH,
           className: D.description,
-          variant: _.BODY,
+          variant: v.BODY,
           children: e
         },
         `description-${t}`
       )),
-      ((T = d == null ? void 0 : d.secondaryDescriptionItems) == null ? void 0 : T.length) && /* @__PURE__ */ i("ul", { className: "adyen-pe-defend-dispute-reason__secondary-description-items-container", children: d.secondaryDescriptionItems.map((e, t) => /* @__PURE__ */ i("li", { className: "adyen-pe-defend-dispute-reason__secondary-description-item", children: /* @__PURE__ */ i(
-        v,
+      ((I = r == null ? void 0 : r.secondaryDescriptionItems) == null ? void 0 : I.length) && /* @__PURE__ */ n("ul", { className: "adyen-pe-defend-dispute-reason__secondary-description-items-container", children: r.secondaryDescriptionItems.map((e, t) => /* @__PURE__ */ n("li", { className: "adyen-pe-defend-dispute-reason__secondary-description-item", children: /* @__PURE__ */ n(
+        A,
         {
-          el: b.PARAGRAPH,
+          el: R.PARAGRAPH,
           className: "adyen-pe-defend-dispute-reason__description",
-          variant: _.BODY,
+          variant: v.BODY,
           children: e
         }
       ) }, `description-item-${t}`)) })
     ] }),
-    H && /* @__PURE__ */ i(U, { onClose: Y, type: W.HIGHLIGHT, variant: K.DEFAULT, children: /* @__PURE__ */ i(v, { className: "adyen-pe-alert__description", el: b.DIV, variant: _.BODY, wide: !0, children: o.get("disputes.defend.chargebackFeeInformation") }) }),
-    /* @__PURE__ */ i("div", { className: "adyen-pe-defend-dispute__actions", children: /* @__PURE__ */ i(X, { actions: M }) })
+    V && /* @__PURE__ */ n(K, { onClose: G, type: X.HIGHLIGHT, variant: W.DEFAULT, children: /* @__PURE__ */ n(A, { className: "adyen-pe-alert__description", el: R.DIV, variant: v.BODY, wide: !0, children: i.get("disputes.management.defend.chargeback.feeInfo") }) }),
+    /* @__PURE__ */ n("div", { className: "adyen-pe-defend-dispute__actions", children: /* @__PURE__ */ n(Z, { actions: H }) })
   ] });
 };
 export {

package/dist/es/components/external/DisputeManagement/components/DefendDisputeFlow/DefendDisputeResponse.js

@@ -1,37 +1,37 @@
 import { jsx as e } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { useCallback as u, useRef as y, useEffect as v } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import C from "../../../../../core/Context/useCoreContext.js";
-import m from "../../../../internal/Button/Button.js";
+import { useCallback as l, useRef as y, useEffect as v } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import k from "../../../../../core/Context/useCoreContext.js";
+import u from "../../../../internal/Button/Button.js";
 import { ButtonVariant as f } from "../../../../internal/Button/types.js";
-import { TypographyVariant as r } from "../../../../internal/Typography/types.js";
-import n from "../../../../internal/Typography/Typography.js";
-import { useDisputeFlow as N } from "../../context/dispute/context.js";
+import { TypographyVariant as a } from "../../../../internal/Typography/types.js";
+import i from "../../../../internal/Typography/Typography.js";
+import { useDisputeFlow as C } from "../../context/dispute/context.js";
 /* empty css                       */
-import { Icon as h } from "../../../../internal/Icon/Icon.js";
-import { isFunction as T } from "../../../../../utils/value/is.js";
-const I = ({ onDisputeDefend: a }) => {
-  const { i18n: s } = C(), { clearFiles: c, clearStates: o, dispute: t, setFlowState: i, defendResponse: d } = N(), g = u(() => {
-    o(), i("details");
-  }, [o, i]), _ = u(() => {
-    c(), i("uploadDefenseFilesView");
-  }, [c, i]), p = y(!1);
+import { Icon as g } from "../../../../internal/Icon/Icon.js";
+import { isFunction as N } from "../../../../../utils/value/is.js";
+const V = ({ onDisputeDefend: r }) => {
+  const { i18n: s } = k(), { clearFiles: o, clearStates: d, dispute: n, setFlowState: t, defendResponse: c } = C(), h = l(() => {
+    d(), t("details");
+  }, [d, t]), _ = l(() => {
+    o(), t("uploadDefenseFilesView");
+  }, [o, t]), m = y(!1);
   return v(() => {
-    if (!p.current && d === "success" && T(a)) {
-      const l = t == null ? void 0 : t.dispute.pspReference;
-      l && (p.current = !0, a({ id: l }));
+    if (!m.current && c === "success" && N(r)) {
+      const p = n == null ? void 0 : n.dispute.pspReference;
+      p && (m.current = !0, r({ id: p }));
     }
-  }, [d, t, a]), /* @__PURE__ */ e("div", { className: "adyen-pe-defend-dispute__response", children: d === "success" ? /* @__PURE__ */ e("div", { className: "adyen-pe-defend-dispute__success", children: [
-    /* @__PURE__ */ e(h, { name: "checkmark-circle-fill", className: "adyen-pe-defend-dispute__success-icon" }),
-    /* @__PURE__ */ e(n, { variant: r.TITLE, children: s.get("disputes.defend.evidenceSubmitted") }),
-    /* @__PURE__ */ e(n, { variant: r.BODY, className: "adyen-pe-defend-dispute__success-description", children: s.get("disputes.defend.submitSuccessfulInformation") }),
-    /* @__PURE__ */ e("div", { className: "adyen-pe-defend-dispute__success-buttons", children: /* @__PURE__ */ e(m, { variant: f.SECONDARY, onClick: g, children: s.get("disputes.showDisputeDetails") }) })
+  }, [c, n, r]), /* @__PURE__ */ e("div", { className: "adyen-pe-defend-dispute__response", children: c === "success" ? /* @__PURE__ */ e("div", { className: "adyen-pe-defend-dispute__success", children: [
+    /* @__PURE__ */ e(g, { name: "checkmark-circle-fill", className: "adyen-pe-defend-dispute__success-icon" }),
+    /* @__PURE__ */ e(i, { variant: a.TITLE, children: s.get("disputes.management.defend.common.evidenceSubmitted") }),
+    /* @__PURE__ */ e(i, { variant: a.BODY, className: "adyen-pe-defend-dispute__success-description", children: s.get("disputes.management.defend.chargeback.submitSuccessInfo") }),
+    /* @__PURE__ */ e("div", { className: "adyen-pe-defend-dispute__success-buttons", children: /* @__PURE__ */ e(u, { variant: f.SECONDARY, onClick: h, children: s.get("disputes.management.common.actions.showDetails") }) })
   ] }) : /* @__PURE__ */ e("div", { className: "adyen-pe-defend-dispute__error", children: [
-    /* @__PURE__ */ e(h, { name: "cross-circle-fill", className: "adyen-pe-defend-dispute__error-icon" }),
-    /* @__PURE__ */ e(n, { variant: r.TITLE, medium: !0, children: s.get("disputes.defend.somethingWentWrong") }),
-    /* @__PURE__ */ e(n, { variant: r.BODY, children: s.get("disputes.error.weCouldNotProcessTheDisputePleaseTryAgainOrContactSupport") }),
-    /* @__PURE__ */ e(m, { variant: f.SECONDARY, onClick: _, children: s.get("disputes.goBack") })
+    /* @__PURE__ */ e(g, { name: "cross-circle-fill", className: "adyen-pe-defend-dispute__error-icon" }),
+    /* @__PURE__ */ e(i, { variant: a.TITLE, medium: !0, children: s.get("disputes.management.defend.common.errors.somethingWentWrong") }),
+    /* @__PURE__ */ e(i, { variant: a.BODY, children: s.get("disputes.management.defend.common.errors.defenseFailed") }),
+    /* @__PURE__ */ e(u, { variant: f.SECONDARY, onClick: _, children: s.get("disputes.management.common.actions.goBack") })
   ] }) });
 };
 export {
-  I as DefendDisputeResponse
+  V as DefendDisputeResponse
 };

package/dist/es/components/external/DisputeManagement/components/DefendDisputeFlow/DefendDocumentUpload.js

@@ -1,54 +1,54 @@
 import { jsx as r } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { FileInput as D } from "../../../../internal/FormFields/FileInput/FileInput.js";
+import { FileInput as c } from "../../../../internal/FormFields/FileInput/FileInput.js";
 import { getDefenseDocumentContent as y } from "../../utils/index.js";
-import c from "../../../../../core/Context/useCoreContext.js";
-import { TypographyElement as h, TypographyVariant as a } from "../../../../internal/Typography/types.js";
-import p from "../../../../internal/Typography/Typography.js";
+import h from "../../../../../core/Context/useCoreContext.js";
+import { TypographyElement as g, TypographyVariant as p } from "../../../../internal/Typography/types.js";
+import d from "../../../../internal/Typography/Typography.js";
 import { useMemo as F } from "../../../../../external/preact/hooks/dist/hooks.module.js";
 import { useDisputeFlow as T } from "../../context/dispute/context.js";
-import { ALLOWED_FILE_TYPES as _, DOCUMENT_MAX_SIZE as g } from "./constants.js";
-const P = ({
+import { ALLOWED_FILE_TYPES as _, DOCUMENT_MAX_SIZE as C } from "./constants.js";
+const S = ({
   document: e,
-  disabled: d,
-  required: l,
-  mapError: m
+  disabled: l,
+  required: m,
+  mapError: s
 }) => {
-  const { i18n: i } = c(), { title: s, primaryDescriptionItems: t } = F(() => y(i, e), [i, e]) || {}, { removeFieldFromDefendPayload: n, addFileToDefendPayload: f } = T();
+  const { i18n: n } = h(), { removeFieldFromDefendPayload: i, addFileToDefendPayload: f, defenseDocumentConfig: a } = T(), { title: u, primaryDescriptionItems: t } = F(() => y(a, n, e), [a, n, e]) || {};
   return /* @__PURE__ */ r("div", { className: "adyen-pe-defend-dispute-document-upload", children: [
     /* @__PURE__ */ r("div", { children: [
       /* @__PURE__ */ r(
-        p,
+        d,
         {
           strongest: !0,
           className: "adyen-pe-defend-dispute-document-upload__title",
-          variant: a.BODY,
-          el: h.DIV,
-          children: s || e
+          variant: p.BODY,
+          el: g.DIV,
+          children: u || e
         }
       ),
-      t && t.length > 0 ? t.map((o, u) => /* @__PURE__ */ r(
-        p,
+      t && t.length > 0 ? t.map((o, D) => /* @__PURE__ */ r(
+        d,
         {
           className: "adyen-pe-defend-dispute-document-upload__description",
-          variant: a.BODY,
+          variant: p.BODY,
           children: o
         },
-        `${u}-description`
+        `${D}-description`
       )) : null
     ] }),
     /* @__PURE__ */ r(
-      D,
+      c,
       {
         allowedFileTypes: _,
-        maxFileSize: (o) => g[o],
-        mapError: m,
+        maxFileSize: (o) => C[o],
+        mapError: s,
         onDelete: () => {
-          e && n(e);
+          e && i(e);
         },
-        disabled: d,
-        required: l,
+        disabled: l,
+        required: m,
         onChange: (o) => {
-          o[0] ? f(e, o[0]) : n(e);
+          o[0] ? f(e, o[0]) : i(e);
         }
       },
       e
@@ -56,5 +56,5 @@ const P = ({
   ] });
 };
 export {
-  P as DefendDocumentUpload
+  S as DefendDocumentUpload
 };

package/dist/es/components/external/DisputeManagement/components/DefendDisputeFlow/SelectAndUploadOptionalDoc.js

@@ -1,108 +1,113 @@
-import { jsx as t } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import A from "classnames";
-import { useResponsiveContainer as E, containerQueries as F } from "../../../../../hooks/useResponsiveContainer.js";
-import _ from "../../../../internal/Typography/Typography.js";
-import { TypographyElement as h, TypographyVariant as v } from "../../../../internal/Typography/types.js";
-import { FileInput as L } from "../../../../internal/FormFields/FileInput/FileInput.js";
-import P from "../../../../../core/Context/useCoreContext.js";
-import { useDisputeFlow as b } from "../../context/dispute/context.js";
-import { getDefenseDocumentContent as B } from "../../utils/index.js";
-import { useCallback as g, useEffect as M } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import N from "../../../../internal/Button/Button.js";
-import { ButtonVariant as O } from "../../../../internal/Button/types.js";
-import { ALLOWED_FILE_TYPES as R, DOCUMENT_MAX_SIZE as Y } from "./constants.js";
-import { Icon as V } from "../../../../internal/Icon/Icon.js";
-import k from "../../../../internal/FormFields/Select/Select.js";
-const r = "adyen-pe-defend-dispute-document-upload-box", a = {
-  deleteButton: r + "__delete-button-container",
-  dropdownList: r + "__dropdown-list",
-  dropdownListMobile: r + "__dropdown-list--mobile",
-  extraDocuments: r + "__extra-documents-selector",
-  extraDocumentsTitle: r + "__extra-documents-selector-title"
-}, te = ({
+import { jsx as o } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import E from "classnames";
+import { useResponsiveContainer as F, containerQueries as L } from "../../../../../hooks/useResponsiveContainer.js";
+import h from "../../../../internal/Typography/Typography.js";
+import { TypographyElement as v, TypographyVariant as C } from "../../../../internal/Typography/types.js";
+import { FileInput as P } from "../../../../internal/FormFields/FileInput/FileInput.js";
+import B from "../../../../../core/Context/useCoreContext.js";
+import { useDisputeFlow as M } from "../../context/dispute/context.js";
+import { getDefenseDocumentContent as N } from "../../utils/index.js";
+import { useMemo as O, useCallback as S, useEffect as R } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import Y from "../../../../internal/Button/Button.js";
+import { ButtonVariant as V } from "../../../../internal/Button/types.js";
+import { ALLOWED_FILE_TYPES as k, DOCUMENT_MAX_SIZE as U } from "./constants.js";
+import { Icon as W } from "../../../../internal/Icon/Icon.js";
+import j from "../../../../internal/FormFields/Select/Select.js";
+const a = "adyen-pe-defend-dispute-document-upload-box", n = {
+  deleteButton: a + "__delete-button-container",
+  dropdownList: a + "__dropdown-list",
+  dropdownListMobile: a + "__dropdown-list--mobile",
+  extraDocuments: a + "__extra-documents-selector",
+  extraDocumentsTitle: a + "__extra-documents-selector-title"
+}, ne = ({
   items: d,
-  selection: o,
+  selection: t,
   setSelection: p,
-  disabled: n,
-  required: C,
-  title: T,
-  index: i,
-  onRemoveOption: u,
+  disabled: i,
+  required: T,
+  title: b,
+  index: l,
+  onRemoveOption: c,
   mapError: x
 }) => {
-  var D, y;
-  const { i18n: l } = P(), { addFileToDefendPayload: w, moveFieldInDefendPayload: c, removeFieldFromDefendPayload: f } = b(), I = g((e) => B(l, e), [l]), S = E(F.down.xs), s = g(
+  var y, _;
+  const { i18n: r } = B(), { addFileToDefendPayload: w, moveFieldInDefendPayload: u, removeFieldFromDefendPayload: f, defenseDocumentConfig: D } = M(), g = O(() => r.get("disputes.management.defend.common.inputs.documentSelect.a11y.label"), [r]), I = F(L.down.xs), A = S(
+    (e) => N(D, r, e),
+    [D, r]
+  ), m = S(
     (e) => {
-      o && c(o, e), p(e, i);
+      t && u(t, e), p(e, l);
     },
-    [i, c, o, p]
+    [l, u, t, p]
   );
-  return M(() => {
-    const e = d.filter(({ disabled: m }) => m !== !0);
-    e.length === 1 && !o && s(e[0].id);
-  }, [d, o, s]), /* @__PURE__ */ t("div", { className: a.extraDocuments, children: [
-    /* @__PURE__ */ t("div", { className: a.deleteButton, children: [
-      /* @__PURE__ */ t(_, { strongest: !0, className: a.extraDocumentsTitle, variant: v.BODY, el: h.DIV, children: T }),
-      u && /* @__PURE__ */ t(
-        N,
+  return R(() => {
+    const e = d.filter(({ disabled: s }) => s !== !0);
+    e.length === 1 && !t && m(e[0].id);
+  }, [d, t, m]), /* @__PURE__ */ o("div", { className: n.extraDocuments, children: [
+    /* @__PURE__ */ o("div", { className: n.deleteButton, children: [
+      /* @__PURE__ */ o(h, { strongest: !0, className: n.extraDocumentsTitle, variant: C.BODY, el: v.DIV, children: b }),
+      c && /* @__PURE__ */ o(
+        Y,
         {
-          disabled: n,
-          onClick: () => i !== void 0 && !n && u(i),
-          variant: O.TERTIARY,
+          disabled: i,
+          "aria-label": r.get("disputes.management.defend.common.actions.deleteOptionalDocument"),
+          onClick: () => l !== void 0 && !i && c(l),
+          variant: V.TERTIARY,
           fullWidth: !1,
           align: "center",
-          children: /* @__PURE__ */ t(V, { name: "trash-can" })
+          children: /* @__PURE__ */ o(W, { name: "trash-can" })
         }
       )
     ] }),
-    /* @__PURE__ */ t("div", { children: [
-      /* @__PURE__ */ t(
-        k,
+    /* @__PURE__ */ o("div", { children: [
+      /* @__PURE__ */ o(
+        j,
         {
           onChange: (e) => {
-            const m = e.target.value;
-            s(m);
+            const s = e.target.value;
+            m(s);
           },
+          items: d,
           filterable: !1,
-          selected: o,
-          readonly: n,
           multiSelect: !1,
-          items: d,
-          popoverClassNameModifiers: [A(a.dropdownList, { [a.dropdownListMobile]: S })],
           showOverlay: !1,
-          placeholder: l.get("disputes.uploadDocuments.selectDocumentType"),
+          selected: t,
+          readonly: i,
+          "aria-label": g,
+          placeholder: g,
+          popoverClassNameModifiers: [E(n.dropdownList, { [n.dropdownListMobile]: I })],
           fixedPopoverPositioning: !0
         }
       ),
-      o && ((y = (D = I(o)) == null ? void 0 : D.primaryDescriptionItems) == null ? void 0 : y.map((e) => /* @__PURE__ */ t(
-        _,
+      t && ((_ = (y = A(t)) == null ? void 0 : y.primaryDescriptionItems) == null ? void 0 : _.map((e) => /* @__PURE__ */ o(
+        h,
         {
           className: "adyen-pe-defend-dispute-document-upload__description",
-          variant: v.BODY,
-          el: h.PARAGRAPH,
+          variant: C.BODY,
+          el: v.PARAGRAPH,
           children: e
         },
         e
       )))
     ] }),
-    /* @__PURE__ */ t(
-      L,
+    /* @__PURE__ */ o(
+      P,
       {
-        maxFileSize: (e) => Y[e],
-        allowedFileTypes: R,
+        maxFileSize: (e) => U[e],
+        allowedFileTypes: k,
         mapError: x,
         onDelete: () => {
-          o && f(o);
+          t && f(t);
         },
-        disabled: n || !o,
-        required: C,
+        disabled: i || !t,
+        required: T,
         onChange: (e) => {
-          o && (e[0] ? w(o, e[0]) : f(o));
+          t && (e[0] ? w(t, e[0]) : f(t));
         }
       }
     )
   ] });
 };
 export {
-  te as default
+  ne as default
 };

package/dist/es/components/external/DisputeManagement/components/DisputeDetails/DisputeDetails.js

@@ -1,38 +1,44 @@
 import { jsx as e } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import u from "../../../../../core/Context/useCoreContext.js";
-import { TypographyVariant as c } from "../../../../internal/Typography/types.js";
-import f from "../../../../internal/Typography/Typography.js";
-import { useDisputeFlow as l } from "../../context/dispute/context.js";
-import { AcceptDisputeFlow as d } from "../AcceptDisputeFlow/AcceptDisputeFlow.js";
+import d from "classnames";
+import { useModalContext as u } from "../../../../internal/Modal/Modal.js";
+import { useDisputeFlow as a } from "../../context/dispute/context.js";
+import { AcceptDisputeFlow as f } from "../AcceptDisputeFlow/AcceptDisputeFlow.js";
 import { DefendDisputeFlow as D } from "../DefendDisputeFlow/DefendDisputeFlow.js";
 import { DisputeData as w } from "../DisputesData/DisputeData.js";
-import { Fragment as g } from "../../../../../external/preact/dist/preact.module.js";
-const R = ({
-  id: t,
-  hideTitle: r,
-  dataCustomization: o,
+import { useEffect as h } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { Fragment as F } from "../../../../../external/preact/dist/preact.module.js";
+import { Header as g } from "../../../../internal/Header/Header.js";
+const r = ({ children: o, hideTitle: t }) => {
+  const { flowState: s } = a(), { withinModal: i } = u();
+  return /* @__PURE__ */ e(F, { children: [
+    /* @__PURE__ */ e("div", { className: d({ "adyen-pe-visually-hidden": s !== "details" }), children: /* @__PURE__ */ e(g, { hideTitle: t, forwardedToRoot: !i, titleKey: "disputes.management.common.title" }) }),
+    o
+  ] });
+}, k = ({
+  id: o,
+  hideTitle: t,
+  dataCustomization: s,
   onContactSupport: i,
-  onDisputeAccept: s,
-  onDisputeDefend: p,
-  onDismiss: a
+  onDisputeAccept: m,
+  onDisputeDefend: c,
+  onDismiss: l
 }) => {
-  const { flowState: n } = l(), { i18n: m } = u();
-  switch (n) {
+  const { flowState: p, getDisputesConfig: n } = a();
+  switch (h(() => {
+    n();
+  }, [n]), p) {
     case "details":
-      return /* @__PURE__ */ e(g, { children: [
-        !r && /* @__PURE__ */ e(f, { variant: c.TITLE, medium: !0, children: m.get("disputes.disputeManagementTitle") }),
-        /* @__PURE__ */ e(w, { disputeId: t, dataCustomization: o, onContactSupport: i, onDismiss: a })
-      ] });
+      return /* @__PURE__ */ e(r, { hideTitle: t, children: /* @__PURE__ */ e(w, { disputeId: o, dataCustomization: s, onContactSupport: i, onDismiss: l }) });
     case "accept":
-      return /* @__PURE__ */ e(d, { onDisputeAccept: s });
+      return /* @__PURE__ */ e(r, { hideTitle: t, children: /* @__PURE__ */ e(f, { onDisputeAccept: m }) });
     case "defendReasonSelectionView":
     case "defenseSubmitResponseView":
     case "uploadDefenseFilesView":
-      return /* @__PURE__ */ e(D, { onDisputeDefend: p });
+      return /* @__PURE__ */ e(r, { hideTitle: t, children: /* @__PURE__ */ e(D, { onDisputeDefend: c }) });
     default:
       return null;
   }
 };
 export {
-  R as DisputeDetails
+  k as DisputeDetails
 };