drf-react-by-schema 0.14.5 → 0.14.6

package/dist/components/forms/inputs/EditableAutocompleteFieldBySchema.js

@@ -51,17 +51,22 @@ const filter = (0, Autocomplete_1.createFilterOptions)();
 const EditableAutocompleteFieldBySchema = react_1.default.forwardRef((_a, ref) => {
     var { control, schema, errors, setValue, getValues, fieldKey, labelKey = 'nome', index, name = 'name', optionsAC, optionsModel, getOptionLabel, renderOption, onEditModel, sx = { mr: 2 }, multiple = false, disabled = false } = _a, other = __rest(_a, ["control", "schema", "errors", "setValue", "getValues", "fieldKey", "labelKey", "index", "name", "optionsAC", "optionsModel", "getOptionLabel", "renderOption", "onEditModel", "sx", "multiple", "disabled"]);
     const { setDialog } = (0, APIWrapperContext_1.useAPIWrapper)();
+    const [options, setOptions] = (0, react_1.useState)(null);
     const model = name;
     const label = schema[model].label;
     if (!optionsModel) {
         optionsModel = model;
     }
-    const options = optionsAC && optionsAC[optionsModel] ? optionsAC[optionsModel] : [];
     if (fieldKey && index && index >= 0) {
         name = `${fieldKey}.${index}.${name}`;
     }
     (0, react_1.useEffect)(() => {
-        if (!getValues || !setValue || !options || options.length === 0) {
+        if (optionsAC && optionsModel && optionsAC[optionsModel]) {
+            setOptions(optionsAC[optionsModel]);
+        }
+    }, [optionsAC, optionsModel]);
+    (0, react_1.useEffect)(() => {
+        if (!getValues || !setValue || !options) {
             return;
         }
         const valuesInitial = getValues(model);
@@ -81,7 +86,7 @@ const EditableAutocompleteFieldBySchema = react_1.default.forwardRef((_a, ref) =
         }
         const harmonizedValues = options.find((option) => option.id === valuesInitial.id);
         setValue(model, harmonizedValues);
-    }, [options]);
+    }, [options, setValue, getValues, model, multiple]);
     const { error, helperText } = fieldKey && index && index >= 0
         ? (0, utils_1.errorProps)({
             fieldKey,
@@ -95,6 +100,9 @@ const EditableAutocompleteFieldBySchema = react_1.default.forwardRef((_a, ref) =
                 ? errors[name].message
                 : schema[name].help_text || '',
         };
+    if (options === null) {
+        return react_1.default.createElement(react_1.default.Fragment, null);
+    }
     if (!disabled && !schema[model].disabled && onEditModel && optionsModel) {
         return (react_1.default.createElement(react_hook_form_1.Controller, { control: control, name: name, render: ({ field }) => (react_1.default.createElement(Autocomplete_1.default, Object.assign({ key: name }, field, { id: name, options: options, disabled: schema[model].disabled === true, autoHighlight: true, isOptionEqualToValue: (option, value) => option.id === value.id, fullWidth: true, multiple: multiple, sx: sx, onChange: (e, value) => {
                     let valueAr = value;
@@ -149,12 +157,15 @@ const EditableAutocompleteFieldBySchema = react_1.default.forwardRef((_a, ref) =
                                     }
                                 } },
                                 react_1.default.createElement(Edit_1.default, null))),
-                            params.InputProps.endAdornment)) }) }, other))), freeSolo: true, filterOptions: (options, params) => {
-                    const filtered = filter(options, params);
+                            params.InputProps.endAdornment)) }) }, other))), freeSolo: true, filterOptions: (filteredOptions, params) => {
+                    if (filteredOptions.length === 0) {
+                        return [];
+                    }
+                    const filtered = filter(filteredOptions, params);
                     const { inputValue } = params;
                     const inputValueSlug = (0, utils_1.slugify)(inputValue);
                     // Suggest the creation of a new value
-                    const isExisting = options.some((option) => inputValueSlug === (0, utils_1.slugify)(option.label));
+                    const isExisting = filteredOptions.some((option) => inputValueSlug === (0, utils_1.slugify)(option.label));
                     if (inputValue !== '' && !isExisting) {
                         filtered.push({
                             inputValue,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "drf-react-by-schema",
-  "version": "0.14.5",
+  "version": "0.14.6",
   "description": "Components and Tools for building a React App having Django Rest Framework (DRF) as server",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",