@dmsi/wedgekit-react 0.0.162 → 0.0.164

package/dist/{chunk-SBSHZ327.js → chunk-A3FTZOB3.js}

@@ -1,18 +1,18 @@
 import {
   Menu
-} from "./chunk-RLK4TBXR.js";
+} from "./chunk-UZZLQASG.js";
 import {
   useSubMenuSystem
 } from "./chunk-5GUW4DUY.js";
 import {
   MenuOption
-} from "./chunk-FFU6FB3K.js";
-import {
-  Search
-} from "./chunk-PMBEIP24.js";
+} from "./chunk-AEDEFN7A.js";
 import {
   CSS
 } from "./chunk-WVUIIBRR.js";
+import {
+  Search
+} from "./chunk-IDSFWKOR.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
@@ -323,7 +323,7 @@ function DataCellHeader(_a) {
                   children: "Filter"
                 })
               ),
-              !predeterminedPinned.current && header.column.getCanPin() && /* @__PURE__ */ jsxs(
+              !predeterminedPinned.current && header.column.getCanPin() && /* @__PURE__ */ jsx(
                 MenuOption,
                 __spreadProps(__spreadValues({
                   onClick: () => {
@@ -374,11 +374,7 @@ function DataCellHeader(_a) {
                       })
                     );
                   },
-                  children: [
-                    "Freeze [",
-                    header.column.columnDef.header,
-                    "]"
-                  ]
+                  children: `Freeze [${header.column.columnDef.header}]`
                 })
               )
             ]

package/dist/{chunk-PMBEIP24.js → chunk-IDSFWKOR.js}

@@ -1,6 +1,6 @@
 import {
   Input
-} from "./chunk-4T3DRGLF.js";
+} from "./chunk-MVGOAMTP.js";
 import {
   __objRest,
   __spreadValues

package/dist/{chunk-XH65MD2C.js → chunk-KADNOKNW.js}

@@ -1,6 +1,6 @@
 import {
   InputBase
-} from "./chunk-4T3DRGLF.js";
+} from "./chunk-MVGOAMTP.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";

package/dist/{chunk-RLK4TBXR.js → chunk-UZZLQASG.js}

@@ -1,12 +1,12 @@
 import {
   useMenuPosition
 } from "./chunk-5GUW4DUY.js";
-import {
-  useMatchesMobile
-} from "./chunk-WNQ53SVY.js";
 import {
   findDocumentRoot
 } from "./chunk-6LN6QT6M.js";
