npm - @portnet/ui - Versions diffs - 0.1.38 → 0.1.40 - Mend

@portnet/ui 0.1.38 → 0.1.40

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/dist/components/others/PuiChip.js +4 -29
package/dist/components/table/PuiTable.js +46 -173
package/dist/components/ui/pages/general/PuiSearchPage.js +88 -126
package/package.json +1 -1

package/dist/components/others/PuiChip.js CHANGED Viewed

@@ -13,11 +13,8 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var React = _interopRequireWildcard(require("react"));
 var _apperance = require("../../config/apperance");
 var _PuiTooltip = _interopRequireDefault(require("./PuiTooltip"));
-var _CheckCircle = _interopRequireDefault(require("@mui/icons-material/CheckCircle"));
-var _Error = _interopRequireDefault(require("@mui/icons-material/Error"));
-var _HourglassEmpty = _interopRequireDefault(require("@mui/icons-material/HourglassEmpty"));
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["id", "className", "sx", "color", "fullWidth", "children", "icon"];
+const _excluded = ["id", "className", "sx", "color", "fullWidth", "children"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -49,23 +46,6 @@ const PrimaryChip = (0, _styles.styled)( /*#__PURE__*/React.forwardRef((props, r
     }
   };
 });
-const iconMapping = {
-  success: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckCircle.default, {
-    style: {
-      color: 'white'
-    }
-  }),
-  error: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Error.default, {
-    style: {
-      color: 'white'
-    }
-  }),
-  info: /*#__PURE__*/(0, _jsxRuntime.jsx)(_HourglassEmpty.default, {
-    style: {
-      color: 'white'
-    }
-  })
-};
 const SecondaryChip = (0, _styles.styled)( /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledChip, _objectSpread({
   ref: ref
 }, props))))(() => {
@@ -137,8 +117,7 @@ const PuiChip = /*#__PURE__*/React.forwardRef((_ref, ref) => {
       sx,
       color,
       fullWidth,
-      children,
-      icon
+      children
     } = _ref,
     rest = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiTooltip.default, {
@@ -153,10 +132,7 @@ const PuiChip = /*#__PURE__*/React.forwardRef((_ref, ref) => {
         width: fullWidth ? "100%" : "fit-content"
       }),
       className,
-      label: children,
-      icon: icon ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Avatar, {
-        children: iconMapping[icon]
-      }) : null
+      label: children
     }, rest))
   });
 });
