@ceed/ads 0.0.29 → 0.0.30

package/dist/components/DataTable/DataTable.js

@@ -71,6 +71,29 @@ function TablePagination(props) {
             page !== lastPage && (React.createElement(Button, { size: "sm", variant: "plain", color: "neutral", onClick: function () { return onPageChange(lastPage); } }, lastPage)),
             React.createElement(Button, { size: "sm", variant: "plain", color: "neutral", onClick: function () { return onPageChange(page + 1); }, disabled: page === lastPage, "aria-label": "Next page" }, ">"))));
 }
+var Resizer = function (ref) { return (React.createElement(Box, { sx: {
+        position: "absolute",
+        top: 0,
+        right: 0,
+        bottom: 0,
+        width: "4px",
+        cursor: "col-resize",
+    }, onMouseDown: function (e) {
+        var _a;
+        var initialX = e.clientX;
+        var initialWidth = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width;
+        var onMouseMove = function (e) {
+            if (initialWidth && initialX) {
+                ref.current.style.width = "".concat(initialWidth + (e.clientX - initialX), "px");
+            }
+        };
+        var onMouseUp = function () {
+            document.removeEventListener("mousemove", onMouseMove);
+            document.removeEventListener("mouseup", onMouseUp);
+        };
+        document.addEventListener("mousemove", onMouseMove);
+        document.addEventListener("mouseup", onMouseUp);
+    } })); };
 function useDataTableRenderer(_a) {
     var rows = _a.rows, columns = _a.columns, totalRowsProp = _a.rowCount, paginationModel = _a.paginationModel, onPaginationModelChange = _a.onPaginationModelChange, _b = _a.selectionModel, selectionModel = _b === void 0 ? [] : _b, onSelectionModelChange = _a.onSelectionModelChange, stickyHeader = _a.stickyHeader;
     var _c = useState((paginationModel === null || paginationModel === void 0 ? void 0 : paginationModel.page) || 1), page = _c[0], setPage = _c[1];
@@ -106,42 +129,17 @@ function useDataTableRenderer(_a) {
         pageSize: pageSize,
         onPaginationModelChange: handlePageChange,
         getColumnHeader: useCallback(function (column) {
-            var _a, _b;
+            var _a, _b, _c;
             var ref = useRef(null);
-            var style = useMemo(function () {
-                var _a;
-                return ({
-                    width: column.width,
-                    minWidth: (_a = column.minWidth) !== null && _a !== void 0 ? _a : "50px",
-                    maxWidth: column.maxWidth,
-                    textAlign: column.type === "number" ? "end" : "start",
-                    position: stickyHeader ? undefined : "relative",
-                });
-            }, [column, stickyHeader]);
-            var resizer = ((_a = column.resizable) !== null && _a !== void 0 ? _a : true) ? (React.createElement(Box, { sx: {
-                    position: "absolute",
-                    top: 0,
-                    right: 0,
-                    bottom: 0,
-                    width: "4px",
-                    cursor: "col-resize",
-                }, onMouseDown: function (e) {
-                    var _a;
-                    var initialX = e.clientX;
-                    var initialWidth = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width;
-                    var onMouseMove = function (e) {
-                        if (initialWidth && initialX) {
-                            ref.current.style.width = "".concat(initialWidth + (e.clientX - initialX), "px");
-                        }
-                    };
-                    var onMouseUp = function () {
-                        document.removeEventListener("mousemove", onMouseMove);
-                        document.removeEventListener("mouseup", onMouseUp);
-                    };
-                    document.addEventListener("mousemove", onMouseMove);
-                    document.addEventListener("mouseup", onMouseUp);
-                } })) : null;
-            return (React.createElement("th", { ref: ref, key: column.field, style: style }, (_b = column.headerName) !== null && _b !== void 0 ? _b : column.field,
+            var style = {
+                width: column.width,
+                minWidth: (_a = column.minWidth) !== null && _a !== void 0 ? _a : "50px",
+                maxWidth: column.maxWidth,
+                textAlign: column.type === "number" ? "end" : "start",
+                position: stickyHeader ? undefined : "relative",
+            };
+            var resizer = ((_b = column.resizable) !== null && _b !== void 0 ? _b : true) ? Resizer(ref) : null;
+            return (React.createElement("th", { ref: ref, key: column.field, style: style }, (_c = column.headerName) !== null && _c !== void 0 ? _c : column.field,
                 resizer));
         }, [stickyHeader, columns]),
         dataInPage: dataInPage,

package/framer/index.js

@@ -32216,6 +32216,34 @@ function TablePagination(props) {
     }
   );
 }
+var Resizer = (ref) => /* @__PURE__ */ jsx2(
+  Box_default2,
+  {
+    sx: {
+      position: "absolute",
+      top: 0,
+      right: 0,
+      bottom: 0,
+      width: "4px",
+      cursor: "col-resize"
+    },
+    onMouseDown: (e) => {
+      const initialX = e.clientX;
+      const initialWidth = ref.current?.getBoundingClientRect().width;
+      const onMouseMove = (e2) => {
+        if (initialWidth && initialX) {
+          ref.current.style.width = `${initialWidth + (e2.clientX - initialX)}px`;
+        }
+      };
+      const onMouseUp = () => {
+        document.removeEventListener("mousemove", onMouseMove);
+        document.removeEventListener("mouseup", onMouseUp);
+      };
+      document.addEventListener("mousemove", onMouseMove);
+      document.addEventListener("mouseup", onMouseUp);
+    }
+  }
+);
 function useDataTableRenderer({
   rows,
   columns,
@@ -32273,44 +32301,14 @@ function useDataTableRenderer({
     getColumnHeader: useCallback23(
       (column2) => {
         const ref = useRef40(null);
-        const style4 = useMemo32(
-          () => ({
-            width: column2.width,
-            minWidth: column2.minWidth ?? "50px",
-            maxWidth: column2.maxWidth,
-            textAlign: column2.type === "number" ? "end" : "start",
-            position: stickyHeader ? void 0 : "relative"
-          }),
-          [column2, stickyHeader]
-        );
-        const resizer = column2.resizable ?? true ? /* @__PURE__ */ jsx2(
-          Box_default2,
-          {
-            sx: {
-              position: "absolute",
-              top: 0,
-              right: 0,
-              bottom: 0,
-              width: "4px",
-              cursor: "col-resize"
-            },
-            onMouseDown: (e) => {
-              const initialX = e.clientX;
-              const initialWidth = ref.current?.getBoundingClientRect().width;
-              const onMouseMove = (e2) => {
-                if (initialWidth && initialX) {
-                  ref.current.style.width = `${initialWidth + (e2.clientX - initialX)}px`;
-                }
-              };
-              const onMouseUp = () => {
-                document.removeEventListener("mousemove", onMouseMove);
-                document.removeEventListener("mouseup", onMouseUp);
-              };
-              document.addEventListener("mousemove", onMouseMove);
-              document.addEventListener("mouseup", onMouseUp);
-            }
-          }
-        ) : null;
+        const style4 = {
+          width: column2.width,
+          minWidth: column2.minWidth ?? "50px",
+          maxWidth: column2.maxWidth,
+          textAlign: column2.type === "number" ? "end" : "start",
+          position: stickyHeader ? void 0 : "relative"
+        };
+        const resizer = column2.resizable ?? true ? Resizer(ref) : null;
         return /* @__PURE__ */ jsxs2("th", { ref, style: style4, children: [
           column2.headerName ?? column2.field,
           resizer

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ceed/ads",
-  "version": "0.0.29",
+  "version": "0.0.30",
   "main": "dist/index.js",
   "type": "module",
   "description": "UI tool for Ecube Labs front-end developers",