@dmsi/wedgekit-react 0.0.171 → 0.0.173

package/dist/{chunk-GCBW2LDM.js → chunk-REGRTR2Y.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk-SYEJVSE4.js";
 import {
   ModalHeader
-} from "./chunk-6A54FL75.js";
+} from "./chunk-ZSKLCKIR.js";
 import {
   ModalScrim
 } from "./chunk-ZFOANBWG.js";
@@ -97,6 +97,7 @@ var Modal = ({
   showButtons = false,
   hideCloseIcon = false,
   headerIcon,
+  headerIconAlign,
   fixedHeightScrolling = false,
   customActions
 }) => {
@@ -126,7 +127,7 @@ var Modal = ({
       fadeInScale(modalRef.current);
       bgFadeIn(bgRef.current);
     }
-  }, [mounted, open]);
+  }, [mounted, onClose, open, wasOpen]);
   const handleKeyDown = useCallback(
     (e) => {
       if (e.key === "Escape") {
@@ -136,7 +137,7 @@ var Modal = ({
         }
       }
     },
-    [onClose, bgRef, modalRef]
+    [onClose]
   );
   const handleClose = useCallback(() => {
     if (onClose) {
@@ -221,7 +222,8 @@ var Modal = ({
                   title,
                   onClose: handleClose,
                   hideCloseIcon,
-                  headerIcon
+                  headerIcon,
+                  headerIconAlign
                 }
               ),
               children && /* @__PURE__ */ jsx(

package/dist/{chunk-OJX75MY2.js → chunk-TB7VTSDP.js}

@@ -185,7 +185,7 @@ function DataCellHeader(_a) {
     "testid",
     "useMenuDefaultMinWidth"
   ]);
-  var _a2;
+  var _a2, _b2, _c;
   const [showMenu, setShowMenu] = useState(false);
   const [filter, setFilter] = useState(
     (_a2 = header.column.getFilterValue()) != null ? _a2 : ""
@@ -219,7 +219,7 @@ function DataCellHeader(_a) {
   const style = __spreadValues({
     position: "relative",
     whiteSpace: "nowrap",
-    width: header.column.getSize(),
+    width: (_c = (_b2 = header.column.columnDef.meta) == null ? void 0 : _b2.headerWidth) != null ? _c : header.column.getSize(),
     "--color-text-primary-normal": "var(--color-text-brand-primary-normal)",
     "--color-icon-on-action-primary-normal": "var(--color-text-brand-primary-normal)",
     "--background-action-secondary-normal": "var(--color-text-brand-primary-normal)"
@@ -256,8 +256,8 @@ function DataCellHeader(_a) {
                   id: id ? `${id}-filter-option` : void 0,
                   testid: testid ? `${testid}-filter-option` : void 0
                 }, subMenuListeners), {
-                  subMenu: (_b2) => {
-                    var _c = _b2, { menuId, subMenuLevel } = _c, props2 = __objRest(_c, ["menuId", "subMenuLevel"]);
+                  subMenu: (_d) => {
+                    var _e = _d, { menuId, subMenuLevel } = _e, props2 = __objRest(_e, ["menuId", "subMenuLevel"]);
                     return /* @__PURE__ */ jsxs(
                       Menu,
                       __spreadProps(__spreadValues({
@@ -330,8 +330,8 @@ function DataCellHeader(_a) {
                     setShowMenu(!showMenu);
                   }
                 }, subMenuListeners), {
-                  subMenu: (_d) => {
-                    var _e = _d, { menuId, subMenuLevel } = _e, props2 = __objRest(_e, ["menuId", "subMenuLevel"]);
+                  subMenu: (_f) => {
+                    var _g = _f, { menuId, subMenuLevel } = _g, props2 = __objRest(_g, ["menuId", "subMenuLevel"]);
                     return /* @__PURE__ */ jsxs(
                       Menu,
                       __spreadProps(__spreadValues({}, props2), {
@@ -419,6 +419,7 @@ function DraggableCellHeader(_a) {
     "header",
     "children"
   ]);
+  var _a2, _b2;
   const { attributes, isDragging, listeners, setNodeRef, transform, node } = useSortable({
     id: header.column.id
   });
@@ -429,7 +430,7 @@ function DraggableCellHeader(_a) {
     transition: "width transform 0.2s ease-in-out",
     whiteSpace: "nowrap",
     zIndex: isDragging ? 1 : 0,
-    width: header.column.getSize(),
+    width: (_b2 = (_a2 = header.column.columnDef.meta) == null ? void 0 : _a2.headerWidth) != null ? _b2 : header.column.getSize(),
     "--color-text-primary-normal": "var(--color-action-000)",
     "--color-icon-on-action-primary-normal": "var(--color-action-000)",
     userSelect: "none"
@@ -455,6 +456,7 @@ function DragAlongCell(_a) {
     "cell",
     "children"
   ]);
+  var _a2, _b2, _c, _d;
   const { isDragging, setNodeRef, transform } = useSortable({
     id: cell.column.id
   });
@@ -463,10 +465,19 @@ function DragAlongCell(_a) {
     position: "relative",
     transform: CSS.Translate.toString(transform),
     transition: "width transform 0.2s ease-in-out",
-    width: cell.column.getSize(),
+    width: (_b2 = (_a2 = cell.column.columnDef.meta) == null ? void 0 : _a2.headerWidth) != null ? _b2 : cell.column.getSize(),
     zIndex: isDragging ? 1 : 0
   };
-  return /* @__PURE__ */ jsx(DataGridCell, __spreadProps(__spreadValues({ style, ref: setNodeRef }, props), { children }));
+  return /* @__PURE__ */ jsx(
+    DataGridCell,
+    __spreadProps(__spreadValues({
+      style,
+      ref: setNodeRef,
+      width: (_d = (_c = cell.column.columnDef.meta) == null ? void 0 : _c.headerWidth) != null ? _d : `${cell.column.getSize()}px`
+    }, props), {
+      children
+    })
+  );
 }
 DragAlongCell.displayName = "DragAlongCell";
 

package/dist/{chunk-6A54FL75.js → chunk-ZSKLCKIR.js}

@@ -19,6 +19,7 @@ var ModalHeader = ({
   title,
   hideCloseIcon,
   headerIcon,
+  headerIconAlign,
   onClose,
   id,
   testid
@@ -30,13 +31,24 @@ var ModalHeader = ({
       "data-testid": testid,
       className: clsx(
         "flex justify-between items-center",
+        headerIconAlign === "center" && "justify-center",
+        headerIconAlign === "right" && "justify-end",
+        headerIconAlign === "left" && "justify-start",
         layoutPaddding,
         layoutGroupGap
       ),
       children: [
         /* @__PURE__ */ jsxs("div", { className: clsx("flex items-center", layoutGroupGap), children: [
           headerIcon,
-          title && /* @__PURE__ */ jsx(Heading2, { id: id ? `${id}-title` : void 0, testid: testid ? `${testid}-title` : void 0, as: "p", children: title })
+          title && /* @__PURE__ */ jsx(
+            Heading2,
+            {
+              id: id ? `${id}-title` : void 0,
+              testid: testid ? `${testid}-title` : void 0,
+              as: "p",
+              children: title
+            }
+          )
         ] }),
         !hideCloseIcon && /* @__PURE__ */ jsx(
           Button,

package/dist/components/DataGridCell.cjs

@@ -1839,7 +1839,7 @@ function DataCellHeader(_a) {
     "testid",
     "useMenuDefaultMinWidth"
   ]);
-  var _a2;
+  var _a2, _b2, _c;
   const [showMenu, setShowMenu] = (0, import_react10.useState)(false);
   const [filter, setFilter] = (0, import_react10.useState)(
     (_a2 = header.column.getFilterValue()) != null ? _a2 : ""
@@ -1873,7 +1873,7 @@ function DataCellHeader(_a) {
   const style = __spreadValues({
     position: "relative",
     whiteSpace: "nowrap",
-    width: header.column.getSize(),
+    width: (_c = (_b2 = header.column.columnDef.meta) == null ? void 0 : _b2.headerWidth) != null ? _c : header.column.getSize(),
     "--color-text-primary-normal": "var(--color-text-brand-primary-normal)",
     "--color-icon-on-action-primary-normal": "var(--color-text-brand-primary-normal)",
     "--background-action-secondary-normal": "var(--color-text-brand-primary-normal)"
@@ -1910,8 +1910,8 @@ function DataCellHeader(_a) {
                   id: id ? `${id}-filter-option` : void 0,
                   testid: testid ? `${testid}-filter-option` : void 0
                 }, subMenuListeners), {
-                  subMenu: (_b2) => {
-                    var _c = _b2, { menuId, subMenuLevel } = _c, props2 = __objRest(_c, ["menuId", "subMenuLevel"]);
+                  subMenu: (_d) => {
+                    var _e = _d, { menuId, subMenuLevel } = _e, props2 = __objRest(_e, ["menuId", "subMenuLevel"]);
                     return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
                       Menu,
                       __spreadProps(__spreadValues({
@@ -1984,8 +1984,8 @@ function DataCellHeader(_a) {
                     setShowMenu(!showMenu);
                   }
                 }, subMenuListeners), {
-                  subMenu: (_d) => {
-                    var _e = _d, { menuId, subMenuLevel } = _e, props2 = __objRest(_e, ["menuId", "subMenuLevel"]);
+                  subMenu: (_f) => {
+                    var _g = _f, { menuId, subMenuLevel } = _g, props2 = __objRest(_g, ["menuId", "subMenuLevel"]);
                     return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
                       Menu,
                       __spreadProps(__spreadValues({}, props2), {
@@ -2073,6 +2073,7 @@ function DraggableCellHeader(_a) {
     "header",
     "children"
   ]);
+  var _a2, _b2;
   const { attributes, isDragging, listeners, setNodeRef, transform, node } = (0, import_sortable.useSortable)({
     id: header.column.id
   });
@@ -2083,7 +2084,7 @@ function DraggableCellHeader(_a) {
     transition: "width transform 0.2s ease-in-out",
     whiteSpace: "nowrap",
     zIndex: isDragging ? 1 : 0,
-    width: header.column.getSize(),
+    width: (_b2 = (_a2 = header.column.columnDef.meta) == null ? void 0 : _a2.headerWidth) != null ? _b2 : header.column.getSize(),
     "--color-text-primary-normal": "var(--color-action-000)",
     "--color-icon-on-action-primary-normal": "var(--color-action-000)",
     userSelect: "none"
@@ -2109,6 +2110,7 @@ function DragAlongCell(_a) {
     "cell",
     "children"
   ]);
+  var _a2, _b2, _c, _d;
   const { isDragging, setNodeRef, transform } = (0, import_sortable.useSortable)({
     id: cell.column.id
   });
@@ -2117,10 +2119,19 @@ function DragAlongCell(_a) {
     position: "relative",
     transform: CSS.Translate.toString(transform),
     transition: "width transform 0.2s ease-in-out",
-    width: cell.column.getSize(),
+    width: (_b2 = (_a2 = cell.column.columnDef.meta) == null ? void 0 : _a2.headerWidth) != null ? _b2 : cell.column.getSize(),
     zIndex: isDragging ? 1 : 0
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(DataGridCell, __spreadProps(__spreadValues({ style, ref: setNodeRef }, props), { children }));
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    DataGridCell,
+    __spreadProps(__spreadValues({
+      style,
+      ref: setNodeRef,
+      width: (_d = (_c = cell.column.columnDef.meta) == null ? void 0 : _c.headerWidth) != null ? _d : `${cell.column.getSize()}px`
+    }, props), {
+      children
+    })
+  );
 }
 DragAlongCell.displayName = "DragAlongCell";
 // Annotate the CommonJS export names for ESM import in node:

package/dist/components/DataGridCell.js

@@ -4,7 +4,7 @@ import {
   DataGridCell,
   DragAlongCell,
   DraggableCellHeader
-} from "../chunk-OJX75MY2.js";
+} from "../chunk-TB7VTSDP.js";
 import "../chunk-FFU6FB3K.js";
 import "../chunk-UBU6IJML.js";
 import "../chunk-5GUW4DUY.js";

package/dist/components/Modal.cjs

@@ -428,6 +428,7 @@ var ModalHeader = ({
   title,
   hideCloseIcon,
   headerIcon,
+  headerIconAlign,
   onClose,
   id,
   testid
@@ -439,13 +440,24 @@ var ModalHeader = ({
       "data-testid": testid,
       className: (0, import_clsx5.default)(
         "flex justify-between items-center",
+        headerIconAlign === "center" && "justify-center",
+        headerIconAlign === "right" && "justify-end",
+        headerIconAlign === "left" && "justify-start",
         layoutPaddding,
         layoutGroupGap
       ),
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: (0, import_clsx5.default)("flex items-center", layoutGroupGap), children: [
           headerIcon,
-          title && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Heading2, { id: id ? `${id}-title` : void 0, testid: testid ? `${testid}-title` : void 0, as: "p", children: title })
+          title && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            Heading2,
+            {
+              id: id ? `${id}-title` : void 0,
+              testid: testid ? `${testid}-title` : void 0,
+              as: "p",
+              children: title
+            }
+          )
         ] }),
         !hideCloseIcon && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
           Button,
@@ -705,6 +717,7 @@ var Modal = ({
   showButtons = false,
   hideCloseIcon = false,
   headerIcon,
+  headerIconAlign,
   fixedHeightScrolling = false,
   customActions
 }) => {
@@ -734,7 +747,7 @@ var Modal = ({
       fadeInScale(modalRef.current);
       bgFadeIn(bgRef.current);
     }
-  }, [mounted, open]);
+  }, [mounted, onClose, open, wasOpen]);
   const handleKeyDown = (0, import_react5.useCallback)(
     (e) => {
       if (e.key === "Escape") {
@@ -744,7 +757,7 @@ var Modal = ({
         }
       }
     },
-    [onClose, bgRef, modalRef]
+    [onClose]
   );
   const handleClose = (0, import_react5.useCallback)(() => {
     if (onClose) {
@@ -829,7 +842,8 @@ var Modal = ({
                   title,
                   onClose: handleClose,
                   hideCloseIcon,
-                  headerIcon
+                  headerIcon,
+                  headerIconAlign
                 }
               ),
               children && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(

package/dist/components/Modal.js

@@ -1,11 +1,11 @@
 "use client";
 import {
   Modal
-} from "../chunk-GCBW2LDM.js";
+} from "../chunk-REGRTR2Y.js";
 import "../chunk-4RJKB7LC.js";
 import "../chunk-T7NDKJDP.js";
 import "../chunk-SYEJVSE4.js";
-import "../chunk-6A54FL75.js";
+import "../chunk-ZSKLCKIR.js";
 import "../chunk-ZFOANBWG.js";
 import "../chunk-AZ7LVLOK.js";
 import "../chunk-WNQ53SVY.js";

package/dist/components/ModalHeader.cjs

@@ -425,6 +425,7 @@ var ModalHeader = ({
   title,
   hideCloseIcon,
   headerIcon,
+  headerIconAlign,
   onClose,
   id,
   testid
@@ -436,13 +437,24 @@ var ModalHeader = ({
       "data-testid": testid,
       className: (0, import_clsx5.default)(
         "flex justify-between items-center",
+        headerIconAlign === "center" && "justify-center",
+        headerIconAlign === "right" && "justify-end",
+        headerIconAlign === "left" && "justify-start",
         layoutPaddding,
         layoutGroupGap
       ),
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: (0, import_clsx5.default)("flex items-center", layoutGroupGap), children: [
           headerIcon,
-          title && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Heading2, { id: id ? `${id}-title` : void 0, testid: testid ? `${testid}-title` : void 0, as: "p", children: title })
+          title && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            Heading2,
+            {
+              id: id ? `${id}-title` : void 0,
+              testid: testid ? `${testid}-title` : void 0,
+              as: "p",
+              children: title
+            }
+          )
         ] }),
         !hideCloseIcon && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
           Button,

package/dist/components/ModalHeader.js

@@ -1,6 +1,6 @@
 import {
   ModalHeader
-} from "../chunk-6A54FL75.js";
+} from "../chunk-ZSKLCKIR.js";
 import "../chunk-AZ7LVLOK.js";
 import "../chunk-NKUETCDA.js";
 import "../chunk-FKMKHLQH.js";