@mercurjs/admin 2.2.0-rc.0 → 2.2.0-rc.1

package/dist/{chunk-NZVS6B77.js → chunk-PDID73QY.js}

@@ -33,7 +33,7 @@ import {
 import {
   useCancelOrderEdit,
   useConfirmOrderEdit
-} from "./chunk-YMOP6JKN.js";
+} from "./chunk-IGTR66D2.js";
 import {
   getPaymentsFromOrder,
   getReservationsLimitCount
@@ -78,7 +78,7 @@ import {
 import {
   _DataTable,
   useDataTable
-} from "./chunk-6ZVV2XHU.js";
+} from "./chunk-GRFWCCUW.js";
 import {
   useDate
 } from "./chunk-UZWFZMOX.js";
@@ -91,7 +91,7 @@ import {
 } from "./chunk-VXW3BCN2.js";
 import {
   useReservationItems
-} from "./chunk-GLZLBHFC.js";
+} from "./chunk-WX4ABVXL.js";
 import {
   useCancelOrder,
   useCancelOrderTransfer,
@@ -106,7 +106,7 @@ import {
 } from "./chunk-PYF5EER5.js";
 import {
   useCustomer
-} from "./chunk-RGS5ZOY7.js";
+} from "./chunk-AFYILTAC.js";
 import {
   ActionMenu
 } from "./chunk-BDGZ4EQO.js";