@@ -165,8 +141,7 @@ PuiChip.propTypes = {
   className: _propTypes.default.string,
   sx: _propTypes.default.object,
   fullWidth: _propTypes.default.bool,
-  color: _propTypes.default.oneOf(["primary", "secondary", "info", "success", "warning", "error"]),
-  icon: _propTypes.default.oneOf(["success", "error", "info"]) // Prop icon pour spécifier l'icône
+  color: _propTypes.default.oneOf(["primary", "secondary", "info", "success", "warning", "error"])
 };
 PuiChip.defaultProps = {
   color: "primary"

package/dist/components/table/PuiTable.js CHANGED Viewed

@@ -32,166 +32,21 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } // Styles for your DataGrid
 const StyledMuiTable = (0, _styles.styled)( /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_xDataGrid.DataGrid, _objectSpread({
   ref: ref
-}, props))))(() => ({
-  "&.MuiDataGrid-root": {
-    fontSize: ".8em",
-    "& .tableActionColumn": {
-      "& .MuiDataGrid-columnHeaderTitle": {
-        justifyContent: "center",
-        display: "flex"
-      },
-      "& .MuiDataGrid-columnHeaderTitleContainer": {
-        justifyContent: "center"
-      }
-    },
-    "&.elevate": {
-      boxShadow: "0px 2px 1px -1px rgb(0 0 0 / 20%), 0px 1px 1px 0px rgb(0 0 0 / 14%), 0px 1px 3px 0px rgb(0 0 0 / 12%)"
-    },
-    backgroundColor: _apperance.palette.gray.light,
-    border: "2px solid ".concat(_apperance.palette.gray.dark),
-    "& .MuiPaginationItem-root": {
-      "&.Mui-selected": {
-        color: _apperance.palette.white,
-        backgroundColor: _apperance.palette.primary
-      }
-    },
-    "& .table-stripped .MuiDataGrid-row": {
-      "&:nth-of-type(even)": {
-        backgroundColor: _apperance.palette.gray.light
-      }
-    },
-    "& .MuiLinearProgress-root": {
-      zIndex: 1,
-      backgroundColor: _apperance.palette.info,
-      "& .MuiLinearProgress-bar": {
-        backgroundColor: _apperance.palette.primary
-      }
-    },
-    "& .MuiDataGrid-columnHeaders": {
-      "& .MuiDataGrid-columnHeader": {
-        "& .MuiDataGrid-columnHeaderTitle": {
-          display: "flex",
-          alignItems: "center",
-          fontWeight: "600",
-          color: _apperance.palette.primary,
-          whiteSpace: "normal",
-          lineHeight: "1.2em"
-        },
-        "&:focus-within": {
-          outline: "none"
-        },
-        "&:last-of-type .MuiDataGrid-columnSeparator": {
-          display: "none"
-        }
-      },
-      "& .MuiDataGrid-columnSeparator": {
-        color: _apperance.palette.gray.dark
-      }
-    },
-    "& .MuiDataGrid-cell": {
-      paddingTop: "2px",
-      paddingBottom: "2px",
-      whiteSpace: "normal",
-      textOverflow: "ellipsis",
-      overflow: "hidden",
-      maxHeight: "none",
-      minWidth: "maxWidth",
-      wordBreak: "break-word",
-      "&.tableAction": {
-        justifyContent: "center",
-        position: "relative",
-        overflow: "initial !important"
-      },
-      "&:focus-within": {
-        outline: "none"
-      }
-    },
-    "& .MuiDataGrid-row": {
-      maxHeight: "none !important",
-      "&:nth-of-type(odd)": {
-        backgroundColor: "#ffffff" // color for odd rows
-      },
-      "&:nth-of-type(even)": {
-        backgroundColor: "#F6F9FF" // color for even rows
-      },
-      "&:hover": {
-        backgroundColor: "#95C7FC"
-      }
-    },
-    "& .MuiDataGrid-virtualScrollerContent": {
-      "& .MuiDataGrid-row": {
-        maxHeight: "none !important"
-      }
-    },
-    "& .MuiDataGrid-virtualScroller": {
-      backgroundColor: _apperance.palette.white
-    },
-    "& .MuiDataGrid-footerContainer": {
-      backgroundColor: _apperance.palette.white,
-      height: "28px",
-      minHeight: "28px"
-    }
-  }
-}));
-const localeText = {
-  noRowsLabel: "Aucune ligne",
-  footerRowSelected: count => count !== 1 ? "".concat(count.toLocaleString(), " lignes s\xE9lectionn\xE9es") : "".concat(count.toLocaleString(), " ligne s\xE9lectionn\xE9e"),
-  footerTotalVisibleRows: (visibleCount, totalCount) => "".concat(visibleCount.toLocaleString(), " de ").concat(totalCount.toLocaleString()),
-  MuiTablePagination: {
-    labelDisplayedRows: _ref => {
-      let {
-        from,
-        to,
-        count
-      } = _ref;
-      return "".concat(from, "\u2013").concat(to, " de ").concat(count !== -1 ? count : "plus que ".concat(to));
-    },
-    labelRowsPerPage: "Lignes par page"
-  }
-};
-const TablePagination = () => {
-  const apiRef = (0, _xDataGrid.useGridApiContext)();
-  const page = (0, _xDataGrid.useGridSelector)(apiRef, _xDataGrid.gridPageSelector);
-  const pageCount = (0, _xDataGrid.useGridSelector)(apiRef, _xDataGrid.gridPageCountSelector);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Pagination, {
-    size: "small",
-    sx: {
-      position: "absolute",
-      left: "50%",
-      transform: "translateX(-50%)",
-      "& .MuiButtonBase-root": {
-        lineHeight: "1em",
-        fontSize: "1em",
-        minWidth: "20px",
-        height: "20px"
-      }
-    },
-    count: pageCount,
-    page: page + 1,
-    onChange: (event, value) => apiRef.current.setPage(value - 1),
-    showFirstButton: true,
-    showLastButton: true
-  });
-};
-const TableCheckbox = /*#__PURE__*/React.forwardRef((props, ref) => {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiCheckbox.default, _objectSpread(_objectSpread({
-    ref: ref
-  }, props), {}, {
-    formik: false,
-    sx: {
-      transform: "scale(.6)",
-      marginTop: "-4px"
+}, props))))(() => {
+  return {
+    "&.MuiDataGrid-root": {
+      fontSize: ".8em",
+      backgroundColor: _apperance.palette.gray.light,
+      border: "2px solid ".concat(_apperance.palette.gray.dark)
     }
-  }));
+  };
 });
