@etsoo/react 1.4.46 → 1.4.50

package/lib/mu/ComboBox.js

@@ -10,12 +10,19 @@ import { SearchField } from './SearchField';
  */
 export function ComboBox(props) {
     // Destruct
-    const { search = false, idField = 'id', idValue, inputError, inputHelperText, inputMargin, inputOnChange, inputRequired, inputVariant, defaultValue, label, labelField = 'label', loadData, onLoadData, name, inputAutoComplete = 'off', options = [], readOnly = true, onChange, value, getOptionLabel = (option) => String(Reflect.get(option, labelField)), sx = { minWidth: '150px' }, ...rest } = props;
+    const { search = false, idField = 'id', idValue, inputError, inputHelperText, inputMargin, inputOnChange, inputRequired, inputVariant, defaultValue, label, labelField = 'label', loadData, onLoadData, name, inputAutoComplete = 'off', options, readOnly = true, onChange, value, getOptionLabel = (option) => String(Reflect.get(option, labelField)), sx = { minWidth: '150px' }, ...rest } = props;
     // Value input ref
     const inputRef = React.createRef();
     // Options state
-    const [localOptions, setOptions] = React.useState(options);
+    const [localOptions, setOptions] = React.useState(options !== null && options !== void 0 ? options : []);
     const isMounted = React.useRef(true);
+    // When options change
+    // [options] will cause infinite loop
+    const propertyWay = loadData == null;
+    React.useEffect(() => {
+        if (propertyWay && options != null)
+            setOptions(options);
+    }, [JSON.stringify(options), propertyWay]);
     // Local default value
     let localValue = idValue != null
         ? localOptions.find((o) => Reflect.get(o, idField) === idValue)

package/lib/mu/SelectEx.js

@@ -15,6 +15,13 @@ export function SelectEx(props) {
     // Options state
     const [localOptions, setOptions] = React.useState(options);
     const isMounted = React.useRef(true);
+    // When options change
+    // [options] will cause infinite loop
+    const propertyWay = loadData == null;
+    React.useEffect(() => {
+        if (propertyWay && options != null)
+            setOptions(options);
+    }, [JSON.stringify(options), propertyWay]);
     // Local value
     const valueSource = (_a = defaultValue !== null && defaultValue !== void 0 ? defaultValue : value) !== null && _a !== void 0 ? _a : '';
     let localValue;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@etsoo/react",
-    "version": "1.4.46",
+    "version": "1.4.50",
     "description": "TypeScript ReactJs framework",
     "main": "lib/index.js",
     "types": "lib/index.d.ts",
@@ -50,11 +50,11 @@
         "@emotion/react": "^11.7.1",
         "@emotion/style": "^0.8.0",
         "@emotion/styled": "^11.6.0",
-        "@etsoo/appscript": "^1.2.24",
+        "@etsoo/appscript": "^1.2.25",
         "@etsoo/notificationbase": "^1.1.0",
-        "@etsoo/shared": "^1.1.3",
-        "@mui/icons-material": "^5.2.5",
-        "@mui/material": "^5.2.8",
+        "@etsoo/shared": "^1.1.5",
+        "@mui/icons-material": "^5.3.0",
+        "@mui/material": "^5.3.0",
         "@reach/router": "^1.3.4",
         "@types/pica": "^5.1.3",
         "@types/pulltorefreshjs": "^0.1.5",
@@ -83,9 +83,9 @@
         "@babel/runtime-corejs3": "^7.16.8",
         "@types/jest": "^27.4.0",
         "@types/react-test-renderer": "^17.0.1",
-        "@typescript-eslint/eslint-plugin": "^5.9.1",
-        "@typescript-eslint/parser": "^5.9.1",
-        "eslint": "^8.6.0",
+        "@typescript-eslint/eslint-plugin": "^5.10.0",
+        "@typescript-eslint/parser": "^5.10.0",
+        "eslint": "^8.7.0",
         "eslint-config-airbnb-base": "^15.0.0",
         "eslint-plugin-import": "^2.25.4",
         "eslint-plugin-react": "^7.28.0",

package/src/mu/ComboBox.tsx

@@ -56,7 +56,7 @@ export function ComboBox<T extends {} = IdLabelDto>(props: ComboBoxProps<T>) {
         onLoadData,
         name,
         inputAutoComplete = 'off',
-        options = [],
+        options,
         readOnly = true,
         onChange,
         value,
@@ -69,9 +69,16 @@ export function ComboBox<T extends {} = IdLabelDto>(props: ComboBoxProps<T>) {
     const inputRef = React.createRef<HTMLInputElement>();
 
     // Options state
-    const [localOptions, setOptions] = React.useState(options);
+    const [localOptions, setOptions] = React.useState(options ?? []);
     const isMounted = React.useRef(true);
 
+    // When options change
+    // [options] will cause infinite loop
+    const propertyWay = loadData == null;
+    React.useEffect(() => {
+        if (propertyWay && options != null) setOptions(options);
+    }, [JSON.stringify(options), propertyWay]);
+
     // Local default value
     let localValue =
         idValue != null

package/src/mu/SelectEx.tsx

@@ -90,6 +90,13 @@ export function SelectEx<T extends {} = IdLabelDto>(props: SelectExProps<T>) {
     const [localOptions, setOptions] = React.useState(options);
     const isMounted = React.useRef(true);
 
+    // When options change
+    // [options] will cause infinite loop
+    const propertyWay = loadData == null;
+    React.useEffect(() => {
+        if (propertyWay && options != null) setOptions(options);
+    }, [JSON.stringify(options), propertyWay]);
+
     // Local value
     const valueSource = defaultValue ?? value ?? '';
     let localValue: unknown | unknown[];