@mercurjs/vendor 2.2.0-rc.0 → 2.2.0-rc.2

package/dist/{professional-details-WWZPTXSX.js → professional-details-ZCRAWCXZ.js}

@@ -9,35 +9,35 @@ import {
 import {
   Form
 } from "./chunk-3QSRE5LS.js";
-import "./chunk-BQHVM46E.js";
-import "./chunk-QIF4QE7T.js";
-import "./chunk-VE6GRIIN.js";
-import "./chunk-7MARNXFG.js";
-import "./chunk-MNHP6YRC.js";
-import "./chunk-NTJ3BMOE.js";
-import "./chunk-5PAUN3PM.js";
-import "./chunk-ZLHCZ5F2.js";
-import "./chunk-GZ4KTAWS.js";
-import "./chunk-PUAWN7SS.js";
+import "./chunk-RLRWDHME.js";
+import "./chunk-K5324KIX.js";
+import "./chunk-FV76G2D7.js";
+import "./chunk-GHDLST2P.js";
+import "./chunk-YVYYOBAE.js";
+import "./chunk-L2NJPDUD.js";
+import "./chunk-P7UBW2EI.js";
+import "./chunk-MR6REQKT.js";
+import "./chunk-EPSDO2MJ.js";
+import "./chunk-BHEU34FL.js";
 import {
   useMe,
   useUpdateSellerProfessionalDetails
-} from "./chunk-MVEHWM7K.js";
-import "./chunk-OYUJYPDF.js";
-import "./chunk-O7BGGWW6.js";
-import "./chunk-KIURBTC4.js";
-import "./chunk-3SH24DGG.js";
-import "./chunk-JR7AABT5.js";
-import "./chunk-ZQCCVCHB.js";
-import "./chunk-5BQO3YQP.js";
-import "./chunk-EPRYM3FA.js";
-import "./chunk-6FDPVW7Y.js";
-import "./chunk-JJP6AKMV.js";
-import "./chunk-G6YNCIVF.js";
+} from "./chunk-W34KDYZA.js";
+import "./chunk-II3CLUXA.js";
+import "./chunk-XKEYHWBS.js";
+import "./chunk-J2XUEO2E.js";
+import "./chunk-656G74I2.js";
+import "./chunk-VWPNMEOE.js";
+import "./chunk-O72AIZUN.js";
+import "./chunk-VUWAOX7H.js";
+import "./chunk-5DKUSZQ7.js";
+import "./chunk-DIAWPVYS.js";
+import "./chunk-4U2BLH45.js";
+import "./chunk-YAUGB4LD.js";
 import "./chunk-A5DJIOHN.js";
 import "./chunk-RHKRREUU.js";
 import "./chunk-ZA2KFUFR.js";
-import "./chunk-LXZXXOJ3.js";
+import "./chunk-DTGEFKK4.js";
 import "./chunk-NBMM2TZK.js";
 
 // src/pages/settings/store/professional-details/index.tsx
@@ -45,11 +45,10 @@ import { Heading } from "@medusajs/ui";
 import { useTranslation as useTranslation2 } from "react-i18next";
 
 // src/pages/settings/store/professional-details/store-professional-details-form.tsx
-import { zodResolver } from "@hookform/resolvers/zod";
 import { Button, Input, toast } from "@medusajs/ui";
-import { useForm } from "react-hook-form";
 import { useTranslation } from "react-i18next";
 import * as zod from "zod";