-const autosizeOptions = {
-  includeHeaders: true,
-  includeOutliers: true
-};
-const PuiTable = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
+// Define the table component
+const PuiTable = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
       id,
       className,
@@ -212,24 +67,27 @@ const PuiTable = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
       onPageChange,
       onPageSizeChange,
       rowDetailPanel
-    } = _ref2,
-    rest = _objectWithoutProperties(_ref2, _excluded);
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
   const [expandedRows, setExpandedRows] = React.useState({});
+  // Toggle row expansion
   const toggleRowExpansion = rowId => {
-    setExpandedRows(prevState => _objectSpread(_objectSpread({}, prevState), {}, {
-      [rowId]: !prevState[rowId]
+    setExpandedRows(prev => _objectSpread(_objectSpread({}, prev), {}, {
+      [rowId]: !prev[rowId]
     }));
   };
+  // Render the detail panel for expanded rows
   const renderRowDetails = row => {
-    console.log("row ==", row);
-    if (!row) return null; // Ensure row exists
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Collapse, {
       in: expandedRows[row.id],
       timeout: "auto",
       unmountOnExit: true,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_system.Box, {
         sx: {
-          padding: 2
+          padding: 2,
+          backgroundColor: "#f9f9f9"
         },
         children: rowDetailPanel && /*#__PURE__*/React.cloneElement(rowDetailPanel, {
           rowData: row
@@ -237,15 +95,17 @@ const PuiTable = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
       })
     });
   };
+  // Add an extra column for the expand/collapse button
   const appColumns = React.useMemo(() => [{
     field: "expand",
     headerName: "",
     sortable: false,
     width: 50,
-    renderCell: _ref3 => {
+    renderCell: _ref2 => {
       let {
         row
-      } = _ref3;
+      } = _ref2;
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.IconButton, {
         "aria-label": "expand row",
         size: "small",
@@ -253,7 +113,8 @@ const PuiTable = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
         children: expandedRows[row.id] ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_KeyboardArrowUp.default, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_KeyboardArrowDown.default, {})
       });
     }
-  }, ...columns], [columns, expandedRows]);
+  }, ...columns // Spread the existing columns
+  ], [columns, expandedRows]);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     style: {
       width: "100%"
@@ -262,9 +123,9 @@ const PuiTable = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
       ref: ref,
       id: id,
       components: {
-        BaseCheckbox: TableCheckbox,
+        BaseCheckbox: _PuiCheckbox.default,
         LoadingOverlay: _material.LinearProgress,
-        Pagination: TablePagination
+        Pagination: _material.Pagination
       },
       className: "".concat(className, " ").concat(stripped ? "table-stripped" : "", " ").concat(loading ? "table-loading" : "", " ").concat(elevate ? "elevate" : ""),
       sx: {
@@ -290,12 +151,25 @@ const PuiTable = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
       density: "compact",
       loading: loading,
       paginationMode: paginationMode,
-      localeText: localeText,
-      getRowHeight: () => "auto",
+      localeText: {
+        noRowsLabel: "Aucune ligne",
+        footerRowSelected: count => count !== 1 ? "".concat(count.toLocaleString(), " lignes s\xE9lectionn\xE9es") : "".concat(count.toLocaleString(), " ligne s\xE9lectionn\xE9e"),
+        footerTotalVisibleRows: (visibleCount, totalCount) => "".concat(visibleCount.toLocaleString(), " de ").concat(totalCount.toLocaleString()),
+        MuiTablePagination: {
+          labelDisplayedRows: _ref3 => {
+            let {
+              from,
+              to,
+              count
+            } = _ref3;
+            return "".concat(from, "\u2013").concat(to, " de ").concat(count !== -1 ? count : "plus que ".concat(to));
+          },
+          labelRowsPerPage: "Lignes par page"
+        }
+      },
       onPageChange: onPageChange,
       onPageSizeChange: onPageSizeChange,
-      onSelectionModelChange: onSelect,
-      autosizeOptions: autosizeOptions
+      onSelectionModelChange: onSelect
     }, rest)), rows.map(row => /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
       children: expandedRows[row.id] && renderRowDetails(row)
     }, row.id))]