+import {
+  useMatchesMobile
+} from "./chunk-WNQ53SVY.js";
 import {
   __objRest,
   __spreadProps,
@@ -40,7 +40,8 @@ var Menu = (_a) => {
     mobileHide,
     useDefaultMinWidth,
     autoFocusOff,
-    menuName
+    menuName,
+    calculateMinMaxHeight
   } = _b, props = __objRest(_b, [
     "id",
     "testid",
@@ -58,7 +59,8 @@ var Menu = (_a) => {
     "mobileHide",
     "useDefaultMinWidth",
     "autoFocusOff",
-    "menuName"
+    "menuName",
+    "calculateMinMaxHeight"
   ]);
   const internalRef = useRef(null);
   const actualRef = ref || internalRef;
@@ -75,8 +77,11 @@ var Menu = (_a) => {
     }
   );
   useEffect(() => {
+    if (calculateMinMaxHeight) {
+      return;
+    }
     const raf = requestAnimationFrame(() => {
-      if (!actualRef || !actualRef.current || customMaxHeight) {
+      if (!actualRef.current || customMaxHeight) {
         return;
       }
       if (actualRef.current.childElementCount > 4) {
@@ -94,7 +99,18 @@ var Menu = (_a) => {
     return () => {
       cancelAnimationFrame(raf);
     };
-  }, [actualRef, customMaxHeight]);
+  }, [actualRef.current, customMaxHeight, calculateMinMaxHeight]);
+  useEffect(() => {
+    if (!calculateMinMaxHeight) {
+      return;
+    }
+    if ((positionTo == null ? void 0 : positionTo.current) && actualRef.current) {
+      const positionToRect = positionTo.current.getBoundingClientRect();
+      const offsetInPx = 16;
+      const calculatedMaxHeight = window.innerHeight - positionToRect.bottom - offsetInPx;
+      setMaxHeight(`${calculatedMaxHeight}px`);
+    }
+  }, [actualRef.current, positionTo == null ? void 0 : positionTo.current, calculateMinMaxHeight]);
   useEffect(() => {
     if (!show) {
       return;

package/dist/components/DataGridCell.cjs

@@ -1228,7 +1228,8 @@ var Menu = (_a) => {
     mobileHide,
     useDefaultMinWidth,
     autoFocusOff,
-    menuName
+    menuName,
+    calculateMinMaxHeight
   } = _b, props = __objRest(_b, [
     "id",
     "testid",
@@ -1246,7 +1247,8 @@ var Menu = (_a) => {
     "mobileHide",
     "useDefaultMinWidth",
     "autoFocusOff",
-    "menuName"
+    "menuName",
+    "calculateMinMaxHeight"
   ]);
   const internalRef = (0, import_react8.useRef)(null);
   const actualRef = ref || internalRef;
@@ -1263,8 +1265,11 @@ var Menu = (_a) => {
     }
   );
   (0, import_react8.useEffect)(() => {
+    if (calculateMinMaxHeight) {
+      return;
+    }
     const raf = requestAnimationFrame(() => {
-      if (!actualRef || !actualRef.current || customMaxHeight) {
+      if (!actualRef.current || customMaxHeight) {
         return;
       }
       if (actualRef.current.childElementCount > 4) {
@@ -1282,7 +1287,18 @@ var Menu = (_a) => {
     return () => {
       cancelAnimationFrame(raf);
     };
-  }, [actualRef, customMaxHeight]);
+  }, [actualRef.current, customMaxHeight, calculateMinMaxHeight]);
+  (0, import_react8.useEffect)(() => {
+    if (!calculateMinMaxHeight) {
+      return;
+    }
+    if ((positionTo == null ? void 0 : positionTo.current) && actualRef.current) {
+      const positionToRect = positionTo.current.getBoundingClientRect();
+      const offsetInPx = 16;
+      const calculatedMaxHeight = window.innerHeight - positionToRect.bottom - offsetInPx;
+      setMaxHeight(`${calculatedMaxHeight}px`);
+    }
+  }, [actualRef.current, positionTo == null ? void 0 : positionTo.current, calculateMinMaxHeight]);
   (0, import_react8.useEffect)(() => {
     if (!show) {
       return;
@@ -1961,7 +1977,7 @@ function DataCellHeader(_a) {
                   children: "Filter"
                 })
               ),
-              !predeterminedPinned.current && header.column.getCanPin() && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+              !predeterminedPinned.current && header.column.getCanPin() && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                 MenuOption,
                 __spreadProps(__spreadValues({
                   onClick: () => {
@@ -2012,11 +2028,7 @@ function DataCellHeader(_a) {
                       })
                     );
                   },
-                  children: [
-                    "Freeze [",
-                    header.column.columnDef.header,
-                    "]"
-                  ]
+                  children: `Freeze [${header.column.columnDef.header}]`
                 })
               )
             ]

package/dist/components/DataGridCell.js

@@ -4,17 +4,17 @@ import {
   DataGridCell,
   DragAlongCell,
   DraggableCellHeader
-} from "../chunk-SBSHZ327.js";
-import "../chunk-RLK4TBXR.js";
+} from "../chunk-A3FTZOB3.js";
+import "../chunk-UZZLQASG.js";
 import "../chunk-5GUW4DUY.js";
-import "../chunk-FFU6FB3K.js";
-import "../chunk-WNQ53SVY.js";
+import "../chunk-AEDEFN7A.js";
+import "../chunk-WVUIIBRR.js";
 import "../chunk-6LN6QT6M.js";
-import "../chunk-PMBEIP24.js";
-import "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+import "../chunk-IDSFWKOR.js";
+import "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
-import "../chunk-WVUIIBRR.js";
+import "../chunk-WNQ53SVY.js";
+import "../chunk-5UH6QUFB.js";
 import "../chunk-HVI3CL7Y.js";
 import "../chunk-NKUETCDA.js";
 import "../chunk-RDLEIAQU.js";

package/dist/components/DateInput.js

@@ -1,21 +1,21 @@
-import {
-  calculateCursorPosition,
-  formatDate,
-  formatInputValue,
-  isValidDate,
-  parseInputDate
-} from "../chunk-M3433XEJ.js";
 import {
   findDocumentRoot
 } from "../chunk-6LN6QT6M.js";
 import {
   InputBase
-} from "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
 import {
   CalendarRange
 } from "../chunk-4XA32LKR.js";
+import {
+  calculateCursorPosition,
+  formatDate,
+  formatInputValue,
+  isValidDate,
+  parseInputDate
+} from "../chunk-M3433XEJ.js";
+import "../chunk-5UH6QUFB.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/DateRangeInput.js

@@ -1,22 +1,22 @@
-import {
-  calculateCursorPosition,
-  formatDate,
-  formatInputValue,
-  isValidDate,
-  isValidDateRangeOrder,
-  parseInputDate
-} from "../chunk-M3433XEJ.js";
 import {
   findDocumentRoot
 } from "../chunk-6LN6QT6M.js";
 import {
   InputBase
-} from "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
 import {
   CalendarRange
 } from "../chunk-4XA32LKR.js";
+import {
+  calculateCursorPosition,
+  formatDate,
+  formatInputValue,
+  isValidDate,
+  isValidDateRangeOrder,
+  parseInputDate
+} from "../chunk-M3433XEJ.js";
+import "../chunk-5UH6QUFB.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/FilterGroup.js

@@ -2,22 +2,22 @@
 import {
   OptionPill
 } from "../chunk-LM5MKBPM.js";
-import {
-  Checkbox
-} from "../chunk-WFQEE2OO.js";
 import {
   Search
-} from "../chunk-PMBEIP24.js";
-import "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-IDSFWKOR.js";
+import "../chunk-MVGOAMTP.js";
 import {
   Label
 } from "../chunk-JWCT72WR.js";
+import {
+  Checkbox
+} from "../chunk-WFQEE2OO.js";
+import "../chunk-FKMKHLQH.js";
+import "../chunk-5UH6QUFB.js";
 import "../chunk-HVI3CL7Y.js";
 import {
   Link
 } from "../chunk-I6GEUF6Y.js";
-import "../chunk-FKMKHLQH.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/Input.js

@@ -6,9 +6,9 @@ import {
   InputBase,
   Percentage,
   UOM
-} from "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
+import "../chunk-5UH6QUFB.js";
 import "../chunk-NKUETCDA.js";
 import "../chunk-RDLEIAQU.js";
 import "../chunk-ORMEWXMH.js";

package/dist/components/Menu.cjs

@@ -221,7 +221,8 @@ var Menu = (_a) => {
     mobileHide,
     useDefaultMinWidth,
     autoFocusOff,
-    menuName
+    menuName,
+    calculateMinMaxHeight
   } = _b, props = __objRest(_b, [
     "id",
     "testid",
@@ -239,7 +240,8 @@ var Menu = (_a) => {
     "mobileHide",
     "useDefaultMinWidth",
     "autoFocusOff",
-    "menuName"
+    "menuName",
+    "calculateMinMaxHeight"
   ]);
   const internalRef = (0, import_react5.useRef)(null);
   const actualRef = ref || internalRef;
@@ -256,8 +258,11 @@ var Menu = (_a) => {
     }
   );
   (0, import_react5.useEffect)(() => {
+    if (calculateMinMaxHeight) {
+      return;
+    }
     const raf = requestAnimationFrame(() => {
-      if (!actualRef || !actualRef.current || customMaxHeight) {
+      if (!actualRef.current || customMaxHeight) {
         return;
       }
       if (actualRef.current.childElementCount > 4) {
@@ -275,7 +280,18 @@ var Menu = (_a) => {
     return () => {
       cancelAnimationFrame(raf);
     };
-  }, [actualRef, customMaxHeight]);
+  }, [actualRef.current, customMaxHeight, calculateMinMaxHeight]);
+  (0, import_react5.useEffect)(() => {
+    if (!calculateMinMaxHeight) {
+      return;
+    }
+    if ((positionTo == null ? void 0 : positionTo.current) && actualRef.current) {
+      const positionToRect = positionTo.current.getBoundingClientRect();
+      const offsetInPx = 16;
+      const calculatedMaxHeight = window.innerHeight - positionToRect.bottom - offsetInPx;
+      setMaxHeight(`${calculatedMaxHeight}px`);
+    }
+  }, [actualRef.current, positionTo == null ? void 0 : positionTo.current, calculateMinMaxHeight]);
   (0, import_react5.useEffect)(() => {
     if (!show) {
       return;

package/dist/components/Menu.js

@@ -1,10 +1,10 @@
 "use client";
 import {
   Menu
-} from "../chunk-RLK4TBXR.js";
+} from "../chunk-UZZLQASG.js";
 import "../chunk-5GUW4DUY.js";
-import "../chunk-WNQ53SVY.js";
 import "../chunk-6LN6QT6M.js";
+import "../chunk-WNQ53SVY.js";
 import "../chunk-ORMEWXMH.js";
 export {
   Menu

package/dist/components/MenuOption.js

@@ -1,9 +1,9 @@
 "use client";
 import {
   MenuOption
-} from "../chunk-FFU6FB3K.js";
-import "../chunk-WNQ53SVY.js";
+} from "../chunk-AEDEFN7A.js";
 import "../chunk-JWCT72WR.js";
+import "../chunk-WNQ53SVY.js";
 import "../chunk-HVI3CL7Y.js";
 import "../chunk-NKUETCDA.js";
 import "../chunk-RDLEIAQU.js";

package/dist/components/MobileDataGrid.js

@@ -4,15 +4,15 @@ import {
 import {
   Heading3
 } from "../chunk-AZ7LVLOK.js";
+import {
+  Button
+} from "../chunk-FKMKHLQH.js";
 import {
   Stack
 } from "../chunk-N6JVLYEE.js";
 import {
   Paragraph
 } from "../chunk-HVI3CL7Y.js";
-import {
-  Button
-} from "../chunk-FKMKHLQH.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/Modal.js

@@ -1,16 +1,16 @@
 "use client";
 import {
   Modal
-} from "../chunk-FCREADUH.js";
+} from "../chunk-O7RLJT6I.js";
 import "../chunk-4RJKB7LC.js";
 import "../chunk-C4JGTH6G.js";
 import "../chunk-SYEJVSE4.js";
 import "../chunk-R7ELP5C5.js";
 import "../chunk-ZFOANBWG.js";
 import "../chunk-AZ7LVLOK.js";
-import "../chunk-WNQ53SVY.js";
 import "../chunk-6LN6QT6M.js";
 import "../chunk-FKMKHLQH.js";
+import "../chunk-WNQ53SVY.js";
 import "../chunk-NKUETCDA.js";
 import "../chunk-RDLEIAQU.js";
 import "../chunk-ORMEWXMH.js";

package/dist/components/NestedMenu.js

@@ -1,11 +1,11 @@
 "use client";
 import {
   MenuOption
-} from "../chunk-FFU6FB3K.js";
+} from "../chunk-AEDEFN7A.js";
+import "../chunk-JWCT72WR.js";
 import {
   useKeydown
 } from "../chunk-WNQ53SVY.js";
-import "../chunk-JWCT72WR.js";
 import "../chunk-HVI3CL7Y.js";
 import {
   Icon

package/dist/components/Notification.js

@@ -2,15 +2,15 @@
 import {
   Heading3
 } from "../chunk-AZ7LVLOK.js";
+import {
+  Button
+} from "../chunk-FKMKHLQH.js";
 import {
   Stack
 } from "../chunk-N6JVLYEE.js";
 import {
   Paragraph
 } from "../chunk-HVI3CL7Y.js";
-import {
-  Button
-} from "../chunk-FKMKHLQH.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/PDFViewer.js

@@ -1,7 +1,7 @@
 "use client";
 import {
   Modal
-} from "../chunk-FCREADUH.js";
+} from "../chunk-O7RLJT6I.js";
 import "../chunk-4RJKB7LC.js";
 import "../chunk-C4JGTH6G.js";
 import "../chunk-SYEJVSE4.js";
@@ -11,17 +11,17 @@ import {
   Spinner
 } from "../chunk-PLMGI5K5.js";
 import "../chunk-AZ7LVLOK.js";
+import "../chunk-6LN6QT6M.js";
 import {
   Caption
 } from "../chunk-E7D24OHM.js";
+import {
+  Button
+} from "../chunk-FKMKHLQH.js";
 import "../chunk-WNQ53SVY.js";
-import "../chunk-6LN6QT6M.js";
 import {
   Stack
 } from "../chunk-N6JVLYEE.js";
-import {
-  Button
-} from "../chunk-FKMKHLQH.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/Password.js

@@ -1,9 +1,9 @@
 "use client";
 import {
   InputBase
-} from "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
+import "../chunk-5UH6QUFB.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/Search.js

@@ -1,10 +1,10 @@
 "use client";
 import {
   Search
-} from "../chunk-PMBEIP24.js";
-import "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-IDSFWKOR.js";
+import "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
+import "../chunk-5UH6QUFB.js";
 import "../chunk-NKUETCDA.js";
 import "../chunk-RDLEIAQU.js";
 import "../chunk-ORMEWXMH.js";

package/dist/components/Select.js

@@ -1,10 +1,10 @@
 "use client";
 import {
   Select
-} from "../chunk-XH65MD2C.js";
-import "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-KADNOKNW.js";
+import "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
+import "../chunk-5UH6QUFB.js";
 import "../chunk-NKUETCDA.js";
 import "../chunk-RDLEIAQU.js";
 import "../chunk-ORMEWXMH.js";

package/dist/components/Stepper.js

@@ -1,12 +1,12 @@
 "use client";
 import {
   InputBase
-} from "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
 import {
   Button
 } from "../chunk-FKMKHLQH.js";
+import "../chunk-5UH6QUFB.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/Time.js

@@ -3,9 +3,9 @@ import {
 } from "../chunk-6LN6QT6M.js";
 import {
   InputBase
-} from "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-MVGOAMTP.js";
 import "../chunk-JWCT72WR.js";
+import "../chunk-5UH6QUFB.js";
 import {
   Stack
 } from "../chunk-N6JVLYEE.js";

package/dist/components/Toast.js

@@ -2,12 +2,12 @@
 import {
   Heading3
 } from "../chunk-AZ7LVLOK.js";
-import {
-  Paragraph
-} from "../chunk-HVI3CL7Y.js";
 import {
   Button
 } from "../chunk-FKMKHLQH.js";
+import {
+  Paragraph
+} from "../chunk-HVI3CL7Y.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/Upload.js

@@ -1,9 +1,9 @@
-import {
-  Paragraph
-} from "../chunk-HVI3CL7Y.js";
 import {
   Button
 } from "../chunk-FKMKHLQH.js";
+import {
+  Paragraph
+} from "../chunk-HVI3CL7Y.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";

package/dist/components/index.cjs

@@ -1270,7 +1270,8 @@ var Menu = (_a) => {
     mobileHide,
     useDefaultMinWidth,
     autoFocusOff,
-    menuName
+    menuName,
+    calculateMinMaxHeight
   } = _b, props = __objRest(_b, [
     "id",
     "testid",
@@ -1288,7 +1289,8 @@ var Menu = (_a) => {
     "mobileHide",
     "useDefaultMinWidth",
     "autoFocusOff",
-    "menuName"
+    "menuName",
+    "calculateMinMaxHeight"
   ]);
   const internalRef = (0, import_react8.useRef)(null);
   const actualRef = ref || internalRef;
@@ -1305,8 +1307,11 @@ var Menu = (_a) => {
     }
   );
   (0, import_react8.useEffect)(() => {
+    if (calculateMinMaxHeight) {
+      return;
+    }
     const raf = requestAnimationFrame(() => {
-      if (!actualRef || !actualRef.current || customMaxHeight) {
+      if (!actualRef.current || customMaxHeight) {
         return;
       }
       if (actualRef.current.childElementCount > 4) {
@@ -1324,7 +1329,18 @@ var Menu = (_a) => {
     return () => {
       cancelAnimationFrame(raf);
     };
-  }, [actualRef, customMaxHeight]);
+  }, [actualRef.current, customMaxHeight, calculateMinMaxHeight]);
+  (0, import_react8.useEffect)(() => {
+    if (!calculateMinMaxHeight) {
+      return;
+    }
+    if ((positionTo == null ? void 0 : positionTo.current) && actualRef.current) {
+      const positionToRect = positionTo.current.getBoundingClientRect();
+      const offsetInPx = 16;
+      const calculatedMaxHeight = window.innerHeight - positionToRect.bottom - offsetInPx;
+      setMaxHeight(`${calculatedMaxHeight}px`);
+    }
+  }, [actualRef.current, positionTo == null ? void 0 : positionTo.current, calculateMinMaxHeight]);
   (0, import_react8.useEffect)(() => {
     if (!show) {
       return;
@@ -2003,7 +2019,7 @@ function DataCellHeader(_a) {
                   children: "Filter"
                 })
               ),
-              !predeterminedPinned.current && header.column.getCanPin() && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+              !predeterminedPinned.current && header.column.getCanPin() && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                 MenuOption,
                 __spreadProps(__spreadValues({
                   onClick: () => {
@@ -2054,11 +2070,7 @@ function DataCellHeader(_a) {
                       })
                     );
                   },
-                  children: [
-                    "Freeze [",
-                    header.column.columnDef.header,
-                    "]"
-                  ]
+                  children: `Freeze [${header.column.columnDef.header}]`
                 })
               )
             ]
@@ -2632,6 +2644,7 @@ function ColumnSelectorHeaderCell({
             position: "bottom-right",
             show,
             setShow,
+            calculateMinMaxHeight: true,
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                 Button,
@@ -2670,7 +2683,7 @@ function ColumnSelectorHeaderCell({
 // src/components/DataGrid/index.tsx
 var import_jsx_runtime16 = require("react/jsx-runtime");
 var PAGE_SIZE_OPTIONS = [5, 10, 15, 20, 25, 30, 35];
-var NO_RESULTS_HEIGHT = "h-[120px]";
+var NO_RESULTS_HEIGHT = "h-[80px]";
 function DataGrid({
   id,
   testid,
@@ -2888,7 +2901,7 @@ function DataGrid({
                   {
                     className: (0, import_clsx13.default)(
                       "flex overflow-auto scrollbar-thin relative contain-paint will-change-transform",
-                      empty ? "overflow-y-hidden" : "h-full"
+                      empty ? "overflow-y-hidden" : "min-h-[120px]"
                     ),
                     ref: containerRef,
                     children: [

package/dist/components/index.js

@@ -3,38 +3,41 @@ import {
 } from "../chunk-4VTOTNKJ.js";
 import {
   Select
-} from "../chunk-XH65MD2C.js";
-import {
-  Checkbox
-} from "../chunk-WFQEE2OO.js";
+} from "../chunk-KADNOKNW.js";
 import {
   DataCellHeader,
   DataGridCell,
   DragAlongCell,
   DraggableCellHeader
-} from "../chunk-SBSHZ327.js";
+} from "../chunk-A3FTZOB3.js";
 import {
   Menu
-} from "../chunk-RLK4TBXR.js";
+} from "../chunk-UZZLQASG.js";
 import "../chunk-5GUW4DUY.js";
 import {
   MenuOption
-} from "../chunk-FFU6FB3K.js";
-import {
-  useInfiniteScroll
-} from "../chunk-WNQ53SVY.js";
+} from "../chunk-AEDEFN7A.js";
+import "../chunk-WVUIIBRR.js";
 import "../chunk-6LN6QT6M.js";
 import {
   Search
-} from "../chunk-PMBEIP24.js";
+} from "../chunk-IDSFWKOR.js";
 import {
   Input
-} from "../chunk-4T3DRGLF.js";
-import "../chunk-5UH6QUFB.js";
+} from "../chunk-MVGOAMTP.js";
 import {
   Label
 } from "../chunk-JWCT72WR.js";
-import "../chunk-WVUIIBRR.js";
+import {
+  Checkbox
+} from "../chunk-WFQEE2OO.js";
+import {
+  Button
+} from "../chunk-FKMKHLQH.js";
+import {
+  useInfiniteScroll
+} from "../chunk-WNQ53SVY.js";
+import "../chunk-5UH6QUFB.js";
 import {
   Subheader
 } from "../chunk-CYZL57LH.js";
@@ -48,9 +51,6 @@ import {
 import {
   Paragraph
 } from "../chunk-HVI3CL7Y.js";
-import {
-  Button
-} from "../chunk-FKMKHLQH.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";
@@ -560,6 +560,7 @@ function ColumnSelectorHeaderCell({
             position: "bottom-right",
             show,
             setShow,
+            calculateMinMaxHeight: true,
             children: [
               /* @__PURE__ */ jsx7(
                 Button,
@@ -598,7 +599,7 @@ function ColumnSelectorHeaderCell({
 // src/components/DataGrid/index.tsx
 import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
 var PAGE_SIZE_OPTIONS = [5, 10, 15, 20, 25, 30, 35];
-var NO_RESULTS_HEIGHT = "h-[120px]";
+var NO_RESULTS_HEIGHT = "h-[80px]";
 function DataGrid({
   id,
   testid,
@@ -816,7 +817,7 @@ function DataGrid({
                   {
                     className: clsx5(
                       "flex overflow-auto scrollbar-thin relative contain-paint will-change-transform",
-                      empty ? "overflow-y-hidden" : "h-full"
+                      empty ? "overflow-y-hidden" : "min-h-[120px]"
                     ),
                     ref: containerRef,
                     children: [

package/dist/index.css

@@ -741,8 +741,8 @@
   .h-60 {
     height: calc(var(--spacing) * 60);
   }
-  .h-\[120px\] {
-    height: 120px;
+  .h-\[80px\] {
+    height: 80px;
   }
   .h-\[166px\] {
     height: 166px;
@@ -777,6 +777,9 @@
   .min-h-\[34px\] {
     min-height: 34px;
   }
+  .min-h-\[120px\] {
+    min-height: 120px;
+  }
   .min-h-min {
     min-height: min-content;
   }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dmsi/wedgekit-react",
   "private": false,
-  "version": "0.0.162",
+  "version": "0.0.164",
   "type": "module",
   "scripts": {
     "build": "tsup",

package/src/components/DataGrid/ColumnSelectorHeaderCell/index.tsx

@@ -43,6 +43,7 @@ export function ColumnSelectorHeaderCell<T>({
         position="bottom-right"
         show={show}
         setShow={setShow}
+        calculateMinMaxHeight
       >
         <Button
           id={id ? `${id}-reset-button` : undefined}

package/src/components/DataGrid/index.tsx

@@ -53,7 +53,7 @@ import { ColumnSelectorHeaderCell } from "./ColumnSelectorHeaderCell";
 
 // Constants
 const PAGE_SIZE_OPTIONS = [5, 10, 15, 20, 25, 30, 35];
-const NO_RESULTS_HEIGHT = "h-[120px]";
+const NO_RESULTS_HEIGHT = "h-[80px]";
 
 export function DataGrid<T extends Record<string, unknown>>({
   id,
@@ -336,7 +336,7 @@ export function DataGrid<T extends Record<string, unknown>>({
           <div
             className={clsx(
               "flex overflow-auto scrollbar-thin relative contain-paint will-change-transform",
-              empty ? "overflow-y-hidden" : "h-full",
+              empty ? "overflow-y-hidden" : "min-h-[120px]",
             )}
             ref={containerRef}
           >

package/src/components/DataGridCell.tsx

@@ -405,7 +405,7 @@ export function DataCellHeader<T>({
                 </Menu>
               )}
             >
-              Freeze [{header.column.columnDef.header as string}]
+              {`Freeze [${header.column.columnDef.header as string}]`}
             </MenuOption>
           )}
         </Menu>

package/src/components/Menu.tsx

@@ -31,6 +31,7 @@ type MenuProps = {
   useDefaultMinWidth?: boolean;
   autoFocusOff?: boolean;
   menuName?: string;
+  calculateMinMaxHeight?: boolean;
 };
 
 export const Menu = ({
@@ -51,6 +52,7 @@ export const Menu = ({
   useDefaultMinWidth,
   autoFocusOff,
   menuName,
+  calculateMinMaxHeight,
   ...props
 }: ComponentProps<"div"> & MenuProps) => {
   const internalRef = useRef<HTMLDivElement>(null);
@@ -69,8 +71,12 @@ export const Menu = ({
   );
 
   useEffect(() => {
+    if (calculateMinMaxHeight) {
+      return;
+    }
+
     const raf = requestAnimationFrame(() => {
-      if (!actualRef || !actualRef.current || customMaxHeight) {
+      if (!actualRef.current || customMaxHeight) {
         return;
       }
 
@@ -85,15 +91,31 @@ export const Menu = ({
           accumulatedHeight += child.clientHeight;
         });
 
-        accumulatedHeight = (accumulatedHeight / 5) * 4.5;
+        accumulatedHeight = (accumulatedHeight / 5) * 4.5; // default max height is set to 4.5 times of the first 5 child height of the menu
 
         setMaxHeight(`${accumulatedHeight}px`);
       }
     });
+
     return () => {
       cancelAnimationFrame(raf);
     };
-  }, [actualRef, customMaxHeight]);
+  }, [actualRef.current, customMaxHeight, calculateMinMaxHeight]);
+
+  useEffect(() => {
+    if (!calculateMinMaxHeight) {
+      return;
+    }
+
+    if (positionTo?.current && actualRef.current) {
+      const positionToRect = positionTo.current.getBoundingClientRect();
+      const offsetInPx = 16;
+
+      const calculatedMaxHeight = window.innerHeight - positionToRect.bottom - offsetInPx;
+
+      setMaxHeight(`${calculatedMaxHeight}px`);
+    }
+  }, [actualRef.current, positionTo?.current, calculateMinMaxHeight])
 
   useEffect(() => {
     if (!show) {

package/dist/{chunk-FFU6FB3K.js → chunk-AEDEFN7A.js}

@@ -1,9 +1,9 @@
-import {
-  useMatchesMobile
-} from "./chunk-WNQ53SVY.js";
 import {
   Label
 } from "./chunk-JWCT72WR.js";
+import {
+  useMatchesMobile
+} from "./chunk-WNQ53SVY.js";
 import {
   Paragraph
 } from "./chunk-HVI3CL7Y.js";

package/dist/{chunk-4T3DRGLF.js → chunk-MVGOAMTP.js}

@@ -1,11 +1,11 @@
+import {
+  Label
+} from "./chunk-JWCT72WR.js";
 import {
   formatCurrencyDisplay,
   formatDecimalValue,
   getDecimalPlaceholder
 } from "./chunk-5UH6QUFB.js";
-import {
-  Label
-} from "./chunk-JWCT72WR.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";

package/dist/{chunk-FCREADUH.js → chunk-O7RLJT6I.js}

@@ -13,12 +13,12 @@ import {
 import {
   ModalScrim
 } from "./chunk-ZFOANBWG.js";
-import {
-  useMatchesMobile
-} from "./chunk-WNQ53SVY.js";
 import {
   findDocumentRoot
 } from "./chunk-6LN6QT6M.js";
+import {
+  useMatchesMobile
+} from "./chunk-WNQ53SVY.js";
 
 // src/components/Modal.tsx
 import clsx from "clsx";