@mercurjs/vendor 2.2.0-canary.39 → 2.2.0-canary.41

package/dist/{chunk-BAVE4NRL.js → chunk-7HLAOLG7.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-PHOCVOZ5.js";
 import {
   require_dist
-} from "./chunk-YZBEJ3CY.js";
+} from "./chunk-VYSB4CTB.js";
 import {
   __toESM
 } from "./chunk-NBMM2TZK.js";

package/dist/{chunk-X3ZH4SMS.js → chunk-BUQXFADV.js}

@@ -7,20 +7,20 @@ import {
   CategoryHeader,
   ProductStatusCell,
   ProductStatusHeader
-} from "./chunk-BAVE4NRL.js";
+} from "./chunk-7HLAOLG7.js";
 import {
   ProductCell
 } from "./chunk-FWPGOIFA.js";
 import {
   useProductTableFilters
-} from "./chunk-Y3WDFB7J.js";
+} from "./chunk-ZZUJHLFM.js";
 import {
   PlaceholderCell
 } from "./chunk-PHOCVOZ5.js";
 import {
   _DataTable,
   useDataTable
-} from "./chunk-XRLRKSND.js";
+} from "./chunk-W3UHAQCV.js";
 import {
   SingleColumnPage
 } from "./chunk-YV6MK4PZ.js";