+import { FormExtensionZone, useExtendableForm } from "@mercurjs/dashboard-shared";
 import { jsx, jsxs } from "react/jsx-runtime";
 var StoreProfessionalDetailsSchema = zod.object({
   corporate_name: zod.string().optional().or(zod.literal("")),
@@ -62,13 +61,16 @@ var StoreProfessionalDetailsForm = ({
   const { t } = useTranslation();
   const { handleSuccess } = useRouteModal();
   const details = seller.professional_details;
-  const form = useForm({
+  const form = useExtendableForm({
+    schema: StoreProfessionalDetailsSchema,
+    model: "seller",
+    zone: "professional-details",
+    data: seller,
     defaultValues: {
       corporate_name: details?.corporate_name ?? "",
       registration_number: details?.registration_number ?? "",
       tax_id: details?.tax_id ?? ""
-    },
-    resolver: zodResolver(StoreProfessionalDetailsSchema)
+    }
   });
   const { mutateAsync, isPending } = useUpdateSellerProfessionalDetails(
     seller.id
@@ -78,7 +80,8 @@ var StoreProfessionalDetailsForm = ({
       {
         corporate_name: values.corporate_name || null,
         registration_number: values.registration_number || null,
-        tax_id: values.tax_id || null
+        tax_id: values.tax_id || null,
+        additional_data: values.additional_data
       },
       {
         onSuccess: () => {
@@ -135,6 +138,15 @@ var StoreProfessionalDetailsForm = ({
                 /* @__PURE__ */ jsx(Form.ErrorMessage, {})
               ] })
             }
+          ),
+          /* @__PURE__ */ jsx(
+            FormExtensionZone,
+            {
+              model: "seller",
+              zone: "professional-details",
+              control: form.control,
+              data: seller
+            }
           )
         ] }),
         /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [

package/dist/{profile-5IADQ727.js → profile-T2QLFLI7.js}

@@ -22,48 +22,56 @@ import {
 import {
   useDocumentDirection
 } from "./chunk-Y7QKP6QU.js";
-import "./chunk-BQHVM46E.js";
-import "./chunk-QIF4QE7T.js";
-import "./chunk-VE6GRIIN.js";
-import "./chunk-7MARNXFG.js";
-import "./chunk-MNHP6YRC.js";
-import "./chunk-NTJ3BMOE.js";
-import "./chunk-5PAUN3PM.js";
-import "./chunk-ZLHCZ5F2.js";
-import "./chunk-GZ4KTAWS.js";
-import "./chunk-PUAWN7SS.js";
+import "./chunk-RLRWDHME.js";
+import "./chunk-K5324KIX.js";
+import "./chunk-FV76G2D7.js";
+import "./chunk-GHDLST2P.js";
+import "./chunk-YVYYOBAE.js";
+import "./chunk-L2NJPDUD.js";
+import "./chunk-P7UBW2EI.js";
+import "./chunk-MR6REQKT.js";
+import "./chunk-EPSDO2MJ.js";
+import "./chunk-BHEU34FL.js";
 import {
   useMe,
   useUpdateMe
-} from "./chunk-MVEHWM7K.js";
-import "./chunk-OYUJYPDF.js";
-import "./chunk-O7BGGWW6.js";
-import "./chunk-KIURBTC4.js";
-import "./chunk-3SH24DGG.js";
-import "./chunk-JR7AABT5.js";
-import "./chunk-ZQCCVCHB.js";
-import "./chunk-5BQO3YQP.js";
-import "./chunk-EPRYM3FA.js";
-import "./chunk-6FDPVW7Y.js";
-import "./chunk-JJP6AKMV.js";
-import "./chunk-G6YNCIVF.js";
+} from "./chunk-W34KDYZA.js";
+import "./chunk-II3CLUXA.js";
+import "./chunk-XKEYHWBS.js";
+import "./chunk-J2XUEO2E.js";
+import "./chunk-656G74I2.js";
+import "./chunk-VWPNMEOE.js";
+import "./chunk-O72AIZUN.js";
+import "./chunk-VUWAOX7H.js";
+import "./chunk-5DKUSZQ7.js";
+import "./chunk-DIAWPVYS.js";
+import "./chunk-4U2BLH45.js";
+import "./chunk-YAUGB4LD.js";
 import "./chunk-A5DJIOHN.js";
 import "./chunk-RHKRREUU.js";
 import "./chunk-ZA2KFUFR.js";
-import "./chunk-LXZXXOJ3.js";
+import "./chunk-DTGEFKK4.js";
 import "./chunk-NBMM2TZK.js";
 
 // src/pages/settings/profile/profile-detail/profile-detail.tsx
 import { Children } from "react";
+import { WidgetZone, useExtension as useExtension2 } from "@mercurjs/dashboard-shared";
 
 // src/pages/settings/profile/profile-detail/components/profile-general-section/profile-general-section.tsx
 import { PencilSquare } from "@medusajs/icons";
 import { Container, Heading, Text } from "@medusajs/ui";
 import { useTranslation } from "react-i18next";
+import {
+  DisplayExtensionZone,
+  DisplayField,
+  useExtension
+} from "@mercurjs/dashboard-shared";
 import { jsx, jsxs } from "react/jsx-runtime";
 var ProfileGeneralSection = () => {
   const { i18n, t } = useTranslation();
-  const { seller_member } = useMe();
+  const memberLinks = useExtension().getLinks("member");
+  const meQuery = memberLinks.length ? { fields: memberLinks.map((link) => `+member.${link}.*`).join(",") } : void 0;
+  const { seller_member } = useMe(meQuery);
   const member = seller_member?.member;
   return /* @__PURE__ */ jsxs(Container, { className: "divide-y p-0", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-6 py-4", children: [
@@ -88,25 +96,38 @@ var ProfileGeneralSection = () => {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
+    /* @__PURE__ */ jsx(DisplayField, { model: "member", zone: "general", id: "first_name", data: member, children: /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
       /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", weight: "plus", children: t("profile.fields.firstName", "First name") }),
       /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: member?.first_name || "-" })
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
+    ] }) }),
+    /* @__PURE__ */ jsx(DisplayField, { model: "member", zone: "general", id: "last_name", data: member, children: /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
       /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", weight: "plus", children: t("profile.fields.lastName", "Last name") }),
       /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: member?.last_name || "-" })
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
+    ] }) }),
+    /* @__PURE__ */ jsx(DisplayField, { model: "member", zone: "general", id: "language", data: member, children: /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
       /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", weight: "plus", children: t("profile.fields.languageLabel") }),
       /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", children: languages.find((lang) => lang.code === i18n.language)?.display_name || "-" })
-    ] })
+    ] }) }),
+    /* @__PURE__ */ jsx(
+      DisplayExtensionZone,
+      {
+        model: "member",
+        zone: "general",
+        data: member,
+        builtInFieldIds: ["first_name", "last_name", "language"]
+      }
+    )
   ] });
 };
 
 // src/pages/settings/profile/profile-detail/profile-detail.tsx
 import { jsx as jsx2 } from "react/jsx-runtime";
 var Root = ({ children }) => {
-  return Children.count(children) > 0 ? /* @__PURE__ */ jsx2(SingleColumnPage, { children }) : /* @__PURE__ */ jsx2(SingleColumnPage, { children: /* @__PURE__ */ jsx2(ProfileGeneralSection, {}) });
+  const memberLinks = useExtension2().getLinks("member");
+  const meQuery = memberLinks.length ? { fields: memberLinks.map((link) => `+member.${link}.*`).join(",") } : void 0;
+  const { seller_member } = useMe(meQuery);
+  const member = seller_member?.member;
+  return Children.count(children) > 0 ? /* @__PURE__ */ jsx2(SingleColumnPage, { children }) : /* @__PURE__ */ jsx2(SingleColumnPage, { children: /* @__PURE__ */ jsx2(WidgetZone, { id: "profile.detail.main", data: member, children: /* @__PURE__ */ jsx2(ProfileGeneralSection, {}) }) });
 };
 var ProfileDetailPage = Object.assign(Root, {
   GeneralSection: ProfileGeneralSection
@@ -117,11 +138,14 @@ import { Heading as Heading2 } from "@medusajs/ui";
 import { useTranslation as useTranslation3 } from "react-i18next";
 
 // src/pages/settings/profile/profile-edit/components/edit-profile-form/edit-profile-form.tsx
-import { zodResolver } from "@hookform/resolvers/zod";
 import { Button, Input, Select, toast } from "@medusajs/ui";
-import { useForm } from "react-hook-form";
 import { useTranslation as useTranslation2 } from "react-i18next";
 import * as zod from "zod";
+import {
+  FormExtensionZone,
+  useExtendableForm,
+  useExtension as useExtension3
+} from "@mercurjs/dashboard-shared";
 import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
 var EditProfileSchema = zod.object({
   first_name: zod.string().optional().or(zod.literal("")),
@@ -132,15 +156,20 @@ var EditProfileForm = () => {
   const { t, i18n } = useTranslation2();
   const { handleSuccess } = useRouteModal();
   const direction = useDocumentDirection();
-  const { seller_member } = useMe();
+  const memberLinks = useExtension3().getLinks("member");
+  const meQuery = memberLinks.length ? { fields: memberLinks.map((link) => `+member.${link}.*`).join(",") } : void 0;
+  const { seller_member } = useMe(meQuery);
   const member = seller_member?.member;
-  const form = useForm({
+  const form = useExtendableForm({
+    schema: EditProfileSchema,
+    model: "member",
+    zone: "edit",
+    data: member,
     defaultValues: {
       first_name: member?.first_name ?? "",
       last_name: member?.last_name ?? "",
       language: i18n.language
-    },
-    resolver: zodResolver(EditProfileSchema)
+    }
   });
   const sortedLanguages = languages.sort(
     (a, b) => a.display_name.localeCompare(b.display_name)
@@ -150,7 +179,8 @@ var EditProfileForm = () => {
     await updateMe(
       {
         first_name: values.first_name || null,
-        last_name: values.last_name || null
+        last_name: values.last_name || null,
+        additional_data: values.additional_data
       },
       {
         onSuccess: async () => {
@@ -234,6 +264,15 @@ var EditProfileForm = () => {
             ] })
           ] })
         }
+      ),
+      /* @__PURE__ */ jsx3(
+        FormExtensionZone,
+        {
+          model: "member",
+          zone: "edit",
+          control: form.control,
+          data: member
+        }
       )
     ] }) }),
     /* @__PURE__ */ jsx3(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-x-2", children: [

package/dist/{promotions-BYW6TZ5B.js → promotions-E4Z6APSX.js}

@@ -1,20 +1,20 @@
 import {
   PromotionListPage
-} from "./chunk-RTMMO6IU.js";
-import "./chunk-TPGIMZLI.js";
-import "./chunk-Y4PM3IDZ.js";
+} from "./chunk-RZHVUQ7G.js";
+import "./chunk-VR7P4DAZ.js";
+import "./chunk-GGXGKMYK.js";
 import "./chunk-JHIMVLB2.js";
 import "./chunk-S2WEYEQR.js";
 import "./chunk-FMFVTERD.js";
 import "./chunk-DB6ANJBO.js";
 import "./chunk-PHOCVOZ5.js";