@@ -320,7 +194,6 @@ PuiTable.propTypes = {
   onSelect: _propTypes.default.func,
   onPageChange: _propTypes.default.func,
   onPageSizeChange: _propTypes.default.func,
-  onSelectionModelChange: _propTypes.default.func,
   rowDetailPanel: _propTypes.default.element
 };
 PuiTable.defaultProps = {

package/dist/components/ui/pages/general/PuiSearchPage.js CHANGED Viewed

@@ -1,15 +1,15 @@
 "use strict";
-require("core-js/modules/es.symbol.description.js");
 require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-require("core-js/modules/web.dom-collections.iterator.js");
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
+require("core-js/modules/es.symbol.description.js");
 var _formik = require("formik");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var React = _interopRequireWildcard(require("react"));
 var _PuiButton = _interopRequireDefault(require("../../../buttons/PuiButton"));
 var _PuiFormikForm = _interopRequireDefault(require("../../../others/PuiFormikForm"));
 var _PuiGrid = _interopRequireDefault(require("../../../others/PuiGrid"));
@@ -17,18 +17,15 @@ var _PuiIcon = _interopRequireDefault(require("../../../others/PuiIcon"));
 var _PuiSection = _interopRequireDefault(require("../../../others/PuiSection"));
 var _PuiTable = _interopRequireDefault(require("../../../table/PuiTable"));
 var _PuiDefaultPage = _interopRequireDefault(require("./PuiDefaultPage"));
-var _ExpandMore = _interopRequireDefault(require("@mui/icons-material/ExpandMore"));
-var _ExpandLess = _interopRequireDefault(require("@mui/icons-material/ExpandLess"));
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } // Arrow for collapsed state
-// Arrow for expanded state
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 const PuiStandardSearchPageContainer = _ref => {
   let {
     actions,
@@ -64,14 +61,8 @@ const PuiSearchPage = _ref2 => {
     onReset,
     onSubmit,
     children: _children,
-    additionalActions,
-    collapsibleSearchSection = true // Collapsible by default
+    additionalActions
   } = _ref2;
-  // Start with the section collapsed (not displayed on first render)
-  const [isSearchSectionExpanded, setSearchSectionExpanded] = (0, _react.useState)(false);
-  const toggleSearchSection = () => {
-    setSearchSectionExpanded(prev => !prev);
-  };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_PuiDefaultPage.default, {
     title: title,
     titleIcon: titleIcon,
@@ -83,129 +74,102 @@ const PuiSearchPage = _ref2 => {
     retour: retour,
     onRetour: onRetour,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiSection.default, {
-      title: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        onClick: toggleSearchSection,
-        style: {
-          display: "flex",
-          alignItems: "center",
-          cursor: collapsibleSearchSection ? "pointer" : "default" // Clickable only if collapsibleSearchSection is true
-        },
-        children: [collapsibleSearchSection && (isSearchSectionExpanded ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExpandLess.default, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExpandMore.default, {})), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          style: {
-            marginLeft: collapsibleSearchSection ? "8px" : "0px"
-          },
-          children: "Param\xE8tres de recherche"
-        }), "  "]
-      }),
+      title: "Param\xE8tres de recherche",
       sx: {
         marginBottom: 2
       },
