@etsoo/materialui 1.5.13 → 1.5.14

package/lib/cjs/ResponsibleContainer.js

@@ -59,7 +59,7 @@ function ResponsibleContainer(props) {
         return loadData(GridUtils_1.GridUtils.createLoader(props, fieldTemplate, cacheKey, false), lastItem);
     };
     // Search data
-    const searchData = GridUtils_1.GridUtils.getSearchData(cacheKey);
+    const searchData = (0, react_2.useSearchParamsWithCache)(cacheKey);
     // On submit callback
     const onSubmit = (data, _reset) => {
         if (data == null || state.ref == null)
@@ -177,7 +177,7 @@ function ResponsibleContainer(props) {
             rect?.width == null ||
             rect.width < 20)
             return;
-        const f = typeof fields == "function" ? fields(searchData ?? {}) : fields;
+        const f = typeof fields == "function" ? fields(searchData) : fields;
         return ((0, jsx_runtime_1.jsx)(SearchBar_1.SearchBar, { fields: f, onSubmit: onSubmit, className: `searchBar${showDataGrid ? "Grid" : "List"}`, width: rect.width, top: searchBarTop }));
     }, [showDataGrid, hasFields, searchBarHeight, rect?.width]);
     // Pull container

package/lib/cjs/SearchField.js

@@ -7,8 +7,8 @@ exports.SearchField = SearchField;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("@etsoo/react");
 const react_2 = __importDefault(require("react"));
-const MUGlobal_1 = require("./MUGlobal");
 const TextField_1 = __importDefault(require("@mui/material/TextField"));
+const MUGlobal_1 = require("./MUGlobal");
 /**
  * Search field
  * @param props Props
@@ -16,14 +16,13 @@ const TextField_1 = __importDefault(require("@mui/material/TextField"));
  */
 function SearchField(props) {
     // Destruct
-    const { changeDelay, InputLabelProps = {}, InputProps = {}, inputProps = {}, onChange, readOnly, size = MUGlobal_1.MUGlobal.searchFieldSize, variant = MUGlobal_1.MUGlobal.searchFieldVariant, minChars = 0, ...rest } = props;
+    const { changeDelay, onChange, readOnly, slotProps = {}, size = MUGlobal_1.MUGlobal.searchFieldSize, variant = MUGlobal_1.MUGlobal.searchFieldVariant, minChars = 0, ...rest } = props;
     // Shrink
-    InputLabelProps.shrink ??= MUGlobal_1.MUGlobal.searchFieldShrink;
-    // Read only
-    if (readOnly != null)
-        InputProps.readOnly = readOnly;
-    // Min characters
-    inputProps["data-min-chars"] = minChars;
+    const defaultProps = {
+        input: { readOnly: readOnly },
+        inputLabel: { shrink: MUGlobal_1.MUGlobal.searchFieldShrink },
+        htmlInput: { "data-min-chars": minChars }
+    };
     const isMounted = react_2.default.useRef(true);
     const delayed = onChange != null && changeDelay != null && changeDelay >= 1
         ? (0, react_1.useDelayedExecutor)(onChange, changeDelay)
@@ -52,5 +51,5 @@ function SearchField(props) {
         };
     }, []);
     // Layout
-    return ((0, jsx_runtime_1.jsx)(TextField_1.default, { InputLabelProps: InputLabelProps, InputProps: InputProps, inputProps: inputProps, onChange: onChangeEx, size: size, variant: variant, ...rest }));
+    return ((0, jsx_runtime_1.jsx)(TextField_1.default, { slotProps: Object.assign(slotProps, defaultProps), onChange: onChangeEx, size: size, variant: variant, ...rest }));
 }

package/lib/cjs/pages/DataGridPage.js

@@ -44,7 +44,7 @@ function DataGridPage(props) {
         return loadData(GridUtils_1.GridUtils.createLoader(props, fieldTemplate, cacheKey, false), lastItem);
     };
     // Search data
