@mercurjs/admin 2.0.0-canary.39 → 2.0.0-canary.41

package/dist/{chunk-FYB5MS4F.js → chunk-S2GARTQU.js}

@@ -10,7 +10,7 @@ import {
 } from "./chunk-ULJ3OMWU.js";
 import {
   SingleColumnPage
-} from "./chunk-U2UCL2VG.js";
+} from "./chunk-XIZLPYEE.js";
 import {
   SingleColumnPageSkeleton
 } from "./chunk-INNFZYX2.js";
@@ -133,7 +133,7 @@ var ProductTypeProductSection = ({
 };
 
 // src/pages/product-types/product-type-detail/product-type-detail.tsx
-import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 var Root = ({ children }) => {
   const { id } = useParams();
   const initialData = useLoaderData();
@@ -150,16 +150,16 @@ var Root = ({ children }) => {
   if (isError) {
     throw error;
   }
-  return /* @__PURE__ */ jsx3(SingleColumnPage, { showJSON: true, showMetadata: true, data: product_type, children: Children.count(children) > 0 ? children : /* @__PURE__ */ jsxs3(Fragment, { children: [
+  return Children.count(children) > 0 ? /* @__PURE__ */ jsx3(SingleColumnPage, { showJSON: true, showMetadata: true, data: product_type, children }) : /* @__PURE__ */ jsxs3(SingleColumnPage, { showJSON: true, showMetadata: true, data: product_type, children: [
     /* @__PURE__ */ jsx3(ProductTypeGeneralSection, { productType: product_type }),
     /* @__PURE__ */ jsx3(ProductTypeProductSection, { productType: product_type })
-  ] }) });
+  ] });
 };
-var ProductTypeDetail = Object.assign(Root, {
+var ProductTypeDetailPage = Object.assign(Root, {
   GeneralSection: ProductTypeGeneralSection,
   ProductSection: ProductTypeProductSection
 });
 
 export {
-  ProductTypeDetail
+  ProductTypeDetailPage
 };

package/dist/{chunk-7TLEUIAL.js → chunk-SO6PXIPV.js}

@@ -8,13 +8,13 @@ import {
 } from "./chunk-M33NQCEV.js";
 import {
   SingleColumnPage
-} from "./chunk-U2UCL2VG.js";
+} from "./chunk-XIZLPYEE.js";
 import {
   useSalesChannelTableColumns,
   useSalesChannelTableEmptyState,
   useSalesChannelTableFilters,
   useSalesChannelTableQuery
-} from "./chunk-G4QMLQF2.js";
+} from "./chunk-NZN7PFPB.js";
 import {
   DataTable
 } from "./chunk-UQITHKTH.js";
@@ -386,43 +386,48 @@ var useCommands = (id, setRowSelection) => {
 };
 
 // src/pages/api-key-management/api-key-management-detail/api-key-management-detail.tsx
-import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
 var Root = ({ children }) => {
   const initialData = useLoaderData();
   const { id } = useParams();
-  const { api_key, isLoading, isError, error } = useApiKey(
-    id,
-    void 0,
-    {
-      initialData
-    }
-  );
+  const { api_key, isLoading, isError, error } = useApiKey(id, void 0, {
+    initialData
+  });
   if (isLoading || !api_key) {
     return /* @__PURE__ */ jsx3(SingleColumnPageSkeleton, { showJSON: true, sections: 1 });
   }
   if (isError) {
     throw error;
   }
-  const isPublishable = api_key?.type === "publishable" /* PUBLISHABLE */;
-  return /* @__PURE__ */ jsx3(
+  const isPublishable = api_key.type === "publishable" /* PUBLISHABLE */;
+  return Children.count(children) > 0 ? /* @__PURE__ */ jsx3(
+    SingleColumnPage,
+    {
+      hasOutlet: true,
+      showJSON: true,
+      data: api_key,
+      "data-testid": `${api_key.type}-api-key-detail-page`,
+      children
+    }
+  ) : /* @__PURE__ */ jsxs2(
     SingleColumnPage,
     {
       hasOutlet: true,
       showJSON: true,
       data: api_key,
       "data-testid": `${api_key.type}-api-key-detail-page`,
-      children: Children.count(children) > 0 ? children : /* @__PURE__ */ jsxs2(Fragment2, { children: [
+      children: [
         /* @__PURE__ */ jsx3(ApiKeyGeneralSection, { apiKey: api_key }),
         isPublishable && /* @__PURE__ */ jsx3(ApiKeySalesChannelSection, { apiKey: api_key })
-      ] })
+      ]
     }
   );
 };
-var ApiKeyManagementDetail = Object.assign(Root, {
+var ApiKeyManagementDetailPage = Object.assign(Root, {
   GeneralSection: ApiKeyGeneralSection,
   SalesChannelSection: ApiKeySalesChannelSection
 });
 
 export {
-  ApiKeyManagementDetail
+  ApiKeyManagementDetailPage
 };

package/dist/{category-create-UWBJGIED.js → chunk-ST74PSEZ.js}

@@ -1,20 +1,20 @@
 import {
   CategoryTree
 } from "./chunk-YXFG3M2D.js";
-import {
-  transformNullableFormData
-} from "./chunk-7RPRNVBS.js";
 import {
   insertCategoryTreeItem
 } from "./chunk-Y456KVIN.js";
+import {
+  transformNullableFormData
+} from "./chunk-7RPRNVBS.js";
 import {
   HandleInput
 } from "./chunk-TLE6YHGH.js";
-import "./chunk-TKGWSUEI.js";
 import {
-  KeyboundForm
-} from "./chunk-U2ZFCAPX.js";
-import "./chunk-SMQT3ZNO.js";
+  TabbedForm,
+  defineTabMeta,
+  useTabbedForm
+} from "./chunk-5GG65TKV.js";
 import {
   useDocumentDirection
 } from "./chunk-Y7QKP6QU.js";
@@ -29,28 +29,39 @@ import {
   useCreateProductCategory,
   useProductCategories
 } from "./chunk-36ORDF7W.js";
-import "./chunk-K357FGGP.js";
-import "./chunk-RHKRREUU.js";
-import "./chunk-ZA2KFUFR.js";
-import "./chunk-ZYNBKBY3.js";
-import "./chunk-NBMM2TZK.js";
+
+// src/pages/categories/category-create/components/create-category-form/schema.ts
+import { z } from "zod";
+var CreateCategoryDetailsSchema = z.object({
+  name: z.string().min(1),
+  description: z.string().optional(),
+  handle: z.string().optional(),
+  status: z.enum(["active", "inactive"]),
+  visibility: z.enum(["public", "internal"])
+});
+var CreateCategorySchema = z.object({
+  rank: z.number().nullable(),
+  parent_category_id: z.string().nullable()
+}).merge(CreateCategoryDetailsSchema);
 
 // src/pages/categories/category-create/category-create.tsx
+import { Children as Children2 } from "react";
 import { useSearchParams } from "react-router-dom";
 
 // src/pages/categories/category-create/components/create-category-form/create-category-form.tsx
 import { zodResolver } from "@hookform/resolvers/zod";
-import { Button, ProgressTabs, toast } from "@medusajs/ui";
+import { toast } from "@medusajs/ui";
+import { Children, useMemo as useMemo2 } from "react";
 import { useForm } from "react-hook-form";
 import { useTranslation as useTranslation3 } from "react-i18next";
-import { useState as useState2 } from "react";
 
 // src/pages/categories/category-create/components/create-category-form/create-category-details.tsx
 import { Heading, Input, Select, Text, Textarea } from "@medusajs/ui";
 import { useTranslation } from "react-i18next";
 import { jsx, jsxs } from "react/jsx-runtime";
-var CreateCategoryDetails = ({ form }) => {
+var Root = () => {
   const { t } = useTranslation();
+  const form = useTabbedForm();
   const direction = useDocumentDirection();
   return /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center p-16", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-8", "data-testid": "category-create-form-content", children: [
     /* @__PURE__ */ jsxs("div", { "data-testid": "category-create-form-header", children: [
@@ -163,6 +174,12 @@ var CreateCategoryDetails = ({ form }) => {
     ] })
   ] }) });
 };
+Root._tabMeta = defineTabMeta({
+  id: "details",
+  labelKey: "categories.create.tabs.details",
+  validationFields: ["name", "handle", "description", "status", "visibility"]
+});
+var CreateCategoryDetails = Root;
 
 // src/pages/categories/category-create/components/create-category-form/create-category-nesting.tsx
 import { Badge } from "@medusajs/ui";
@@ -171,12 +188,11 @@ import { useWatch } from "react-hook-form";
 import { useTranslation as useTranslation2 } from "react-i18next";
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var ID = "new-item";
-var CreateCategoryNesting = ({
-  form,
-  shouldFreeze
-}) => {
+var Root2 = () => {
   const { t } = useTranslation2();
+  const form = useTabbedForm();
   const [snapshot, setSnapshot] = useState([]);
+  const shouldFreeze = form.formState.isSubmitting;
   const { product_categories, isPending, isError, error } = useProductCategories({
     parent_category_id: "null",
     limit: 9999,
@@ -223,7 +239,7 @@ var CreateCategoryNesting = ({
     throw error;
   }
   const ready = !isPending && !!product_categories;
-  return /* @__PURE__ */ jsx2("div", { "data-testid": "category-create-form-nesting", children: /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsx2("div", { className: "bg-ui-bg-subtle flex-1", "data-testid": "category-create-form-nesting", children: /* @__PURE__ */ jsx2(
     CategoryTree,
     {
       value: shouldFreeze ? snapshot : value,
@@ -242,32 +258,23 @@ var CreateCategoryNesting = ({
     }
   ) });
 };
-
-// src/pages/categories/category-create/components/create-category-form/schema.ts
-import { z } from "zod";
-var CreateCategoryDetailsSchema = z.object({
-  name: z.string().min(1),
-  description: z.string().optional(),
-  handle: z.string().optional(),
-  status: z.enum(["active", "inactive"]),
-  visibility: z.enum(["public", "internal"])
+Root2._tabMeta = defineTabMeta({
+  id: "organize",
+  labelKey: "categories.create.tabs.organize",
+  validationFields: ["parent_category_id", "rank"]
 });
-var CreateCategorySchema = z.object({
-  rank: z.number().nullable(),
-  parent_category_id: z.string().nullable()
-}).merge(CreateCategoryDetailsSchema);
+var CreateCategoryNesting = Root2;
 
 // src/pages/categories/category-create/components/create-category-form/create-category-form.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx3 } from "react/jsx-runtime";
 var CreateCategoryForm = ({
-  parentCategoryId
+  parentCategoryId,
+  children,
+  schema,
+  defaultValues: extraDefaults
 }) => {
   const { t } = useTranslation3();
   const { handleSuccess } = useRouteModal();
-  const direction = useDocumentDirection();
-  const [activeTab, setActiveTab] = useState2("details" /* DETAILS */);
-  const [validDetails, setValidDetails] = useState2(false);
-  const [shouldFreeze, setShouldFreeze] = useState2(false);
   const form = useForm({
     defaultValues: {
       name: "",
@@ -276,40 +283,16 @@ var CreateCategoryForm = ({
       status: "active",
       visibility: "public",
       rank: parentCategoryId ? 0 : null,
-      parent_category_id: parentCategoryId
+      parent_category_id: parentCategoryId,
+      ...extraDefaults
     },
-    resolver: zodResolver(CreateCategorySchema)
+    resolver: zodResolver(schema ?? CreateCategorySchema)
   });
-  const handleTabChange = (tab) => {
-    if (tab === "organize" /* ORGANIZE */) {
-      const { name, handle, description, status, visibility } = form.getValues();
-      const result = CreateCategoryDetailsSchema.safeParse({
-        name,
-        handle,
-        description,
-        status,
-        visibility
-      });
-      if (!result.success) {
-        result.error.errors.forEach((error) => {
-          form.setError(error.path.join("."), {
-            type: "manual",
-            message: error.message
-          });
-        });
-        return;
-      }
-      form.clearErrors();
-      setValidDetails(true);
-    }
-    setActiveTab(tab);
-  };
   const { mutateAsync, isPending } = useCreateProductCategory();
-  const handleSubmit = form.handleSubmit((data) => {
+  const handleSubmit = form.handleSubmit(async (data) => {
     const { visibility, status, parent_category_id, rank, name, ...rest } = data;
     const parsedData = transformNullableFormData(rest, false);
-    setShouldFreeze(true);
-    mutateAsync(
+    await mutateAsync(
       {
         name,
         ...parsedData,
@@ -329,100 +312,46 @@ var CreateCategoryForm = ({
         },
         onError: (error) => {
           toast.error(error.message);
-          setShouldFreeze(false);
         }
       }
     );
   });
-  const nestingStatus = form.getFieldState("parent_category_id")?.isDirty || form.getFieldState("rank")?.isDirty || activeTab === "organize" /* ORGANIZE */ ? "in-progress" : "not-started";
-  const detailsStatus = validDetails ? "completed" : "in-progress";
-  return /* @__PURE__ */ jsx3(RouteFocusModal.Form, { form, "data-testid": "category-create-form", children: /* @__PURE__ */ jsx3(
-    KeyboundForm,
+  const defaultTabs = useMemo2(
+    () => [
+      /* @__PURE__ */ jsx3(CreateCategoryDetails, {}, "details"),
+      /* @__PURE__ */ jsx3(CreateCategoryNesting, {}, "organize")
+    ],
+    []
+  );
+  const hasCustomChildren = Children.count(children) > 0;
+  return /* @__PURE__ */ jsx3(
+    TabbedForm,
     {
+      form,
       onSubmit: handleSubmit,
-      className: "flex size-full flex-col overflow-hidden",
-      children: /* @__PURE__ */ jsxs3(
-        ProgressTabs,
-        {
-          dir: direction,
-          value: activeTab,
-          onValueChange: (tab) => handleTabChange(tab),
-          className: "flex size-full flex-col",
-          children: [
-            /* @__PURE__ */ jsx3(RouteFocusModal.Header, { "data-testid": "category-create-form-header", children: /* @__PURE__ */ jsx3("div", { className: "flex w-full items-center justify-between", children: /* @__PURE__ */ jsx3("div", { className: "-my-2 w-full max-w-[400px] border-l", children: /* @__PURE__ */ jsxs3(ProgressTabs.List, { className: "grid w-full grid-cols-2", "data-testid": "category-create-form-tabs-list", children: [
-              /* @__PURE__ */ jsx3(
-                ProgressTabs.Trigger,
-                {
-                  value: "details" /* DETAILS */,
-                  status: detailsStatus,
-                  className: "w-full min-w-0 overflow-hidden",
-                  "data-testid": "category-create-form-tab-details",
-                  children: /* @__PURE__ */ jsx3("span", { className: "truncate", children: t("categories.create.tabs.details") })
-                }
-              ),
-              /* @__PURE__ */ jsx3(
-                ProgressTabs.Trigger,
-                {
-                  value: "organize" /* ORGANIZE */,
-                  status: nestingStatus,
-                  className: "w-full min-w-0 overflow-hidden",
-                  "data-testid": "category-create-form-tab-organize",
-                  children: /* @__PURE__ */ jsx3("span", { className: "truncate", children: t("categories.create.tabs.organize") })
-                }
-              )
-            ] }) }) }) }),
-            /* @__PURE__ */ jsxs3(RouteFocusModal.Body, { className: "flex size-full flex-col overflow-auto", "data-testid": "category-create-form-body", children: [
-              /* @__PURE__ */ jsx3(ProgressTabs.Content, { value: "details" /* DETAILS */, "data-testid": "category-create-form-tab-details-content", children: /* @__PURE__ */ jsx3(CreateCategoryDetails, { form }) }),
-              /* @__PURE__ */ jsx3(
-                ProgressTabs.Content,
-                {
-                  value: "organize" /* ORGANIZE */,
-                  className: "bg-ui-bg-subtle flex-1",
-                  "data-testid": "category-create-form-tab-organize-content",
-                  children: /* @__PURE__ */ jsx3(CreateCategoryNesting, { form, shouldFreeze })
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsx3(RouteFocusModal.Footer, { "data-testid": "category-create-form-footer", children: /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-end gap-x-2", children: [
-              /* @__PURE__ */ jsx3(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx3(Button, { size: "small", variant: "secondary", "data-testid": "category-create-form-cancel-button", children: t("actions.cancel") }) }),
-              activeTab === "organize" /* ORGANIZE */ ? /* @__PURE__ */ jsx3(
-                Button,
-                {
-                  size: "small",
-                  variant: "primary",
-                  type: "submit",
-                  isLoading: isPending,
-                  "data-testid": "category-create-form-save-button",
-                  children: t("actions.save")
-                },
-                "submit-btn"
-              ) : /* @__PURE__ */ jsx3(
-                Button,
-                {
-                  size: "small",
-                  variant: "primary",
-                  type: "button",
-                  onClick: () => handleTabChange("organize" /* ORGANIZE */),
-                  "data-testid": "category-create-form-continue-button",
-                  children: t("actions.continue")
-                },
-                "continue-btn"
-              )
-            ] }) })
-          ]
-        }
-      )
+      isLoading: isPending,
+      children: hasCustomChildren ? children : defaultTabs
     }
-  ) });
+  );
 };
 
 // src/pages/categories/category-create/category-create.tsx
 import { jsx as jsx4 } from "react/jsx-runtime";
-var CategoryCreate = () => {
+var Root3 = ({ children }) => {
   const [searchParams] = useSearchParams();
   const parentCategoryId = searchParams.get("parent_category_id");
-  return /* @__PURE__ */ jsx4(RouteFocusModal, { children: /* @__PURE__ */ jsx4(CreateCategoryForm, { parentCategoryId }) });
+  return /* @__PURE__ */ jsx4(RouteFocusModal, { children: Children2.count(children) > 0 ? children : /* @__PURE__ */ jsx4(CreateCategoryForm, { parentCategoryId }) });
 };
+var CategoryCreatePage = Object.assign(Root3, {
+  Form: CreateCategoryForm,
+  DetailsTab: CreateCategoryDetails,
+  OrganizeTab: CreateCategoryNesting,
+  Tab: TabbedForm.Tab
+});
+var CategoryCreate = Root3;
+
 export {
-  CategoryCreate as Component
+  CreateCategorySchema,
+  CategoryCreatePage,
+  CategoryCreate
 };

package/dist/{chunk-33FUPXJL.js → chunk-T3OYE2MH.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-2BE77FVK.js";
 import {
   SingleColumnPage
-} from "./chunk-U2UCL2VG.js";
+} from "./chunk-XIZLPYEE.js";
 import {
   SingleColumnPageSkeleton
 } from "./chunk-INNFZYX2.js";
@@ -86,17 +86,17 @@ var Root = ({ children }) => {
   if (isError) {
     throw error;
   }
-  return /* @__PURE__ */ jsx2(SingleColumnPage, { showJSON: true, showMetadata: true, data: shipping_option_type, children: Children.count(children) > 0 ? children : /* @__PURE__ */ jsx2(
+  return Children.count(children) > 0 ? /* @__PURE__ */ jsx2(SingleColumnPage, { showJSON: true, showMetadata: true, data: shipping_option_type, children }) : /* @__PURE__ */ jsx2(SingleColumnPage, { showJSON: true, showMetadata: true, data: shipping_option_type, children: /* @__PURE__ */ jsx2(
     ShippingOptionTypeGeneralSection,
     {
       shippingOptionType: shipping_option_type
     }
   ) });
 };
-var ShippingOptionTypeDetail = Object.assign(Root, {
+var ShippingOptionTypeDetailPage = Object.assign(Root, {
   GeneralSection: ShippingOptionTypeGeneralSection
 });
 
 export {
-  ShippingOptionTypeDetail
+  ShippingOptionTypeDetailPage
 };

package/dist/{chunk-JRWB7VWP.js → chunk-U4RMXPGI.js}

@@ -13,13 +13,13 @@ import {
 import {
   useProductTableColumns
 } from "./chunk-3CKTAFTR.js";
+import {
+  TwoColumnPage
+} from "./chunk-V5J73NPW.js";
 import {
   _DataTable,
   useDataTable
 } from "./chunk-ULJ3OMWU.js";
-import {
-  TwoColumnPage
-} from "./chunk-U2UCL2VG.js";
 import {
   Skeleton,
   TwoColumnPageSkeleton
@@ -442,7 +442,7 @@ var useColumns = (priceList) => {
 };
 
 // src/pages/price-lists/price-list-detail/price-list-detail.tsx
-import { Fragment, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 var Root = ({ children }) => {
   const { id } = useParams();
   const { price_list, isLoading, isError, error } = usePriceList(id);
@@ -452,15 +452,15 @@ var Root = ({ children }) => {
   if (isError) {
     throw error;
   }
-  return /* @__PURE__ */ jsx4(Fragment, { children: Children.count(children) > 0 ? children : /* @__PURE__ */ jsxs4(TwoColumnPage, { data: price_list, showJSON: true, children: [
+  return Children.count(children) > 0 ? /* @__PURE__ */ jsx4(TwoColumnPage, { data: price_list, showJSON: true, "data-testid": "price-list-detail-page", children }) : /* @__PURE__ */ jsxs4(TwoColumnPage, { data: price_list, showJSON: true, "data-testid": "price-list-detail-page", children: [
     /* @__PURE__ */ jsxs4(TwoColumnPage.Main, { children: [
       /* @__PURE__ */ jsx4(PriceListGeneralSection, { priceList: price_list }),
       /* @__PURE__ */ jsx4(PriceListProductSection, { priceList: price_list })
     ] }),
     /* @__PURE__ */ jsx4(TwoColumnPage.Sidebar, { children: /* @__PURE__ */ jsx4(PriceListConfigurationSection, { priceList: price_list }) })
-  ] }) });
+  ] });
 };
-var PriceListDetails = Object.assign(Root, {
+var PriceListDetailPage = Object.assign(Root, {
   Main: TwoColumnPage.Main,
   Sidebar: TwoColumnPage.Sidebar,
   MainGeneralSection: PriceListGeneralSection,
@@ -469,5 +469,5 @@ var PriceListDetails = Object.assign(Root, {
 });
 
 export {
-  PriceListDetails
+  PriceListDetailPage
 };

package/dist/{chunk-YGSM5PVN.js → chunk-UI2BJVP5.js}

@@ -3,7 +3,7 @@ import {
   useCombinedRefs,
   useDataGridCell,
   useDataGridCellError
-} from "./chunk-KUWNYCGL.js";
+} from "./chunk-U3OWJE7V.js";
 import {
   ConditionalTooltip
 } from "./chunk-LAVHRER2.js";

package/dist/{chunk-FXU7SL6M.js → chunk-UOIUQC3P.js}

@@ -71,16 +71,16 @@ import {
   getFormattedAddress,
   isSameAddress
 } from "./chunk-W6Y3PPU5.js";
-import {
-  _DataTable,
-  useDataTable
-} from "./chunk-ULJ3OMWU.js";
 import {
   TwoColumnPage
-} from "./chunk-U2UCL2VG.js";
+} from "./chunk-V5J73NPW.js";
 import {
   Thumbnail
 } from "./chunk-WIYFXWRI.js";
+import {
+  _DataTable,
+  useDataTable
+} from "./chunk-ULJ3OMWU.js";
 import {
   Skeleton,
   TwoColumnPageSkeleton
@@ -3756,11 +3756,11 @@ var useColumns = () => {
 };
 
 // src/pages/orders/order-detail/order-detail.tsx
-import { Fragment as Fragment4, jsx as jsx19, jsxs as jsxs19 } 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 { order, isLoading, isError, error } = useOrder(
+  const { order: rawOrder, isLoading, isError, error } = useOrder(
     id,
     {
       fields: DEFAULT_FIELDS
@@ -3769,8 +3769,9 @@ var Root = ({ children }) => {
       initialData
     }
   );
-  if (order) {
-    order.items = order.items.sort((itemA, itemB) => {
+  const order = rawOrder ? {
+    ...rawOrder,
+    items: [...rawOrder.items].sort((itemA, itemB) => {
       if (itemA.created_at > itemB.created_at) {
         return 1;
       }
@@ -3778,8 +3779,8 @@ var Root = ({ children }) => {
         return -1;
       }
       return 0;
-    });
-  }
+    })
+  } : rawOrder;
   const { order: orderPreview, isLoading: isPreviewLoading } = useOrderPreview(
     id
   );
@@ -3789,7 +3790,17 @@ var Root = ({ children }) => {
   if (isError) {
     throw error;
   }
-  return /* @__PURE__ */ jsx19(Fragment4, { children: Children.count(children) > 0 ? children : /* @__PURE__ */ jsxs19(
+  return Children.count(children) > 0 ? /* @__PURE__ */ jsx19(
+    TwoColumnPage,
+    {
+      data: order,
+      showJSON: true,
+      showMetadata: true,
+      hasOutlet: true,
+      "data-testid": "order-detail-page",
+      children
+    }
+  ) : /* @__PURE__ */ jsxs19(
     TwoColumnPage,
     {
       data: order,
@@ -3815,9 +3826,8 @@ var Root = ({ children }) => {
         ] })
       ]
     }
-  ) });
+  );
 };
-var OrderDetail = Root;
 var OrderDetailPage = Object.assign(Root, {
   Main: TwoColumnPage.Main,
   Sidebar: TwoColumnPage.Sidebar,
@@ -3835,5 +3845,5 @@ var OrderDetailPage = Object.assign(Root, {
 });
 
 export {
-  OrderDetail
+  OrderDetailPage
 };

package/dist/{chunk-ZU2RNSCP.js → chunk-UONTDHRH.js}

@@ -27,9 +27,11 @@ var TaxRegionTable = ({
   queryObject,
   prefix,
   children,
+  renderHeader,
   "data-testid": dataTestId
 }) => {
   const { t } = useTranslation();
+  const showHeader = renderHeader !== false;
   if (isPending) {
     return /* @__PURE__ */ jsxs("div", { className: "flex flex-col divide-y", children: [
       Array.from({ length: 3 }).map((_, index) => {
@@ -49,7 +51,7 @@ var TaxRegionTable = ({
   const noRecords = !isPending && count === 0 && noQuery;
   const { pageIndex, pageSize } = table.getState().pagination;
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-col divide-y", "data-testid": dataTestId, children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-col justify-between gap-x-4 gap-y-3 px-6 py-4 md:flex-row md:items-center", "data-testid": dataTestId ? `${dataTestId}-header` : void 0, children: [
+    showHeader && /* @__PURE__ */ jsxs("div", { className: "flex flex-col justify-between gap-x-4 gap-y-3 px-6 py-4 md:flex-row md:items-center", "data-testid": dataTestId ? `${dataTestId}-header` : void 0, children: [
       /* @__PURE__ */ jsx("div", { children }),
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
         !noRecords && /* @__PURE__ */ jsx("div", { className: "flex w-full items-center gap-x-2 md:w-fit", children: /* @__PURE__ */ jsx(
@@ -63,7 +65,7 @@ var TaxRegionTable = ({
             prefix
           }
         ) }),
-        /* @__PURE__ */ jsx(Link, { to: action.to, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", "data-testid": dataTestId ? `${dataTestId}-create-button` : void 0, children: action.label }) })
+        action && /* @__PURE__ */ jsx(Link, { to: action.to, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", "data-testid": dataTestId ? `${dataTestId}-create-button` : void 0, children: action.label }) })
       ] })
     ] }),
     noResults && /* @__PURE__ */ jsx(NoResults, {}),