-import "./chunk-KZQFIPY2.js";
+import "./chunk-ESXMD6CR.js";
+import "./chunk-YV6MK4PZ.js";
 import "./chunk-FQERBIVS.js";
-import "./chunk-W3UHAQCV.js";
+import "./chunk-7TQNE3E2.js";
 import "./chunk-YN3FGNJM.js";
 import "./chunk-KCHYLLVG.js";
-import "./chunk-634XVU3D.js";
-import "./chunk-YV6MK4PZ.js";
+import "./chunk-CVXKASWV.js";
 import "./chunk-THHRRYRS.js";
 import "./chunk-LRD242C7.js";
 import "./chunk-INNFZYX2.js";
@@ -22,10 +22,10 @@ import "./chunk-BDGZ4EQO.js";
 import "./chunk-LAVHRER2.js";
 import "./chunk-QHQWEERJ.js";
 import "./chunk-Y7QKP6QU.js";
-import "./chunk-ZLHCZ5F2.js";
+import "./chunk-MR6REQKT.js";
 import "./chunk-RHKRREUU.js";
 import "./chunk-ZA2KFUFR.js";
-import "./chunk-LXZXXOJ3.js";
+import "./chunk-DTGEFKK4.js";
 import "./chunk-NBMM2TZK.js";
 export {
   PromotionListPage

package/dist/{receive-MTXKKPKZ.js → receive-QCVCAR3R.js}

@@ -10,10 +10,10 @@ import {
   useUpdateDismissItem,
   useUpdateReceiveItem,
   useUpdateReturn
-} from "./chunk-3TST3EWQ.js";
+} from "./chunk-OQTL7PXK.js";
 import {
   getStylizedAmount
-} from "./chunk-3BXCPHN6.js";
+} from "./chunk-XCHKUSUU.js";
 import "./chunk-IQPN4PZJ.js";
 import {
   Combobox
@@ -34,16 +34,16 @@ import {
 } from "./chunk-WIYFXWRI.js";
 import {
   useStockLocations
-} from "./chunk-ZQCCVCHB.js";
+} from "./chunk-O72AIZUN.js";
 import {
   useOrder,
   useOrderPreview
-} from "./chunk-6FDPVW7Y.js";
-import "./chunk-G6YNCIVF.js";
+} from "./chunk-DIAWPVYS.js";
+import "./chunk-YAUGB4LD.js";
 import "./chunk-A5DJIOHN.js";
 import "./chunk-RHKRREUU.js";
 import "./chunk-ZA2KFUFR.js";
