@medusajs/dashboard 3.0.0-snapshot-20251216135612 → 3.0.0-snapshot-20260102125810

package/dist/{chunk-CCQD65EY.mjs → chunk-FKNW5MLZ.mjs}

@@ -213,6 +213,7 @@ var useDataGridCell = ({
         case "number":
           return numberCharacterRegex.test(key);
         case "text":
+        case "multiline-text":
           return textCharacterRegex.test(key);
         default:
           return false;
@@ -251,6 +252,15 @@ var useDataGridCell = ({
         nativeInputValueSetter?.call(inputRef.current, e.key);
         const event = new Event("input", { bubbles: true });
         inputRef.current.dispatchEvent(event);
+      } else if (inputRef.current instanceof HTMLTextAreaElement) {
+        inputRef.current.value = "";
+        const nativeTextAreaValueSetter = Object.getOwnPropertyDescriptor(
+          window.HTMLTextAreaElement.prototype,
+          "value"
+        )?.set;
+        nativeTextAreaValueSetter?.call(inputRef.current, e.key);
+        const event = new Event("input", { bubbles: true });
+        inputRef.current.dispatchEvent(event);
       }
       e.stopPropagation();
       e.preventDefault();
@@ -1316,6 +1326,7 @@ function convertArrayToPrimitive(values, type) {
     case "boolean":
       return values.map(convertToBoolean);
     case "text":
+    case "multiline-text":
       return values.map(covertToString);
     default:
       throw new Error(`Unsupported target type "${type}".`);
@@ -1437,7 +1448,19 @@ var useDataGridKeydownEvent = ({
     },
     [rangeEnd, matrix, getSelectionValues, setSelectionValues, execute]
   );
-  const handleSpaceKeyTextOrNumber = useCallback9(
+  const handleSpaceKeyText = useCallback9(
+    (anchor2) => {
+      const field = matrix.getCellField(anchor2);
+      const input = queryTool?.getInput(anchor2);
+      if (!field || !input) {
+        return;
+      }
+      createSnapshot(anchor2);
+      input.focus();
+    },
+    [matrix, queryTool, createSnapshot]
+  );
+  const handleSpaceKeyNumber = useCallback9(
     (anchor2) => {
       const field = matrix.getCellField(anchor2);
       const input = queryTool?.getInput(anchor2);
@@ -1508,9 +1531,12 @@ var useDataGridKeydownEvent = ({
         case "togglable-number":
           handleSpaceKeyTogglableNumber(anchor);
           break;
-        case "number":
         case "text":
-          handleSpaceKeyTextOrNumber(anchor);
+        case "multiline-text":
+          handleSpaceKeyText(anchor);
+          break;
+        case "number":
+          handleSpaceKeyNumber(anchor);
           break;
       }
     },
@@ -1519,7 +1545,8 @@ var useDataGridKeydownEvent = ({
       isEditing,
       matrix,
       handleSpaceKeyBoolean,
-      handleSpaceKeyTextOrNumber,
+      handleSpaceKeyText,
+      handleSpaceKeyNumber,
       handleSpaceKeyTogglableNumber
     ]
   );
@@ -1570,6 +1597,19 @@ var useDataGridKeydownEvent = ({
     },
     [handleMoveOnEnter, handleEditOnEnter, isEditing]
   );
+  const handleEnterKeyMultilineText = useCallback9(
+    (e, anchor2) => {
+      if (isEditing) {
+        if (e.shiftKey) {
+          return;
+        }
+        handleMoveOnEnter(e, anchor2);
+        return;
+      }
+      handleEditOnEnter(anchor2);
+    },
+    [handleMoveOnEnter, handleEditOnEnter, isEditing]
+  );
   const handleEnterKeyBoolean = useCallback9(
     (e, anchor2) => {
       const field = matrix.getCellField(anchor2);
@@ -1603,9 +1643,15 @@ var useDataGridKeydownEvent = ({
       if (!anchor) {
         return;
       }
-      e.preventDefault();
       const type = matrix.getCellType(anchor);
+      if (type === "multiline-text" && isEditing && e.shiftKey) {
+        return;
+      }
+      e.preventDefault();
       switch (type) {
+        case "multiline-text":
+          handleEnterKeyMultilineText(e, anchor);
+          break;
         case "togglable-number":
         case "text":
         case "number":
@@ -1617,7 +1663,14 @@ var useDataGridKeydownEvent = ({
         }
       }
     },
-    [anchor, matrix, handleEnterKeyTextOrNumber, handleEnterKeyBoolean]
+    [
+      anchor,
+      matrix,
+      isEditing,
+      handleEnterKeyTextOrNumber,
+      handleEnterKeyBoolean,
+      handleEnterKeyMultilineText
+    ]
   );
   const handleDeleteKeyTogglableNumber = useCallback9(
     (anchor2, rangeEnd2) => {
@@ -1680,6 +1733,7 @@ var useDataGridKeydownEvent = ({
       }
       switch (type) {
         case "text":
+        case "multiline-text":
         case "number":
           handleDeleteKeyTextOrNumber(anchor, rangeEnd);
           break;
@@ -2020,66 +2074,58 @@ var DataGridCellContainer = ({
 }) => {
   const error = get2(errors, field);
   const hasError = !!error;
-  return /* @__PURE__ */ jsxs3(
-    "div",
-    {
-      className: clx("group/container relative w-full", {
-        "h-full": !isMultiLine
-      }),
-      children: [
-        /* @__PURE__ */ jsxs3(
-          "div",
+  return /* @__PURE__ */ jsxs3("div", { className: clx("group/container relative h-full w-full"), children: [
+    /* @__PURE__ */ jsxs3(
+      "div",
+      {
+        className: clx(
+          "bg-ui-bg-base group/cell relative flex h-full w-full gap-x-2 px-4 py-2.5 outline-none",
           {
-            className: clx(
-              "bg-ui-bg-base group/cell relative flex w-full gap-x-2 px-4 py-2.5 outline-none",
-              {
-                "h-full items-center": !isMultiLine,
-                "items-start": isMultiLine,
-                "bg-ui-tag-red-bg text-ui-tag-red-text": hasError && !isAnchor && !isSelected && !isDragSelected,
-                "ring-ui-bg-interactive ring-2 ring-inset": isAnchor,
-                "bg-ui-bg-highlight [&:has([data-field]:focus)]:bg-ui-bg-base": isSelected || isAnchor,
-                "bg-ui-bg-subtle": isDragSelected && !isAnchor
-              }
-            ),
-            tabIndex: -1,
-            ...innerProps,
-            children: [
-              /* @__PURE__ */ jsx3(
-                ErrorMessage,
-                {
-                  name: field,
-                  errors,
-                  render: ({ message }) => {
-                    return /* @__PURE__ */ jsx3("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx3(Tooltip2, { content: message, delayDuration: 0, children: /* @__PURE__ */ jsx3(ExclamationCircle, { className: "text-ui-tag-red-icon z-[3]" }) }) });
-                  }
-                }
-              ),
-              /* @__PURE__ */ jsx3(
-                "div",
-                {
-                  className: clx("relative z-[1] flex w-full", {
-                    "h-full items-center justify-center": !isMultiLine,
-                    "items-start": isMultiLine
-                  }),
-                  children: /* @__PURE__ */ jsx3(RenderChildren, { isAnchor, placeholder, children })
-                }
-              ),
-              /* @__PURE__ */ jsx3(DataGridRowErrorIndicator, { rowErrors }),
-              showOverlay && /* @__PURE__ */ jsx3(
-                "div",
-                {
-                  ...overlayProps,
-                  "data-cell-overlay": "true",
-                  className: "absolute inset-0 z-[2]"
-                }
-              )
-            ]
+            "items-center": !isMultiLine,
+            "items-start": isMultiLine,
+            "bg-ui-tag-red-bg text-ui-tag-red-text": hasError && !isAnchor && !isSelected && !isDragSelected,
+            "ring-ui-bg-interactive ring-2 ring-inset": isAnchor,
+            "bg-ui-bg-highlight [&:has([data-field]:focus)]:bg-ui-bg-base": isSelected || isAnchor,
+            "bg-ui-bg-subtle": isDragSelected && !isAnchor
           }
         ),
-        outerComponent
-      ]
-    }
-  );
+        tabIndex: -1,
+        ...innerProps,
+        children: [
+          /* @__PURE__ */ jsx3(
+            ErrorMessage,
+            {
+              name: field,
+              errors,
+              render: ({ message }) => {
+                return /* @__PURE__ */ jsx3("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx3(Tooltip2, { content: message, delayDuration: 0, children: /* @__PURE__ */ jsx3(ExclamationCircle, { className: "text-ui-tag-red-icon z-[3]" }) }) });
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx3(
+            "div",
+            {
+              className: clx("relative z-[1] flex h-full w-full", {
+                "items-center justify-center": !isMultiLine,
+                "items-start": isMultiLine
+              }),
+              children: /* @__PURE__ */ jsx3(RenderChildren, { isAnchor, placeholder, children })
+            }
+          ),
+          /* @__PURE__ */ jsx3(DataGridRowErrorIndicator, { rowErrors }),
+          showOverlay && /* @__PURE__ */ jsx3(
+            "div",
+            {
+              ...overlayProps,
+              "data-cell-overlay": "true",
+              className: "absolute inset-0 z-[2]"
+            }
+          )
+        ]
+      }
+    ),
+    outerComponent
+  ] });
 };
 var RenderChildren = ({
   isAnchor,
@@ -2250,14 +2296,13 @@ var Inner2 = ({
   ] });
 };
 
-// src/components/data-grid/components/data-grid-number-cell.tsx
+// src/components/data-grid/components/data-grid-multiline-cell.tsx
 import { clx as clx2 } from "@medusajs/ui";
-import { useEffect as useEffect4, useState as useState5 } from "react";
+import { useCallback as useCallback13, useEffect as useEffect4, useRef as useRef3, useState as useState5 } from "react";
 import { Controller as Controller3 } from "react-hook-form";
 import { jsx as jsx6 } from "react/jsx-runtime";
-var DataGridNumberCell = ({
-  context,
-  ...rest
+var DataGridMultilineCell = ({
+  context
 }) => {
   const { field, control, renderProps } = useDataGridCell({
     context
@@ -2270,12 +2315,92 @@ var DataGridNumberCell = ({
       control,
       name: field,
       render: ({ field: field2 }) => {
-        return /* @__PURE__ */ jsx6(DataGridCellContainer, { ...container, ...errorProps, children: /* @__PURE__ */ jsx6(Inner3, { field: field2, inputProps: input, ...rest }) });
+        return /* @__PURE__ */ jsx6(DataGridCellContainer, { ...container, ...errorProps, isMultiLine: true, children: /* @__PURE__ */ jsx6(Inner3, { field: field2, inputProps: input }) });
       }
     }
   );
 };
 var Inner3 = ({
+  field,
+  inputProps
+}) => {
+  const { onChange: _, onBlur, ref, value, ...rest } = field;
+  const { ref: inputRef, onBlur: onInputBlur, onChange, ...input } = inputProps;
+  const [localValue, setLocalValue] = useState5(value);
+  const textareaRef = useRef3(null);
+  useEffect4(() => {
+    setLocalValue(value);
+  }, [value]);
+  const combinedRefs = useCombinedRefs(inputRef, ref, textareaRef);
+  const adjustTextareaHeight = useCallback13(() => {
+    const textarea = textareaRef.current;
+    if (textarea) {
+      textarea.style.height = "0px";
+      const newHeight = Math.max(textarea.scrollHeight, 24);
+      textarea.style.height = `${newHeight}px`;
+    }
+  }, []);
+  useEffect4(() => {
+    adjustTextareaHeight();
+  }, [localValue, adjustTextareaHeight]);
+  useEffect4(() => {
+    adjustTextareaHeight();
+    const timeoutId = setTimeout(adjustTextareaHeight, 50);
+    return () => clearTimeout(timeoutId);
+  }, [adjustTextareaHeight]);
+  return /* @__PURE__ */ jsx6(
+    "textarea",
+    {
+      className: clx2(
+        "txt-compact-small text-ui-fg-subtle flex w-full cursor-pointer bg-transparent outline-none",
+        "focus:cursor-text",
+        "resize-none overflow-hidden py-2"
+      ),
+      autoComplete: "off",
+      tabIndex: -1,
+      value: localValue ?? "",
+      onChange: (e) => {
+        setLocalValue(e.target.value);
+        adjustTextareaHeight();
+      },
+      ref: combinedRefs,
+      onBlur: () => {
+        onBlur();
+        onInputBlur();
+        onChange(localValue, value);
+      },
+      ...input,
+      ...rest
+    }
+  );
+};
+
+// src/components/data-grid/components/data-grid-number-cell.tsx
+import { clx as clx3 } from "@medusajs/ui";
+import { useEffect as useEffect5, useState as useState6 } from "react";
+import { Controller as Controller4 } from "react-hook-form";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var DataGridNumberCell = ({
+  context,
+  ...rest
+}) => {
+  const { field, control, renderProps } = useDataGridCell({
+    context
+  });
+  const errorProps = useDataGridCellError({ context });
+  const { container, input } = renderProps;
+  return /* @__PURE__ */ jsx7(
+    Controller4,
+    {
+      control,
+      name: field,
+      render: ({ field: field2 }) => {
+        return /* @__PURE__ */ jsx7(DataGridCellContainer, { ...container, ...errorProps, children: /* @__PURE__ */ jsx7(Inner4, { field: field2, inputProps: input, ...rest }) });
+      }
+    }
+  );
+};
+var Inner4 = ({
   field,
   inputProps,
   ...props
@@ -2288,12 +2413,12 @@ var Inner3 = ({
     onFocus,
     ...attributes
   } = inputProps;
-  const [localValue, setLocalValue] = useState5(value);
-  useEffect4(() => {
+  const [localValue, setLocalValue] = useState6(value);
+  useEffect5(() => {
     setLocalValue(value);
   }, [value]);
   const combinedRefs = useCombinedRefs(inputRef, ref);
-  return /* @__PURE__ */ jsx6("div", { className: "size-full", children: /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7("div", { className: "size-full", children: /* @__PURE__ */ jsx7(
     "input",
     {
       ref: combinedRefs,
@@ -2307,7 +2432,7 @@ var Inner3 = ({
       onFocus,
       type: "number",
       inputMode: "decimal",
-      className: clx2(
+      className: clx3(
         "txt-compact-small size-full bg-transparent outline-none",
         "placeholder:text-ui-fg-muted"
       ),
@@ -2320,8 +2445,8 @@ var Inner3 = ({
 };
 
 // src/components/data-grid/components/data-grid-readonly-cell.tsx
-import { clx as clx3 } from "@medusajs/ui";
-import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+import { clx as clx4 } from "@medusajs/ui";
+import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
 var DataGridReadonlyCell = ({
   context,
   color = "muted",
@@ -2332,27 +2457,24 @@ var DataGridReadonlyCell = ({
   return /* @__PURE__ */ jsxs5(
     "div",
     {
-      className: clx3(
+      className: clx4(
         "txt-compact-small text-ui-fg-subtle flex w-full cursor-not-allowed justify-between overflow-hidden px-4 py-2.5 outline-none",
         color === "muted" && "bg-ui-bg-subtle",
         color === "normal" && "bg-ui-bg-base",
-        {
-          "h-full items-center": !isMultiLine,
-          "items-start": isMultiLine
-        }
+        "h-full items-center"
       ),
       children: [
-        /* @__PURE__ */ jsx7(
+        /* @__PURE__ */ jsx8(
           "div",
           {
-            className: clx3("flex-1", {
+            className: clx4("flex-1", {
               truncate: !isMultiLine,
               "whitespace-pre-wrap break-words": isMultiLine
             }),
             children
           }
         ),
-        /* @__PURE__ */ jsx7(DataGridRowErrorIndicator, { rowErrors })
+        /* @__PURE__ */ jsx8(DataGridRowErrorIndicator, { rowErrors })
       ]
     }
   );
@@ -2364,7 +2486,7 @@ import {
   AdjustmentsDone,
   ExclamationCircle as ExclamationCircle2
 } from "@medusajs/icons";
-import { Button as Button2, DropdownMenu, clx as clx5 } from "@medusajs/ui";
+import { Button as Button2, DropdownMenu, clx as clx6 } from "@medusajs/ui";
 import {
   flexRender,
   getCoreRowModel,
@@ -2374,22 +2496,22 @@ import {
   useVirtualizer
 } from "@tanstack/react-virtual";
 import {
-  useCallback as useCallback14,
-  useEffect as useEffect5,
+  useCallback as useCallback15,
+  useEffect as useEffect6,
   useMemo as useMemo5,
-  useRef as useRef3,
-  useState as useState8
+  useRef as useRef4,
+  useState as useState9
 } from "react";
 import { useTranslation as useTranslation3 } from "react-i18next";
 
 // src/hooks/use-command-history.tsx
-import { useCallback as useCallback13, useState as useState6 } from "react";
+import { useCallback as useCallback14, useState as useState7 } from "react";
 var useCommandHistory = (maxHistory = 20) => {
-  const [past, setPast] = useState6([]);
-  const [future, setFuture] = useState6([]);
+  const [past, setPast] = useState7([]);
+  const [future, setFuture] = useState7([]);
   const canUndo = past.length > 0;
   const canRedo = future.length > 0;
-  const undo = useCallback13(() => {
+  const undo = useCallback14(() => {
     if (!canUndo) {
       return;
     }
@@ -2399,7 +2521,7 @@ var useCommandHistory = (maxHistory = 20) => {
     setPast(newPast);
     setFuture([previous, ...future.slice(0, maxHistory - 1)]);
   }, [canUndo, future, past, maxHistory]);
-  const redo = useCallback13(() => {
+  const redo = useCallback14(() => {
     if (!canRedo) {
       return;
     }
@@ -2409,7 +2531,7 @@ var useCommandHistory = (maxHistory = 20) => {
     setPast([...past, next].slice(0, maxHistory - 1));
     setFuture(newFuture);
   }, [canRedo, future, past, maxHistory]);
-  const execute = useCallback13(
+  const execute = useCallback14(
     (command) => {
       command.execute();
       setPast((past2) => [...past2, command].slice(0, maxHistory - 1));
@@ -2430,7 +2552,7 @@ var useCommandHistory = (maxHistory = 20) => {
 import { XMark } from "@medusajs/icons";
 import {
   Button,
-  clx as clx4,
+  clx as clx5,
   Heading,
   IconButton,
   Input,
@@ -2438,9 +2560,9 @@ import {
   Text
 } from "@medusajs/ui";
 import { Dialog as RadixDialog } from "radix-ui";
-import { useMemo as useMemo4, useState as useState7 } from "react";
+import { useMemo as useMemo4, useState as useState8 } from "react";
 import { useTranslation as useTranslation2 } from "react-i18next";
-import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
 var useDataGridShortcuts = () => {
   const { t } = useTranslation2();
   const shortcuts = useMemo4(
@@ -2588,7 +2710,7 @@ var DataGridKeyboardShortcutModal = ({
   onOpenChange
 }) => {
   const { t } = useTranslation2();
-  const [searchValue, onSearchValueChange] = useState7("");
+  const [searchValue, onSearchValueChange] = useState8("");
   const shortcuts = useDataGridShortcuts();
   const searchResults = useMemo4(() => {
     return shortcuts.filter(
@@ -2596,12 +2718,12 @@ var DataGridKeyboardShortcutModal = ({
     );
   }, [searchValue, shortcuts]);
   return /* @__PURE__ */ jsxs6(RadixDialog.Root, { open, onOpenChange, children: [
-    /* @__PURE__ */ jsx8(RadixDialog.Trigger, { asChild: true, children: /* @__PURE__ */ jsx8(Button, { size: "small", variant: "secondary", children: t("dataGrid.shortcuts.label") }) }),
+    /* @__PURE__ */ jsx9(RadixDialog.Trigger, { asChild: true, children: /* @__PURE__ */ jsx9(Button, { size: "small", variant: "secondary", children: t("dataGrid.shortcuts.label") }) }),
     /* @__PURE__ */ jsxs6(RadixDialog.Portal, { children: [
-      /* @__PURE__ */ jsx8(
+      /* @__PURE__ */ jsx9(
         RadixDialog.Overlay,
         {
-          className: clx4(
+          className: clx5(
             "bg-ui-bg-overlay fixed inset-0",
             "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
           )
@@ -2611,15 +2733,15 @@ var DataGridKeyboardShortcutModal = ({
         /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-y-3 px-6 py-4", children: [
           /* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-between", children: [
             /* @__PURE__ */ jsxs6("div", { children: [
-              /* @__PURE__ */ jsx8(RadixDialog.Title, { asChild: true, children: /* @__PURE__ */ jsx8(Heading, { children: t("app.menus.user.shortcuts") }) }),
-              /* @__PURE__ */ jsx8(RadixDialog.Description, { className: "sr-only" })
+              /* @__PURE__ */ jsx9(RadixDialog.Title, { asChild: true, children: /* @__PURE__ */ jsx9(Heading, { children: t("app.menus.user.shortcuts") }) }),
+              /* @__PURE__ */ jsx9(RadixDialog.Description, { className: "sr-only" })
             ] }),
             /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-x-2", children: [
-              /* @__PURE__ */ jsx8(Kbd, { children: "esc" }),
-              /* @__PURE__ */ jsx8(RadixDialog.Close, { asChild: true, children: /* @__PURE__ */ jsx8(IconButton, { variant: "transparent", size: "small", children: /* @__PURE__ */ jsx8(XMark, {}) }) })
+              /* @__PURE__ */ jsx9(Kbd, { children: "esc" }),
+              /* @__PURE__ */ jsx9(RadixDialog.Close, { asChild: true, children: /* @__PURE__ */ jsx9(IconButton, { variant: "transparent", size: "small", children: /* @__PURE__ */ jsx9(XMark, {}) }) })
             ] })
           ] }),
-          /* @__PURE__ */ jsx8("div", { children: /* @__PURE__ */ jsx8(
+          /* @__PURE__ */ jsx9("div", { children: /* @__PURE__ */ jsx9(
             Input,
             {
               type: "search",
@@ -2629,15 +2751,15 @@ var DataGridKeyboardShortcutModal = ({
             }
           ) })
         ] }),
-        /* @__PURE__ */ jsx8("div", { className: "flex flex-col divide-y overflow-y-auto", children: searchResults.map((shortcut, index) => {
+        /* @__PURE__ */ jsx9("div", { className: "flex flex-col divide-y overflow-y-auto", children: searchResults.map((shortcut, index) => {
           return /* @__PURE__ */ jsxs6(
             "div",
             {
               className: "text-ui-fg-subtle flex items-center justify-between px-6 py-3",
               children: [
-                /* @__PURE__ */ jsx8(Text, { size: "small", children: shortcut.label }),
-                /* @__PURE__ */ jsx8("div", { className: "flex items-center gap-x-1", children: shortcut.keys.Mac?.map((key, index2) => {
-                  return /* @__PURE__ */ jsx8("div", { className: "flex items-center gap-x-1", children: /* @__PURE__ */ jsx8(Kbd, { children: key }) }, index2);
+                /* @__PURE__ */ jsx9(Text, { size: "small", children: shortcut.label }),
+                /* @__PURE__ */ jsx9("div", { className: "flex items-center gap-x-1", children: shortcut.keys.Mac?.map((key, index2) => {
+                  return /* @__PURE__ */ jsx9("div", { className: "flex items-center gap-x-1", children: /* @__PURE__ */ jsx9(Kbd, { children: key }) }, index2);
                 }) })
               ]
             },
@@ -2650,7 +2772,7 @@ var DataGridKeyboardShortcutModal = ({
 };
 
 // src/components/data-grid/components/data-grid-root.tsx
-import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
 var ROW_HEIGHT = 40;
 var getCommonPinningStyles = (column) => {
   const isPinned = column.getIsPinned();
@@ -2674,13 +2796,15 @@ var DataGridRoot = ({
   onEditingChange,
   disableInteractions,
   multiColumnSelection = false,
+  showColumnsDropdown = true,
   totalRowCount,
   onFetchMore,
   isFetchingMore,
-  hasNextPage
+  hasNextPage,
+  headerContent
 }) => {
   const isLazyMode = totalRowCount !== void 0;
-  const containerRef = useRef3(null);
+  const containerRef = useRef4(null);
   const { redo, undo, execute } = useCommandHistory();
   const {
     register,
@@ -2689,16 +2813,16 @@ var DataGridRoot = ({
     setValue: setValue2,
     formState: { errors }
   } = state;
-  const [internalTrapActive, setTrapActive] = useState8(true);
+  const [internalTrapActive, setTrapActive] = useState9(true);
   const trapActive = !disableInteractions && internalTrapActive;
-  const [anchor, setAnchor] = useState8(null);
-  const [rangeEnd, setRangeEnd] = useState8(null);
-  const [dragEnd, setDragEnd] = useState8(null);
-  const [isSelecting, setIsSelecting] = useState8(false);
-  const [isDragging, setIsDragging] = useState8(false);
-  const [isEditing, setIsEditing] = useState8(false);
-  const [columnVisibility, setColumnVisibility] = useState8({});
-  const [rowVisibility, setRowVisibility] = useState8({});
+  const [anchor, setAnchor] = useState9(null);
+  const [rangeEnd, setRangeEnd] = useState9(null);
+  const [dragEnd, setDragEnd] = useState9(null);
+  const [isSelecting, setIsSelecting] = useState9(false);
+  const [isDragging, setIsDragging] = useState9(false);
+  const [isEditing, setIsEditing] = useState9(false);
+  const [columnVisibility, setColumnVisibility] = useState9({});
+  const [rowVisibility, setRowVisibility] = useState9({});
   const grid = useReactTable({
     data,
     columns,
@@ -2750,13 +2874,13 @@ var DataGridRoot = ({
     }
   });
   const virtualRows = rowVirtualizer.getVirtualItems();
-  const lazyLoadingRefs = useRef3({
+  const lazyLoadingRefs = useRef4({
     onFetchMore,
     hasNextPage,
     isFetchingMore,
     loadedRowCount: visibleRows.length
   });
-  useEffect5(() => {
+  useEffect6(() => {
     lazyLoadingRefs.current = {
       onFetchMore,
       hasNextPage,
@@ -2765,7 +2889,7 @@ var DataGridRoot = ({
     };
   }, [onFetchMore, hasNextPage, isFetchingMore, visibleRows.length]);
   const hasData = visibleRows.length > 0;
-  const handleScroll = useCallback14(() => {
+  const handleScroll = useCallback15(() => {
     const { onFetchMore: onFetchMore2, hasNextPage: hasNextPage2, isFetchingMore: isFetchingMore2, loadedRowCount } = lazyLoadingRefs.current;
     if (!onFetchMore2 || !hasNextPage2 || isFetchingMore2) {
       return;
@@ -2779,7 +2903,7 @@ var DataGridRoot = ({
       onFetchMore2();
     }
   }, [lazyLoadingRefs, containerRef]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!isLazyMode || !hasData) {
       return;
     }
@@ -2841,7 +2965,7 @@ var DataGridRoot = ({
     [flatRows, columns, multiColumnSelection]
   );
   const queryTool = useDataGridQueryTool(containerRef);
-  const setSingleRange = useCallback14(
+  const setSingleRange = useCallback15(
     (coordinates) => {
       setAnchor(coordinates);
       setRangeEnd(coordinates);
@@ -2849,7 +2973,7 @@ var DataGridRoot = ({
     []
   );
   const { errorCount, isHighlighted, toggleErrorHighlighting } = useDataGridErrorHighlighting(matrix, grid, errors);
-  const handleToggleErrorHighlighting = useCallback14(() => {
+  const handleToggleErrorHighlighting = useCallback15(() => {
     toggleErrorHighlighting(
       rowVisibility,
       columnVisibility,
@@ -2863,7 +2987,7 @@ var DataGridRoot = ({
     handleResetColumns,
     isDisabled: isColumsDisabled
   } = useDataGridColumnVisibility(grid, matrix);
-  const handleToggleColumnVisibility = useCallback14(
+  const handleToggleColumnVisibility = useCallback15(
     (index) => {
       return handleToggleColumn(index);
     },
@@ -2885,7 +3009,7 @@ var DataGridRoot = ({
     matrix,
     form: state
   });
-  const onEditingChangeHandler = useCallback14(
+  const onEditingChangeHandler = useCallback15(
     (value) => {
       if (onEditingChange) {
         onEditingChange(value);
@@ -2973,7 +3097,7 @@ var DataGridRoot = ({
   const { getCellErrorMetadata, getCellMetadata } = useDataGridCellMetadata({
     matrix
   });
-  useEffect5(() => {
+  useEffect6(() => {
     if (!trapActive) {
       return;
     }
@@ -2994,7 +3118,7 @@ var DataGridRoot = ({
     handleCopyEvent,
     handlePasteEvent
   ]);
-  useEffect5(() => {
+  useEffect6(() => {
     const specialFocusHandler = (e) => {
       if (isSpecialFocusKey(e)) {
         handleSpecialFocusKeys(e);
@@ -3006,12 +3130,12 @@ var DataGridRoot = ({
       window.removeEventListener("keydown", specialFocusHandler);
     };
   }, [handleSpecialFocusKeys]);
-  const handleHeaderInteractionChange = useCallback14((isActive) => {
+  const handleHeaderInteractionChange = useCallback15((isActive) => {
     if (isActive) {
       setTrapActive(false);
     }
   }, []);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!anchor) {
       return;
     }
@@ -3020,7 +3144,7 @@ var DataGridRoot = ({
     }
     setRangeEnd(anchor);
   }, [anchor, rangeEnd]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!anchor && matrix) {
       const coords = matrix.getFirstNavigableCell();
       if (coords) {
@@ -3072,7 +3196,7 @@ var DataGridRoot = ({
       navigateToField
     ]
   );
-  const handleRestoreGridFocus = useCallback14(() => {
+  const handleRestoreGridFocus = useCallback15(() => {
     if (anchor && !trapActive) {
       setTrapActive(true);
       setSingleRange(anchor);
@@ -3082,10 +3206,11 @@ var DataGridRoot = ({
       });
     }
   }, [anchor, trapActive, setSingleRange, scrollToCoordinates, queryTool]);
-  return /* @__PURE__ */ jsx9(DataGridContext.Provider, { value: values, children: /* @__PURE__ */ jsxs7("div", { className: "bg-ui-bg-subtle flex size-full flex-col", children: [
-    /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(DataGridContext.Provider, { value: values, children: /* @__PURE__ */ jsxs7("div", { className: "bg-ui-bg-subtle flex size-full flex-col", children: [
+    /* @__PURE__ */ jsx10(
       DataGridHeader,
       {
+        showColumnsDropdown,
         columnOptions,
         isDisabled: isColumsDisabled,
         onToggleColumn: handleToggleColumnVisibility,
@@ -3093,10 +3218,11 @@ var DataGridRoot = ({
         onToggleErrorHighlighting: handleToggleErrorHighlighting,
         onResetColumns: handleResetColumns,
         isHighlighted,
-        onHeaderInteractionChange: handleHeaderInteractionChange
+        onHeaderInteractionChange: handleHeaderInteractionChange,
+        headerContent
       }
     ),
-    /* @__PURE__ */ jsx9("div", { className: "size-full overflow-hidden", children: /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10("div", { className: "size-full overflow-hidden", children: /* @__PURE__ */ jsx10(
       "div",
       {
         ref: containerRef,
@@ -3108,7 +3234,7 @@ var DataGridRoot = ({
         "data-container": true,
         role: "application",
         children: /* @__PURE__ */ jsxs7("div", { role: "grid", className: "text-ui-fg-subtle grid", children: [
-          /* @__PURE__ */ jsx9(
+          /* @__PURE__ */ jsx10(
             "div",
             {
               role: "rowgroup",
@@ -3119,7 +3245,7 @@ var DataGridRoot = ({
                   role: "row",
                   className: "flex h-10 w-full",
                   children: [
-                    virtualPaddingLeft ? /* @__PURE__ */ jsx9(
+                    virtualPaddingLeft ? /* @__PURE__ */ jsx10(
                       "div",
                       {
                         role: "presentation",
@@ -3131,7 +3257,7 @@ var DataGridRoot = ({
                       const previousVC = array[index - 1];
                       if (previousVC && vc.index !== previousVC.index + 1) {
                         acc.push(
-                          /* @__PURE__ */ jsx9(
+                          /* @__PURE__ */ jsx10(
                             "div",
                             {
                               role: "presentation",
@@ -3145,7 +3271,7 @@ var DataGridRoot = ({
                         );
                       }
                       acc.push(
-                        /* @__PURE__ */ jsx9(
+                        /* @__PURE__ */ jsx10(
                           "div",
                           {
                             role: "columnheader",
@@ -3165,7 +3291,7 @@ var DataGridRoot = ({
                       );
                       return acc;
                     }, []),
-                    virtualPaddingRight ? /* @__PURE__ */ jsx9(
+                    virtualPaddingRight ? /* @__PURE__ */ jsx10(
                       "div",
                       {
                         role: "presentation",
@@ -3181,7 +3307,7 @@ var DataGridRoot = ({
               ))
             }
           ),
-          /* @__PURE__ */ jsx9(
+          /* @__PURE__ */ jsx10(
             "div",
             {
               role: "rowgroup",
@@ -3192,7 +3318,7 @@ var DataGridRoot = ({
               children: virtualRows.map((virtualRow) => {
                 const row = visibleRows[virtualRow.index];
                 if (!row) {
-                  return /* @__PURE__ */ jsx9(
+                  return /* @__PURE__ */ jsx10(
                     DataGridRowSkeleton,
                     {
                       virtualRow,
@@ -3204,7 +3330,7 @@ var DataGridRoot = ({
                   );
                 }
                 const rowIndex = flatRows.findIndex((r) => r.id === row.id);
-                return /* @__PURE__ */ jsx9(
+                return /* @__PURE__ */ jsx10(
                   DataGridRow,
                   {
                     row,
@@ -3237,10 +3363,12 @@ var DataGridHeader = ({
   isHighlighted,
   errorCount,
   onToggleErrorHighlighting,
-  onHeaderInteractionChange
+  onHeaderInteractionChange,
+  showColumnsDropdown,
+  headerContent
 }) => {
-  const [shortcutsOpen, setShortcutsOpen] = useState8(false);
-  const [columnsOpen, setColumnsOpen] = useState8(false);
+  const [shortcutsOpen, setShortcutsOpen] = useState9(false);
+  const [columnsOpen, setColumnsOpen] = useState9(false);
   const { t } = useTranslation3();
   const direction = useDocumentDirection();
   const hasChanged = columnOptions.some((column) => !column.checked);
@@ -3253,7 +3381,7 @@ var DataGridHeader = ({
     setColumnsOpen(value);
   };
   return /* @__PURE__ */ jsxs7("div", { className: "bg-ui-bg-base flex items-center justify-between border-b p-4", children: [
-    /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-x-2", children: [
+    showColumnsDropdown && /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-x-2", children: [
       /* @__PURE__ */ jsxs7(
         DropdownMenu,
         {
@@ -3261,23 +3389,23 @@ var DataGridHeader = ({
           open: columnsOpen,
           onOpenChange: handleColumnsOpenChange,
           children: [
-            /* @__PURE__ */ jsx9(
+            /* @__PURE__ */ jsx10(
               ConditionalTooltip,
               {
                 showTooltip: isDisabled,
                 content: t("dataGrid.columns.disabled"),
-                children: /* @__PURE__ */ jsx9(DropdownMenu.Trigger, { asChild: true, disabled: isDisabled, children: /* @__PURE__ */ jsxs7(Button2, { size: "small", variant: "secondary", children: [
-                  hasChanged ? /* @__PURE__ */ jsx9(AdjustmentsDone, {}) : /* @__PURE__ */ jsx9(Adjustments, {}),
+                children: /* @__PURE__ */ jsx10(DropdownMenu.Trigger, { asChild: true, disabled: isDisabled, children: /* @__PURE__ */ jsxs7(Button2, { size: "small", variant: "secondary", children: [
+                  hasChanged ? /* @__PURE__ */ jsx10(AdjustmentsDone, {}) : /* @__PURE__ */ jsx10(Adjustments, {}),
                   t("dataGrid.columns.view")
                 ] }) })
               }
             ),
-            /* @__PURE__ */ jsx9(DropdownMenu.Content, { children: columnOptions.map((column, index) => {
+            /* @__PURE__ */ jsx10(DropdownMenu.Content, { children: columnOptions.map((column, index) => {
               const { checked, disabled, id, name } = column;
               if (disabled) {
                 return null;
               }
-              return /* @__PURE__ */ jsx9(
+              return /* @__PURE__ */ jsx10(
                 DropdownMenu.CheckboxItem,
                 {
                   checked,
@@ -3291,7 +3419,7 @@ var DataGridHeader = ({
           ]
         }
       ),
-      hasChanged && /* @__PURE__ */ jsx9(
+      hasChanged && /* @__PURE__ */ jsx10(
         Button2,
         {
           size: "small",
@@ -3304,7 +3432,8 @@ var DataGridHeader = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-x-2", children: [
+    headerContent,
+    /* @__PURE__ */ jsxs7("div", { className: "ml-auto flex items-center gap-x-2", children: [
       errorCount > 0 && /* @__PURE__ */ jsxs7(
         Button2,
         {
@@ -3312,18 +3441,18 @@ var DataGridHeader = ({
           variant: "secondary",
           type: "button",
           onClick: onToggleErrorHighlighting,
-          className: clx5({
+          className: clx6({
             "bg-ui-button-neutral-pressed": isHighlighted
           }),
           children: [
-            /* @__PURE__ */ jsx9(ExclamationCircle2, { className: "text-ui-fg-subtle" }),
-            /* @__PURE__ */ jsx9("span", { children: t("dataGrid.errors.count", {
+            /* @__PURE__ */ jsx10(ExclamationCircle2, { className: "text-ui-fg-subtle" }),
+            /* @__PURE__ */ jsx10("span", { children: t("dataGrid.errors.count", {
               count: errorCount
             }) })
           ]
         }
       ),
-      /* @__PURE__ */ jsx9(
+      /* @__PURE__ */ jsx10(
         DataGridKeyboardShortcutModal,
         {
           open: shortcutsOpen,
@@ -3346,7 +3475,7 @@ var DataGridCell = ({
     col: columnIndex
   };
   const isAnchor = isCellMatch(coords, anchor);
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     "div",
     {
       role: "gridcell",
@@ -3358,7 +3487,7 @@ var DataGridCell = ({
       },
       "data-row-index": rowIndex,
       "data-column-index": columnIndex,
-      className: clx5(
+      className: clx6(
         "relative flex items-stretch border-b border-r p-0 outline-none"
       ),
       tabIndex: -1,
@@ -3368,11 +3497,11 @@ var DataGridCell = ({
           columnIndex,
           rowIndex
         }),
-        isAnchor && /* @__PURE__ */ jsx9(
+        isAnchor && /* @__PURE__ */ jsx10(
           "div",
           {
             onMouseDown: onDragToFillStart,
-            className: clx5(
+            className: clx6(
               "bg-ui-fg-interactive absolute bottom-0 right-0 z-[3] size-1.5 cursor-ns-resize",
               {
                 "cursor-nwse-resize": multiColumnSelection
@@ -3410,7 +3539,7 @@ var DataGridRow = ({
       },
       className: "bg-ui-bg-subtle txt-compact-small absolute flex min-h-10 w-full",
       children: [
-        virtualPaddingLeft ? /* @__PURE__ */ jsx9(
+        virtualPaddingLeft ? /* @__PURE__ */ jsx10(
           "div",
           {
             role: "presentation",
@@ -3424,7 +3553,7 @@ var DataGridRow = ({
           const previousVC = array[index - 1];
           if (previousVC && vc.index !== previousVC.index + 1) {
             acc.push(
-              /* @__PURE__ */ jsx9(
+              /* @__PURE__ */ jsx10(
                 "div",
                 {
                   role: "presentation",
@@ -3438,7 +3567,7 @@ var DataGridRow = ({
             );
           }
           acc.push(
-            /* @__PURE__ */ jsx9(
+            /* @__PURE__ */ jsx10(
               DataGridCell,
               {
                 cell,
@@ -3453,7 +3582,7 @@ var DataGridRow = ({
           );
           return acc;
         }, []),
-        virtualPaddingRight ? /* @__PURE__ */ jsx9(
+        virtualPaddingRight ? /* @__PURE__ */ jsx10(
           "div",
           {
             role: "presentation",
@@ -3480,7 +3609,7 @@ var DataGridRowSkeleton = ({
       },
       className: "bg-ui-bg-subtle txt-compact-small absolute flex h-10 w-full",
       children: [
-        virtualPaddingLeft ? /* @__PURE__ */ jsx9(
+        virtualPaddingLeft ? /* @__PURE__ */ jsx10(
           "div",
           {
             role: "presentation",
@@ -3492,7 +3621,7 @@ var DataGridRowSkeleton = ({
           const elements = [];
           if (previousVC && vc.index !== previousVC.index + 1) {
             elements.push(
-              /* @__PURE__ */ jsx9(
+              /* @__PURE__ */ jsx10(
                 "div",
                 {
                   role: "presentation",
@@ -3506,20 +3635,20 @@ var DataGridRowSkeleton = ({
             );
           }
           elements.push(
-            /* @__PURE__ */ jsx9(
+            /* @__PURE__ */ jsx10(
               "div",
               {
                 role: "gridcell",
                 style: { width: vc.size },
                 className: "relative flex items-center border-b border-r p-0 outline-none",
-                children: /* @__PURE__ */ jsx9("div", { className: "flex h-full w-full items-center px-4", children: /* @__PURE__ */ jsx9("div", { className: "bg-ui-bg-component h-4 w-3/4 animate-pulse rounded" }) })
+                children: /* @__PURE__ */ jsx10("div", { className: "flex h-full w-full items-center px-4", children: /* @__PURE__ */ jsx10("div", { className: "bg-ui-bg-component h-4 w-3/4 animate-pulse rounded" }) })
               },
               `skeleton-cell-${vc.index}`
             )
           );
           return elements;
         }),
-        virtualPaddingRight ? /* @__PURE__ */ jsx9(
+        virtualPaddingRight ? /* @__PURE__ */ jsx10(
           "div",
           {
             role: "presentation",
@@ -3532,103 +3661,45 @@ var DataGridRowSkeleton = ({
 };
 
 // src/components/data-grid/components/data-grid-text-cell.tsx
-import { clx as clx6 } from "@medusajs/ui";
-import { useCallback as useCallback15, useEffect as useEffect6, useRef as useRef4, useState as useState9 } from "react";
-import { Controller as Controller4 } from "react-hook-form";
-import { jsx as jsx10 } from "react/jsx-runtime";
+import { clx as clx7 } from "@medusajs/ui";
+import { useEffect as useEffect7, useRef as useRef5, useState as useState10 } from "react";
+import { Controller as Controller5 } from "react-hook-form";
+import { jsx as jsx11 } from "react/jsx-runtime";
 var DataGridTextCell = ({
-  context,
-  isMultiLine = false
+  context
 }) => {
   const { field, control, renderProps } = useDataGridCell({
     context
   });
   const errorProps = useDataGridCellError({ context });
   const { container, input } = renderProps;
-  return /* @__PURE__ */ jsx10(
-    Controller4,
+  return /* @__PURE__ */ jsx11(
+    Controller5,
     {
       control,
       name: field,
       render: ({ field: field2 }) => {
-        return /* @__PURE__ */ jsx10(
-          DataGridCellContainer,
-          {
-            ...container,
-            ...errorProps,
-            isMultiLine,
-            children: /* @__PURE__ */ jsx10(Inner4, { field: field2, inputProps: input, isMultiLine })
-          }
-        );
+        return /* @__PURE__ */ jsx11(DataGridCellContainer, { ...container, ...errorProps, children: /* @__PURE__ */ jsx11(Inner5, { field: field2, inputProps: input }) });
       }
     }
   );
 };
-var Inner4 = ({
+var Inner5 = ({
   field,
-  inputProps,
-  isMultiLine
+  inputProps
 }) => {
   const { onChange: _, onBlur, ref, value, ...rest } = field;
   const { ref: inputRef, onBlur: onInputBlur, onChange, ...input } = inputProps;
-  const [localValue, setLocalValue] = useState9(value);
-  const textareaRef = useRef4(null);
-  useEffect6(() => {
+  const [localValue, setLocalValue] = useState10(value);
+  const inputElRef = useRef5(null);
+  useEffect7(() => {
     setLocalValue(value);
   }, [value]);
-  const combinedRefs = useCombinedRefs(inputRef, ref);
-  const textareaCombinedRefs = useCombinedRefs(inputRef, ref, textareaRef);
-  const adjustTextareaHeight = useCallback15(() => {
-    const textarea = textareaRef.current;
-    if (textarea) {
-      textarea.style.height = "0px";
-      const newHeight = Math.max(textarea.scrollHeight, 24);
-      textarea.style.height = `${newHeight}px`;
-    }
-  }, []);
-  useEffect6(() => {
-    if (isMultiLine) {
-      adjustTextareaHeight();
-    }
-  }, [localValue, isMultiLine, adjustTextareaHeight]);
-  useEffect6(() => {
-    if (isMultiLine) {
-      adjustTextareaHeight();
-      const timeoutId = setTimeout(adjustTextareaHeight, 50);
-      return () => clearTimeout(timeoutId);
-    }
-  }, [isMultiLine, adjustTextareaHeight]);
-  if (isMultiLine) {
-    return /* @__PURE__ */ jsx10(
-      "textarea",
-      {
-        className: clx6(
-          "txt-compact-small text-ui-fg-subtle flex w-full cursor-pointer bg-transparent outline-none",
-          "focus:cursor-text",
-          "resize-none overflow-hidden py-2"
-        ),
-        autoComplete: "off",
-        tabIndex: -1,
-        value: localValue ?? "",
-        onChange: (e) => {
-          setLocalValue(e.target.value);
-          adjustTextareaHeight();
-        },
-        ref: textareaCombinedRefs,
-        onBlur: () => {
-          onBlur();
-          onInputBlur();
-          onChange(localValue, value);
-        },
-        ...input,
-        ...rest
-      }
-    );
-  }
-  return /* @__PURE__ */ jsx10(
+  const combinedRefs = useCombinedRefs(inputRef, ref, inputElRef);
+  return /* @__PURE__ */ jsx11(
     "input",
     {
-      className: clx6(
+      className: clx7(
         "txt-compact-small text-ui-fg-subtle flex size-full cursor-pointer bg-transparent outline-none",
         "focus:cursor-text",
         "items-center justify-center"
@@ -3650,11 +3721,11 @@ var Inner4 = ({
 };
 
 // src/components/data-grid/components/data-grid-textarea-modal-cell.tsx
-import { clx as clx7, Textarea } from "@medusajs/ui";
+import { clx as clx8, Textarea } from "@medusajs/ui";
 import { Popover as RadixPopover } from "radix-ui";
-import { useCallback as useCallback16, useEffect as useEffect7, useRef as useRef5, useState as useState10 } from "react";
-import { Controller as Controller5 } from "react-hook-form";
-import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
+import { useCallback as useCallback16, useEffect as useEffect8, useRef as useRef6, useState as useState11 } from "react";
+import { Controller as Controller6 } from "react-hook-form";
+import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
 var DataGridExpandableTextCell = ({
   context,
   fieldLabel
@@ -3664,14 +3735,14 @@ var DataGridExpandableTextCell = ({
   });
   const errorProps = useDataGridCellError({ context });
   const { container, input } = renderProps;
-  return /* @__PURE__ */ jsx11(
-    Controller5,
+  return /* @__PURE__ */ jsx12(
+    Controller6,
     {
       control,
       name: field,
       render: ({ field: field2 }) => {
-        return /* @__PURE__ */ jsx11(
-          Inner5,
+        return /* @__PURE__ */ jsx12(
+          Inner6,
           {
             field: field2,
             inputProps: input,
@@ -3684,7 +3755,7 @@ var DataGridExpandableTextCell = ({
     }
   );
 };
-var Inner5 = ({
+var Inner6 = ({
   field,
   inputProps,
   fieldLabel: _fieldLabel,
@@ -3695,19 +3766,19 @@ var Inner5 = ({
   const { ref: inputRef, onBlur: onInputBlur, onChange, ...input } = inputProps;
   const { setSingleRange, anchor } = useDataGridContext();
   const { row, col } = anchor || { row: 0, col: 0 };
-  const [localValue, setLocalValue] = useState10(value || "");
-  const [isPopoverOpen, setIsPopoverOpen] = useState10(false);
-  const [popoverValue, setPopoverValue] = useState10(value || "");
-  const popoverContentRef = useRef5(null);
-  useEffect7(() => {
+  const [localValue, setLocalValue] = useState11(value || "");
+  const [isPopoverOpen, setIsPopoverOpen] = useState11(false);
+  const [popoverValue, setPopoverValue] = useState11(value || "");
+  const popoverContentRef = useRef6(null);
+  useEffect8(() => {
     setLocalValue(value || "");
   }, [value]);
-  useEffect7(() => {
+  useEffect8(() => {
     if (isPopoverOpen) {
       setPopoverValue(value || "");
     }
   }, [isPopoverOpen, value]);
-  useEffect7(() => {
+  useEffect8(() => {
     if (!isPopoverOpen || !popoverContentRef.current) {
       return;
     }
@@ -3785,17 +3856,17 @@ var Inner5 = ({
       },
       children: [
         /* @__PURE__ */ jsxs8(DataGridCellContainer, { ...customContainer, ...errorProps, children: [
-          /* @__PURE__ */ jsx11(RadixPopover.Anchor, { asChild: true, children: /* @__PURE__ */ jsx11(
+          /* @__PURE__ */ jsx12(RadixPopover.Anchor, { asChild: true, children: /* @__PURE__ */ jsx12(
             "div",
             {
-              className: clx7(
+              className: clx8(
                 "txt-compact-small text-ui-fg-subtle flex size-full cursor-pointer items-center justify-center bg-transparent outline-none",
                 "focus:cursor-text"
               ),
-              children: /* @__PURE__ */ jsx11("span", { className: "w-full truncate text-center", children: truncatedValue })
+              children: /* @__PURE__ */ jsx12("span", { className: "w-full truncate text-center", children: truncatedValue })
             }
           ) }),
-          /* @__PURE__ */ jsx11(
+          /* @__PURE__ */ jsx12(
             "input",
             {
               className: "sr-only",
@@ -3814,10 +3885,10 @@ var Inner5 = ({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx11(RadixPopover.Portal, { children: /* @__PURE__ */ jsx11(
+        /* @__PURE__ */ jsx12(RadixPopover.Portal, { children: /* @__PURE__ */ jsx12(
           RadixPopover.Content,
           {
-            className: clx7(
+            className: clx8(
               "bg-ui-bg-base shadow-elevation-flyout flex max-h-[80vh] w-[600px] overflow-hidden p-0 outline-none"
             ),
             align: "start",
@@ -3827,7 +3898,7 @@ var Inner5 = ({
             collisionPadding: 24,
             onEscapeKeyDown: handlePopoverSave,
             onKeyDown: handlePopoverKeyDown,
-            children: /* @__PURE__ */ jsx11("div", { ref: popoverContentRef, className: "h-full w-full", children: /* @__PURE__ */ jsx11(
+            children: /* @__PURE__ */ jsx12("div", { ref: popoverContentRef, className: "h-full w-full", children: /* @__PURE__ */ jsx12(
               Textarea,
               {
                 value: popoverValue,
@@ -3846,7 +3917,7 @@ var Inner5 = ({
 };
 
 // src/components/data-grid/data-grid.tsx
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 var _DataGrid = ({
   isLoading,
   // Lazy loading props - passed through to DataGridRoot
@@ -3856,13 +3927,13 @@ var _DataGrid = ({
   hasNextPage,
   ...props
 }) => {
-  return isLoading ? /* @__PURE__ */ jsx12(
+  return isLoading ? /* @__PURE__ */ jsx13(
     DataGridSkeleton,
     {
       columns: props.columns,
       rows: props.data?.length && props.data.length > 0 ? props.data.length : 10
     }
-  ) : /* @__PURE__ */ jsx12(
+  ) : /* @__PURE__ */ jsx13(
     DataGridRoot,
     {
       ...props,
@@ -3876,6 +3947,7 @@ var _DataGrid = ({
 var DataGrid = Object.assign(_DataGrid, {
   BooleanCell: DataGridBooleanCell,
   TextCell: DataGridTextCell,
+  MultilineCell: DataGridMultilineCell,
   ExpandableTextCell: DataGridExpandableTextCell,
   NumberCell: DataGridNumberCell,
   CurrencyCell: DataGridCurrencyCell,
@@ -3921,23 +3993,23 @@ function createDataGridHelper() {
 import { TaxExclusive, TaxInclusive } from "@medusajs/icons";
 import { Tooltip as Tooltip3 } from "@medusajs/ui";
 import { useTranslation as useTranslation4 } from "react-i18next";
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 var IncludesTaxTooltip = ({
   includesTax
 }) => {
   const { t } = useTranslation4();
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14(
     Tooltip3,
     {
       maxWidth: 999,
       content: includesTax ? t("general.includesTaxTooltip") : t("general.excludesTaxTooltip"),
-      children: includesTax ? /* @__PURE__ */ jsx13(TaxInclusive, { className: "text-ui-fg-muted shrink-0" }) : /* @__PURE__ */ jsx13(TaxExclusive, { className: "text-ui-fg-muted shrink-0" })
+      children: includesTax ? /* @__PURE__ */ jsx14(TaxInclusive, { className: "text-ui-fg-muted shrink-0" }) : /* @__PURE__ */ jsx14(TaxExclusive, { className: "text-ui-fg-muted shrink-0" })
     }
   );
 };
 
 // src/components/data-grid/helpers/create-data-grid-price-columns.tsx
-import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
 var createDataGridPriceColumns = ({
   currencies: currencies2,
   regions,
@@ -3969,14 +4041,14 @@ var createDataGridPriceColumns = ({
         },
         type: "number",
         header: () => /* @__PURE__ */ jsxs9("div", { className: "flex w-full items-center justify-between gap-3", children: [
-          /* @__PURE__ */ jsx14("span", { className: "truncate", title: translatedCurrencyName, children: translatedCurrencyName }),
-          /* @__PURE__ */ jsx14(IncludesTaxTooltip, { includesTax: preference?.is_tax_inclusive })
+          /* @__PURE__ */ jsx15("span", { className: "truncate", title: translatedCurrencyName, children: translatedCurrencyName }),
+          /* @__PURE__ */ jsx15(IncludesTaxTooltip, { includesTax: preference?.is_tax_inclusive })
         ] }),
         cell: (context) => {
           if (isReadyOnly?.(context)) {
-            return /* @__PURE__ */ jsx14(DataGridReadonlyCell, { context });
+            return /* @__PURE__ */ jsx15(DataGridReadonlyCell, { context });
           }
-          return /* @__PURE__ */ jsx14(DataGridCurrencyCell, { code: currency, context });
+          return /* @__PURE__ */ jsx15(DataGridCurrencyCell, { code: currency, context });
         }
       });
     }) ?? [],
@@ -4001,18 +4073,18 @@ var createDataGridPriceColumns = ({
         },
         type: "number",
         header: () => /* @__PURE__ */ jsxs9("div", { className: "flex w-full items-center justify-between gap-3", children: [
-          /* @__PURE__ */ jsx14("span", { className: "truncate", title: translatedRegionName, children: translatedRegionName }),
-          /* @__PURE__ */ jsx14(IncludesTaxTooltip, { includesTax: preference?.is_tax_inclusive })
+          /* @__PURE__ */ jsx15("span", { className: "truncate", title: translatedRegionName, children: translatedRegionName }),
+          /* @__PURE__ */ jsx15(IncludesTaxTooltip, { includesTax: preference?.is_tax_inclusive })
         ] }),
         cell: (context) => {
           if (isReadyOnly?.(context)) {
-            return /* @__PURE__ */ jsx14(DataGridReadonlyCell, { context });
+            return /* @__PURE__ */ jsx15(DataGridReadonlyCell, { context });
           }
           const currency = currencies2?.find((c) => c === region.currency_code);
           if (!currency) {
             return null;
           }
-          return /* @__PURE__ */ jsx14(
+          return /* @__PURE__ */ jsx15(
             DataGridCurrencyCell,
             {
               code: region.currency_code,