@@ -118,6 +118,7 @@ import {
 // src/pages/orders/order-detail/order-detail.tsx
 import { Children } from "react";
 import { useLoaderData, useParams as useParams2 } from "react-router-dom";
+import { useLinkQuery, WidgetZone } from "@mercurjs/dashboard-shared";
 
 // src/pages/orders/order-detail/components/active-order-claim-section/active-order-claim-section.tsx
 import { ExclamationCircle } from "@medusajs/icons";
@@ -454,6 +455,7 @@ var OrderActiveEditSection = ({
 
 // src/pages/orders/order-detail/components/order-activity-section/order-activity-section.tsx
 import { Container as Container5, Heading as Heading5 } from "@medusajs/ui";
+import { DisplayExtensionZone } from "@mercurjs/dashboard-shared";
 import { useTranslation as useTranslation8 } from "react-i18next";
 
 // src/pages/orders/order-detail/components/order-activity-section/order-timeline.tsx
@@ -1379,84 +1381,39 @@ var OrderActivitySection = ({ order }) => {
   const { t } = useTranslation8();
   return /* @__PURE__ */ jsxs8(Container5, { className: "flex flex-col gap-y-8 px-6 py-4", "data-testid": "order-activity-section", children: [
     /* @__PURE__ */ jsx8("div", { className: "flex flex-col gap-y-4", children: /* @__PURE__ */ jsx8("div", { className: "flex items-center justify-between", "data-testid": "order-activity-header", children: /* @__PURE__ */ jsx8(Heading5, { level: "h2", "data-testid": "order-activity-heading", children: t("orders.activity.header") }) }) }),
-    /* @__PURE__ */ jsx8(OrderTimeline, { order })
-  ] });
-};
-
-// src/pages/orders/order-detail/components/order-commission-section/order-commission-section.tsx
-import { Container as Container6, Heading as Heading6, Text as Text7 } from "@medusajs/ui";
-import { useMemo as useMemo3 } from "react";
-import { useTranslation as useTranslation9 } from "react-i18next";
-import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
-var OrderCommissionSection = ({
-  order
-}) => {
-  const { t } = useTranslation9();
-  const { commission_lines, isLoading } = useOrderCommissionLines(order.id);
-  const itemTitleById = useMemo3(() => {
-    const map = /* @__PURE__ */ new Map();
-    order.items?.forEach((item) => {
-      map.set(item.id, item.product_title ?? item.title);
-    });
-    return map;
-  }, [order.items]);
-  if (isLoading || !commission_lines.length) {
-    return null;
-  }
-  const total = commission_lines.reduce(
-    (acc, line) => acc + (line.amount ?? 0),
-    0
-  );
-  return /* @__PURE__ */ jsxs9(Container6, { className: "divide-y p-0", "data-testid": "order-commission-section", children: [
-    /* @__PURE__ */ jsx9("div", { className: "flex items-center justify-between px-6 py-4", children: /* @__PURE__ */ jsx9(Heading6, { level: "h2", children: t("fields.commission") }) }),
-    /* @__PURE__ */ jsx9("div", { className: "divide-y", children: commission_lines.map((line) => {
-      const label = line.shipping_method_id ? t("fields.shipping") : itemTitleById.get(line.item_id ?? "") ?? line.code;
-      return /* @__PURE__ */ jsxs9(
-        "div",
-        {
-          className: "text-ui-fg-subtle grid grid-cols-2 items-center gap-4 px-6 py-4",
-          children: [
-            /* @__PURE__ */ jsx9(Text7, { size: "small", leading: "compact", children: label }),
-            /* @__PURE__ */ jsx9(Text7, { size: "small", leading: "compact", className: "text-right", children: getLocaleAmount(line.amount, order.currency_code) })
-          ]
-        },
-        line.id
-      );
-    }) }),
-    /* @__PURE__ */ jsxs9("div", { className: "flex items-center justify-between px-6 py-4", children: [
-      /* @__PURE__ */ jsx9(Text7, { size: "small", weight: "plus", leading: "compact", children: t("orders.commission.total") }),
-      /* @__PURE__ */ jsx9(Text7, { size: "small", weight: "plus", leading: "compact", children: getLocaleAmount(total, order.currency_code) })
-    ] })
+    /* @__PURE__ */ jsx8(OrderTimeline, { order }),
+    /* @__PURE__ */ jsx8(DisplayExtensionZone, { model: "order", zone: "activity", data: order })
   ] });
 };
 
 // src/pages/orders/order-detail/components/order-customer-section/order-customer-section.tsx
 import { ArrowPath as ArrowPath2, CurrencyDollar, Envelope, FlyingBox } from "@medusajs/icons";
-import { Container as Container7, Heading as Heading7 } from "@medusajs/ui";
-import { useTranslation as useTranslation11 } from "react-i18next";
+import { Container as Container6, Heading as Heading6 } from "@medusajs/ui";
+import { DisplayExtensionZone as DisplayExtensionZone2 } from "@mercurjs/dashboard-shared";
+import { useTranslation as useTranslation10 } from "react-i18next";
 
 // src/components/common/customer-info/customer-info.tsx
-import { Avatar, Copy as Copy2, Text as Text8 } from "@medusajs/ui";
-import { useTranslation as useTranslation10 } from "react-i18next";
+import { Avatar, Copy as Copy2, Text as Text7 } from "@medusajs/ui";
+import { useTranslation as useTranslation9 } from "react-i18next";
 import { Link } from "react-router-dom";
-import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
 var ID = ({ data }) => {
-  const { t } = useTranslation10();
+  const { t } = useTranslation9();
   const id = data.customer_id;
   const name = getOrderCustomer(data);
   const email = data.email;
   const fallback = (name || email || "").charAt(0).toUpperCase();
-  return /* @__PURE__ */ jsxs10("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
-    /* @__PURE__ */ jsx10(Text8, { size: "small", leading: "compact", weight: "plus", children: t("fields.id") }),
-    /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsxs9("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
+    /* @__PURE__ */ jsx9(Text7, { size: "small", leading: "compact", weight: "plus", children: t("fields.id") }),
+    /* @__PURE__ */ jsx9(
       Link,
       {
         to: `/customers/${id}`,
         className: "focus:shadow-borders-focus rounded-[4px] outline-none transition-shadow",
-        children: /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-x-2 overflow-hidden", children: [
-          /* @__PURE__ */ jsx10(Avatar, { size: "2xsmall", fallback }),
-          /* @__PURE__ */ jsx10(
-            Text8,
+        children: /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-x-2 overflow-hidden", children: [
+          /* @__PURE__ */ jsx9(Avatar, { size: "2xsmall", fallback }),
+          /* @__PURE__ */ jsx9(
+            Text7,
             {
               size: "small",
               leading: "compact",
@@ -1470,26 +1427,26 @@ var ID = ({ data }) => {
   ] });
 };
 var Company = ({ data }) => {
-  const { t } = useTranslation10();
+  const { t } = useTranslation9();
   const company = data.shipping_address?.company || data.billing_address?.company;
   if (!company) {
     return null;
   }
-  return /* @__PURE__ */ jsxs10("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
-    /* @__PURE__ */ jsx10(Text8, { size: "small", leading: "compact", weight: "plus", children: t("fields.company") }),
-    /* @__PURE__ */ jsx10(Text8, { size: "small", leading: "compact", className: "truncate", children: company })
+  return /* @__PURE__ */ jsxs9("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
+    /* @__PURE__ */ jsx9(Text7, { size: "small", leading: "compact", weight: "plus", children: t("fields.company") }),
+    /* @__PURE__ */ jsx9(Text7, { size: "small", leading: "compact", className: "truncate", children: company })
   ] });
 };
 var Contact = ({ data }) => {
-  const { t } = useTranslation10();
+  const { t } = useTranslation9();
   const phone = data.shipping_address?.phone || data.billing_address?.phone;
   const email = data.email || "";
-  return /* @__PURE__ */ jsxs10("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-start px-6 py-4", children: [
-    /* @__PURE__ */ jsx10(Text8, { size: "small", leading: "compact", weight: "plus", children: t("orders.customer.contactLabel") }),
-    /* @__PURE__ */ jsxs10("div", { className: "flex flex-col gap-y-2", children: [
-      /* @__PURE__ */ jsxs10("div", { className: "grid grid-cols-[1fr_20px] items-start gap-x-2", children: [
-        /* @__PURE__ */ jsx10(
-          Text8,
+  return /* @__PURE__ */ jsxs9("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-start px-6 py-4", children: [
+    /* @__PURE__ */ jsx9(Text7, { size: "small", leading: "compact", weight: "plus", children: t("orders.customer.contactLabel") }),
+    /* @__PURE__ */ jsxs9("div", { className: "flex flex-col gap-y-2", children: [
+      /* @__PURE__ */ jsxs9("div", { className: "grid grid-cols-[1fr_20px] items-start gap-x-2", children: [
+        /* @__PURE__ */ jsx9(
+          Text7,
           {
             size: "small",
             leading: "compact",
@@ -1497,11 +1454,11 @@ var Contact = ({ data }) => {
             children: email
           }
         ),
-        /* @__PURE__ */ jsx10("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx10(Copy2, { content: email, className: "text-ui-fg-muted" }) })
+        /* @__PURE__ */ jsx9("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx9(Copy2, { content: email, className: "text-ui-fg-muted" }) })
       ] }),
-      phone && /* @__PURE__ */ jsxs10("div", { className: "grid grid-cols-[1fr_20px] items-start gap-x-2", children: [
-        /* @__PURE__ */ jsx10(
-          Text8,
+      phone && /* @__PURE__ */ jsxs9("div", { className: "grid grid-cols-[1fr_20px] items-start gap-x-2", children: [
+        /* @__PURE__ */ jsx9(
+          Text7,
           {
             size: "small",
             leading: "compact",
@@ -1509,7 +1466,7 @@ var Contact = ({ data }) => {
             children: phone
           }
         ),
-        /* @__PURE__ */ jsx10("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx10(Copy2, { content: phone, className: "text-ui-fg-muted" }) })
+        /* @__PURE__ */ jsx9("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx9(Copy2, { content: phone, className: "text-ui-fg-muted" }) })
       ] })
     ] })
   ] });
@@ -1518,33 +1475,33 @@ var AddressPrint = ({
   address,
   type
 }) => {
-  const { t } = useTranslation10();
-  return /* @__PURE__ */ jsxs10("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-start px-6 py-4", children: [
-    /* @__PURE__ */ jsx10(Text8, { size: "small", leading: "compact", weight: "plus", children: type === "shipping" ? t("addresses.shippingAddress.label") : t("addresses.billingAddress.label") }),
-    address ? /* @__PURE__ */ jsxs10("div", { className: "grid grid-cols-[1fr_20px] items-start gap-x-2", children: [
-      /* @__PURE__ */ jsx10(Text8, { size: "small", leading: "compact", children: getFormattedAddress({ address }).map((line, i) => {
-        return /* @__PURE__ */ jsxs10("span", { className: "break-words", children: [
+  const { t } = useTranslation9();
+  return /* @__PURE__ */ jsxs9("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-start px-6 py-4", children: [
+    /* @__PURE__ */ jsx9(Text7, { size: "small", leading: "compact", weight: "plus", children: type === "shipping" ? t("addresses.shippingAddress.label") : t("addresses.billingAddress.label") }),
+    address ? /* @__PURE__ */ jsxs9("div", { className: "grid grid-cols-[1fr_20px] items-start gap-x-2", children: [
+      /* @__PURE__ */ jsx9(Text7, { size: "small", leading: "compact", children: getFormattedAddress({ address }).map((line, i) => {
+        return /* @__PURE__ */ jsxs9("span", { className: "break-words", children: [
           line,
-          /* @__PURE__ */ jsx10("br", {})
+          /* @__PURE__ */ jsx9("br", {})
         ] }, i);
       }) }),
-      /* @__PURE__ */ jsx10("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx10(
+      /* @__PURE__ */ jsx9("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx9(
         Copy2,
         {
           content: getFormattedAddress({ address }).join("\n"),
           className: "text-ui-fg-muted"
         }
       ) })
-    ] }) : /* @__PURE__ */ jsx10(Text8, { size: "small", leading: "compact", children: "-" })
+    ] }) : /* @__PURE__ */ jsx9(Text7, { size: "small", leading: "compact", children: "-" })
   ] });
 };
 var Addresses = ({ data }) => {
-  const { t } = useTranslation10();
-  return /* @__PURE__ */ jsxs10("div", { className: "divide-y", children: [
-    /* @__PURE__ */ jsx10(AddressPrint, { address: data.shipping_address, type: "shipping" }),
-    !isSameAddress(data.shipping_address, data.billing_address) ? /* @__PURE__ */ jsx10(AddressPrint, { address: data.billing_address, type: "billing" }) : /* @__PURE__ */ jsxs10("div", { className: "grid grid-cols-2 items-center px-6 py-4", children: [
-      /* @__PURE__ */ jsx10(
-        Text8,
+  const { t } = useTranslation9();
+  return /* @__PURE__ */ jsxs9("div", { className: "divide-y", children: [
+    /* @__PURE__ */ jsx9(AddressPrint, { address: data.shipping_address, type: "shipping" }),
+    !isSameAddress(data.shipping_address, data.billing_address) ? /* @__PURE__ */ jsx9(AddressPrint, { address: data.billing_address, type: "billing" }) : /* @__PURE__ */ jsxs9("div", { className: "grid grid-cols-2 items-center px-6 py-4", children: [
+      /* @__PURE__ */ jsx9(
+        Text7,
         {
           size: "small",
           leading: "compact",
@@ -1553,7 +1510,7 @@ var Addresses = ({ data }) => {
           children: t("addresses.billingAddress.label")
         }
       ),
-      /* @__PURE__ */ jsx10(Text8, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: t("addresses.billingAddress.sameAsShipping") })
+      /* @__PURE__ */ jsx9(Text7, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: t("addresses.billingAddress.sameAsShipping") })
     ] })
   ] });
 };
@@ -1578,40 +1535,41 @@ var getOrderCustomer = (obj) => {
 };
 
 // src/pages/orders/order-detail/components/order-customer-section/order-customer-section.tsx
-import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
 var OrderCustomerSection = ({ order }) => {
-  return /* @__PURE__ */ jsxs11(
-    Container7,
+  return /* @__PURE__ */ jsxs10(
+    Container6,
     {
       className: "divide-y p-0",
       "data-testid": "order-customer-section",
       children: [
-        /* @__PURE__ */ jsx11(Header, { order }),
-        /* @__PURE__ */ jsx11(CustomerInfo.ID, { data: order }),
-        /* @__PURE__ */ jsx11(CustomerInfo.Contact, { data: order }),
-        /* @__PURE__ */ jsx11(CustomerInfo.Company, { data: order }),
-        /* @__PURE__ */ jsx11(CustomerInfo.Addresses, { data: order })
+        /* @__PURE__ */ jsx10(Header, { order }),
+        /* @__PURE__ */ jsx10(CustomerInfo.ID, { data: order }),
+        /* @__PURE__ */ jsx10(CustomerInfo.Contact, { data: order }),
+        /* @__PURE__ */ jsx10(CustomerInfo.Company, { data: order }),
+        /* @__PURE__ */ jsx10(CustomerInfo.Addresses, { data: order }),
+        /* @__PURE__ */ jsx10(DisplayExtensionZone2, { model: "order", zone: "customer", data: order })
       ]
     }
   );
 };
 var Header = ({ order }) => {
-  const { t } = useTranslation11();
-  return /* @__PURE__ */ jsxs11(
+  const { t } = useTranslation10();
+  return /* @__PURE__ */ jsxs10(
     "div",
     {
       className: "flex items-center justify-between px-6 py-4",
       "data-testid": "order-customer-header",
       children: [
-        /* @__PURE__ */ jsx11(
-          Heading7,
+        /* @__PURE__ */ jsx10(
+          Heading6,
           {
             level: "h2",
             "data-testid": "order-customer-heading",
             children: t("fields.customer")
           }
         ),
-        /* @__PURE__ */ jsx11(
+        /* @__PURE__ */ jsx10(
           ActionMenu,
           {
             groups: [
@@ -1620,7 +1578,7 @@ var Header = ({ order }) => {
                   {
                     label: t("transferOwnership.label"),
                     to: `transfer`,
-                    icon: /* @__PURE__ */ jsx11(ArrowPath2, {})
+                    icon: /* @__PURE__ */ jsx10(ArrowPath2, {})
                   }
                 ]
               },
@@ -1629,12 +1587,12 @@ var Header = ({ order }) => {
                   {
                     label: t("addresses.shippingAddress.editLabel"),
                     to: "shipping-address",
-                    icon: /* @__PURE__ */ jsx11(FlyingBox, {})
+                    icon: /* @__PURE__ */ jsx10(FlyingBox, {})
                   },
                   {
                     label: t("addresses.billingAddress.editLabel"),
                     to: "billing-address",
-                    icon: /* @__PURE__ */ jsx11(CurrencyDollar, {})
+                    icon: /* @__PURE__ */ jsx10(CurrencyDollar, {})
                   }
                 ]
               },
@@ -1643,7 +1601,7 @@ var Header = ({ order }) => {
                   {
                     label: t("email.editLabel"),
                     to: `email`,
-                    icon: /* @__PURE__ */ jsx11(Envelope, {}),
+                    icon: /* @__PURE__ */ jsx10(Envelope, {}),
                     disabled: order.status === "canceled"
                   }
                 ]
@@ -1659,40 +1617,40 @@ var Header = ({ order }) => {
 
 // src/pages/orders/order-detail/components/order-fulfillment-section/order-fulfillment-section.tsx
 import {
-  Container as Container8,
+  Container as Container7,
   Copy as Copy3,
-  Heading as Heading8,
+  Heading as Heading7,
   StatusBadge,
-  Text as Text9,
+  Text as Text8,
   Tooltip as Tooltip2
 } from "@medusajs/ui";
 import { format } from "date-fns";
-import { useTranslation as useTranslation12 } from "react-i18next";
+import { useTranslation as useTranslation11 } from "react-i18next";
 import { Link as Link2 } from "react-router-dom";
-import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
 var OrderFulfillmentSection = ({
   order
 }) => {
   const fulfillments = order.fulfillments || [];
-  return /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-y-3", "data-testid": "order-fulfillment-section", children: [
-    /* @__PURE__ */ jsx12(UnfulfilledItemBreakdown, { order }),
-    fulfillments.map((f, index) => /* @__PURE__ */ jsx12(Fulfillment, { index, fulfillment: f, order }, f.id))
+  return /* @__PURE__ */ jsxs11("div", { className: "flex flex-col gap-y-3", "data-testid": "order-fulfillment-section", children: [
+    /* @__PURE__ */ jsx11(UnfulfilledItemBreakdown, { order }),
+    fulfillments.map((f, index) => /* @__PURE__ */ jsx11(Fulfillment, { index, fulfillment: f, order }, f.id))
   ] });
 };
 var UnfulfilledItem = ({
   item,
   currencyCode
 }) => {
-  return /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs11(
     "div",
     {
       className: "text-ui-fg-subtle grid grid-cols-2 items-start px-6 py-4",
       children: [
-        /* @__PURE__ */ jsxs12("div", { className: "flex items-start gap-x-4", children: [
-          /* @__PURE__ */ jsx12(Thumbnail, { src: item.thumbnail }),
-          /* @__PURE__ */ jsxs12("div", { children: [
-            /* @__PURE__ */ jsx12(
-              Text9,
+        /* @__PURE__ */ jsxs11("div", { className: "flex items-start gap-x-4", children: [
+          /* @__PURE__ */ jsx11(Thumbnail, { src: item.thumbnail }),
+          /* @__PURE__ */ jsxs11("div", { children: [
+            /* @__PURE__ */ jsx11(
+              Text8,
               {
                 size: "small",
                 leading: "compact",
@@ -1701,20 +1659,20 @@ var UnfulfilledItem = ({
                 children: item.title
               }
             ),
-            item.variant_sku && /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-x-1", children: [
-              /* @__PURE__ */ jsx12(Text9, { size: "small", children: item.variant_sku }),
-              /* @__PURE__ */ jsx12(Copy3, { content: item.variant_sku, className: "text-ui-fg-muted" })
+            item.variant_sku && /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-x-1", children: [
+              /* @__PURE__ */ jsx11(Text8, { size: "small", children: item.variant_sku }),
+              /* @__PURE__ */ jsx11(Copy3, { content: item.variant_sku, className: "text-ui-fg-muted" })
             ] }),
-            /* @__PURE__ */ jsx12(Text9, { size: "small", children: item.variant?.options?.map((o) => o.value).join(" \xB7 ") })
+            /* @__PURE__ */ jsx11(Text8, { size: "small", children: item.variant?.options?.map((o) => o.value).join(" \xB7 ") })
           ] })
         ] }),
-        /* @__PURE__ */ jsxs12("div", { className: "grid grid-cols-3 items-center gap-x-4", children: [
-          /* @__PURE__ */ jsx12("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsx12(Text9, { size: "small", children: getLocaleAmount(item.unit_price, currencyCode) }) }),
-          /* @__PURE__ */ jsx12("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsxs12(Text9, { children: [
-            /* @__PURE__ */ jsx12("span", { className: "tabular-nums", children: item.quantity - item.detail.fulfilled_quantity }),
+        /* @__PURE__ */ jsxs11("div", { className: "grid grid-cols-3 items-center gap-x-4", children: [
+          /* @__PURE__ */ jsx11("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsx11(Text8, { size: "small", children: getLocaleAmount(item.unit_price, currencyCode) }) }),
+          /* @__PURE__ */ jsx11("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsxs11(Text8, { children: [
+            /* @__PURE__ */ jsx11("span", { className: "tabular-nums", children: item.quantity - item.detail.fulfilled_quantity }),
             "x"
           ] }) }),
-          /* @__PURE__ */ jsx12("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsx12(Text9, { size: "small", children: getLocaleAmount(item.subtotal || 0, currencyCode) }) })
+          /* @__PURE__ */ jsx11("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsx11(Text8, { size: "small", children: getLocaleAmount(item.subtotal || 0, currencyCode) }) })
         ] })
       ]
     },
@@ -1728,8 +1686,8 @@ var UnfulfilledItemBreakdown = ({ order }) => {
   const unfulfilledItemsWithoutShipping = order.items.filter(
     (i) => !i.requires_shipping && i.detail.fulfilled_quantity < i.quantity
   );
-  return /* @__PURE__ */ jsxs12(Fragment2, { children: [
-    !!unfulfilledItemsWithShipping.length && /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsxs11(Fragment2, { children: [
+    !!unfulfilledItemsWithShipping.length && /* @__PURE__ */ jsx11(
       UnfulfilledItemDisplay,
       {
         order,
@@ -1737,7 +1695,7 @@ var UnfulfilledItemBreakdown = ({ order }) => {
         requiresShipping: true
       }
     ),
-    !!unfulfilledItemsWithoutShipping.length && /* @__PURE__ */ jsx12(
+    !!unfulfilledItemsWithoutShipping.length && /* @__PURE__ */ jsx11(
       UnfulfilledItemDisplay,
       {
         order,
@@ -1752,19 +1710,19 @@ var UnfulfilledItemDisplay = ({
   unfulfilledItems,
   requiresShipping = false
 }) => {
-  const { t } = useTranslation12();
+  const { t } = useTranslation11();
   if (order.status === "canceled") {
     return;
   }
-  return /* @__PURE__ */ jsxs12(Container8, { className: "divide-y p-0", "data-testid": "order-fulfillment-unfulfilled", children: [
-    /* @__PURE__ */ jsxs12("div", { className: "flex items-center justify-between px-6 py-4", "data-testid": "order-fulfillment-unfulfilled-header", children: [
-      /* @__PURE__ */ jsx12(Heading8, { level: "h2", "data-testid": "order-fulfillment-unfulfilled-heading", children: t("orders.fulfillment.unfulfilledItems") }),
-      /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-x-4", "data-testid": "order-fulfillment-unfulfilled-badges", children: [
-        requiresShipping && /* @__PURE__ */ jsx12(StatusBadge, { color: "red", className: "text-nowrap", "data-testid": "order-fulfillment-unfulfilled-requires-shipping-badge", children: t("orders.fulfillment.requiresShipping") }),
-        /* @__PURE__ */ jsx12(StatusBadge, { color: "red", className: "text-nowrap", "data-testid": "order-fulfillment-unfulfilled-awaiting-badge", children: t("orders.fulfillment.awaitingFulfillmentBadge") })
+  return /* @__PURE__ */ jsxs11(Container7, { className: "divide-y p-0", "data-testid": "order-fulfillment-unfulfilled", children: [
+    /* @__PURE__ */ jsxs11("div", { className: "flex items-center justify-between px-6 py-4", "data-testid": "order-fulfillment-unfulfilled-header", children: [
+      /* @__PURE__ */ jsx11(Heading7, { level: "h2", "data-testid": "order-fulfillment-unfulfilled-heading", children: t("orders.fulfillment.unfulfilledItems") }),
+      /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-x-4", "data-testid": "order-fulfillment-unfulfilled-badges", children: [
+        requiresShipping && /* @__PURE__ */ jsx11(StatusBadge, { color: "red", className: "text-nowrap", "data-testid": "order-fulfillment-unfulfilled-requires-shipping-badge", children: t("orders.fulfillment.requiresShipping") }),
+        /* @__PURE__ */ jsx11(StatusBadge, { color: "red", className: "text-nowrap", "data-testid": "order-fulfillment-unfulfilled-awaiting-badge", children: t("orders.fulfillment.awaitingFulfillmentBadge") })
       ] })
     ] }),
-    /* @__PURE__ */ jsx12("div", { "data-testid": "order-fulfillment-unfulfilled-items", children: unfulfilledItems.map((item) => /* @__PURE__ */ jsx12(
+    /* @__PURE__ */ jsx11("div", { "data-testid": "order-fulfillment-unfulfilled-items", children: unfulfilledItems.map((item) => /* @__PURE__ */ jsx11(
       UnfulfilledItem,
       {
         item,
@@ -1778,7 +1736,7 @@ var Fulfillment = ({
   fulfillment,
   index
 }) => {
-  const { t } = useTranslation12();
+  const { t } = useTranslation11();
   const showLocation = !!fulfillment.location_id;
   const isPickUpFulfillment = fulfillment.shipping_option?.service_zone.fulfillment_set.type === "pickup" /* Pickup */;
   const { stock_location, isError, error } = useStockLocation(
@@ -1808,77 +1766,77 @@ var Fulfillment = ({
     throw error;
   }
   const isValidUrl = (url) => url && url.length > 0 && url !== "#";
-  return /* @__PURE__ */ jsxs12(Container8, { className: "divide-y p-0", "data-testid": `order-fulfillment-${fulfillment.id}`, children: [
-    /* @__PURE__ */ jsxs12("div", { className: "flex items-center justify-between px-6 py-4", "data-testid": `order-fulfillment-${fulfillment.id}-header`, children: [
-      /* @__PURE__ */ jsx12(Heading8, { level: "h2", "data-testid": `order-fulfillment-${fulfillment.id}-heading`, children: t("orders.fulfillment.number", {
+  return /* @__PURE__ */ jsxs11(Container7, { className: "divide-y p-0", "data-testid": `order-fulfillment-${fulfillment.id}`, children: [
+    /* @__PURE__ */ jsxs11("div", { className: "flex items-center justify-between px-6 py-4", "data-testid": `order-fulfillment-${fulfillment.id}-header`, children: [
+      /* @__PURE__ */ jsx11(Heading7, { level: "h2", "data-testid": `order-fulfillment-${fulfillment.id}-heading`, children: t("orders.fulfillment.number", {
         number: index + 1
       }) }),
-      /* @__PURE__ */ jsx12("div", { className: "flex items-center gap-x-4", "data-testid": `order-fulfillment-${fulfillment.id}-status-container`, children: /* @__PURE__ */ jsx12(
+      /* @__PURE__ */ jsx11("div", { className: "flex items-center gap-x-4", "data-testid": `order-fulfillment-${fulfillment.id}-status-container`, children: /* @__PURE__ */ jsx11(
         Tooltip2,
         {
           content: format(
             new Date(statusTimestamp),
             "dd MMM, yyyy, HH:mm:ss"
           ),
-          children: /* @__PURE__ */ jsx12(StatusBadge, { color: statusColor, className: "text-nowrap", "data-testid": `order-fulfillment-${fulfillment.id}-status-badge`, children: statusText })
+          children: /* @__PURE__ */ jsx11(StatusBadge, { color: statusColor, className: "text-nowrap", "data-testid": `order-fulfillment-${fulfillment.id}-status-badge`, children: statusText })
         }
       ) })
     ] }),
-    /* @__PURE__ */ jsxs12("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-start px-6 py-4", children: [
-      /* @__PURE__ */ jsx12(Text9, { size: "small", leading: "compact", weight: "plus", children: t("orders.fulfillment.itemsLabel") }),
-      /* @__PURE__ */ jsx12("ul", { children: fulfillment.items.map((f_item) => /* @__PURE__ */ jsx12("li", { children: /* @__PURE__ */ jsxs12(Text9, { size: "small", leading: "compact", children: [
+    /* @__PURE__ */ jsxs11("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-start px-6 py-4", children: [
+      /* @__PURE__ */ jsx11(Text8, { size: "small", leading: "compact", weight: "plus", children: t("orders.fulfillment.itemsLabel") }),
+      /* @__PURE__ */ jsx11("ul", { children: fulfillment.items.map((f_item) => /* @__PURE__ */ jsx11("li", { children: /* @__PURE__ */ jsxs11(Text8, { size: "small", leading: "compact", children: [
         f_item.quantity,
         "x ",
         f_item.title
       ] }) }, f_item.line_item_id)) })
     ] }),
-    showLocation && /* @__PURE__ */ jsxs12("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
-      /* @__PURE__ */ jsx12(Text9, { size: "small", leading: "compact", weight: "plus", children: t("orders.fulfillment.shippingFromLabel") }),
-      stock_location ? /* @__PURE__ */ jsx12(
+    showLocation && /* @__PURE__ */ jsxs11("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
+      /* @__PURE__ */ jsx11(Text8, { size: "small", leading: "compact", weight: "plus", children: t("orders.fulfillment.shippingFromLabel") }),
+      stock_location ? /* @__PURE__ */ jsx11(
         Link2,
         {
           to: `/settings/locations/${stock_location.id}`,
           className: "text-ui-fg-interactive hover:text-ui-fg-interactive-hover transition-fg",
-          children: /* @__PURE__ */ jsx12(Text9, { size: "small", leading: "compact", children: stock_location.name })
+          children: /* @__PURE__ */ jsx11(Text8, { size: "small", leading: "compact", children: stock_location.name })
         }
-      ) : /* @__PURE__ */ jsx12(Skeleton, { className: "w-16" })
+      ) : /* @__PURE__ */ jsx11(Skeleton, { className: "w-16" })
     ] }),
-    /* @__PURE__ */ jsxs12("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
-      /* @__PURE__ */ jsx12(Text9, { size: "small", leading: "compact", weight: "plus", children: t("fields.provider") }),
-      /* @__PURE__ */ jsx12(Text9, { size: "small", leading: "compact", children: formatProvider(fulfillment.provider_id) })
+    /* @__PURE__ */ jsxs11("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4", children: [
+      /* @__PURE__ */ jsx11(Text8, { size: "small", leading: "compact", weight: "plus", children: t("fields.provider") }),
+      /* @__PURE__ */ jsx11(Text8, { size: "small", leading: "compact", children: formatProvider(fulfillment.provider_id) })
     ] }),
-    /* @__PURE__ */ jsxs12("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-start px-6 py-4", children: [
-      /* @__PURE__ */ jsx12(Text9, { size: "small", leading: "compact", weight: "plus", children: t("orders.fulfillment.trackingLabel") }),
-      /* @__PURE__ */ jsx12("div", { children: fulfillment.labels && fulfillment.labels.length > 0 ? /* @__PURE__ */ jsx12("ul", { children: fulfillment.labels.map((tlink) => {
+    /* @__PURE__ */ jsxs11("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-start px-6 py-4", children: [
+      /* @__PURE__ */ jsx11(Text8, { size: "small", leading: "compact", weight: "plus", children: t("orders.fulfillment.trackingLabel") }),
+      /* @__PURE__ */ jsx11("div", { children: fulfillment.labels && fulfillment.labels.length > 0 ? /* @__PURE__ */ jsx11("ul", { children: fulfillment.labels.map((tlink) => {
         const hasTrackingUrl = isValidUrl(tlink.tracking_url);
         const hasLabelUrl = isValidUrl(tlink.label_url);
         if (hasTrackingUrl || hasLabelUrl) {
-          return /* @__PURE__ */ jsxs12("li", { children: [
-            hasTrackingUrl && /* @__PURE__ */ jsx12(
+          return /* @__PURE__ */ jsxs11("li", { children: [
+            hasTrackingUrl && /* @__PURE__ */ jsx11(
               "a",
               {
                 href: tlink.tracking_url,
                 target: "_blank",
                 rel: "noopener noreferrer",
                 className: "text-ui-fg-interactive hover:text-ui-fg-interactive-hover transition-fg",
-                children: /* @__PURE__ */ jsx12(Text9, { size: "small", leading: "compact", as: "span", children: tlink.tracking_number })
+                children: /* @__PURE__ */ jsx11(Text8, { size: "small", leading: "compact", as: "span", children: tlink.tracking_number })
               }
             ),
             hasTrackingUrl && hasLabelUrl && " - ",
-            hasLabelUrl && /* @__PURE__ */ jsx12(
+            hasLabelUrl && /* @__PURE__ */ jsx11(
               "a",
               {
                 href: tlink.label_url,
                 target: "_blank",
                 rel: "noopener noreferrer",
                 className: "text-ui-fg-interactive hover:text-ui-fg-interactive-hover transition-fg",
-                children: /* @__PURE__ */ jsx12(Text9, { size: "small", leading: "compact", as: "span", children: t("orders.fulfillment.labelLink") })
+                children: /* @__PURE__ */ jsx11(Text8, { size: "small", leading: "compact", as: "span", children: t("orders.fulfillment.labelLink") })
               }
             )
           ] }, tlink.tracking_number);
         }
-        return /* @__PURE__ */ jsx12("li", { children: /* @__PURE__ */ jsx12(Text9, { size: "small", leading: "compact", children: tlink.tracking_number }) }, tlink.tracking_number);
-      }) }) : /* @__PURE__ */ jsx12(Text9, { size: "small", leading: "compact", children: "-" }) })
+        return /* @__PURE__ */ jsx11("li", { children: /* @__PURE__ */ jsx11(Text8, { size: "small", leading: "compact", children: tlink.tracking_number }) }, tlink.tracking_number);
+      }) }) : /* @__PURE__ */ jsx11(Text8, { size: "small", leading: "compact", children: "-" }) })
     ] })
   ] });
 };
@@ -1886,18 +1844,26 @@ var Fulfillment = ({
 // src/pages/orders/order-detail/components/order-general-section/order-general-section.tsx
 import { XCircle } from "@medusajs/icons";
 import {
-  Container as Container9,
+  Container as Container8,
   Copy as Copy4,
-  Heading as Heading9,
+  Heading as Heading8,
   StatusBadge as StatusBadge2,
-  Text as Text10,
+  Text as Text9,
   toast as toast6,
   usePrompt as usePrompt2
 } from "@medusajs/ui";
-import { useTranslation as useTranslation13 } from "react-i18next";
-import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
+import { useTranslation as useTranslation12 } from "react-i18next";
+import { DisplayExtensionZone as DisplayExtensionZone3, DisplayField } from "@mercurjs/dashboard-shared";
+import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+var GENERAL_FIELD_IDS = [
+  "display_id",
+  "created_at",
+  "status",
+  "payment_status",
+  "fulfillment_status"
+];
 var OrderGeneralSection = ({ order }) => {
-  const { t } = useTranslation13();
+  const { t } = useTranslation12();
   const prompt = usePrompt2();
   const { getFullDate } = useDate();
   const { mutateAsync: cancelOrder } = useCancelOrder(order.id);
@@ -1928,27 +1894,27 @@ var OrderGeneralSection = ({ order }) => {
       }
     });
   };
-  return /* @__PURE__ */ jsxs13(Container9, { className: "flex items-center justify-between px-6 py-4", "data-testid": "order-general-section", children: [
-    /* @__PURE__ */ jsxs13("div", { children: [
-      /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-x-1", "data-testid": "order-general-section-id-container", children: [
-        /* @__PURE__ */ jsxs13(Heading9, { "data-testid": "order-general-section-id-heading", children: [
+  return /* @__PURE__ */ jsxs12(Container8, { className: "flex items-center justify-between px-6 py-4", "data-testid": "order-general-section", children: [
+    /* @__PURE__ */ jsxs12("div", { children: [
+      /* @__PURE__ */ jsx12(DisplayField, { model: "order", zone: "general", id: "display_id", data: order, children: /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-x-1", "data-testid": "order-general-section-id-container", children: [
+        /* @__PURE__ */ jsxs12(Heading8, { "data-testid": "order-general-section-id-heading", children: [
           "#",
           order.display_id
         ] }),
-        /* @__PURE__ */ jsx13(Copy4, { content: `#${order.display_id}`, className: "text-ui-fg-muted", "data-testid": "order-general-section-id-copy" })
-      ] }),
-      /* @__PURE__ */ jsx13(Text10, { size: "small", className: "text-ui-fg-subtle", "data-testid": "order-general-section-date", children: t("orders.onDateFromSalesChannel", {
+        /* @__PURE__ */ jsx12(Copy4, { content: `#${order.display_id}`, className: "text-ui-fg-muted", "data-testid": "order-general-section-id-copy" })
+      ] }) }),
+      /* @__PURE__ */ jsx12(DisplayField, { model: "order", zone: "general", id: "created_at", data: order, children: /* @__PURE__ */ jsx12(Text9, { size: "small", className: "text-ui-fg-subtle", "data-testid": "order-general-section-date", children: t("orders.onDateFromSalesChannel", {
         date: getFullDate({ date: order.created_at, includeTime: true }),
         salesChannel: order.sales_channel?.name
-      }) })
+      }) }) })
     ] }),
-    /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-x-4", "data-testid": "order-general-section-badges-container", children: [
-      /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-x-1.5", "data-testid": "order-general-section-badges", children: [
-        /* @__PURE__ */ jsx13(OrderBadge, { order }),
-        /* @__PURE__ */ jsx13(PaymentBadge, { order }),
-        /* @__PURE__ */ jsx13(FulfillmentBadge, { order })
+    /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-x-4", "data-testid": "order-general-section-badges-container", children: [
+      /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-x-1.5", "data-testid": "order-general-section-badges", children: [
+        /* @__PURE__ */ jsx12(DisplayField, { model: "order", zone: "general", id: "status", data: order, children: /* @__PURE__ */ jsx12(OrderBadge, { order }) }),
+        /* @__PURE__ */ jsx12(DisplayField, { model: "order", zone: "general", id: "payment_status", data: order, children: /* @__PURE__ */ jsx12(PaymentBadge, { order }) }),
+        /* @__PURE__ */ jsx12(DisplayField, { model: "order", zone: "general", id: "fulfillment_status", data: order, children: /* @__PURE__ */ jsx12(FulfillmentBadge, { order }) })
       ] }),
-      /* @__PURE__ */ jsx13(
+      /* @__PURE__ */ jsx12(
         ActionMenu,
         {
           groups: [
@@ -1959,7 +1925,7 @@ var OrderGeneralSection = ({ order }) => {
                   onClick: handleCancel,
                   disabled: cancelDisabled,
                   disabledTooltip: cancelDisabledTooltip,
-                  icon: /* @__PURE__ */ jsx13(XCircle, {})
+                  icon: /* @__PURE__ */ jsx12(XCircle, {})
                 }
               ]
             }
@@ -1967,45 +1933,54 @@ var OrderGeneralSection = ({ order }) => {
           "data-testid": "order-general-section-action-menu"
         }
       )
-    ] })
+    ] }),
+    /* @__PURE__ */ jsx12(
+      DisplayExtensionZone3,
+      {
+        model: "order",
+        zone: "general",
+        data: order,
+        builtInFieldIds: GENERAL_FIELD_IDS
+      }
+    )
   ] });
 };
 var FulfillmentBadge = ({ order }) => {
-  const { t } = useTranslation13();
+  const { t } = useTranslation12();
   const { label, color } = getOrderFulfillmentStatus(
     t,
     order.fulfillment_status
   );
-  return /* @__PURE__ */ jsx13(StatusBadge2, { color, className: "text-nowrap", "data-testid": "order-general-section-fulfillment-badge", children: label });
+  return /* @__PURE__ */ jsx12(StatusBadge2, { color, className: "text-nowrap", "data-testid": "order-general-section-fulfillment-badge", children: label });
 };
 var PaymentBadge = ({ order }) => {
-  const { t } = useTranslation13();
+  const { t } = useTranslation12();
   const { label, color } = getOrderPaymentStatus(t, order.payment_status);
-  return /* @__PURE__ */ jsx13(StatusBadge2, { color, className: "text-nowrap", "data-testid": "order-general-section-payment-badge", children: label });
+  return /* @__PURE__ */ jsx12(StatusBadge2, { color, className: "text-nowrap", "data-testid": "order-general-section-payment-badge", children: label });
 };
 var OrderBadge = ({ order }) => {
-  const { t } = useTranslation13();
+  const { t } = useTranslation12();
   const orderStatus = getCanceledOrderStatus(t, order.status);
   if (!orderStatus) {
     return null;
   }
-  return /* @__PURE__ */ jsx13(StatusBadge2, { color: orderStatus.color, className: "text-nowrap", "data-testid": "order-general-section-order-badge", children: orderStatus.label });
+  return /* @__PURE__ */ jsx12(StatusBadge2, { color: orderStatus.color, className: "text-nowrap", "data-testid": "order-general-section-order-badge", children: orderStatus.label });
 };
 
 // src/components/common/display-id/display-id.tsx
-import { useTranslation as useTranslation14 } from "react-i18next";
+import { useTranslation as useTranslation13 } from "react-i18next";
 import { useState as useState4 } from "react";
 import copy from "copy-to-clipboard";
 import { clx as clx2, toast as toast7, Tooltip as Tooltip3 } from "@medusajs/ui";
-import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
 function DisplayId({ id, className }) {
-  const { t } = useTranslation14();
+  const { t } = useTranslation13();
   const [open, setOpen] = useState4(false);
   const onClick = () => {
     copy(id);
     toast7.success(t("actions.idCopiedToClipboard"));
   };
-  return /* @__PURE__ */ jsx14(Tooltip3, { maxWidth: 260, content: id, open, onOpenChange: setOpen, children: /* @__PURE__ */ jsxs14("span", { onClick, className: clx2("cursor-pointer", className), children: [
+  return /* @__PURE__ */ jsx13(Tooltip3, { maxWidth: 260, content: id, open, onOpenChange: setOpen, children: /* @__PURE__ */ jsxs13("span", { onClick, className: clx2("cursor-pointer", className), children: [
     "#",
     id.slice(-7)
   ] }) });
@@ -2027,28 +2002,29 @@ import { ArrowDownRightMini, DocumentText, XCircle as XCircle2 } from "@medusajs
 import {
   Badge,
   Button as Button6,
-  Container as Container10,
-  Heading as Heading10,
+  Container as Container9,
+  Heading as Heading9,
   StatusBadge as StatusBadge3,
-  Text as Text11,
+  Text as Text10,
   toast as toast8,
   Tooltip as Tooltip4,
   usePrompt as usePrompt3
 } from "@medusajs/ui";
+import { DisplayExtensionZone as DisplayExtensionZone4 } from "@mercurjs/dashboard-shared";
 import { format as format2 } from "date-fns";
-import { Trans, useTranslation as useTranslation15 } from "react-i18next";
-import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Trans, useTranslation as useTranslation14 } from "react-i18next";
+import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
 var OrderPaymentSection = ({ order }) => {
   const payments = getPaymentsFromOrder(order);
   const refunds = payments.map((payment) => payment?.refunds).flat(1).filter(Boolean);
-  return /* @__PURE__ */ jsxs15(
-    Container10,
+  return /* @__PURE__ */ jsxs14(
+    Container9,
     {
       className: "divide-y p-0",
       "data-testid": "order-payment-section",
       children: [
-        /* @__PURE__ */ jsx15(Header2, { order }),
-        /* @__PURE__ */ jsx15(
+        /* @__PURE__ */ jsx14(Header2, { order }),
+        /* @__PURE__ */ jsx14(
           PaymentBreakdown,
           {
             order,
@@ -2057,22 +2033,23 @@ var OrderPaymentSection = ({ order }) => {
             currencyCode: order.currency_code
           }
         ),
-        /* @__PURE__ */ jsx15(Total, { order })
+        /* @__PURE__ */ jsx14(Total, { order }),
+        /* @__PURE__ */ jsx14(DisplayExtensionZone4, { model: "order", zone: "payment", data: order })
       ]
     }
   );
 };
 var Header2 = ({ order }) => {
-  const { t } = useTranslation15();
+  const { t } = useTranslation14();
   const { label, color } = getOrderPaymentStatus(t, order.payment_status);
-  return /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsxs14(
     "div",
     {
       className: "flex items-center justify-between px-6 py-4",
       "data-testid": "order-payment-header",
       children: [
-        /* @__PURE__ */ jsx15(Heading10, { level: "h2", "data-testid": "order-payment-heading", children: t("orders.payment.title") }),
-        /* @__PURE__ */ jsx15(
+        /* @__PURE__ */ jsx14(Heading9, { level: "h2", "data-testid": "order-payment-heading", children: t("orders.payment.title") }),
+        /* @__PURE__ */ jsx14(
           StatusBadge3,
           {
             color,
@@ -2089,8 +2066,8 @@ var Refund = ({
   refund,
   currencyCode
 }) => {
-  const { t } = useTranslation15();
-  const RefundReasonBadge = refund?.refund_reason && /* @__PURE__ */ jsx15(
+  const { t } = useTranslation14();
+  const RefundReasonBadge = refund?.refund_reason && /* @__PURE__ */ jsx14(
     Badge,
     {
       size: "2xsmall",
@@ -2100,27 +2077,27 @@ var Refund = ({
       children: refund.refund_reason.label
     }
   );
-  const RefundNoteIndicator = refund.note && /* @__PURE__ */ jsx15(Tooltip4, { content: refund.note, children: /* @__PURE__ */ jsx15(DocumentText, { className: "ml-1 inline text-ui-tag-neutral-icon" }) });
-  return /* @__PURE__ */ jsxs15("div", { className: "flex items-start gap-x-4 bg-ui-bg-subtle px-6 py-4 text-ui-fg-subtle sm:items-center", children: [
-    /* @__PURE__ */ jsxs15("div", { className: "flex flex-1 flex-col gap-3 sm:flex-row sm:items-center", children: [
-      /* @__PURE__ */ jsxs15("div", { className: "flex shrink-0 flex-row items-center gap-x-3", children: [
-        /* @__PURE__ */ jsx15(ArrowDownRightMini, { className: "text-ui-fg-muted" }),
-        /* @__PURE__ */ jsxs15("div", { children: [
-          /* @__PURE__ */ jsx15(Text11, { size: "small", leading: "compact", weight: "plus", children: t("orders.payment.refund") }),
-          /* @__PURE__ */ jsx15(Text11, { size: "small", leading: "compact", children: format2(new Date(refund.created_at), "dd MMM, yyyy, HH:mm:ss") })
+  const RefundNoteIndicator = refund.note && /* @__PURE__ */ jsx14(Tooltip4, { content: refund.note, children: /* @__PURE__ */ jsx14(DocumentText, { className: "ml-1 inline text-ui-tag-neutral-icon" }) });
+  return /* @__PURE__ */ jsxs14("div", { className: "flex items-start gap-x-4 bg-ui-bg-subtle px-6 py-4 text-ui-fg-subtle sm:items-center", children: [
+    /* @__PURE__ */ jsxs14("div", { className: "flex flex-1 flex-col gap-3 sm:flex-row sm:items-center", children: [
+      /* @__PURE__ */ jsxs14("div", { className: "flex shrink-0 flex-row items-center gap-x-3", children: [
+        /* @__PURE__ */ jsx14(ArrowDownRightMini, { className: "text-ui-fg-muted" }),
+        /* @__PURE__ */ jsxs14("div", { children: [
+          /* @__PURE__ */ jsx14(Text10, { size: "small", leading: "compact", weight: "plus", children: t("orders.payment.refund") }),
+          /* @__PURE__ */ jsx14(Text10, { size: "small", leading: "compact", children: format2(new Date(refund.created_at), "dd MMM, yyyy, HH:mm:ss") })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-x-3", children: [
-        /* @__PURE__ */ jsx15("div", { className: "shrink-0", children: RefundNoteIndicator }),
+      /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-x-3", children: [
+        /* @__PURE__ */ jsx14("div", { className: "shrink-0", children: RefundNoteIndicator }),
         RefundReasonBadge
       ] })
     ] }),
-    /* @__PURE__ */ jsxs15("div", { className: "flex shrink-0 items-center justify-end gap-4", children: [
-      /* @__PURE__ */ jsxs15(Text11, { size: "small", leading: "compact", children: [
+    /* @__PURE__ */ jsxs14("div", { className: "flex shrink-0 items-center justify-end gap-4", children: [
+      /* @__PURE__ */ jsxs14(Text10, { size: "small", leading: "compact", children: [
         "- ",
         getLocaleAmount(refund.amount, currencyCode)
       ] }),
-      /* @__PURE__ */ jsx15("div", { className: "h-7 w-5" })
+      /* @__PURE__ */ jsx14("div", { className: "h-7 w-5" })
     ] })
   ] });
 };
@@ -2130,7 +2107,7 @@ var Payment = ({
   refunds,
   currencyCode
 }) => {
-  const { t } = useTranslation15();
+  const { t } = useTranslation14();
   const prompt = usePrompt3();
   const { mutateAsync } = useCapturePayment(order.id, payment.id);
   const handleCapture = async () => {
@@ -2174,32 +2151,32 @@ var Payment = ({
   const [status, color] = getPaymentStatusAttributes(payment);
   const showCapture = payment.captured_at === null && payment.canceled_at === null;
   const totalRefunded = payment.refunds?.reduce((acc, next) => next.amount + acc, 0) ?? 0;
-  return /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsxs14(
     "div",
     {
       className: "divide-y",
       "data-testid": `order-payment-${payment.id}`,
       children: [
-        /* @__PURE__ */ jsxs15(
+        /* @__PURE__ */ jsxs14(
           "div",
           {
             className: "grid grid-cols-[1fr_1fr_1fr_20px] items-center gap-x-4 px-6 py-4 text-ui-fg-subtle sm:grid-cols-[1fr_1fr_1fr_1fr_20px]",
             "data-testid": `order-payment-${payment.id}-row`,
             children: [
-              /* @__PURE__ */ jsxs15("div", { className: "w-full min-w-[60px] overflow-hidden", children: [
-                /* @__PURE__ */ jsx15(
-                  Text11,
+              /* @__PURE__ */ jsxs14("div", { className: "w-full min-w-[60px] overflow-hidden", children: [
+                /* @__PURE__ */ jsx14(
+                  Text10,
                   {
                     size: "small",
                     leading: "compact",
                     weight: "plus",
                     className: "truncate",
                     "data-testid": `order-payment-${payment.id}-id`,
-                    children: /* @__PURE__ */ jsx15(display_id_default, { id: payment.id })
+                    children: /* @__PURE__ */ jsx14(display_id_default, { id: payment.id })
                   }
                 ),
-                /* @__PURE__ */ jsx15(
-                  Text11,
+                /* @__PURE__ */ jsx14(
+                  Text10,
                   {
                     size: "small",
                     leading: "compact",
@@ -2208,8 +2185,8 @@ var Payment = ({
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsx15("div", { className: "hidden items-center justify-end sm:flex", children: /* @__PURE__ */ jsx15(
-                Text11,
+              /* @__PURE__ */ jsx14("div", { className: "hidden items-center justify-end sm:flex", children: /* @__PURE__ */ jsx14(
+                Text10,
                 {
                   size: "small",
                   leading: "compact",
@@ -2218,7 +2195,7 @@ var Payment = ({
                   children: payment.provider_id
                 }
               ) }),
-              /* @__PURE__ */ jsx15("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsx15(
+              /* @__PURE__ */ jsx14("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsx14(
                 StatusBadge3,
                 {
                   color,
@@ -2227,8 +2204,8 @@ var Payment = ({
                   children: status
                 }
               ) }),
-              /* @__PURE__ */ jsx15("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsx15(
-                Text11,
+              /* @__PURE__ */ jsx14("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsx14(
+                Text10,
                 {
                   size: "small",
                   leading: "compact",
@@ -2236,7 +2213,7 @@ var Payment = ({
                   children: getLocaleAmount(payment.amount, payment.currency_code)
                 }
               ) }),
-              /* @__PURE__ */ jsx15(
+              /* @__PURE__ */ jsx14(
                 ActionMenu,
                 {
                   groups: [
@@ -2244,7 +2221,7 @@ var Payment = ({
                       actions: [
                         {
                           label: t("orders.payment.createRefund"),
-                          icon: /* @__PURE__ */ jsx15(XCircle2, {}),
+                          icon: /* @__PURE__ */ jsx14(XCircle2, {}),
                           to: `/orders/${order.id}/refund?paymentId=${payment.id}`,
                           disabled: !payment.captured_at || !!payment.canceled_at || totalRefunded >= payment.amount
                         }
@@ -2257,23 +2234,23 @@ var Payment = ({
             ]
           }
         ),
-        showCapture && /* @__PURE__ */ jsxs15(
+        showCapture && /* @__PURE__ */ jsxs14(
           "div",
           {
             className: "flex items-center justify-between bg-ui-bg-subtle px-6 py-4",
             "data-testid": `order-payment-${payment.id}-capture-section`,
             children: [
-              /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-x-2", children: [
-                /* @__PURE__ */ jsx15(ArrowDownRightMini, { className: "shrink-0 text-ui-fg-muted" }),
-                /* @__PURE__ */ jsx15(Text11, { size: "small", leading: "compact", children: /* @__PURE__ */ jsx15(
+              /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-x-2", children: [
+                /* @__PURE__ */ jsx14(ArrowDownRightMini, { className: "shrink-0 text-ui-fg-muted" }),
+                /* @__PURE__ */ jsx14(Text10, { size: "small", leading: "compact", children: /* @__PURE__ */ jsx14(
                   Trans,
                   {
                     i18nKey: "orders.payment.isReadyToBeCaptured",
-                    components: [/* @__PURE__ */ jsx15(display_id_default, { id: payment.id }, payment.id)]
+                    components: [/* @__PURE__ */ jsx14(display_id_default, { id: payment.id }, payment.id)]
                   }
                 ) })
               ] }),
-              /* @__PURE__ */ jsxs15(
+              /* @__PURE__ */ jsxs14(
                 Button6,
                 {
                   className: "shrink-0",
@@ -2282,15 +2259,15 @@ var Payment = ({
                   onClick: handleCapture,
                   "data-testid": `order-payment-${payment.id}-capture-button`,
                   children: [
-                    /* @__PURE__ */ jsx15("span", { className: "hidden sm:block", children: t("orders.payment.capture") }),
-                    /* @__PURE__ */ jsx15("span", { className: "sm:hidden", children: t("orders.payment.capture_short") })
+                    /* @__PURE__ */ jsx14("span", { className: "hidden sm:block", children: t("orders.payment.capture") }),
+                    /* @__PURE__ */ jsx14("span", { className: "sm:hidden", children: t("orders.payment.capture_short") })
                   ]
                 }
               )
             ]
           }
         ),
-        refunds.map((refund) => /* @__PURE__ */ jsx15(Refund, { refund, currencyCode }, refund.id))
+        refunds.map((refund) => /* @__PURE__ */ jsx14(Refund, { refund, currencyCode }, refund.id))
       ]
     }
   );
@@ -2303,31 +2280,31 @@ var CreditLine = ({
     return null;
   }
   const prettyReference = creditLine.reference?.split("_").join(" ").split("-").join(" ");
-  const prettyReferenceId = creditLine.reference_id ? /* @__PURE__ */ jsx15(display_id_default, { id: creditLine.reference_id }) : null;
-  return /* @__PURE__ */ jsx15("div", { className: "divide-y", children: /* @__PURE__ */ jsxs15("div", { className: "grid grid-cols-[1fr_1fr_20px] items-center gap-x-4 px-6 py-4 text-ui-fg-subtle sm:grid-cols-[1fr_1fr_1fr_20px]", children: [
-    /* @__PURE__ */ jsxs15("div", { className: "w-full min-w-[60px] overflow-hidden", children: [
-      /* @__PURE__ */ jsx15(
-        Text11,
+  const prettyReferenceId = creditLine.reference_id ? /* @__PURE__ */ jsx14(display_id_default, { id: creditLine.reference_id }) : null;
+  return /* @__PURE__ */ jsx14("div", { className: "divide-y", children: /* @__PURE__ */ jsxs14("div", { className: "grid grid-cols-[1fr_1fr_20px] items-center gap-x-4 px-6 py-4 text-ui-fg-subtle sm:grid-cols-[1fr_1fr_1fr_20px]", children: [
+    /* @__PURE__ */ jsxs14("div", { className: "w-full min-w-[60px] overflow-hidden", children: [
+      /* @__PURE__ */ jsx14(
+        Text10,
         {
           size: "small",
           leading: "compact",
           weight: "plus",
           className: "truncate",
-          children: /* @__PURE__ */ jsx15(display_id_default, { id: creditLine.id })
+          children: /* @__PURE__ */ jsx14(display_id_default, { id: creditLine.id })
         }
       ),
-      /* @__PURE__ */ jsx15(Text11, { size: "small", leading: "compact", children: creditLine.created_at ? format2(
+      /* @__PURE__ */ jsx14(Text10, { size: "small", leading: "compact", children: creditLine.created_at ? format2(
         new Date(creditLine.created_at),
         "dd MMM, yyyy, HH:mm:ss"
       ) : "-" })
     ] }),
-    /* @__PURE__ */ jsx15("div", { className: "hidden items-center justify-end sm:flex", children: /* @__PURE__ */ jsxs15(Text11, { size: "small", leading: "compact", className: "capitalize", children: [
+    /* @__PURE__ */ jsx14("div", { className: "hidden items-center justify-end sm:flex", children: /* @__PURE__ */ jsxs14(Text10, { size: "small", leading: "compact", className: "capitalize", children: [
       prettyReference,
       " (",
       prettyReferenceId,
       ")"
     ] }) }),
-    /* @__PURE__ */ jsx15("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsx15(Text11, { size: "small", leading: "compact", children: getLocaleAmount(creditLine.amount, currencyCode) }) })
+    /* @__PURE__ */ jsx14("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsx14(Text10, { size: "small", leading: "compact", children: getLocaleAmount(creditLine.amount, currencyCode) }) })
   ] }) });
 };
 var PaymentBreakdown = ({
@@ -2350,7 +2327,7 @@ var PaymentBreakdown = ({
     }
     return { event: entry, type };
   });
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx14(
     "div",
     {
       className: "flex flex-col divide-y",
@@ -2358,7 +2335,7 @@ var PaymentBreakdown = ({
       children: entries.map(({ type, event }) => {
         switch (type) {
           case "payment":
-            return /* @__PURE__ */ jsx15(
+            return /* @__PURE__ */ jsx14(
               Payment,
               {
                 order,
@@ -2371,7 +2348,7 @@ var PaymentBreakdown = ({
               event.id
             );
           case "refund":
-            return /* @__PURE__ */ jsx15(
+            return /* @__PURE__ */ jsx14(
               Refund,
               {
                 refund: event,
@@ -2380,7 +2357,7 @@ var PaymentBreakdown = ({
               event.id
             );
           case "credit_line_refund":
-            return /* @__PURE__ */ jsx15(
+            return /* @__PURE__ */ jsx14(
               CreditLine,
               {
                 creditLine: event,
@@ -2394,36 +2371,36 @@ var PaymentBreakdown = ({
   );
 };
 var Total = ({ order }) => {
-  const { t } = useTranslation15();
+  const { t } = useTranslation14();
   const totalPending = getTotalPending(order.payment_collections);
-  return /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsxs14(
     "div",
     {
       className: "flex flex-col gap-y-4 px-6 py-4",
       "data-testid": "order-payment-total",
       children: [
-        /* @__PURE__ */ jsxs15(
+        /* @__PURE__ */ jsxs14(
           "div",
           {
             className: "flex items-center justify-between",
             "data-testid": "order-payment-total-paid",
             children: [
-              /* @__PURE__ */ jsx15(Text11, { size: "small", weight: "plus", leading: "compact", children: t("orders.payment.totalPaidByCustomer") }),
-              /* @__PURE__ */ jsx15(Text11, { size: "small", weight: "plus", leading: "compact", children: getStylizedAmount(
+              /* @__PURE__ */ jsx14(Text10, { size: "small", weight: "plus", leading: "compact", children: t("orders.payment.totalPaidByCustomer") }),
+              /* @__PURE__ */ jsx14(Text10, { size: "small", weight: "plus", leading: "compact", children: getStylizedAmount(
                 getTotalCaptured(order.payment_collections),
                 order.currency_code
               ) })
             ]
           }
         ),
-        order.status !== "canceled" && totalPending > 0 && /* @__PURE__ */ jsxs15(
+        order.status !== "canceled" && totalPending > 0 && /* @__PURE__ */ jsxs14(
           "div",
           {
             className: "flex items-center justify-between",
             "data-testid": "order-payment-total-pending",
             children: [
-              /* @__PURE__ */ jsx15(Text11, { size: "small", weight: "plus", leading: "compact", children: t("orders.payment.totalPending") }),
-              /* @__PURE__ */ jsx15(Text11, { size: "small", weight: "plus", leading: "compact", children: getStylizedAmount(totalPending, order.currency_code) })
+              /* @__PURE__ */ jsx14(Text10, { size: "small", weight: "plus", leading: "compact", children: t("orders.payment.totalPending") }),
+              /* @__PURE__ */ jsx14(Text10, { size: "small", weight: "plus", leading: "compact", children: getStylizedAmount(totalPending, order.currency_code) })
             ]
           }
         )
@@ -2433,8 +2410,8 @@ var Total = ({ order }) => {
 };
 
 // src/pages/orders/order-detail/components/order-summary-section/order-summary-section.tsx
-import { useMemo as useMemo4, useState as useState6 } from "react";
-import { useTranslation as useTranslation18 } from "react-i18next";
+import { useMemo as useMemo3, useState as useState6 } from "react";
+import { useTranslation as useTranslation17 } from "react-i18next";
 import { Link as Link3 } from "react-router-dom";
 import {
   ArrowDownRightMini as ArrowDownRightMini2,
@@ -2449,15 +2426,16 @@ import {
   Badge as Badge4,
   Button as Button7,
   clx as clx3,
-  Container as Container11,
+  Container as Container10,
   Copy as Copy5,
-  Heading as Heading11,
+  Heading as Heading10,
   StatusBadge as StatusBadge4,
-  Text as Text13,
+  Text as Text12,
   toast as toast9,
   Tooltip as Tooltip6,
   usePrompt as usePrompt4
 } from "@medusajs/ui";
+import { DisplayExtensionZone as DisplayExtensionZone5 } from "@mercurjs/dashboard-shared";
 import { format as format3 } from "date-fns";
 
 // src/lib/credit-line.ts
@@ -2468,12 +2446,12 @@ var getTotalCreditLines = (creditLines) => creditLines.reduce((acc, creditLine)
 
 // src/pages/orders/order-detail/components/order-summary-section/return-info-popover.tsx
 import { InformationCircleSolid } from "@medusajs/icons";
-import { Badge as Badge2, Popover as Popover3, Text as Text12 } from "@medusajs/ui";
+import { Badge as Badge2, Popover as Popover3, Text as Text11 } from "@medusajs/ui";
 import { useState as useState5 } from "react";
-import { useTranslation as useTranslation16 } from "react-i18next";
-import { jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
+import { useTranslation as useTranslation15 } from "react-i18next";
+import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
 function ReturnInfoPopover({ orderReturn }) {
-  const { t } = useTranslation16();
+  const { t } = useTranslation15();
   const [open, setOpen] = useState5(false);
   const { getFullDate } = useDate();
   const handleMouseEnter = () => {
@@ -2495,36 +2473,36 @@ function ReturnInfoPopover({ orderReturn }) {
   if (typeof orderReturn !== "object") {
     return;
   }
-  return /* @__PURE__ */ jsxs16(Popover3, { open, children: [
-    /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs15(Popover3, { open, children: [
+    /* @__PURE__ */ jsx15(
       Popover3.Trigger,
       {
         onMouseEnter: handleMouseEnter,
         onMouseLeave: handleMouseLeave,
         autoFocus: false,
         className: "align-sub focus-visible:outline-none",
-        children: /* @__PURE__ */ jsx16(InformationCircleSolid, {})
+        children: /* @__PURE__ */ jsx15(InformationCircleSolid, {})
       }
     ),
-    /* @__PURE__ */ jsx16(
+    /* @__PURE__ */ jsx15(
       Popover3.Content,
       {
         align: "center",
         side: "top",
         className: "bg-ui-bg-component p-2 focus-visible:outline-none",
-        children: /* @__PURE__ */ jsxs16("div", { className: "", children: [
-          /* @__PURE__ */ jsxs16(Badge2, { size: "2xsmall", className: "mb-2", rounded: "full", children: [
+        children: /* @__PURE__ */ jsxs15("div", { className: "", children: [
+          /* @__PURE__ */ jsxs15(Badge2, { size: "2xsmall", className: "mb-2", rounded: "full", children: [
             returnType,
             ": #",
             returnTypeId.slice(-7)
           ] }),
-          /* @__PURE__ */ jsxs16(Text12, { size: "xsmall", children: [
-            /* @__PURE__ */ jsx16("span", { className: "text-ui-fg-subtle", children: t(`orders.returns.returnRequested`) }),
+          /* @__PURE__ */ jsxs15(Text11, { size: "xsmall", children: [
+            /* @__PURE__ */ jsx15("span", { className: "text-ui-fg-subtle", children: t(`orders.returns.returnRequested`) }),
             " \xB7 ",
             getFullDate({ date: orderReturn.requested_at, includeTime: true })
           ] }),
-          /* @__PURE__ */ jsxs16(Text12, { size: "xsmall", children: [
-            /* @__PURE__ */ jsx16("span", { className: "text-ui-fg-subtle", children: t(`orders.returns.itemReceived`) }),
+          /* @__PURE__ */ jsxs15(Text11, { size: "xsmall", children: [
+            /* @__PURE__ */ jsx15("span", { className: "text-ui-fg-subtle", children: t(`orders.returns.itemReceived`) }),
             " \xB7 ",
             orderReturn.received_at ? getFullDate({
               date: orderReturn.received_at,
@@ -2541,10 +2519,10 @@ var return_info_popover_default = ReturnInfoPopover;
 // src/pages/orders/order-detail/components/order-summary-section/shipping-info-popover.tsx
 import { InformationCircleSolid as InformationCircleSolid2 } from "@medusajs/icons";
 import { Badge as Badge3, Tooltip as Tooltip5 } from "@medusajs/ui";
-import { useTranslation as useTranslation17 } from "react-i18next";
-import { jsx as jsx17, jsxs as jsxs17 } from "react/jsx-runtime";
+import { useTranslation as useTranslation16 } from "react-i18next";
+import { jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
 function ShippingInfoPopover({ shippingMethod }) {
-  const { t } = useTranslation17();
+  const { t } = useTranslation16();
   const shippingDetail = shippingMethod?.detail;
   if (!shippingDetail) {
     return;
@@ -2562,24 +2540,24 @@ function ShippingInfoPopover({ shippingMethod }) {
   if (!rmaId) {
     return;
   }
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx16(
     Tooltip5,
     {
-      content: /* @__PURE__ */ jsxs17(Badge3, { size: "2xsmall", rounded: "full", children: [
+      content: /* @__PURE__ */ jsxs16(Badge3, { size: "2xsmall", rounded: "full", children: [
         rmaType,
         ": #",
         rmaId.slice(-7)
       ] }),
-      children: /* @__PURE__ */ jsx17(InformationCircleSolid2, { className: "inline-block text-ui-fg-muted ml-1" })
+      children: /* @__PURE__ */ jsx16(InformationCircleSolid2, { className: "inline-block text-ui-fg-muted ml-1" })
     }
   );
 }
 var shipping_info_popover_default = ShippingInfoPopover;
 
 // src/pages/orders/order-detail/components/order-summary-section/order-summary-section.tsx
-import { Fragment as Fragment3, jsx as jsx18, jsxs as jsxs18 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx17, jsxs as jsxs17 } from "react/jsx-runtime";
 var OrderSummarySection = ({ order }) => {
-  const { t } = useTranslation18();
+  const { t } = useTranslation17();
   const prompt = usePrompt4();
   const { reservations } = useReservationItems(
     {
@@ -2638,24 +2616,24 @@ var OrderSummarySection = ({ order }) => {
       }
     );
   };
-  return /* @__PURE__ */ jsxs18(
-    Container11,
+  return /* @__PURE__ */ jsxs17(
+    Container10,
     {
       className: "divide-y p-0",
       "data-testid": "order-summary-section",
       children: [
-        /* @__PURE__ */ jsx18(Header3, { order, orderPreview }),
-        /* @__PURE__ */ jsx18(ItemBreakdown, { order, reservations }),
-        /* @__PURE__ */ jsx18(CostBreakdown, { order }),
-        /* @__PURE__ */ jsx18(DiscountAndTotalBreakdown, { order }),
-        /* @__PURE__ */ jsx18(Total2, { order }),
-        (showPayment || showRefund) && /* @__PURE__ */ jsxs18(
+        /* @__PURE__ */ jsx17(Header3, { order, orderPreview }),
+        /* @__PURE__ */ jsx17(ItemBreakdown, { order, reservations }),
+        /* @__PURE__ */ jsx17(CostBreakdown, { order }),
+        /* @__PURE__ */ jsx17(DiscountAndTotalBreakdown, { order }),
+        /* @__PURE__ */ jsx17(Total2, { order }),
+        (showPayment || showRefund) && /* @__PURE__ */ jsxs17(
           "div",
           {
             className: "bg-ui-bg-subtle flex items-center justify-end gap-x-2 rounded-b-xl px-4 py-4",
             "data-testid": "order-summary-actions",
             children: [
-              showPayment && /* @__PURE__ */ jsx18(
+              showPayment && /* @__PURE__ */ jsx17(
                 Button7,
                 {
                   size: "small",
@@ -2665,14 +2643,14 @@ var OrderSummarySection = ({ order }) => {
                   children: t("orders.payment.markAsPaid")
                 }
               ),
-              showRefund && /* @__PURE__ */ jsx18(
+              showRefund && /* @__PURE__ */ jsx17(
                 Button7,
                 {
                   size: "small",
                   variant: "secondary",
                   asChild: true,
                   "data-testid": "order-summary-refund-button",
-                  children: /* @__PURE__ */ jsx18(Link3, { to: `/orders/${order.id}/refund`, children: t("orders.payment.refundAmount", {
+                  children: /* @__PURE__ */ jsx17(Link3, { to: `/orders/${order.id}/refund`, children: t("orders.payment.refundAmount", {
                     amount: getStylizedAmount(
                       pendingDifference * -1,
                       order?.currency_code
@@ -2682,7 +2660,8 @@ var OrderSummarySection = ({ order }) => {
               )
             ]
           }
-        )
+        ),
+        /* @__PURE__ */ jsx17(DisplayExtensionZone5, { model: "order", zone: "summary", data: order })
       ]
     }
   );
@@ -2691,20 +2670,20 @@ var Header3 = ({
   order,
   orderPreview
 }) => {
-  const { t } = useTranslation18();
+  const { t } = useTranslation17();
   const shouldDisableReturn = order.items.every(
     (i) => !(getReturnableQuantity(i) > 0)
   );
   const isOrderEditActive = orderPreview?.order_change?.change_type === "edit";
   const isOrderEditPending = orderPreview?.order_change?.change_type === "edit" && orderPreview?.order_change?.status === "pending";
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs17(
     "div",
     {
       className: "flex items-center justify-between px-6 py-4",
       "data-testid": "order-summary-header",
       children: [
-        /* @__PURE__ */ jsx18(Heading11, { level: "h2", "data-testid": "order-summary-heading", children: t("fields.summary") }),
-        /* @__PURE__ */ jsx18(
+        /* @__PURE__ */ jsx17(Heading10, { level: "h2", "data-testid": "order-summary-heading", children: t("fields.summary") }),
+        /* @__PURE__ */ jsx17(
           ActionMenu,
           {
             groups: [
@@ -2715,7 +2694,7 @@ var Header3 = ({
                       isOrderEditPending ? "orders.summary.editOrderContinue" : "orders.summary.editOrder"
                     ),
                     to: `/orders/${order.id}/edits`,
-                    icon: /* @__PURE__ */ jsx18(PencilSquare, {}),
+                    icon: /* @__PURE__ */ jsx17(PencilSquare, {}),
                     disabled: order.status === "canceled" || orderPreview?.order_change && orderPreview?.order_change?.change_type !== "edit" || orderPreview?.order_change?.change_type === "edit" && orderPreview?.order_change?.status === "requested"
                   }
                 ]
@@ -2725,19 +2704,19 @@ var Header3 = ({
                   {
                     label: t("orders.returns.create"),
                     to: `/orders/${order.id}/returns`,
-                    icon: /* @__PURE__ */ jsx18(ArrowUturnLeft2, {}),
+                    icon: /* @__PURE__ */ jsx17(ArrowUturnLeft2, {}),
                     disabled: shouldDisableReturn || isOrderEditActive || !!orderPreview?.order_change?.exchange_id || !!orderPreview?.order_change?.claim_id
                   },
                   {
                     label: orderPreview?.order_change?.id && orderPreview?.order_change?.exchange_id ? t("orders.exchanges.manage") : t("orders.exchanges.create"),
                     to: `/orders/${order.id}/exchanges`,
-                    icon: /* @__PURE__ */ jsx18(ArrowPath3, {}),
+                    icon: /* @__PURE__ */ jsx17(ArrowPath3, {}),
                     disabled: shouldDisableReturn || isOrderEditActive || !!orderPreview?.order_change?.return_id && !orderPreview?.order_change?.exchange_id || !!orderPreview?.order_change?.claim_id
                   },
                   {
                     label: orderPreview?.order_change?.id && orderPreview?.order_change?.claim_id ? t("orders.claims.manage") : t("orders.claims.create"),
                     to: `/orders/${order.id}/claims`,
-                    icon: /* @__PURE__ */ jsx18(ExclamationCircle2, {}),
+                    icon: /* @__PURE__ */ jsx17(ExclamationCircle2, {}),
                     disabled: shouldDisableReturn || isOrderEditActive || !!orderPreview?.order_change?.return_id && !orderPreview?.order_change?.claim_id || !!orderPreview?.order_change?.exchange_id
                   }
                 ]
@@ -2758,30 +2737,30 @@ var Item = ({
   claims,
   exchanges
 }) => {
-  const { t } = useTranslation18();
+  const { t } = useTranslation17();
   const offerInventoryLinks = item.offer?.inventory_item_link ?? [];
   const isInventoryManaged = !!offerInventoryLinks.length;
   const hasInventoryKit = (item.variant?.inventory_items?.length || 0) > 1 || item.variant?.inventory_items?.some((i) => i.required_quantity > 1);
   const hasUnfulfilledItems = item.quantity - item.detail.fulfilled_quantity > 0;
   const offerSku = item.offer?.sku ?? null;
   const captionSku = offerSku ?? item.variant_sku ?? null;
-  return /* @__PURE__ */ jsxs18(Fragment3, { children: [
-    /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs17(Fragment3, { children: [
+    /* @__PURE__ */ jsxs17(
       "div",
       {
         className: "text-ui-fg-subtle grid grid-cols-2 items-center gap-x-4 px-6 py-4",
         "data-testid": `order-summary-item-${item.id}`,
         children: [
-          /* @__PURE__ */ jsxs18(
+          /* @__PURE__ */ jsxs17(
             "div",
             {
               className: "flex items-start gap-x-4",
               "data-testid": `order-summary-item-${item.id}-info`,
               children: [
-                /* @__PURE__ */ jsx18(Thumbnail, { src: item.thumbnail }),
-                /* @__PURE__ */ jsxs18("div", { children: [
-                  /* @__PURE__ */ jsx18(
-                    Text13,
+                /* @__PURE__ */ jsx17(Thumbnail, { src: item.thumbnail }),
+                /* @__PURE__ */ jsxs17("div", { children: [
+                  /* @__PURE__ */ jsx17(
+                    Text12,
                     {
                       size: "small",
                       leading: "compact",
@@ -2790,19 +2769,19 @@ var Item = ({
                       children: item.title
                     }
                   ),
-                  captionSku && /* @__PURE__ */ jsxs18(
+                  captionSku && /* @__PURE__ */ jsxs17(
                     "div",
                     {
                       className: "flex items-center gap-x-1",
                       "data-testid": `order-summary-item-${item.id}-sku`,
                       children: [
-                        /* @__PURE__ */ jsx18(Text13, { size: "small", children: captionSku }),
-                        /* @__PURE__ */ jsx18(Copy5, { content: captionSku, className: "text-ui-fg-muted" })
+                        /* @__PURE__ */ jsx17(Text12, { size: "small", children: captionSku }),
+                        /* @__PURE__ */ jsx17(Copy5, { content: captionSku, className: "text-ui-fg-muted" })
                       ]
                     }
                   ),
-                  /* @__PURE__ */ jsx18(
-                    Text13,
+                  /* @__PURE__ */ jsx17(
+                    Text12,
                     {
                       size: "small",
                       "data-testid": `order-summary-item-${item.id}-options`,
@@ -2813,31 +2792,31 @@ var Item = ({
               ]
             }
           ),
-          /* @__PURE__ */ jsxs18(
+          /* @__PURE__ */ jsxs17(
             "div",
             {
               className: "grid grid-cols-3 items-center gap-x-4",
               "data-testid": `order-summary-item-${item.id}-pricing`,
               children: [
-                /* @__PURE__ */ jsx18("div", { className: "flex items-center justify-end gap-x-4", children: /* @__PURE__ */ jsx18(
-                  Text13,
+                /* @__PURE__ */ jsx17("div", { className: "flex items-center justify-end gap-x-4", children: /* @__PURE__ */ jsx17(
+                  Text12,
                   {
                     size: "small",
                     "data-testid": `order-summary-item-${item.id}-unit-price`,
                     children: getLocaleAmount(item.unit_price, currencyCode)
                   }
                 ) }),
-                /* @__PURE__ */ jsxs18(
+                /* @__PURE__ */ jsxs17(
                   "div",
                   {
                     className: "flex items-center gap-x-2",
                     "data-testid": `order-summary-item-${item.id}-quantity`,
                     children: [
-                      /* @__PURE__ */ jsx18("div", { className: "w-fit min-w-[27px]", children: /* @__PURE__ */ jsxs18(Text13, { size: "small", children: [
-                        /* @__PURE__ */ jsx18("span", { className: "tabular-nums", children: item.quantity }),
+                      /* @__PURE__ */ jsx17("div", { className: "w-fit min-w-[27px]", children: /* @__PURE__ */ jsxs17(Text12, { size: "small", children: [
+                        /* @__PURE__ */ jsx17("span", { className: "tabular-nums", children: item.quantity }),
                         "x"
                       ] }) }),
-                      /* @__PURE__ */ jsx18("div", { className: "overflow-visible", children: isInventoryManaged && hasUnfulfilledItems && /* @__PURE__ */ jsx18(
+                      /* @__PURE__ */ jsx17("div", { className: "overflow-visible", children: isInventoryManaged && hasUnfulfilledItems && /* @__PURE__ */ jsx17(
                         StatusBadge4,
                         {
                           color: reservation ? "green" : "orange",
@@ -2849,8 +2828,8 @@ var Item = ({
                     ]
                   }
                 ),
-                /* @__PURE__ */ jsx18("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsx18(
-                  Text13,
+                /* @__PURE__ */ jsx17("div", { className: "flex items-center justify-end", children: /* @__PURE__ */ jsx17(
+                  Text12,
                   {
                     size: "small",
                     className: "pt-[1px]",
@@ -2865,10 +2844,10 @@ var Item = ({
       },
       item.id
     ),
-    hasInventoryKit && /* @__PURE__ */ jsx18(InventoryKitBreakdown, { item }),
-    returns.map((r) => /* @__PURE__ */ jsx18(ReturnBreakdown, { orderReturn: r, itemId: item.id }, r.id)),
-    claims.map((claim) => /* @__PURE__ */ jsx18(ClaimBreakdown, { claim, itemId: item.id }, claim.id)),
-    exchanges.map((exchange) => /* @__PURE__ */ jsx18(
+    hasInventoryKit && /* @__PURE__ */ jsx17(InventoryKitBreakdown, { item }),
+    returns.map((r) => /* @__PURE__ */ jsx17(ReturnBreakdown, { orderReturn: r, itemId: item.id }, r.id)),
+    claims.map((claim) => /* @__PURE__ */ jsx17(ClaimBreakdown, { claim, itemId: item.id }, claim.id)),
+    exchanges.map((exchange) => /* @__PURE__ */ jsx17(
       ExchangeBreakdown,
       {
         exchange,
@@ -2894,13 +2873,13 @@ var ItemBreakdown = ({
     order_id: order.id,
     fields: "*items,*items.reason"
   });
-  const reservationsMap = useMemo4(
+  const reservationsMap = useMemo3(
     () => new Map((reservations || []).map((r) => [r.line_item_id, r])),
     [reservations]
   );
-  return /* @__PURE__ */ jsx18("div", { "data-testid": "order-summary-items-breakdown", children: order.items?.map((item) => {
+  return /* @__PURE__ */ jsx17("div", { "data-testid": "order-summary-items-breakdown", children: order.items?.map((item) => {
     const reservation = reservationsMap.get(item.id);
-    return /* @__PURE__ */ jsx18(
+    return /* @__PURE__ */ jsx17(
       Item,
       {
         item,
@@ -2919,22 +2898,36 @@ var Cost = ({
   value,
   secondaryValue,
   tooltip
-}) => /* @__PURE__ */ jsxs18("div", { className: "grid grid-cols-3 items-center", children: [
-  /* @__PURE__ */ jsxs18(Text13, { size: "small", leading: "compact", children: [
+}) => /* @__PURE__ */ jsxs17("div", { className: "grid grid-cols-3 items-center", children: [
+  /* @__PURE__ */ jsxs17(Text12, { size: "small", leading: "compact", children: [
     label,
     " ",
     tooltip
   ] }),
-  /* @__PURE__ */ jsx18("div", { className: "text-right", children: /* @__PURE__ */ jsx18(Text13, { size: "small", leading: "compact", children: secondaryValue }) }),
-  /* @__PURE__ */ jsx18("div", { className: "text-right", children: /* @__PURE__ */ jsx18(Text13, { size: "small", leading: "compact", children: value }) })
+  /* @__PURE__ */ jsx17("div", { className: "text-right", children: /* @__PURE__ */ jsx17(Text12, { size: "small", leading: "compact", children: secondaryValue }) }),
+  /* @__PURE__ */ jsx17("div", { className: "text-right", children: /* @__PURE__ */ jsx17(Text12, { size: "small", leading: "compact", children: value }) })
 ] });
 var CostBreakdown = ({
   order
 }) => {
-  const { t } = useTranslation18();
+  const { t } = useTranslation17();
   const [isTaxOpen, setIsTaxOpen] = useState6(false);
   const [isShippingOpen, setIsShippingOpen] = useState6(false);
-  const taxCodes = useMemo4(() => {
+  const [isCommissionOpen, setIsCommissionOpen] = useState6(false);
+  const { commission_lines } = useOrderCommissionLines(order.id);
+  const hasCommission = commission_lines.length > 0;
+  const commissionTotal = commission_lines.reduce(
+    (acc, line) => acc + (line.amount ?? 0),
+    0
+  );
+  const commissionItemTitleById = useMemo3(() => {
+    const map = /* @__PURE__ */ new Map();
+    order.items?.forEach((item) => {
+      map.set(item.id, item.product_title ?? item.title);
+    });
+    return map;
+  }, [order.items]);
+  const taxCodes = useMemo3(() => {
     const taxCodeMap = {};
     order.items.forEach((item) => {
       item.tax_lines?.forEach((line) => {
@@ -2959,32 +2952,32 @@ var CostBreakdown = ({
     return taxCodeMap;
   }, [order]);
   const hasTaxes = !!Object.keys(taxCodes).length;
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs17(
     "div",
     {
       className: "text-ui-fg-subtle flex flex-col gap-y-2 px-6 py-4",
       "data-testid": "order-summary-cost-breakdown",
       children: [
-        /* @__PURE__ */ jsx18(
+        /* @__PURE__ */ jsx17(
           Cost,
           {
             label: t("orders.summary.itemSubtotal"),
             value: getLocaleAmount(order.item_subtotal, order.currency_code)
           }
         ),
-        /* @__PURE__ */ jsx18(
+        /* @__PURE__ */ jsx17(
           Cost,
           {
             label: (
               // oxlint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
-              /* @__PURE__ */ jsxs18(
+              /* @__PURE__ */ jsxs17(
                 "span",
                 {
                   onClick: () => setIsShippingOpen((o) => !o),
                   className: "flex cursor-pointer items-center gap-1",
                   children: [
-                    /* @__PURE__ */ jsx18("span", { children: t("orders.summary.shippingSubtotal") }),
-                    /* @__PURE__ */ jsx18(
+                    /* @__PURE__ */ jsx17("span", { children: t("orders.summary.shippingSubtotal") }),
+                    /* @__PURE__ */ jsx17(
                       TriangleDownMini,
                       {
                         style: {
@@ -2999,30 +2992,30 @@ var CostBreakdown = ({
             value: getLocaleAmount(order.shipping_subtotal, order.currency_code)
           }
         ),
-        isShippingOpen && /* @__PURE__ */ jsx18("div", { className: "flex flex-col gap-1 pl-5", children: (order.shipping_methods || []).sort(
+        isShippingOpen && /* @__PURE__ */ jsx17("div", { className: "flex flex-col gap-1 pl-5", children: (order.shipping_methods || []).sort(
           (m1, m2) => m1.created_at.localeCompare(m2.created_at)
         ).map((sm, i) => {
-          return /* @__PURE__ */ jsxs18(
+          return /* @__PURE__ */ jsxs17(
             "div",
             {
               className: "flex items-center justify-between gap-x-2",
               children: [
-                /* @__PURE__ */ jsx18("div", { children: /* @__PURE__ */ jsxs18("span", { className: "txt-small", children: [
+                /* @__PURE__ */ jsx17("div", { children: /* @__PURE__ */ jsxs17("span", { className: "txt-small", children: [
                   sm.name,
                   sm.detail.return_id && ` (${t("fields.returnShipping")})`,
                   " ",
-                  /* @__PURE__ */ jsx18(shipping_info_popover_default, { shippingMethod: sm }, i)
+                  /* @__PURE__ */ jsx17(shipping_info_popover_default, { shippingMethod: sm }, i)
                 ] }) }),
-                /* @__PURE__ */ jsx18("div", { className: "relative flex-1", children: /* @__PURE__ */ jsx18("div", { className: "bottom-[calc(50% - 2px)] absolute h-[1px] w-full border-b border-dashed" }) }),
-                /* @__PURE__ */ jsx18("span", { className: "txt-small text-ui-fg-muted", children: getLocaleAmount(sm.subtotal, order.currency_code) })
+                /* @__PURE__ */ jsx17("div", { className: "relative flex-1", children: /* @__PURE__ */ jsx17("div", { className: "bottom-[calc(50% - 2px)] absolute h-[1px] w-full border-b border-dashed" }) }),
+                /* @__PURE__ */ jsx17("span", { className: "txt-small text-ui-fg-muted", children: getLocaleAmount(sm.subtotal, order.currency_code) })
               ]
             },
             sm.id
           );
         }) }),
-        /* @__PURE__ */ jsxs18(Fragment3, { children: [
-          /* @__PURE__ */ jsxs18("div", { className: "flex justify-between", children: [
-            /* @__PURE__ */ jsxs18(
+        /* @__PURE__ */ jsxs17(Fragment3, { children: [
+          /* @__PURE__ */ jsxs17("div", { className: "flex justify-between", children: [
+            /* @__PURE__ */ jsxs17(
               "div",
               {
                 onClick: () => hasTaxes && setIsTaxOpen((o) => !o),
@@ -3030,8 +3023,8 @@ var CostBreakdown = ({
                   "cursor-pointer": hasTaxes
                 }),
                 children: [
-                  /* @__PURE__ */ jsx18("span", { className: "txt-small select-none", children: t("orders.summary.taxTotal") }),
-                  hasTaxes && /* @__PURE__ */ jsx18(
+                  /* @__PURE__ */ jsx17("span", { className: "txt-small select-none", children: t("orders.summary.taxTotal") }),
+                  hasTaxes && /* @__PURE__ */ jsx17(
                     TriangleDownMini,
                     {
                       style: {
@@ -3042,34 +3035,72 @@ var CostBreakdown = ({
                 ]
               }
             ),
-            /* @__PURE__ */ jsx18("div", { className: "text-right", children: /* @__PURE__ */ jsx18(Text13, { size: "small", leading: "compact", children: getLocaleAmount(order.original_tax_total, order.currency_code) }) })
+            /* @__PURE__ */ jsx17("div", { className: "text-right", children: /* @__PURE__ */ jsx17(Text12, { size: "small", leading: "compact", children: getLocaleAmount(order.original_tax_total, order.currency_code) }) })
           ] }),
-          isTaxOpen && /* @__PURE__ */ jsx18("div", { className: "flex flex-col gap-1 pl-5", children: Object.entries(taxCodes).map(([code, { total, rate }]) => {
-            return /* @__PURE__ */ jsxs18(
+          isTaxOpen && /* @__PURE__ */ jsx17("div", { className: "flex flex-col gap-1 pl-5", children: Object.entries(taxCodes).map(([code, { total, rate }]) => {
+            return /* @__PURE__ */ jsxs17(
               "div",
               {
                 className: "flex items-center justify-between gap-x-2",
                 children: [
-                  /* @__PURE__ */ jsxs18("div", { className: "flex gap-1", children: [
-                    /* @__PURE__ */ jsx18("span", { className: "txt-small", children: code }),
-                    /* @__PURE__ */ jsxs18("span", { className: "txt-small", children: [
+                  /* @__PURE__ */ jsxs17("div", { className: "flex gap-1", children: [
+                    /* @__PURE__ */ jsx17("span", { className: "txt-small", children: code }),
+                    /* @__PURE__ */ jsxs17("span", { className: "txt-small", children: [
                       "(",
                       formatPercentage(rate),
                       ")"
                     ] })
                   ] }),
-                  /* @__PURE__ */ jsx18("div", { className: "relative flex-1", children: /* @__PURE__ */ jsx18("div", { className: "bottom-[calc(50% - 2px)] absolute h-[1px] w-full border-b border-dashed" }) }),
-                  /* @__PURE__ */ jsx18("span", { className: "txt-small text-ui-fg-muted", children: getLocaleAmount(total, order.currency_code) })
+                  /* @__PURE__ */ jsx17("div", { className: "relative flex-1", children: /* @__PURE__ */ jsx17("div", { className: "bottom-[calc(50% - 2px)] absolute h-[1px] w-full border-b border-dashed" }) }),
+                  /* @__PURE__ */ jsx17("span", { className: "txt-small text-ui-fg-muted", children: getLocaleAmount(total, order.currency_code) })
                 ]
               },
               code
             );
           }) })
         ] }),
-        /* @__PURE__ */ jsxs18("div", { className: "text-ui-fg-base flex items-center justify-between", children: [
-          /* @__PURE__ */ jsx18(Text13, { className: "text-ui-fg-subtle", size: "small", leading: "compact", children: t("fields.total") }),
-          /* @__PURE__ */ jsx18(
-            Text13,
+        hasCommission && /* @__PURE__ */ jsxs17(Fragment3, { children: [
+          /* @__PURE__ */ jsxs17("div", { className: "flex justify-between", children: [
+            /* @__PURE__ */ jsxs17(
+              "div",
+              {
+                onClick: () => setIsCommissionOpen((o) => !o),
+                className: "flex cursor-pointer items-center gap-1",
+                children: [
+                  /* @__PURE__ */ jsx17("span", { className: "txt-small select-none", children: t("fields.commission") }),
+                  /* @__PURE__ */ jsx17(
+                    TriangleDownMini,
+                    {
+                      style: {
+                        transform: `rotate(${isCommissionOpen ? 0 : -90}deg)`
+                      }
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx17("div", { className: "text-right", children: /* @__PURE__ */ jsx17(Text12, { size: "small", leading: "compact", children: getLocaleAmount(commissionTotal, order.currency_code) }) })
+          ] }),
+          isCommissionOpen && /* @__PURE__ */ jsx17("div", { className: "flex flex-col gap-1 pl-5", children: commission_lines.map((line) => {
+            const label = line.shipping_method_id ? t("fields.shipping") : commissionItemTitleById.get(line.item_id ?? "") ?? line.code;
+            return /* @__PURE__ */ jsxs17(
+              "div",
+              {
+                className: "flex items-center justify-between gap-x-2",
+                children: [
+                  /* @__PURE__ */ jsx17("div", { children: /* @__PURE__ */ jsx17("span", { className: "txt-small", children: label }) }),
+                  /* @__PURE__ */ jsx17("div", { className: "relative flex-1", children: /* @__PURE__ */ jsx17("div", { className: "bottom-[calc(50% - 2px)] absolute h-[1px] w-full border-b border-dashed" }) }),
+                  /* @__PURE__ */ jsx17("span", { className: "txt-small text-ui-fg-muted", children: getLocaleAmount(line.amount, order.currency_code) })
+                ]
+              },
+              line.id
+            );
+          }) })
+        ] }),
+        /* @__PURE__ */ jsxs17("div", { className: "text-ui-fg-base flex items-center justify-between", children: [
+          /* @__PURE__ */ jsx17(Text12, { className: "text-ui-fg-subtle", size: "small", leading: "compact", children: t("fields.total") }),
+          /* @__PURE__ */ jsx17(
+            Text12,
             {
               className: "text-ui-fg-subtle text-bold",
               size: "small",
@@ -3085,11 +3116,11 @@ var CostBreakdown = ({
 var DiscountAndTotalBreakdown = ({
   order
 }) => {
-  const { t } = useTranslation18();
+  const { t } = useTranslation17();
   const [isDiscountOpen, setIsDiscountOpen] = useState6(false);
   const [isCreditLinesOpen, setIsCreditLinesOpen] = useState6(false);
   const creditLines = order.credit_lines ?? [];
-  const discounts = useMemo4(() => {
+  const discounts = useMemo3(() => {
     const discounts2 = [];
     if (order.item_discount_total) {
       discounts2.push({
@@ -3117,18 +3148,18 @@ var DiscountAndTotalBreakdown = ({
   }, [order]);
   const hasDiscount = discounts.length > 0;
   const hasCreditLines = creditLines.length > 0;
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs17(
     "div",
     {
       className: "text-ui-fg-subtle flex flex-col gap-y-2 px-6 py-4",
       "data-testid": "order-summary-discount-breakdown",
       children: [
-        /* @__PURE__ */ jsx18(
+        /* @__PURE__ */ jsx17(
           Cost,
           {
             label: (
               // oxlint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
-              /* @__PURE__ */ jsxs18(
+              /* @__PURE__ */ jsxs17(
                 "span",
                 {
                   onClick: () => hasDiscount && setIsDiscountOpen((o) => !o),
@@ -3137,8 +3168,8 @@ var DiscountAndTotalBreakdown = ({
                   }),
                   "data-testid": "order-summary-discount-toggle",
                   children: [
-                    /* @__PURE__ */ jsx18("span", { children: t("orders.summary.discountTotal") }),
-                    hasDiscount && /* @__PURE__ */ jsx18(
+                    /* @__PURE__ */ jsx17("span", { children: t("orders.summary.discountTotal") }),
+                    hasDiscount && /* @__PURE__ */ jsx17(
                       TriangleDownMini,
                       {
                         style: {
@@ -3153,41 +3184,41 @@ var DiscountAndTotalBreakdown = ({
             value: getLocaleAmount(order.discount_total, order.currency_code)
           }
         ),
-        isDiscountOpen && /* @__PURE__ */ jsx18("div", { className: "flex flex-col gap-1 pl-5", children: discounts.map(({ type, total, codes }) => {
-          return /* @__PURE__ */ jsxs18(
+        isDiscountOpen && /* @__PURE__ */ jsx17("div", { className: "flex flex-col gap-1 pl-5", children: discounts.map(({ type, total, codes }) => {
+          return /* @__PURE__ */ jsxs17(
             "div",
             {
               className: "flex items-center justify-between gap-x-2",
               children: [
-                /* @__PURE__ */ jsxs18("div", { className: "flex gap-1", children: [
-                  /* @__PURE__ */ jsx18("span", { className: "txt-small", children: t(`fields.${type}`) }),
-                  /* @__PURE__ */ jsxs18("span", { className: "txt-small", children: [
+                /* @__PURE__ */ jsxs17("div", { className: "flex gap-1", children: [
+                  /* @__PURE__ */ jsx17("span", { className: "txt-small", children: t(`fields.${type}`) }),
+                  /* @__PURE__ */ jsxs17("span", { className: "txt-small", children: [
                     "(",
                     codes.join(", "),
                     ")"
                   ] })
                 ] }),
-                /* @__PURE__ */ jsx18("div", { className: "relative flex-1", children: /* @__PURE__ */ jsx18("div", { className: "bottom-[calc(50% - 2px)] absolute h-[1px] w-full border-b border-dashed" }) }),
-                /* @__PURE__ */ jsx18("span", { className: "txt-small text-ui-fg-muted", children: getLocaleAmount(total, order.currency_code) })
+                /* @__PURE__ */ jsx17("div", { className: "relative flex-1", children: /* @__PURE__ */ jsx17("div", { className: "bottom-[calc(50% - 2px)] absolute h-[1px] w-full border-b border-dashed" }) }),
+                /* @__PURE__ */ jsx17("span", { className: "txt-small text-ui-fg-muted", children: getLocaleAmount(total, order.currency_code) })
               ]
             },
             type
           );
         }) }),
-        hasCreditLines && /* @__PURE__ */ jsxs18(Fragment3, { children: [
-          /* @__PURE__ */ jsx18(
+        hasCreditLines && /* @__PURE__ */ jsxs17(Fragment3, { children: [
+          /* @__PURE__ */ jsx17(
             Cost,
             {
               label: (
                 // oxlint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
-                /* @__PURE__ */ jsxs18(
+                /* @__PURE__ */ jsxs17(
                   "span",
                   {
                     onClick: () => setIsCreditLinesOpen((o) => !o),
                     className: "flex cursor-pointer items-center gap-1",
                     children: [
-                      /* @__PURE__ */ jsx18("span", { children: t("orders.creditLines.title") }),
-                      /* @__PURE__ */ jsx18(
+                      /* @__PURE__ */ jsx17("span", { children: t("orders.creditLines.title") }),
+                      /* @__PURE__ */ jsx17(
                         TriangleDownMini,
                         {
                           style: {
@@ -3205,34 +3236,34 @@ var DiscountAndTotalBreakdown = ({
               )
             }
           ),
-          isCreditLinesOpen && /* @__PURE__ */ jsx18("div", { className: "flex flex-col gap-1 pl-5", children: creditLines.map((creditLine) => {
+          isCreditLinesOpen && /* @__PURE__ */ jsx17("div", { className: "flex flex-col gap-1 pl-5", children: creditLines.map((creditLine) => {
             const prettyReference = creditLine.reference?.split("_").join(" ").split("-").join(" ");
-            return /* @__PURE__ */ jsxs18(
+            return /* @__PURE__ */ jsxs17(
               "div",
               {
                 className: "flex items-center justify-between gap-x-2",
                 children: [
-                  /* @__PURE__ */ jsxs18("div", { className: "flex items-center", children: [
-                    /* @__PURE__ */ jsx18(
-                      Text13,
+                  /* @__PURE__ */ jsxs17("div", { className: "flex items-center", children: [
+                    /* @__PURE__ */ jsx17(
+                      Text12,
                       {
                         size: "small",
                         leading: "compact",
                         weight: "plus",
                         className: "txt-small text-ui-fg-subtle font-medium",
-                        children: /* @__PURE__ */ jsx18(display_id_default, { id: creditLine.id })
+                        children: /* @__PURE__ */ jsx17(display_id_default, { id: creditLine.id })
                       }
                     ),
-                    /* @__PURE__ */ jsx18("span", { className: "txt-small text-ui-fg-subtle mx-1", children: "-" }),
-                    /* @__PURE__ */ jsx18(
+                    /* @__PURE__ */ jsx17("span", { className: "txt-small text-ui-fg-subtle mx-1", children: "-" }),
+                    /* @__PURE__ */ jsx17(
                       Tooltip6,
                       {
                         content: format3(
                           new Date(creditLine.created_at),
                           "dd MMM, yyyy, HH:mm:ss"
                         ),
-                        children: /* @__PURE__ */ jsx18(
-                          Text13,
+                        children: /* @__PURE__ */ jsx17(
+                          Text12,
                           {
                             size: "small",
                             leading: "compact",
@@ -3245,9 +3276,9 @@ var DiscountAndTotalBreakdown = ({
                         )
                       }
                     ),
-                    /* @__PURE__ */ jsx18("span", { className: "txt-small text-ui-fg-subtle mx-1", children: "-" }),
-                    /* @__PURE__ */ jsxs18(
-                      Text13,
+                    /* @__PURE__ */ jsx17("span", { className: "txt-small text-ui-fg-subtle mx-1", children: "-" }),
+                    /* @__PURE__ */ jsxs17(
+                      Text12,
                       {
                         size: "small",
                         leading: "compact",
@@ -3260,8 +3291,8 @@ var DiscountAndTotalBreakdown = ({
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ jsx18("div", { className: "relative flex-1", children: /* @__PURE__ */ jsx18("div", { className: "bottom-[calc(50% - 2px)] absolute h-[1px] w-full border-b border-dashed" }) }),
-                  /* @__PURE__ */ jsx18("span", { className: "txt-small text-ui-fg-muted", children: getLocaleAmount(
+                  /* @__PURE__ */ jsx17("div", { className: "relative flex-1", children: /* @__PURE__ */ jsx17("div", { className: "bottom-[calc(50% - 2px)] absolute h-[1px] w-full border-b border-dashed" }) }),
+                  /* @__PURE__ */ jsx17("span", { className: "txt-small text-ui-fg-muted", children: getLocaleAmount(
                     creditLine.amount,
                     order.currency_code
                   ) })
@@ -3271,10 +3302,10 @@ var DiscountAndTotalBreakdown = ({
             );
           }) })
         ] }),
-        /* @__PURE__ */ jsxs18("div", { className: "text-ui-fg-base flex items-center justify-between", children: [
-          /* @__PURE__ */ jsx18(Text13, { className: "text-ui-fg-subtle", size: "small", leading: "compact", children: t("orders.summary.totalAfterDiscount") }),
-          /* @__PURE__ */ jsx18(
-            Text13,
+        /* @__PURE__ */ jsxs17("div", { className: "text-ui-fg-base flex items-center justify-between", children: [
+          /* @__PURE__ */ jsx17(Text12, { className: "text-ui-fg-subtle", size: "small", leading: "compact", children: t("orders.summary.totalAfterDiscount") }),
+          /* @__PURE__ */ jsx17(
+            Text12,
             {
               className: "text-ui-fg-subtle text-bold",
               size: "small",
@@ -3288,17 +3319,17 @@ var DiscountAndTotalBreakdown = ({
   );
 };
 var InventoryKitBreakdown = ({ item }) => {
-  const { t } = useTranslation18();
+  const { t } = useTranslation17();
   const [isOpen, setIsOpen] = useState6(false);
   const inventory = item.variant?.inventory_items || [];
-  return /* @__PURE__ */ jsxs18(Fragment3, { children: [
-    /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs17(Fragment3, { children: [
+    /* @__PURE__ */ jsxs17(
       "div",
       {
         onClick: () => setIsOpen((o) => !o),
         className: "flex cursor-pointer items-center gap-2 border-t border-dashed px-6 py-4",
         children: [
-          /* @__PURE__ */ jsx18(
+          /* @__PURE__ */ jsx17(
             TriangleDownMini,
             {
               style: {
@@ -3306,26 +3337,26 @@ var InventoryKitBreakdown = ({ item }) => {
               }
             }
           ),
-          /* @__PURE__ */ jsx18("span", { className: "text-ui-fg-muted txt-small select-none", children: t("orders.summary.inventoryKit", { count: inventory.length }) })
+          /* @__PURE__ */ jsx17("span", { className: "text-ui-fg-muted txt-small select-none", children: t("orders.summary.inventoryKit", { count: inventory.length }) })
         ]
       }
     ),
-    isOpen && /* @__PURE__ */ jsx18("div", { className: "flex flex-col gap-1 px-6 pb-4", children: inventory.map((i) => {
-      return /* @__PURE__ */ jsxs18(
+    isOpen && /* @__PURE__ */ jsx17("div", { className: "flex flex-col gap-1 px-6 pb-4", children: inventory.map((i) => {
+      return /* @__PURE__ */ jsxs17(
         "div",
         {
           className: "flex items-center justify-between gap-x-2",
           children: [
-            /* @__PURE__ */ jsx18("div", { children: /* @__PURE__ */ jsxs18("span", { className: "txt-small text-ui-fg-subtle font-medium", children: [
+            /* @__PURE__ */ jsx17("div", { children: /* @__PURE__ */ jsxs17("span", { className: "txt-small text-ui-fg-subtle font-medium", children: [
               i.inventory.title,
-              i.inventory.sku && /* @__PURE__ */ jsxs18("span", { className: "text-ui-fg-subtle font-normal", children: [
+              i.inventory.sku && /* @__PURE__ */ jsxs17("span", { className: "text-ui-fg-subtle font-normal", children: [
                 " ",
                 "\u22C5 ",
                 i.inventory.sku
               ] })
             ] }) }),
-            /* @__PURE__ */ jsx18("div", { className: "relative flex-1", children: /* @__PURE__ */ jsx18("div", { className: "bottom-[calc(50% - 2px)] absolute h-[1px] w-full border-b border-dashed" }) }),
-            /* @__PURE__ */ jsxs18("span", { className: "txt-small text-ui-fg-muted", children: [
+            /* @__PURE__ */ jsx17("div", { className: "relative flex-1", children: /* @__PURE__ */ jsx17("div", { className: "bottom-[calc(50% - 2px)] absolute h-[1px] w-full border-b border-dashed" }) }),
+            /* @__PURE__ */ jsxs17("span", { className: "txt-small text-ui-fg-muted", children: [
               i.required_quantity,
               "x"
             ] })
@@ -3340,21 +3371,21 @@ var ReturnBreakdownWithDamages = ({
   orderReturn,
   itemId
 }) => {
-  const { t } = useTranslation18();
+  const { t } = useTranslation17();
   const item = orderReturn?.items?.find((ri) => ri.item_id === itemId);
   const damagedQuantity = item?.damaged_quantity || 0;
-  return item && /* @__PURE__ */ jsxs18(
+  return item && /* @__PURE__ */ jsxs17(
     "div",
     {
       className: "txt-compact-small-plus text-ui-fg-subtle bg-ui-bg-subtle flex flex-row justify-between gap-y-2 border-t-2 border-dotted px-6 py-4",
       children: [
-        /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx18(ArrowDownRightMini2, { className: "text-ui-fg-muted" }),
-          /* @__PURE__ */ jsx18(Text13, { size: "small", children: t(`orders.returns.damagedItemsReturned`, {
+        /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx17(ArrowDownRightMini2, { className: "text-ui-fg-muted" }),
+          /* @__PURE__ */ jsx17(Text12, { size: "small", children: t(`orders.returns.damagedItemsReturned`, {
             quantity: damagedQuantity
           }) }),
-          item?.note && /* @__PURE__ */ jsx18(Tooltip6, { content: item.note, children: /* @__PURE__ */ jsx18(DocumentText2, { className: "text-ui-tag-neutral-icon ml-1 inline" }) }),
-          item?.reason && /* @__PURE__ */ jsx18(
+          item?.note && /* @__PURE__ */ jsx17(Tooltip6, { content: item.note, children: /* @__PURE__ */ jsx17(DocumentText2, { className: "text-ui-tag-neutral-icon ml-1 inline" }) }),
+          item?.reason && /* @__PURE__ */ jsx17(
             Badge4,
             {
               size: "2xsmall",
@@ -3364,9 +3395,9 @@ var ReturnBreakdownWithDamages = ({
             }
           )
         ] }),
-        /* @__PURE__ */ jsxs18(Text13, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: [
+        /* @__PURE__ */ jsxs17(Text12, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: [
           t(`orders.returns.damagedItemReceived`),
-          /* @__PURE__ */ jsx18("span", { className: "ml-2", children: /* @__PURE__ */ jsx18(return_info_popover_default, { orderReturn }) })
+          /* @__PURE__ */ jsx17("span", { className: "ml-2", children: /* @__PURE__ */ jsx17(return_info_popover_default, { orderReturn }) })
         ] })
       ]
     },
@@ -3377,7 +3408,7 @@ var ReturnBreakdown = ({
   orderReturn,
   itemId
 }) => {
-  const { t } = useTranslation18();
+  const { t } = useTranslation17();
   const { getRelativeDate } = useDate();
   if (!["requested", "received", "partially_received"].includes(
     orderReturn.status || ""
@@ -3387,29 +3418,29 @@ var ReturnBreakdown = ({
   const isRequested = orderReturn.status === "requested";
   const item = orderReturn?.items?.find((ri) => ri.item_id === itemId);
   const damagedQuantity = item?.damaged_quantity || 0;
-  return item && /* @__PURE__ */ jsxs18(Fragment3, { children: [
-    damagedQuantity > 0 && /* @__PURE__ */ jsx18(
+  return item && /* @__PURE__ */ jsxs17(Fragment3, { children: [
+    damagedQuantity > 0 && /* @__PURE__ */ jsx17(
       ReturnBreakdownWithDamages,
       {
         orderReturn,
         itemId
       }
     ),
-    /* @__PURE__ */ jsxs18(
+    /* @__PURE__ */ jsxs17(
       "div",
       {
         className: "txt-compact-small-plus text-ui-fg-subtle bg-ui-bg-subtle flex flex-row justify-between gap-y-2 border-t-2 border-dotted px-6 py-4",
         children: [
-          /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx18(ArrowDownRightMini2, { className: "text-ui-fg-muted" }),
-            /* @__PURE__ */ jsx18(Text13, { size: "small", children: t(
+          /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx17(ArrowDownRightMini2, { className: "text-ui-fg-muted" }),
+            /* @__PURE__ */ jsx17(Text12, { size: "small", children: t(
               `orders.returns.${isRequested ? "returnRequestedInfo" : "returnReceivedInfo"}`,
               {
                 requestedItemsCount: item?.[isRequested ? "quantity" : "received_quantity"]
               }
             ) }),
-            item?.note && /* @__PURE__ */ jsx18(Tooltip6, { content: item.note, children: /* @__PURE__ */ jsx18(DocumentText2, { className: "text-ui-tag-neutral-icon ml-1 inline" }) }),
-            item?.reason && /* @__PURE__ */ jsx18(
+            item?.note && /* @__PURE__ */ jsx17(Tooltip6, { content: item.note, children: /* @__PURE__ */ jsx17(DocumentText2, { className: "text-ui-tag-neutral-icon ml-1 inline" }) }),
+            item?.reason && /* @__PURE__ */ jsx17(
               Badge4,
               {
                 size: "2xsmall",
@@ -3419,13 +3450,13 @@ var ReturnBreakdown = ({
               }
             )
           ] }),
-          orderReturn && isRequested && /* @__PURE__ */ jsxs18(Text13, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: [
+          orderReturn && isRequested && /* @__PURE__ */ jsxs17(Text12, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: [
             getRelativeDate(orderReturn.created_at),
-            /* @__PURE__ */ jsx18("span", { className: "ml-2", children: /* @__PURE__ */ jsx18(return_info_popover_default, { orderReturn }) })
+            /* @__PURE__ */ jsx17("span", { className: "ml-2", children: /* @__PURE__ */ jsx17(return_info_popover_default, { orderReturn }) })
           ] }),
-          orderReturn && !isRequested && /* @__PURE__ */ jsxs18(Text13, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: [
+          orderReturn && !isRequested && /* @__PURE__ */ jsxs17(Text12, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: [
             t(`orders.returns.itemReceived`),
-            /* @__PURE__ */ jsx18("span", { className: "ml-2", children: /* @__PURE__ */ jsx18(return_info_popover_default, { orderReturn }) })
+            /* @__PURE__ */ jsx17("span", { className: "ml-2", children: /* @__PURE__ */ jsx17(return_info_popover_default, { orderReturn }) })
           ] })
         ]
       },
@@ -3437,26 +3468,26 @@ var ClaimBreakdown = ({
   claim,
   itemId
 }) => {
-  const { t } = useTranslation18();
+  const { t } = useTranslation17();
   const { getRelativeDate } = useDate();
   const items = claim.additional_items.filter(
     (item) => item.item?.id === itemId
   );
-  return !!items.length && /* @__PURE__ */ jsxs18(
+  return !!items.length && /* @__PURE__ */ jsxs17(
     "div",
     {
       className: "txt-compact-small-plus text-ui-fg-subtle bg-ui-bg-subtle flex flex-row justify-between gap-y-2 border-b-2 border-t-2 border-dotted px-6 py-4",
       children: [
-        /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx18(ArrowDownRightMini2, { className: "text-ui-fg-muted" }),
-          /* @__PURE__ */ jsx18(Text13, { size: "small", children: t(`orders.claims.outboundItemAdded`, {
+        /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx17(ArrowDownRightMini2, { className: "text-ui-fg-muted" }),
+          /* @__PURE__ */ jsx17(Text12, { size: "small", children: t(`orders.claims.outboundItemAdded`, {
             itemsCount: items.reduce(
               (acc, item) => acc = acc + item.quantity,
               0
             )
           }) })
         ] }),
-        /* @__PURE__ */ jsx18(Text13, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: getRelativeDate(claim.created_at) })
+        /* @__PURE__ */ jsx17(Text12, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: getRelativeDate(claim.created_at) })
       ]
     },
     claim.id
@@ -3466,68 +3497,68 @@ var ExchangeBreakdown = ({
   exchange,
   itemId
 }) => {
-  const { t } = useTranslation18();
+  const { t } = useTranslation17();
   const { getRelativeDate } = useDate();
   const items = exchange.additional_items.filter(
     (item) => item?.item?.id === itemId
   );
-  return !!items.length && /* @__PURE__ */ jsxs18(
+  return !!items.length && /* @__PURE__ */ jsxs17(
     "div",
     {
       className: "txt-compact-small-plus text-ui-fg-subtle bg-ui-bg-subtle flex flex-row justify-between gap-y-2 border-b-2 border-t-2 border-dotted px-6 py-4",
       children: [
-        /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx18(ArrowDownRightMini2, { className: "text-ui-fg-muted" }),
-          /* @__PURE__ */ jsx18(Text13, { size: "small", children: t(`orders.exchanges.outboundItemAdded`, {
+        /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx17(ArrowDownRightMini2, { className: "text-ui-fg-muted" }),
+          /* @__PURE__ */ jsx17(Text12, { size: "small", children: t(`orders.exchanges.outboundItemAdded`, {
             itemsCount: items.reduce(
               (acc, item) => acc = acc + item.quantity,
               0
             )
           }) })
         ] }),
-        /* @__PURE__ */ jsx18(Text13, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: getRelativeDate(exchange.created_at) })
+        /* @__PURE__ */ jsx17(Text12, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: getRelativeDate(exchange.created_at) })
       ]
     },
     exchange.id
   );
 };
 var Total2 = ({ order }) => {
-  const { t } = useTranslation18();
-  return /* @__PURE__ */ jsxs18(
+  const { t } = useTranslation17();
+  return /* @__PURE__ */ jsxs17(
     "div",
     {
       className: " flex flex-col gap-y-2 px-6 py-4",
       "data-testid": "order-summary-total",
       children: [
-        /* @__PURE__ */ jsxs18(
+        /* @__PURE__ */ jsxs17(
           "div",
           {
             className: "text-ui-fg-base flex items-center justify-between",
             "data-testid": "order-summary-paid-total",
             children: [
-              /* @__PURE__ */ jsx18(Text13, { className: "text-ui-fg-subtle", size: "small", leading: "compact", children: t("fields.paidTotal") }),
-              /* @__PURE__ */ jsx18(Text13, { className: "text-ui-fg-subtle", size: "small", leading: "compact", children: getStylizedAmount(
+              /* @__PURE__ */ jsx17(Text12, { className: "text-ui-fg-subtle", size: "small", leading: "compact", children: t("fields.paidTotal") }),
+              /* @__PURE__ */ jsx17(Text12, { className: "text-ui-fg-subtle", size: "small", leading: "compact", children: getStylizedAmount(
                 getTotalCaptured(order.payment_collections || []),
                 order.currency_code
               ) })
             ]
           }
         ),
-        getTotalCreditLines(order.credit_lines ?? []) > 0 && /* @__PURE__ */ jsxs18("div", { className: "text-ui-fg-base flex items-center justify-between", children: [
-          /* @__PURE__ */ jsx18(Text13, { className: "text-ui-fg-subtle", size: "small", leading: "compact", children: t("fields.creditTotal") }),
-          /* @__PURE__ */ jsx18(Text13, { className: "text-ui-fg-subtle", size: "small", leading: "compact", children: getStylizedAmount(
+        getTotalCreditLines(order.credit_lines ?? []) > 0 && /* @__PURE__ */ jsxs17("div", { className: "text-ui-fg-base flex items-center justify-between", children: [
+          /* @__PURE__ */ jsx17(Text12, { className: "text-ui-fg-subtle", size: "small", leading: "compact", children: t("fields.creditTotal") }),
+          /* @__PURE__ */ jsx17(Text12, { className: "text-ui-fg-subtle", size: "small", leading: "compact", children: getStylizedAmount(
             getTotalCreditLines(order.credit_lines ?? []),
             order.currency_code
           ) })
         ] }),
-        /* @__PURE__ */ jsxs18(
+        /* @__PURE__ */ jsxs17(
           "div",
           {
             className: "text-ui-fg-base flex items-center justify-between",
             "data-testid": "order-summary-outstanding-amount",
             children: [
-              /* @__PURE__ */ jsx18(
-                Text13,
+              /* @__PURE__ */ jsx17(
+                Text12,
                 {
                   className: "text-ui-fg-subtle text-semibold",
                   size: "small",
@@ -3535,8 +3566,8 @@ var Total2 = ({ order }) => {
                   children: t("orders.returns.outstandingAmount")
                 }
               ),
-              /* @__PURE__ */ jsx18(
-                Text13,
+              /* @__PURE__ */ jsx17(
+                Text12,
                 {
                   className: "text-ui-fg-subtle text-bold",
                   size: "small",
@@ -3556,21 +3587,22 @@ var Total2 = ({ order }) => {
 };
 
 // src/pages/orders/order-detail/components/order-remaining-orders-group-section/order-remaining-orders-group-section.tsx
-import { Container as Container12, Heading as Heading12 } from "@medusajs/ui";
+import { Container as Container11, Heading as Heading11 } from "@medusajs/ui";
+import { DisplayExtensionZone as DisplayExtensionZone6 } from "@mercurjs/dashboard-shared";
 import { createColumnHelper } from "@tanstack/react-table";
-import { useMemo as useMemo5 } from "react";
-import { useTranslation as useTranslation19 } from "react-i18next";
+import { useMemo as useMemo4 } from "react";
+import { useTranslation as useTranslation18 } from "react-i18next";
 import { useParams } from "react-router-dom";
-import { jsx as jsx19, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs18 } from "react/jsx-runtime";
 var DEFAULT_FIELDS2 = "id,*orders,*orders.customer,*orders.seller,*orders.sales_channel";
 var OrderRemainingOrdersGroupSection = () => {
   const { id } = useParams();
-  const { t } = useTranslation19();
+  const { t } = useTranslation18();
   const { order_group, isLoading, isError, error } = useOrderGroupByOrderId(
     id,
     { fields: DEFAULT_FIELDS2 }
   );
-  const orders = useMemo5(() => {
+  const orders = useMemo4(() => {
     const group = order_group;
     if (!group?.orders) return [];
     return group.orders.filter((o) => o.id !== id);
@@ -3590,21 +3622,21 @@ var OrderRemainingOrdersGroupSection = () => {
   if (!isLoading && orders.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ jsxs19(
-    Container12,
+  return /* @__PURE__ */ jsxs18(
+    Container11,
     {
       className: "divide-y p-0",
       "data-testid": "order-remaining-orders-group-section",
       children: [
-        /* @__PURE__ */ jsx19(
+        /* @__PURE__ */ jsx18(
           "div",
           {
             className: "flex items-center justify-between px-6 py-4",
             "data-testid": "order-remaining-orders-group-header",
-            children: /* @__PURE__ */ jsx19(Heading12, { level: "h2", "data-testid": "order-remaining-orders-group-heading", children: t("orders.group.heading") })
+            children: /* @__PURE__ */ jsx18(Heading11, { level: "h2", "data-testid": "order-remaining-orders-group-heading", children: t("orders.group.heading") })
           }
         ),
-        /* @__PURE__ */ jsx19(
+        /* @__PURE__ */ jsx18(
           _DataTable,
           {
             columns,
@@ -3617,6 +3649,14 @@ var OrderRemainingOrdersGroupSection = () => {
               message: t("orders.group.noOtherOrders")
             }
           }
+        ),
+        /* @__PURE__ */ jsx18(
+          DisplayExtensionZone6,
+          {
+            model: "order",
+            zone: "order-group",
+            data: order_group
+          }
         )
       ]
     }
@@ -3624,35 +3664,35 @@ var OrderRemainingOrdersGroupSection = () => {
 };
 var columnHelper = createColumnHelper();
 var useColumns = () => {
-  return useMemo5(
+  return useMemo4(
     () => [
       columnHelper.accessor("display_id", {
-        header: () => /* @__PURE__ */ jsx19(DisplayIdHeader, {}),
-        cell: ({ getValue }) => /* @__PURE__ */ jsx19(DisplayIdCell, { displayId: getValue() })
+        header: () => /* @__PURE__ */ jsx18(DisplayIdHeader, {}),
+        cell: ({ getValue }) => /* @__PURE__ */ jsx18(DisplayIdCell, { displayId: getValue() })
       }),
       columnHelper.display({
         id: "seller",
-        header: () => /* @__PURE__ */ jsx19(TextHeader, { text: "Store" }),
+        header: () => /* @__PURE__ */ jsx18(TextHeader, { text: "Store" }),
         cell: ({ row }) => {
           const seller = row.original.seller;
-          return /* @__PURE__ */ jsx19(TextCell, { text: seller?.name ?? "-" });
+          return /* @__PURE__ */ jsx18(TextCell, { text: seller?.name ?? "-" });
         }
       }),
       columnHelper.accessor("created_at", {
-        header: () => /* @__PURE__ */ jsx19(DateHeader, {}),
-        cell: ({ getValue }) => /* @__PURE__ */ jsx19(DateCell, { date: new Date(getValue()) })
+        header: () => /* @__PURE__ */ jsx18(DateHeader, {}),
+        cell: ({ getValue }) => /* @__PURE__ */ jsx18(DateCell, { date: new Date(getValue()) })
       }),
       columnHelper.accessor("payment_status", {
-        header: () => /* @__PURE__ */ jsx19(PaymentStatusHeader, {}),
-        cell: ({ getValue }) => /* @__PURE__ */ jsx19(PaymentStatusCell, { status: getValue() })
+        header: () => /* @__PURE__ */ jsx18(PaymentStatusHeader, {}),
+        cell: ({ getValue }) => /* @__PURE__ */ jsx18(PaymentStatusCell, { status: getValue() })
       }),
       columnHelper.accessor("fulfillment_status", {
-        header: () => /* @__PURE__ */ jsx19(FulfillmentStatusHeader, {}),
-        cell: ({ getValue }) => /* @__PURE__ */ jsx19(FulfillmentStatusCell, { status: getValue() })
+        header: () => /* @__PURE__ */ jsx18(FulfillmentStatusHeader, {}),
+        cell: ({ getValue }) => /* @__PURE__ */ jsx18(FulfillmentStatusCell, { status: getValue() })
       }),
       columnHelper.accessor("total", {
-        header: () => /* @__PURE__ */ jsx19(TotalHeader, {}),
-        cell: ({ getValue, row }) => /* @__PURE__ */ jsx19(
+        header: () => /* @__PURE__ */ jsx18(TotalHeader, {}),
+        cell: ({ getValue, row }) => /* @__PURE__ */ jsx18(
           TotalCell,
           {
             currencyCode: row.original.currency_code,
@@ -3666,15 +3706,14 @@ var useColumns = () => {
 };
 
 // src/pages/orders/order-detail/order-detail.tsx
-import { jsx as jsx20, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs19 } from "react/jsx-runtime";
 var Root = ({ children }) => {
   const initialData = useLoaderData();
   const { id } = useParams2();
+  const query = useLinkQuery("order", DEFAULT_FIELDS);
   const { order: rawOrder, isLoading, isError, error } = useOrder(
     id,
-    {
-      fields: DEFAULT_FIELDS
-    },
+    query,
     {
       initialData
     }
@@ -3695,12 +3734,12 @@ var Root = ({ children }) => {
     id
   );
   if (isLoading || !order || isPreviewLoading) {
-    return /* @__PURE__ */ jsx20(TwoColumnPageSkeleton, { mainSections: 4, sidebarSections: 2, showJSON: true });
+    return /* @__PURE__ */ jsx19(TwoColumnPageSkeleton, { mainSections: 4, sidebarSections: 2, showJSON: true });
   }
   if (isError) {
     throw error;
   }
-  return Children.count(children) > 0 ? /* @__PURE__ */ jsx20(
+  return Children.count(children) > 0 ? /* @__PURE__ */ jsx19(
     TwoColumnPage,
     {
       data: order,
@@ -3710,7 +3749,7 @@ var Root = ({ children }) => {
       "data-testid": "order-detail-page",
       children
     }
-  ) : /* @__PURE__ */ jsxs20(
+  ) : /* @__PURE__ */ jsxs19(
     TwoColumnPage,
     {
       data: order,
@@ -3719,22 +3758,21 @@ var Root = ({ children }) => {
       hasOutlet: true,
       "data-testid": "order-detail-page",
       children: [
-        /* @__PURE__ */ jsxs20(TwoColumnPage.Main, { "data-testid": "order-detail-main", children: [
-          /* @__PURE__ */ jsx20(OrderActiveEditSection, { order }),
-          /* @__PURE__ */ jsx20(ActiveOrderClaimSection, { orderPreview }),
-          /* @__PURE__ */ jsx20(ActiveOrderExchangeSection, { orderPreview }),
-          /* @__PURE__ */ jsx20(ActiveOrderReturnSection, { orderPreview }),
-          /* @__PURE__ */ jsx20(OrderGeneralSection, { order }),
-          /* @__PURE__ */ jsx20(OrderSummarySection, { order }),
-          /* @__PURE__ */ jsx20(OrderCommissionSection, { order }),
-          /* @__PURE__ */ jsx20(OrderPaymentSection, { order }),
-          /* @__PURE__ */ jsx20(OrderFulfillmentSection, { order })
-        ] }),
-        /* @__PURE__ */ jsxs20(TwoColumnPage.Sidebar, { "data-testid": "order-detail-sidebar", children: [
-          /* @__PURE__ */ jsx20(OrderCustomerSection, { order }),
-          /* @__PURE__ */ jsx20(OrderActivitySection, { order }),
-          /* @__PURE__ */ jsx20(OrderRemainingOrdersGroupSection, {})
-        ] })
+        /* @__PURE__ */ jsx19(TwoColumnPage.Main, { "data-testid": "order-detail-main", children: /* @__PURE__ */ jsxs19(WidgetZone, { id: "orders.detail.main", data: order, children: [
+          /* @__PURE__ */ jsx19(OrderActiveEditSection, { order }),
+          /* @__PURE__ */ jsx19(ActiveOrderClaimSection, { orderPreview }),
+          /* @__PURE__ */ jsx19(ActiveOrderExchangeSection, { orderPreview }),
+          /* @__PURE__ */ jsx19(ActiveOrderReturnSection, { orderPreview }),
+          /* @__PURE__ */ jsx19(OrderGeneralSection, { order }),
+          /* @__PURE__ */ jsx19(OrderSummarySection, { order }),
+          /* @__PURE__ */ jsx19(OrderPaymentSection, { order }),
+          /* @__PURE__ */ jsx19(OrderFulfillmentSection, { order })
+        ] }) }),
+        /* @__PURE__ */ jsx19(TwoColumnPage.Sidebar, { "data-testid": "order-detail-sidebar", children: /* @__PURE__ */ jsxs19(WidgetZone, { id: "orders.detail.side", data: order, children: [
+          /* @__PURE__ */ jsx19(OrderCustomerSection, { order }),
+          /* @__PURE__ */ jsx19(OrderActivitySection, { order }),
+          /* @__PURE__ */ jsx19(OrderRemainingOrdersGroupSection, {})
+        ] }) })
       ]
     }
   );