-import "./chunk-LXZXXOJ3.js";
+import "./chunk-DTGEFKK4.js";
 import "./chunk-NBMM2TZK.js";
 
 // src/pages/orders/[id]/returns/[return_id]/receive/index.tsx

package/dist/{refund-3IXGYA7W.js → refund-GAOWE636.js}

@@ -1,7 +1,13 @@
 import {
-  getStylizedAmount
-} from "./chunk-3BXCPHN6.js";
-import "./chunk-IQPN4PZJ.js";
+  display_id_default
+} from "./chunk-WQTWBXKO.js";
+import {
+  getDecimalDigits,
+  getLocaleAmount
+} from "./chunk-XCHKUSUU.js";
+import {
+  currencies
+} from "./chunk-IQPN4PZJ.js";
 import "./chunk-TKGWSUEI.js";
 import {
   KeyboundForm
@@ -19,15 +25,15 @@ import {
 import {
   useRefundPayment,
   useRefundReasons
-} from "./chunk-5BQO3YQP.js";
+} from "./chunk-VUWAOX7H.js";
 import {
   useOrder
-} from "./chunk-6FDPVW7Y.js";
-import "./chunk-G6YNCIVF.js";
+} from "./chunk-DIAWPVYS.js";
+import "./chunk-YAUGB4LD.js";
 import "./chunk-A5DJIOHN.js";
 import "./chunk-RHKRREUU.js";
 import "./chunk-ZA2KFUFR.js";