@@ -39,6 +39,7 @@ import {
 
 // src/pages/offers/offer-list-page.tsx
 import { Children as Children2 } from "react";
+import { WidgetZone } from "@mercurjs/dashboard-shared";
 
 // src/pages/offers/_components/offer-list-table.tsx
 import { Container } from "@medusajs/ui";
@@ -47,7 +48,9 @@ import { Outlet } from "react-router-dom";
 
 // src/pages/offers/_components/offer-list-data-table.tsx
 import { keepPreviousData } from "@tanstack/react-query";
+import { useMemo as useMemo2 } from "react";
 import { useTranslation as useTranslation3 } from "react-i18next";
+import { useExtendableTable } from "@mercurjs/dashboard-shared";
 
 // src/pages/offers/_components/use-offer-table-columns.tsx
 import { Text } from "@medusajs/ui";
@@ -265,8 +268,12 @@ var OfferListDataTable = () => {
     { placeholderData: keepPreviousData }
   );
   const rows = products ?? [];
-  const filters = useOfferTableFilters();
-  const columns = useOfferTableColumns();
+  const baseFilters = useOfferTableFilters();
+  const { columns, filters: extFilters } = useColumns();
+  const filters = useMemo2(
+    () => [...baseFilters, ...extFilters],
+    [baseFilters, extFilters]
+  );
   const { table } = useDataTable({
     data: rows,
     columns,
@@ -308,6 +315,20 @@ var OfferListDataTable = () => {
     }
   );
 };
+var useColumns = () => {
+  const base = useOfferTableColumns();
+  const actionsColumn = base[base.length - 1];
+  const baseColumns = base.slice(0, -1);
+  const { columns: extended, filters } = useExtendableTable({
+    model: "offer",
+    columns: baseColumns
+  });
+  const columns = useMemo2(
+    () => [...extended, actionsColumn],
+    [extended, actionsColumn]
+  );
+  return { columns, filters };
+};
 
 // src/pages/offers/_components/offer-list-header.tsx
 import { Button, Heading } from "@medusajs/ui";
@@ -339,7 +360,7 @@ var OfferListTable = ({ children }) => /* @__PURE__ */ jsxs2(Container, { classN
 
 // src/pages/offers/offer-list-page.tsx
 import { jsx as jsx6 } from "react/jsx-runtime";
-var Root = ({ children }) => /* @__PURE__ */ jsx6(SingleColumnPage, { children: Children2.count(children) > 0 ? children : /* @__PURE__ */ jsx6(OfferListTable, {}) });
+var Root = ({ children }) => /* @__PURE__ */ jsx6(SingleColumnPage, { children: /* @__PURE__ */ jsx6(WidgetZone, { id: "offers.list", children: Children2.count(children) > 0 ? children : /* @__PURE__ */ jsx6(OfferListTable, {}) }) });
 var OfferListPage = Object.assign(Root, {
   Table: OfferListTable,
   Header: OfferListHeader,

package/dist/{chunk-EGEC3BY2.js → chunk-CSZ6RV7N.js}

@@ -7,7 +7,7 @@ import {
 import {
   _DataTable,
   useDataTable
-} from "./chunk-XRLRKSND.js";
+} from "./chunk-W3UHAQCV.js";
 import {
   SingleColumnPage
 } from "./chunk-YV6MK4PZ.js";
@@ -21,6 +21,7 @@ import {
 
 // src/pages/campaigns/campaign-list-page.tsx
 import { Children as Children3 } from "react";
+import { WidgetZone } from "@mercurjs/dashboard-shared";
 
 // src/pages/campaigns/_components/campaign-list-table/campaign-list-table.tsx
 import { Children as Children2 } from "react";
@@ -59,6 +60,7 @@ import { PencilSquare, Trash } from "@medusajs/icons";
 import { toast, usePrompt } from "@medusajs/ui";
 import { keepPreviousData } from "@tanstack/react-query";
 import { createColumnHelper } from "@tanstack/react-table";
+import { useExtendableTable } from "@mercurjs/dashboard-shared";
 import { useMemo } from "react";
 import { useTranslation as useTranslation2 } from "react-i18next";
 import { jsx as jsx2 } from "react/jsx-runtime";
@@ -75,7 +77,7 @@ var CampaignListDataTable = () => {
   } = useCampaigns(searchParams, {
     placeholderData: keepPreviousData
   });
-  const columns = useColumns();
+  const { columns } = useColumns();
   const { table } = useDataTable({
     data: campaigns ?? [],
     columns,
@@ -165,9 +167,13 @@ var CampaignActions = ({ campaign }) => {
 var columnHelper = createColumnHelper();
 var useColumns = () => {
   const base = useCampaignTableColumns();
-  return useMemo(
+  const { columns: extended, filters } = useExtendableTable({
+    model: "campaign",
+    columns: base
+  });
+  const columns = useMemo(
     () => [
-      ...base,
+      ...extended,
       columnHelper.display({
         id: "actions",
         cell: ({ row }) => {
@@ -175,8 +181,9 @@ var useColumns = () => {
         }
       })
     ],
-    [base]
+    [extended]
   );
+  return { columns, filters };
 };
 
 // src/pages/campaigns/_components/campaign-list-table/campaign-list-table.tsx
@@ -191,7 +198,7 @@ var CampaignListTable = ({ children }) => {
 // src/pages/campaigns/campaign-list-page.tsx
 import { jsx as jsx4 } from "react/jsx-runtime";
 var Root = ({ children }) => {
-  return /* @__PURE__ */ jsx4(SingleColumnPage, { hasOutlet: true, children: Children3.count(children) > 0 ? children : /* @__PURE__ */ jsx4(CampaignListTable, {}) });
+  return /* @__PURE__ */ jsx4(SingleColumnPage, { hasOutlet: true, children: /* @__PURE__ */ jsx4(WidgetZone, { id: "campaigns.list", children: Children3.count(children) > 0 ? children : /* @__PURE__ */ jsx4(CampaignListTable, {}) }) });
 };
 var CampaignListPage = Object.assign(Root, {
   Table: CampaignListTable,

package/dist/{chunk-JAKAZ3ZY.js → chunk-D76WZZSB.js}

@@ -13,7 +13,7 @@ import {
 import {
   _DataTable,
   useDataTable
-} from "./chunk-XRLRKSND.js";
+} from "./chunk-W3UHAQCV.js";
 import {
   SingleColumnPage
 } from "./chunk-YV6MK4PZ.js";

package/dist/{chunk-2UPEWY5I.js → chunk-E5BSLZR5.js}

@@ -14,7 +14,7 @@ import {
 import {
   _DataTable,
   useDataTable
-} from "./chunk-XRLRKSND.js";
+} from "./chunk-W3UHAQCV.js";
 import {
   SingleColumnPage
 } from "./chunk-YV6MK4PZ.js";
@@ -30,6 +30,7 @@ import {
 
 // src/pages/categories/category-list-page.tsx
 import { Children as Children3 } from "react";
+import { WidgetZone } from "@mercurjs/dashboard-shared";
 
 // src/pages/categories/_components/category-list-table/category-list-table.tsx
 import { Children as Children2 } from "react";
@@ -45,7 +46,7 @@ var CategoryListTitle = () => {
   const { t } = useTranslation();
   return /* @__PURE__ */ jsxs("div", { children: [
     /* @__PURE__ */ jsx(Heading, { children: t("categories.domain") }),
-    /* @__PURE__ */ jsx(Text, { className: "text-ui-fg-subtle", size: "small", children: "Organize products into categories." })
+    /* @__PURE__ */ jsx(Text, { className: "text-ui-fg-subtle", size: "small", children: t("categories.subtitle") })
   ] });
 };
 var CategoryListActions = ({
@@ -64,6 +65,7 @@ var CategoryListHeader = ({
 
 // src/pages/categories/_components/category-list-table/category-list-data-table.tsx
 import { keepPreviousData } from "@tanstack/react-query";
+import { useExtendableTable } from "@mercurjs/dashboard-shared";
 import { useMemo as useMemo2 } from "react";
 
 // src/pages/categories/_components/category-list-table/use-category-table-columns.tsx
@@ -228,7 +230,11 @@ var CategoryListDataTable = () => {
 };
 var useColumns = () => {
   const base = useCategoryTableColumns();
-  return useMemo2(() => [...base], [base]);
+  const { columns: extended } = useExtendableTable({
+    model: "category",
+    columns: base
+  });
+  return useMemo2(() => [...extended], [extended]);
 };
 
 // src/pages/categories/_components/category-list-table/category-list-table.tsx
@@ -246,7 +252,7 @@ var CategoryListTable = ({ children }) => {
 // src/pages/categories/category-list-page.tsx
 import { jsx as jsx5 } from "react/jsx-runtime";
 var Root = ({ children }) => {
-  return /* @__PURE__ */ jsx5(SingleColumnPage, { hasOutlet: true, children: Children3.count(children) > 0 ? children : /* @__PURE__ */ jsx5(CategoryListTable, {}) });
+  return /* @__PURE__ */ jsx5(SingleColumnPage, { hasOutlet: true, children: /* @__PURE__ */ jsx5(WidgetZone, { id: "categories.list", children: Children3.count(children) > 0 ? children : /* @__PURE__ */ jsx5(CategoryListTable, {}) }) });
 };
 var CategoryListPage = Object.assign(Root, {
   Table: CategoryListTable,

package/dist/{chunk-FRYZRBLA.js → chunk-INYLPVCG.js}

@@ -160,7 +160,7 @@ var InnerForm = ({
                                     "aria-labelledby": METADATA_KEY_LABEL_ID,
                                     ...field2,
                                     disabled: isDisabled,
-                                    placeholder: "Key"
+                                    placeholder: t("metadata.edit.labels.key")
                                   }
                                 ) }) });
                               }
@@ -179,7 +179,7 @@ var InnerForm = ({
                                     ...field2,
                                     value: isDisabled ? placeholder : value,
                                     disabled: isDisabled,
-                                    placeholder: "Value"
+                                    placeholder: t("metadata.edit.labels.value")
                                   }
                                 ) }) });
                               }

package/dist/{chunk-MI7PXP7H.js → chunk-JY2XON7H.js}

@@ -10,7 +10,7 @@ import {
 import {
   _DataTable,
   useDataTable
-} from "./chunk-XRLRKSND.js";
+} from "./chunk-W3UHAQCV.js";
 import {
   SingleColumnPage
 } from "./chunk-YV6MK4PZ.js";

package/dist/{chunk-2QEFRSKJ.js → chunk-KZQFIPY2.js}

@@ -8937,6 +8937,7 @@ var en_default = {
     duplicate: "Duplicate",
     publish: "Publish",
     create: "Create",
+    request: "Request",
     delete: "Delete",
     remove: "Remove",
     revoke: "Revoke",
@@ -9724,6 +9725,7 @@ var en_default = {
     createCollection: "Create Collection",
     createCollectionHint: "Create a new collection to organize your products.",
     createSuccess: "Collection created successfully.",
+    requestSuccess: "Collection requested successfully",
     editCollection: "Edit Collection",
     handleTooltip: "The handle is used to reference the collection in your storefront. If not specified, the handle will be generated from the collection title.",
     deleteWarning: "You are about to delete the collection {{title}}. This action cannot be undone.",
@@ -9861,6 +9863,7 @@ var en_default = {
       attributes: "Attributes",
       requiresShipping: "Requires shipping",
       requiresShippingHint: "Does the inventory item require shipping?",
+      descriptionPlaceholder: "The item description",
       successToast: "Inventory item was successfully created."
     },
     reservation: {
@@ -9912,6 +9915,7 @@ var en_default = {
     subtitle: "Manage your catalog listings",
     create: {
       header: "Create offer",
+      description: "Select variants and configure stock levels and prices to create offers.",
       successToast: "Offer was successfully published. Only offers with stock levels and prices set will be visible on the storefront.",
       publish: "Publish",
       tipLabel: "Tip:",
@@ -10286,6 +10290,7 @@ var en_default = {
         partiallyCaptured: "Partially captured",
         refunded: "Refunded",
         canceled: "Canceled",
+        pending: "Pending",
         requiresAction: "Requires action"
       },
       capturePayment: "Payment of {{amount}} will be captured.",
@@ -11348,10 +11353,16 @@ var en_default = {
     campaign_currency: {
       tooltip: "This is the promotion's currency. Change it from the Details tab."
     },
+    campaignSection: {
+      noRecordsTitle: "Not part of a campaign",
+      noRecordsMessage: "Add this promotion to an existing campaign",
+      addToCampaign: "Add to Campaign"
+    },
     form: {
       required: "Required",
       and: "AND",
       selectAttribute: "Select Attribute",
+      selectOperator: "Select Operator",
       campaign: {
         existing: {
           title: "Existing Campaign",
@@ -11618,10 +11629,17 @@ var en_default = {
         successToast_other: "Successfully deleted prices for {{count}} products."
       },
       add: {
-        successToast: "Prices were successfully added to the price list."
+        successToast: "Prices were successfully added to the price list.",
+        atLeastOnePrice: "At least one price must be added.",
+        alreadyInPriceList: "This product is already in the price list",
+        noVariants: "This product has no variants",
+        title: "Add Products to Price List",
+        description: "Add products and set prices for the price list"
       },
       edit: {
-        successToast: "Prices were successfully updated."
+        successToast: "Prices were successfully updated.",
+        title: "Edit Prices for {{title}}",
+        description: "Update prices for products in the price list"
       }
     },
     fields: {
@@ -12550,8 +12568,10 @@ var en_default = {
     subtitle: "Organize your products into types.",
     create: {
       header: "Create Product Type",
+      requestHeader: "Request Product Type",
       hint: "Create a new product type to categorize your products.",
-      successToast: "Product type {{value}} was successfully created."
+      successToast: "Product type {{value}} was successfully created.",
+      requestSuccessToast: "Product type requested successfully"
     },
     edit: {
       header: "Edit Product Type",
@@ -12833,8 +12853,10 @@ var en_default = {
   views: {
     save: "Save",
     saveAsNew: "Save as new view",
+    saveAsSystemDefault: "Save as system default",
     updateDefaultForEveryone: "Update default for everyone",
     updateViewName: "Update view",
+    updateNamed: 'Update "{{name}}"',
     prompts: {
       updateDefault: {
         title: "Update default view",
@@ -12847,6 +12869,18 @@ var en_default = {
         description: 'Are you sure you want to update "{{name}}"?',
         confirmText: "Update",
         cancelText: "Cancel"
+      },
+      saveAsDefault: {
+        title: "Save as system default",
+        description: "This will save the current configuration as the system default. All users will see this configuration by default unless they have their own personal views. Are you sure?",
+        confirmText: "Save as default",
+        cancelText: "Cancel"
+      },
+      updateExisting: {
+        title: "Update existing view",
+        description: 'Update "{{name}}" with the current configuration?',
+        confirmText: "Update",
+        cancelText: "Cancel"
       }
     }
   },

package/dist/{chunk-CAE5333U.js → chunk-MAW6ZT3D.js}

@@ -14,7 +14,7 @@ import {
 import {
   _DataTable,
   useDataTable
-} from "./chunk-XRLRKSND.js";
+} from "./chunk-W3UHAQCV.js";
 import {
   useQueryParams
 } from "./chunk-THHRRYRS.js";

package/dist/{chunk-H6LZ77GX.js → chunk-QGZH3D2P.js}

@@ -3,6 +3,7 @@ import {
 } from "./chunk-THHRRYRS.js";
 
 // src/hooks/table/query/use-product-table-query.tsx
+import { useExtension, withLinkFields } from "@mercurjs/dashboard-shared";
 var DEFAULT_FIELDS = (
   // TODO: Remove exclusion once we avoid including unnecessary relations by default in the query config
   "id,title,handle,status,*collection,categories.id,categories.name,variants.id,thumbnail,-type,-tags,-images,-variants"
@@ -11,6 +12,7 @@ var useProductTableQuery = ({
   prefix,
   pageSize = 20
 }) => {
+  const links = useExtension().getLinks("product");
   const queryObject = useQueryParams(
     [
       "offset",
@@ -57,7 +59,7 @@ var useProductTableQuery = ({
     type_id: type_id?.split(","),
     status: status?.split(","),
     q,
-    fields: DEFAULT_FIELDS
+    fields: withLinkFields(DEFAULT_FIELDS, links)
   };
   return {
     searchParams,
@@ -66,5 +68,6 @@ var useProductTableQuery = ({
 };
 
 export {
+  DEFAULT_FIELDS,
   useProductTableQuery
 };

package/dist/{chunk-ZG6T4LG6.js → chunk-T7OX3EOG.js}

@@ -13,7 +13,7 @@ import {
 import {
   _DataTable,
   useDataTable
-} from "./chunk-XRLRKSND.js";
+} from "./chunk-W3UHAQCV.js";
 import {
   SingleColumnPage
 } from "./chunk-YV6MK4PZ.js";
@@ -33,6 +33,7 @@ import {
 // src/pages/customer-groups/customer-group-detail/customer-group-detail.tsx
 import { Children } from "react";
 import { useLoaderData, useParams } from "react-router-dom";
+import { WidgetZone } from "@mercurjs/dashboard-shared";
 
 // src/pages/customer-groups/customer-group-detail/components/customer-group-customer-section/customer-group-customer-section.tsx
 import { XCircle } from "@medusajs/icons";
@@ -48,6 +49,7 @@ import { createColumnHelper } from "@tanstack/react-table";
 import { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
+import { DisplayExtensionZone } from "@mercurjs/dashboard-shared";
 import { jsx, jsxs } from "react/jsx-runtime";
 var PAGE_SIZE = 20;
 var CustomerGroupCustomerSection = ({
@@ -186,6 +188,14 @@ var CustomerGroupCustomerSection = ({
               message: t("customerGroups.customers.list.noRecordsMessage")
             }
           }
+        ),
+        /* @__PURE__ */ jsx(
+          DisplayExtensionZone,
+          {
+            model: "customer_group",
+            zone: "customers",
+            data: group
+          }
         )
       ]
     }
@@ -293,6 +303,7 @@ import { PencilSquare, Trash } from "@medusajs/icons";
 import { Container as Container2, Heading as Heading2, Text, toast as toast2, usePrompt as usePrompt2 } from "@medusajs/ui";
 import { useTranslation as useTranslation2 } from "react-i18next";
 import { useNavigate } from "react-router-dom";
+import { DisplayExtensionZone as DisplayExtensionZone2, DisplayField } from "@mercurjs/dashboard-shared";
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var CustomerGroupGeneralSection = ({
   group
@@ -339,7 +350,7 @@ var CustomerGroupGeneralSection = ({
             className: "flex items-center justify-between px-6 py-4",
             "data-testid": "customer-group-general-section-header",
             children: [
-              /* @__PURE__ */ jsx2(Heading2, { "data-testid": "customer-group-general-section-name", children: group.name }),
+              /* @__PURE__ */ jsx2(DisplayField, { model: "customer_group", zone: "general", id: "name", data: group, children: /* @__PURE__ */ jsx2(Heading2, { "data-testid": "customer-group-general-section-name", children: group.name }) }),
               /* @__PURE__ */ jsx2(
                 ActionMenu,
                 {
@@ -368,32 +379,50 @@ var CustomerGroupGeneralSection = ({
             ]
           }
         ),
-        /* @__PURE__ */ jsxs2(
-          "div",
+        /* @__PURE__ */ jsx2(
+          DisplayField,
           {
-            className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4",
-            "data-testid": "customer-group-general-section-customers-row",
-            children: [
-              /* @__PURE__ */ jsx2(
-                Text,
-                {
-                  size: "small",
-                  leading: "compact",
-                  weight: "plus",
-                  "data-testid": "customer-group-general-section-customers-label",
-                  children: t("customers.domain")
-                }
-              ),
-              /* @__PURE__ */ jsx2(
-                Text,
-                {
-                  size: "small",
-                  leading: "compact",
-                  "data-testid": "customer-group-general-section-customers-value",
-                  children: group.customers?.length || "-"
-                }
-              )
-            ]
+            model: "customer_group",
+            zone: "general",
+            id: "customers",
+            data: group,
+            children: /* @__PURE__ */ jsxs2(
+              "div",
+              {
+                className: "text-ui-fg-subtle grid grid-cols-2 items-center px-6 py-4",
+                "data-testid": "customer-group-general-section-customers-row",
+                children: [
+                  /* @__PURE__ */ jsx2(
+                    Text,
+                    {
+                      size: "small",
+                      leading: "compact",
+                      weight: "plus",
+                      "data-testid": "customer-group-general-section-customers-label",
+                      children: t("customers.domain")
+                    }
+                  ),
+                  /* @__PURE__ */ jsx2(
+                    Text,
+                    {
+                      size: "small",
+                      leading: "compact",
+                      "data-testid": "customer-group-general-section-customers-value",
+                      children: group.customers?.length || "-"
+                    }
+                  )
+                ]
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          DisplayExtensionZone2,
+          {
+            model: "customer_group",
+            zone: "general",
+            data: group,
+            builtInFieldIds: ["name", "customers"]
           }
         )
       ]
@@ -419,10 +448,10 @@ var Root = ({ children }) => {
   if (isError) {
     throw error;
   }
-  return Children.count(children) > 0 ? /* @__PURE__ */ jsx3(SingleColumnPage, { showJSON: true, data: customer_group, hasOutlet: true, children }) : /* @__PURE__ */ jsxs3(SingleColumnPage, { showJSON: true, data: customer_group, hasOutlet: true, children: [
+  return Children.count(children) > 0 ? /* @__PURE__ */ jsx3(SingleColumnPage, { showJSON: true, data: customer_group, hasOutlet: true, children }) : /* @__PURE__ */ jsx3(SingleColumnPage, { showJSON: true, data: customer_group, hasOutlet: true, children: /* @__PURE__ */ jsxs3(WidgetZone, { id: "customer-groups.detail.main", data: customer_group, children: [
     /* @__PURE__ */ jsx3(CustomerGroupGeneralSection, { group: customer_group }),
     /* @__PURE__ */ jsx3(CustomerGroupCustomerSection, { group: customer_group })
-  ] });
+  ] }) });
 };
 var CustomerGroupDetailPage = Object.assign(Root, {
   GeneralSection: CustomerGroupGeneralSection,

package/dist/{chunk-MUGQQY6P.js → chunk-TB3B7NEX.js}

@@ -25,6 +25,7 @@ import {
 } from "@medusajs/ui";
 import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
+import { DisplayExtensionZone } from "@mercurjs/dashboard-shared";
 import { jsx, jsxs } from "react/jsx-runtime";
 var ProductMediaSection = ({
   product,
@@ -186,7 +187,8 @@ var ProductMediaSection = ({
           shortcut: "d"
         }
       )
-    ] }) })
+    ] }) }),
+    /* @__PURE__ */ jsx(DisplayExtensionZone, { model: "product", zone: "media", data: product })
   ] });
 };
 var getMedia = (product) => {
@@ -211,7 +213,16 @@ import { PencilSquare as PencilSquare2, Trash } from "@medusajs/icons";
 import { Container as Container2, Heading as Heading2, StatusBadge, usePrompt as usePrompt2 } from "@medusajs/ui";
 import { useTranslation as useTranslation2 } from "react-i18next";
 import { useNavigate } from "react-router-dom";
+import { DisplayExtensionZone as DisplayExtensionZone2, DisplayField } from "@mercurjs/dashboard-shared";
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var GENERAL_FIELD_IDS = [
+  "title",
+  "status",
+  "description",
+  "subtitle",
+  "handle",
+  "discountable"
+];
 var productStatusColor = (status) => {
   switch (status) {
     case "draft":
@@ -253,9 +264,18 @@ var ProductGeneralSection = ({
   };
   return /* @__PURE__ */ jsxs2(Container2, { className: "divide-y p-0", children: [
     /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between px-6 py-4", children: [
-      /* @__PURE__ */ jsx2(Heading2, { children: product.title }),
+      /* @__PURE__ */ jsx2(DisplayField, { model: "product", zone: "general", id: "title", data: product, children: /* @__PURE__ */ jsx2(Heading2, { children: product.title }) }),
       /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-x-4", children: [
-        /* @__PURE__ */ jsx2(StatusBadge, { color: productStatusColor(product.status), children: t(`products.productStatus.${product.status}`) }),
+        /* @__PURE__ */ jsx2(
+          DisplayField,
+          {
+            model: "product",
+            zone: "general",
+            id: "status",
+            data: product,
+            children: /* @__PURE__ */ jsx2(StatusBadge, { color: productStatusColor(product.status), children: t(`products.productStatus.${product.status}`) })
+          }
+        ),
         /* @__PURE__ */ jsx2(
           ActionMenu,
           {
@@ -283,26 +303,44 @@ var ProductGeneralSection = ({
         )
       ] })
     ] }),
-    /* @__PURE__ */ jsx2(
+    /* @__PURE__ */ jsx2(DisplayField, { model: "product", zone: "general", id: "description", data: product, children: /* @__PURE__ */ jsx2(
       SectionRow,
       {
         title: t("fields.description"),
         value: product.description || "-"
       }
-    ),
-    /* @__PURE__ */ jsx2(
+    ) }),
+    /* @__PURE__ */ jsx2(DisplayField, { model: "product", zone: "general", id: "subtitle", data: product, children: /* @__PURE__ */ jsx2(
       SectionRow,
       {
         title: t("fields.subtitle"),
         value: product.subtitle || "-"
       }
+    ) }),
+    /* @__PURE__ */ jsx2(DisplayField, { model: "product", zone: "general", id: "handle", data: product, children: /* @__PURE__ */ jsx2(SectionRow, { title: t("fields.handle"), value: `/${product.handle}` }) }),
+    /* @__PURE__ */ jsx2(
+      DisplayField,
+      {
+        model: "product",
+        zone: "general",
+        id: "discountable",
+        data: product,
+        children: /* @__PURE__ */ jsx2(
+          SectionRow,
+          {
+            title: t("fields.discountable"),
+            value: product.discountable ? t("general.true") : t("general.false")
+          }
+        )
+      }
     ),
-    /* @__PURE__ */ jsx2(SectionRow, { title: t("fields.handle"), value: `/${product.handle}` }),
     /* @__PURE__ */ jsx2(
-      SectionRow,
+      DisplayExtensionZone2,
       {
-        title: t("fields.discountable"),
-        value: product.discountable ? t("general.true") : t("general.false")
+        model: "product",
+        zone: "general",
+        data: product,
+        builtInFieldIds: GENERAL_FIELD_IDS
       }
     )
   ] });