-    const searchData = GridUtils_1.GridUtils.getSearchData(cacheKey);
+    const searchData = (0, react_1.useSearchParamsWithCache)(cacheKey);
     const onInitLoad = (ref) => {
         // Avoid repeatedly load from cache
         if (initLoadedRef.current || !cacheKey)

package/lib/cjs/pages/FixedListPage.js

@@ -50,7 +50,7 @@ function FixedListPage(props) {
         return loadData(GridUtils_1.GridUtils.createLoader(props, fieldTemplate, cacheKey, false), lastItem);
     };
     // Search data
-    const searchData = GridUtils_1.GridUtils.getSearchData(cacheKey);
+    const searchData = (0, react_1.useSearchParamsWithCache)(cacheKey);
     const onInitLoad = (ref) => {
         // Avoid repeatedly load from cache
         if (initLoadedRef.current || !cacheKey)

package/lib/cjs/pages/ListPage.js

@@ -51,7 +51,7 @@ function ListPage(props) {
     const { dimensions } = (0, react_1.useDimensions)(1, undefined, sizeReadyMiliseconds);
     const rect = dimensions[0][2];
     // Search data
-    const searchData = GridUtils_1.GridUtils.getSearchData(cacheKey);
+    const searchData = (0, react_1.useSearchParamsWithCache)(cacheKey);
     const onInitLoad = (ref) => {
         // Avoid repeatedly load from cache
         if (initLoadedRef.current || !cacheKey)

package/lib/cjs/pages/TablePage.js

@@ -47,7 +47,7 @@ function TablePage(props) {
         return loadData(GridUtils_1.GridUtils.createLoader(props, fieldTemplate, cacheKey, false), lastItem);
     };
     // Search data
-    const searchData = GridUtils_1.GridUtils.getSearchData(cacheKey);
+    const searchData = (0, react_1.useSearchParamsWithCache)(cacheKey);
     // Total width
     const totalWidth = react_2.default.useMemo(() => columns.reduce((previousValue, { width, minWidth }) => {
         return previousValue + (width ?? minWidth ?? TableEx_1.TableExMinWidth);

package/lib/mjs/ResponsibleContainer.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
-import { ReactUtils, useCombinedRefs, useDimensions } from "@etsoo/react";
+import { ReactUtils, useCombinedRefs, useDimensions, useSearchParamsWithCache } from "@etsoo/react";
 import { DataGridEx } from "./DataGridEx";
 import { MUGlobal } from "./MUGlobal";
 import { PullToRefreshUI } from "./PullToRefreshUI";
@@ -53,7 +53,7 @@ export function ResponsibleContainer(props) {
         return loadData(GridUtils.createLoader(props, fieldTemplate, cacheKey, false), lastItem);
     };
     // Search data
-    const searchData = GridUtils.getSearchData(cacheKey);
+    const searchData = useSearchParamsWithCache(cacheKey);
     // On submit callback
     const onSubmit = (data, _reset) => {
         if (data == null || state.ref == null)
@@ -171,7 +171,7 @@ export function ResponsibleContainer(props) {
             rect?.width == null ||
             rect.width < 20)
             return;
-        const f = typeof fields == "function" ? fields(searchData ?? {}) : fields;
+        const f = typeof fields == "function" ? fields(searchData) : fields;
         return (_jsx(SearchBar, { fields: f, onSubmit: onSubmit, className: `searchBar${showDataGrid ? "Grid" : "List"}`, width: rect.width, top: searchBarTop }));
     }, [showDataGrid, hasFields, searchBarHeight, rect?.width]);
     // Pull container

package/lib/mjs/SearchField.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useDelayedExecutor } from "@etsoo/react";
 import React from "react";
-import { MUGlobal } from "./MUGlobal";
 import TextField from "@mui/material/TextField";
+import { MUGlobal } from "./MUGlobal";
 /**
  * Search field
  * @param props Props
@@ -10,14 +10,13 @@ import TextField from "@mui/material/TextField";
  */
 export function SearchField(props) {
     // Destruct
-    const { changeDelay, InputLabelProps = {}, InputProps = {}, inputProps = {}, onChange, readOnly, size = MUGlobal.searchFieldSize, variant = MUGlobal.searchFieldVariant, minChars = 0, ...rest } = props;
+    const { changeDelay, onChange, readOnly, slotProps = {}, size = MUGlobal.searchFieldSize, variant = MUGlobal.searchFieldVariant, minChars = 0, ...rest } = props;
     // Shrink
-    InputLabelProps.shrink ??= MUGlobal.searchFieldShrink;
-    // Read only
-    if (readOnly != null)
-        InputProps.readOnly = readOnly;
-    // Min characters
-    inputProps["data-min-chars"] = minChars;
+    const defaultProps = {
+        input: { readOnly: readOnly },
+        inputLabel: { shrink: MUGlobal.searchFieldShrink },
+        htmlInput: { "data-min-chars": minChars }
+    };
     const isMounted = React.useRef(true);
     const delayed = onChange != null && changeDelay != null && changeDelay >= 1
         ? useDelayedExecutor(onChange, changeDelay)
@@ -46,5 +45,5 @@ export function SearchField(props) {
         };
     }, []);
     // Layout
-    return (_jsx(TextField, { InputLabelProps: InputLabelProps, InputProps: InputProps, inputProps: inputProps, onChange: onChangeEx, size: size, variant: variant, ...rest }));
+    return (_jsx(TextField, { slotProps: Object.assign(slotProps, defaultProps), onChange: onChangeEx, size: size, variant: variant, ...rest }));
 }

package/lib/mjs/pages/DataGridPage.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCombinedRefs, useDimensions } from "@etsoo/react";
+import { useCombinedRefs, useDimensions, useSearchParamsWithCache } from "@etsoo/react";
 import React from "react";
 import { DataGridEx } from "../DataGridEx";
 import { MUGlobal } from "../MUGlobal";
@@ -38,7 +38,7 @@ export function DataGridPage(props) {
         return loadData(GridUtils.createLoader(props, fieldTemplate, cacheKey, false), lastItem);
     };
     // Search data
-    const searchData = GridUtils.getSearchData(cacheKey);
+    const searchData = useSearchParamsWithCache(cacheKey);
     const onInitLoad = (ref) => {
         // Avoid repeatedly load from cache
         if (initLoadedRef.current || !cacheKey)

package/lib/mjs/pages/FixedListPage.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCombinedRefs, useDimensions } from "@etsoo/react";
+import { useCombinedRefs, useDimensions, useSearchParamsWithCache } from "@etsoo/react";
 import React from "react";
 import { MUGlobal } from "../MUGlobal";
 import { ScrollerListEx } from "../ScrollerListEx";
@@ -44,7 +44,7 @@ export function FixedListPage(props) {
         return loadData(GridUtils.createLoader(props, fieldTemplate, cacheKey, false), lastItem);
     };
     // Search data
-    const searchData = GridUtils.getSearchData(cacheKey);
+    const searchData = useSearchParamsWithCache(cacheKey);
     const onInitLoad = (ref) => {
         // Avoid repeatedly load from cache
         if (initLoadedRef.current || !cacheKey)

package/lib/mjs/pages/ListPage.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCombinedRefs, useDimensions } from "@etsoo/react";
+import { useCombinedRefs, useDimensions, useSearchParamsWithCache } from "@etsoo/react";
 import React from "react";
 import { MUGlobal } from "../MUGlobal";
 import { ScrollerListEx } from "../ScrollerListEx";
@@ -45,7 +45,7 @@ export function ListPage(props) {
     const { dimensions } = useDimensions(1, undefined, sizeReadyMiliseconds);
     const rect = dimensions[0][2];
     // Search data
-    const searchData = GridUtils.getSearchData(cacheKey);
+    const searchData = useSearchParamsWithCache(cacheKey);
     const onInitLoad = (ref) => {
         // Avoid repeatedly load from cache
         if (initLoadedRef.current || !cacheKey)

package/lib/mjs/pages/TablePage.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCombinedRefs, useDimensions } from "@etsoo/react";
+import { useCombinedRefs, useDimensions, useSearchParamsWithCache } from "@etsoo/react";
 import React from "react";
 import { MUGlobal } from "../MUGlobal";
 import { SearchBar } from "../SearchBar";
@@ -41,7 +41,7 @@ export function TablePage(props) {
         return loadData(GridUtils.createLoader(props, fieldTemplate, cacheKey, false), lastItem);
     };
     // Search data
-    const searchData = GridUtils.getSearchData(cacheKey);
+    const searchData = useSearchParamsWithCache(cacheKey);
     // Total width
     const totalWidth = React.useMemo(() => columns.reduce((previousValue, { width, minWidth }) => {
         return previousValue + (width ?? minWidth ?? TableExMinWidth);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@etsoo/materialui",
-  "version": "1.5.13",
+  "version": "1.5.14",
   "description": "TypeScript Material-UI Implementation",
   "main": "lib/cjs/index.js",
   "module": "lib/mjs/index.js",
@@ -42,7 +42,7 @@
     "@emotion/styled": "^11.14.0",
     "@etsoo/appscript": "^1.6.21",
     "@etsoo/notificationbase": "^1.1.60",
-    "@etsoo/react": "^1.8.35",
+    "@etsoo/react": "^1.8.37",
     "@etsoo/shared": "^1.2.66",
     "@mui/icons-material": "^7.0.1",
     "@mui/material": "^7.0.1",

package/src/ResponsibleContainer.tsx

@@ -15,7 +15,8 @@ import {
   ReactUtils,
   ScrollerListRef,
   useCombinedRefs,
-  useDimensions
+  useDimensions,
+  useSearchParamsWithCache
 } from "@etsoo/react";
 import { DataGridEx, DataGridExProps } from "./DataGridEx";
 import { MUGlobal } from "./MUGlobal";
@@ -252,7 +253,7 @@ export function ResponsibleContainer<T extends object, F>(
   };
 
   // Search data
-  const searchData = GridUtils.getSearchData(cacheKey);
+  const searchData = useSearchParamsWithCache(cacheKey);
 
   // On submit callback
   const onSubmit = (data: FormData, _reset: boolean) => {
@@ -437,7 +438,7 @@ export function ResponsibleContainer<T extends object, F>(
     )
       return;
 
-    const f = typeof fields == "function" ? fields(searchData ?? {}) : fields;
+    const f = typeof fields == "function" ? fields(searchData) : fields;
 
     return (
       <SearchBar

package/src/SearchField.tsx

@@ -1,7 +1,7 @@
 import { useDelayedExecutor } from "@etsoo/react";
 import React from "react";
-import { MUGlobal } from "./MUGlobal";
 import TextField, { TextFieldProps } from "@mui/material/TextField";
+import { MUGlobal } from "./MUGlobal";
 
 /**
  * Search field props
@@ -32,11 +32,9 @@ export function SearchField(props: SearchFieldProps) {
   // Destruct
   const {
     changeDelay,
-    InputLabelProps = {},
-    InputProps = {},
-    inputProps = {},
     onChange,
     readOnly,
+    slotProps = {},
     size = MUGlobal.searchFieldSize,
     variant = MUGlobal.searchFieldVariant,
     minChars = 0,
@@ -44,13 +42,11 @@ export function SearchField(props: SearchFieldProps) {
   } = props;
 
   // Shrink
-  InputLabelProps.shrink ??= MUGlobal.searchFieldShrink;
-
-  // Read only
-  if (readOnly != null) InputProps.readOnly = readOnly;
-
-  // Min characters
-  inputProps["data-min-chars"] = minChars;
+  const defaultProps: typeof slotProps = {
+    input: { readOnly: readOnly },
+    inputLabel: { shrink: MUGlobal.searchFieldShrink },
+    htmlInput: { "data-min-chars": minChars }
+  };
 
   const isMounted = React.useRef(true);
   const delayed =
@@ -90,9 +86,7 @@ export function SearchField(props: SearchFieldProps) {
   // Layout
   return (
     <TextField
-      InputLabelProps={InputLabelProps}
-      InputProps={InputProps}
-      inputProps={inputProps}
+      slotProps={Object.assign(slotProps, defaultProps)}
       onChange={onChangeEx}
       size={size}
       variant={variant}

package/src/pages/DataGridPage.tsx

@@ -5,7 +5,8 @@ import {
   ScrollerGridForwardRef,
   VariableSizeGrid,
   useCombinedRefs,
-  useDimensions
+  useDimensions,
+  useSearchParamsWithCache
 } from "@etsoo/react";
 import React from "react";
 import { DataGridEx } from "../DataGridEx";
@@ -84,7 +85,7 @@ export function DataGridPage<T extends object, F>(
   };
 
   // Search data
-  const searchData = GridUtils.getSearchData(cacheKey);
+  const searchData = useSearchParamsWithCache(cacheKey);
 
   const onInitLoad = (
     ref: VariableSizeGrid<T>

package/src/pages/FixedListPage.tsx

@@ -5,7 +5,8 @@ import {
   ScrollerListForwardRef,
   ScrollerListRef,
   useCombinedRefs,
-  useDimensions
+  useDimensions,
+  useSearchParamsWithCache
 } from "@etsoo/react";
 import React from "react";
 import { MUGlobal } from "../MUGlobal";
@@ -94,7 +95,7 @@ export function FixedListPage<T extends object, F>(
   };
 
   // Search data
-  const searchData = GridUtils.getSearchData(cacheKey);
+  const searchData = useSearchParamsWithCache(cacheKey);
 
   const onInitLoad = (
     ref: ScrollerListRef

package/src/pages/ListPage.tsx

@@ -5,7 +5,8 @@ import {
   ScrollerListForwardRef,
   ScrollerListRef,
   useCombinedRefs,
-  useDimensions
+  useDimensions,
+  useSearchParamsWithCache
 } from "@etsoo/react";
 import React from "react";
 import { MUGlobal } from "../MUGlobal";
@@ -86,7 +87,7 @@ export function ListPage<T extends object, F>(props: ListPageProps<T, F>) {
   const rect = dimensions[0][2];
 
   // Search data
-  const searchData = GridUtils.getSearchData(cacheKey);
+  const searchData = useSearchParamsWithCache(cacheKey);
 
   const onInitLoad = (
     ref: ScrollerListRef

package/src/pages/TablePage.tsx

@@ -1,7 +1,8 @@
 import {
   GridLoadDataProps,
   useCombinedRefs,
-  useDimensions
+  useDimensions,
+  useSearchParamsWithCache
 } from "@etsoo/react";
 import { DataTypes, IdDefaultType } from "@etsoo/shared";
 import React from "react";
@@ -93,7 +94,7 @@ export function TablePage<
   };
 
   // Search data
-  const searchData = GridUtils.getSearchData(cacheKey);
+  const searchData = useSearchParamsWithCache(cacheKey);
 
   // Total width
   const totalWidth = React.useMemo(