-import "./chunk-LXZXXOJ3.js";
+import "./chunk-DTGEFKK4.js";
 import "./chunk-NBMM2TZK.js";
 
 // src/pages/orders/[id]/refund/index.tsx
@@ -40,23 +46,18 @@ import { useMemo } from "react";
 import { useForm } from "react-hook-form";
 import { useTranslation } from "react-i18next";
 import { useSearchParams } from "react-router-dom";
+import { formatValue } from "react-currency-input-field";
 import { z } from "zod";
 import { zodResolver } from "@hookform/resolvers/zod";
 import {
   Button,
+  CurrencyInput,
   Heading,
-  Input,
   Select,
-  Text,
   Textarea,
   toast
 } from "@medusajs/ui";
 import { jsx, jsxs } from "react/jsx-runtime";
-var RefundSchema = z.object({
-  amount: z.coerce.number().positive(),
-  refund_reason_id: z.string().optional(),
-  note: z.string().optional()
-});
 var CreateRefundForm = ({ order }) => {
   const { t } = useTranslation();
   const dir = useDocumentDirection();
@@ -91,22 +92,44 @@ var CreateRefundForm = ({ order }) => {
     if (!payment) return 0;
     return Math.max(0, payment.amount - refundedAmount);
   }, [payment, refundedAmount]);