-      children: isSearchSectionExpanded && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-        children: formik ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_formik.Formik, _objectSpread(_objectSpread({
-          initialValues: {}
-        }, formikProps), {}, {
-          children: _ref3 => {
-            let {
-              resetForm,
-              submitForm
-            } = _ref3;
-            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiFormikForm.default, {
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(PuiStandardSearchPageContainer, {
-                actions: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_PuiGrid.default, {
-                  container: true,
-                  justifyContent: "end",
-                  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiGrid.default, {
-                    item: true,
-                    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiButton.default, {
-                      startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiIcon.default, {
-                        type: "effacer",
-                        size: "small"
-                      }),
-                      onClick: resetForm,
-                      color: "tertiary",
-                      children: "Effacer"
-                    })
-                  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiGrid.default, {
-                    item: true,
-                    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiButton.default, {
-                      startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiIcon.default, {
-                        type: "rechercher",
-                        size: "small"
-                      }),
-                      onClick: submitForm,
-                      loadingPosition: "start",
-                      children: "Rechercher"
-                    })
-                  }), additionalActions && additionalActions.map((actionItem, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiGrid.default, {
+      children: formik ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_formik.Formik, _objectSpread(_objectSpread({
+        initialValues: {}
+      }, formikProps), {}, {
+        children: _ref3 => {
+          let {
+            resetForm,
+            submitForm
+          } = _ref3;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiFormikForm.default, {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(PuiStandardSearchPageContainer, {
+              actions: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_PuiGrid.default, {
+                container: true,
+                justifyContent: "end",
+                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiGrid.default, {
+                  item: true,
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiButton.default, {
+                    startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiIcon.default, {
+                      type: "effacer",
+                      size: "small"
+                    }),
+                    onClick: resetForm,
+                    color: "tertiary",
+                    children: "Effacer"
+                  })
+                }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiGrid.default, {
+                  item: true,
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiButton.default, {
+                    startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiIcon.default, {
+                      type: "rechercher",
+                      size: "small"
+                    }),
+                    onClick: submitForm,
+                    loadingPosition: "start",
+                    children: "Rechercher"
+                  })
+                }), additionalActions && additionalActions.map((actionItem, index) => {
+                  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiGrid.default, {
                     item: true,
                     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiButton.default, {
                       startIcon: actionItem.icon,
                       onClick: actionItem.action,
                       children: actionItem.name
                     })
-                  }, index))]
-                }),
-                children: _children
-              })
-            });
-          }
-        })) : /*#__PURE__*/(0, _jsxRuntime.jsx)(PuiStandardSearchPageContainer, {
-          actions: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_PuiGrid.default, {
-            container: true,
-            justifyContent: "end",
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiGrid.default, {
-              item: true,
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiButton.default, {
-                startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiIcon.default, {
-                  type: "effacer",
-                  size: "small"
-                }),
-                onClick: onReset,
-                color: "tertiary",
-                children: "Effacer"
-              })
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiGrid.default, {
-              item: true,
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiButton.default, {
-                startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiIcon.default, {
-                  type: "rechercher",
-                  size: "small"
-                }),
-                onClick: onSubmit,
-                loadingPosition: "start",
-                children: "Rechercher"
-              })
-            }), additionalActions && additionalActions.map((actionItem, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiGrid.default, {
+                  }, index);
+                })]
+              }),
+              children: _children
+            })
+          });
+        }
+      })) : /*#__PURE__*/(0, _jsxRuntime.jsx)(PuiStandardSearchPageContainer, {
+        actions: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_PuiGrid.default, {
+          container: true,
+          justifyContent: "end",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiGrid.default, {
+            item: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiButton.default, {
+              startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiIcon.default, {
+                type: "effacer",
+                size: "small"
+              }),
+              onClick: onReset,
+              color: "tertiary",
+              children: "Effacer"
+            })
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiGrid.default, {
+            item: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiButton.default, {
+              startIcon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiIcon.default, {
+                type: "rechercher",
+                size: "small"
+              }),
+              onClick: onSubmit,
+              loadingPosition: "start",
+              children: "Rechercher"
+            })
+          }), additionalActions && additionalActions.map((actionItem, index) => {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiGrid.default, {
               item: true,
               children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiButton.default, {
                 startIcon: actionItem.icon,
                 onClick: actionItem.action,
                 children: actionItem.name
               })
-            }, index))]
-          }),
-          children: _children
-        })
+            }, index);
+          })]
+        }),
+        children: _children
       })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiTable.default, _objectSpread(_objectSpread({
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PuiTable.default, _objectSpread({
       paginationMode: "server"
-    }, tableProps), {}, {
-      sx: {
-        '& .MuiDataGrid-columnHeaders': {
-          backgroundColor: '#f5f5f5',
-          // Light gray background
-          fontWeight: 'bold',
-          textAlign: 'center',
-          padding: '10px 15px'
-        },
-        '& .MuiDataGrid-cell': {
-          padding: '8px 12px' // Adds padding for cells
-        },
-        '& .numeric-cell': {
-          textAlign: 'right' // Aligns numeric values to the right
-        }
-      }
-    }))]
+    }, tableProps))]
   });
 };
 PuiSearchPage.propTypes = {
@@ -227,13 +191,11 @@ PuiSearchPage.propTypes = {
     name: _propTypes.default.string.isRequired,
     action: _propTypes.default.func.isRequired,
     icon: _propTypes.default.element
-  })),
-  collapsibleSearchSection: _propTypes.default.bool // New prop with default value
+  }))
 };
 PuiSearchPage.defaultProps = {
   formik: true,
   loading: false,
-  additionalActions: [],
-  collapsibleSearchSection: true // Collapsible by default is true
+  additionalActions: []
 };
 var _default = exports.default = PuiSearchPage;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@portnet/ui",
-  "version": "0.1.38",
+  "version": "0.1.40",
   "description": "Portnet UI",
   "keywords": [
     "react",