@selfcommunity/react-ui 0.11.0-alpha.114 → 0.11.0-alpha.116

package/lib/cjs/components/CategoryAutocomplete/CategoryAutocomplete.d.ts

@@ -1,6 +1,6 @@
 import { AutocompleteProps, TextFieldProps } from '@mui/material';
 import { SCCategoryType } from '@selfcommunity/types';
-export interface CategoryAutocompleteProps extends Pick<AutocompleteProps<SCCategoryType | null, any, any, any>, Exclude<keyof AutocompleteProps<SCCategoryType | null, any, any, any>, 'open' | 'onOpen' | 'onClose' | 'onChange' | 'filterSelectedOptions' | 'disableCloseOnSelect' | 'options' | 'getOptionLabel' | 'value' | 'selectOnFocus' | 'clearOnBlur' | 'blurOnSelect' | 'handleHomeEndKeys' | 'clearIcon' | 'noOptionsText' | 'isOptionEqualToValue' | 'renderTags' | 'renderOption' | 'renderInput'>> {
+export interface CategoryAutocompleteProps extends Pick<AutocompleteProps<SCCategoryType | null, any, any, any>, Exclude<keyof AutocompleteProps<SCCategoryType | null, any, any, any>, 'open' | 'onOpen' | 'onClose' | 'onChange' | 'filterSelectedOptions' | 'disableCloseOnSelect' | 'options' | 'getOptionLabel' | 'value' | 'selectOnFocus' | 'clearOnBlur' | 'blurOnSelect' | 'handleHomeEndKeys' | 'noOptionsText' | 'isOptionEqualToValue' | 'renderTags' | 'renderOption' | 'renderInput'>> {
     /**
      * The maximum number of categories that will be visible when not focused.
      * @default 0

package/lib/cjs/components/CategoryAutocomplete/CategoryAutocomplete.js

@@ -56,9 +56,6 @@ const CategoryAutocomplete = (inProps) => {
     // HOOKS
     const { categories, isLoading } = (0, react_core_1.useSCFetchCategories)({ endpointQueryParams });
     (0, react_1.useEffect)(() => {
-        if (value === null) {
-            return;
-        }
         onChange === null || onChange === void 0 ? void 0 : onChange(value);
     }, [value]);
     (0, react_1.useEffect)(() => {
@@ -83,6 +80,7 @@ const CategoryAutocomplete = (inProps) => {
             newValue = value;
         }
         setValue(newValue);
+        onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
     };
     // Render
     return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: classes.root, multiple: multiple, open: open, onOpen: handleOpen, onClose: handleClose, filterSelectedOptions: !checkboxSelect, disableCloseOnSelect: checkboxSelect, options: categories || [], getOptionLabel: (option) => option.name || '', value: value, selectOnFocus: true, clearOnBlur: true, blurOnSelect: true, handleHomeEndKeys: true, clearIcon: null, disabled: disabled || isLoading, noOptionsText: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.categoryAutocomplete.empty", defaultMessage: "ui.categoryAutocomplete.empty" }), onChange: handleChange, isOptionEqualToValue: (option, value) => value.id === option.id, renderTags: (value, getTagProps) => {

package/lib/cjs/components/TagAutocomplete/TagAutocomplete.js

@@ -81,9 +81,7 @@ const TagAutocomplete = (inProps) => {
         }
     }, [open, inputValue]);
     (0, react_1.useEffect)(() => {
-        if (value !== null) {
-            onChange && onChange(value);
-        }
+        onChange === null || onChange === void 0 ? void 0 : onChange(value);
     }, [value]);
     (0, react_1.useEffect)(() => {
         const loadDefault = () => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
@@ -108,7 +106,10 @@ const TagAutocomplete = (inProps) => {
         }
     };
     const handleClose = () => setOpen(false);
-    const handleChange = (_event, newValue) => setValue(newValue);
+    const handleChange = (_event, newValue) => {
+        setValue(newValue);
+        onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
+    };
     const filterOptions = (0, react_1.useCallback)((options, state) => {
         const search = state.inputValue.toLowerCase();
         return options.filter((option) => {
@@ -123,7 +124,7 @@ const TagAutocomplete = (inProps) => {
             const parts = (0, parse_1.default)(option.name, matches);
             return ((0, jsx_runtime_1.jsx)("li", Object.assign({}, props, { children: (0, jsx_runtime_1.jsx)(TagChip_1.default, Object.assign({ showDescription: true, disposable: false, tag: option, label: (0, jsx_runtime_1.jsx)(react_1.default.Fragment, { children: parts.map((part, index) => ((0, jsx_runtime_1.jsx)("span", Object.assign({ style: { fontWeight: part.highlight ? 700 : 400 } }, { children: part.text }), index))) }) }, TagChipProps), option.id) })));
         }, renderInput: (params) => {
-            return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, TextFieldProps, { InputProps: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'tags', endAdornment: tags.length > 0 ? ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [loading && (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: "inherit", size: 20 }), params.InputProps.endAdornment] })) : null }) })));
+            return ((0, jsx_runtime_1.jsx)(material_1.TextField, Object.assign({}, params, TextFieldProps, { InputProps: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'tags', endAdornment: value || tags.length > 0 ? ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [loading && (0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: "inherit", size: 20 }), params.InputProps.endAdornment] })) : null }) })));
         } }, rest)));
 };
 exports.default = TagAutocomplete;

package/lib/esm/components/CategoryAutocomplete/CategoryAutocomplete.d.ts

@@ -1,6 +1,6 @@
 import { AutocompleteProps, TextFieldProps } from '@mui/material';
 import { SCCategoryType } from '@selfcommunity/types';
-export interface CategoryAutocompleteProps extends Pick<AutocompleteProps<SCCategoryType | null, any, any, any>, Exclude<keyof AutocompleteProps<SCCategoryType | null, any, any, any>, 'open' | 'onOpen' | 'onClose' | 'onChange' | 'filterSelectedOptions' | 'disableCloseOnSelect' | 'options' | 'getOptionLabel' | 'value' | 'selectOnFocus' | 'clearOnBlur' | 'blurOnSelect' | 'handleHomeEndKeys' | 'clearIcon' | 'noOptionsText' | 'isOptionEqualToValue' | 'renderTags' | 'renderOption' | 'renderInput'>> {
+export interface CategoryAutocompleteProps extends Pick<AutocompleteProps<SCCategoryType | null, any, any, any>, Exclude<keyof AutocompleteProps<SCCategoryType | null, any, any, any>, 'open' | 'onOpen' | 'onClose' | 'onChange' | 'filterSelectedOptions' | 'disableCloseOnSelect' | 'options' | 'getOptionLabel' | 'value' | 'selectOnFocus' | 'clearOnBlur' | 'blurOnSelect' | 'handleHomeEndKeys' | 'noOptionsText' | 'isOptionEqualToValue' | 'renderTags' | 'renderOption' | 'renderInput'>> {
     /**
      * The maximum number of categories that will be visible when not focused.
      * @default 0

package/lib/esm/components/CategoryAutocomplete/CategoryAutocomplete.js

@@ -54,9 +54,6 @@ const CategoryAutocomplete = (inProps) => {
     // HOOKS
     const { categories, isLoading } = useSCFetchCategories({ endpointQueryParams });
     useEffect(() => {
-        if (value === null) {
-            return;
-        }
         onChange === null || onChange === void 0 ? void 0 : onChange(value);
     }, [value]);
     useEffect(() => {
@@ -81,6 +78,7 @@ const CategoryAutocomplete = (inProps) => {
             newValue = value;
         }
         setValue(newValue);
+        onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
     };
     // Render
     return (_jsx(Root, Object.assign({ className: classes.root, multiple: multiple, open: open, onOpen: handleOpen, onClose: handleClose, filterSelectedOptions: !checkboxSelect, disableCloseOnSelect: checkboxSelect, options: categories || [], getOptionLabel: (option) => option.name || '', value: value, selectOnFocus: true, clearOnBlur: true, blurOnSelect: true, handleHomeEndKeys: true, clearIcon: null, disabled: disabled || isLoading, noOptionsText: _jsx(FormattedMessage, { id: "ui.categoryAutocomplete.empty", defaultMessage: "ui.categoryAutocomplete.empty" }), onChange: handleChange, isOptionEqualToValue: (option, value) => value.id === option.id, renderTags: (value, getTagProps) => {

package/lib/esm/components/TagAutocomplete/TagAutocomplete.js

@@ -79,9 +79,7 @@ const TagAutocomplete = (inProps) => {
         }
     }, [open, inputValue]);
     useEffect(() => {
-        if (value !== null) {
-            onChange && onChange(value);
-        }
+        onChange === null || onChange === void 0 ? void 0 : onChange(value);
     }, [value]);
     useEffect(() => {
         const loadDefault = () => __awaiter(void 0, void 0, void 0, function* () {
@@ -106,7 +104,10 @@ const TagAutocomplete = (inProps) => {
         }
     };
     const handleClose = () => setOpen(false);
-    const handleChange = (_event, newValue) => setValue(newValue);
+    const handleChange = (_event, newValue) => {
+        setValue(newValue);
+        onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
+    };
     const filterOptions = useCallback((options, state) => {
         const search = state.inputValue.toLowerCase();
         return options.filter((option) => {
@@ -121,7 +122,7 @@ const TagAutocomplete = (inProps) => {
             const parts = parse(option.name, matches);
             return (_jsx("li", Object.assign({}, props, { children: _jsx(TagChip, Object.assign({ showDescription: true, disposable: false, tag: option, label: _jsx(React.Fragment, { children: parts.map((part, index) => (_jsx("span", Object.assign({ style: { fontWeight: part.highlight ? 700 : 400 } }, { children: part.text }), index))) }) }, TagChipProps), option.id) })));
         }, renderInput: (params) => {
-            return (_jsx(TextField, Object.assign({}, params, TextFieldProps, { InputProps: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'tags', endAdornment: tags.length > 0 ? (_jsxs(Fragment, { children: [loading && _jsx(CircularProgress, { color: "inherit", size: 20 }), params.InputProps.endAdornment] })) : null }) })));
+            return (_jsx(TextField, Object.assign({}, params, TextFieldProps, { InputProps: Object.assign(Object.assign({}, params.InputProps), { autoComplete: 'tags', endAdornment: value || tags.length > 0 ? (_jsxs(Fragment, { children: [loading && _jsx(CircularProgress, { color: "inherit", size: 20 }), params.InputProps.endAdornment] })) : null }) })));
         } }, rest)));
 };
 export default TagAutocomplete;