+  const currency = useMemo(
+    () => currencies[order.currency_code.toUpperCase()],
+    [order.currency_code]
+  );
+  const decimalDigits = getDecimalDigits(order.currency_code);
+  const getRoundedAmount = (amount) => amount.toLocaleString("en-US", {
+    minimumFractionDigits: decimalDigits,
+    maximumFractionDigits: decimalDigits,
+    useGrouping: false
+  });
+  const RefundSchema = useMemo(
+    () => z.object({
+      amount: z.object({
+        value: z.union([z.string(), z.number()]),
+        float: z.number().nullable()
+      }).refine((v) => v.float !== null && v.float > 0, {
+        message: t("orders.payment.enterAmount")
+      }),
+      refund_reason_id: z.string().optional(),
+      note: z.string().optional()
+    }),
+    [t]
+  );
   const refundPayment = useRefundPayment(order.id, paymentId);
   const form = useForm({
     resolver: zodResolver(RefundSchema),
     defaultValues: {
-      amount: remaining,
-      refund_reason_id: void 0,
-      note: ""
-    },
-    values: {
-      amount: remaining,
+      amount: {
+        value: getRoundedAmount(remaining),
+        float: remaining
+      },
       refund_reason_id: void 0,
       note: ""
     }
   });
   const handleSubmit = form.handleSubmit(async (values) => {
-    if (values.amount > remaining) {
+    const amount = values.amount.float ?? 0;
+    if (amount > remaining) {
       form.setError("amount", {
         message: t("orders.payment.createRefundWrongQuantity", {
           number: remaining
@@ -116,7 +139,7 @@ var CreateRefundForm = ({ order }) => {
     }
     await refundPayment.mutateAsync(
       {
-        amount: values.amount,
+        amount,
         refund_reason_id: values.refund_reason_id,
         note: values.note?.trim() ? values.note.trim() : void 0
       },
@@ -124,7 +147,7 @@ var CreateRefundForm = ({ order }) => {
         onSuccess: () => {
           toast.success(
             t("orders.payment.refundPaymentSuccess", {
-              amount: getStylizedAmount(values.amount, order.currency_code)
+              amount: getLocaleAmount(amount, order.currency_code)
             })
           );
           handleSuccess(`/orders/${order.id}`);
@@ -140,17 +163,16 @@ var CreateRefundForm = ({ order }) => {
   }
   return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { onSubmit: handleSubmit, className: "flex flex-1 flex-col", children: [
     /* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
-      /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-component shadow-elevation-card-rest rounded-lg p-3", children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-          /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: t("orders.payment.totalPaidByCustomer") }),
-          /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: getStylizedAmount(
-            payment.amount,
-            order.currency_code
-          ) })
-        ] }),
-        refundedAmount > 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between pt-1", children: [
-          /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: t("orders.payment.totalRefunded") }),
-          /* @__PURE__ */ jsx(Text, { size: "small", weight: "plus", children: getStylizedAmount(refundedAmount, order.currency_code) })
+      /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-base flex items-center gap-x-1 text-sm", children: [
+        /* @__PURE__ */ jsx("span", { children: getLocaleAmount(
+          payment.amount,
+          order.currency_code
+        ) }),
+        /* @__PURE__ */ jsx("span", { children: "-" }),
+        /* @__PURE__ */ jsxs("span", { children: [
+          "(",
+          /* @__PURE__ */ jsx(display_id_default, { id: payment.id }),
+          ")"
         ] })
       ] }),
       /* @__PURE__ */ jsx(
@@ -158,26 +180,28 @@ var CreateRefundForm = ({ order }) => {
         {
           control: form.control,
           name: "amount",
-          render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
+          render: ({ field: { onChange, ...field } }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
             /* @__PURE__ */ jsx(Form.Label, { children: t("fields.amount") }),
             /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(
-              Input,
+              CurrencyInput,
               {
-                type: "number",
-                step: "0.01",
-                min: 0,
-                max: remaining,
-                "data-testid": "refund-amount-input",
                 ...field,
-                value: field.value ?? "",
-                onChange: (e) => field.onChange(
-                  e.target.value === "" ? "" : Number(e.target.value)
-                )
+                min: 0,
+                placeholder: formatValue({
+                  value: "0",
+                  decimalScale: currency.decimal_digits
+                }),
+                decimalScale: currency.decimal_digits,
+                symbol: currency.symbol_native,
+                code: currency.code,
+                value: field.value.value,
+                onValueChange: (_value, _name, values) => onChange({
+                  value: values?.value ?? "",
+                  float: values?.float ?? null
+                }),
+                "data-testid": "refund-amount-input"
               }
             ) }),
-            /* @__PURE__ */ jsx(Form.Hint, { children: t("orders.payment.refundAmount", {
-              amount: getStylizedAmount(remaining, order.currency_code)
-            }) }),
             /* @__PURE__ */ jsx(Form.ErrorMessage, {})
           ] })
         }
@@ -224,7 +248,7 @@ var CreateRefundForm = ({ order }) => {
         }
       )
     ] }) }),
-    /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
+    /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
       /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: t("actions.cancel") }) }),
       /* @__PURE__ */ jsx(
         Button,
@@ -233,7 +257,7 @@ var CreateRefundForm = ({ order }) => {
           type: "submit",
           isLoading: refundPayment.isPending,
           "data-testid": "refund-submit-button",
-          children: t("actions.confirm")
+          children: t("actions.save")
         }
       )
     ] }) })