@selfcommunity/react-ui 0.7.36-alpha.1 → 0.7.36-alpha.2
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.
|
@@ -106,17 +106,26 @@ function SearchAutocomplete(inProps) {
|
|
|
106
106
|
console.log(error);
|
|
107
107
|
});
|
|
108
108
|
}
|
|
109
|
+
const optionLabel = (option) => {
|
|
110
|
+
switch (option.type) {
|
|
111
|
+
case types_1.SuggestionType.CATEGORY:
|
|
112
|
+
return option[option.type]['name_synonyms'];
|
|
113
|
+
case types_1.SuggestionType.USER:
|
|
114
|
+
return option[option.type]['username'];
|
|
115
|
+
default:
|
|
116
|
+
return option[option.type]['name'];
|
|
117
|
+
}
|
|
118
|
+
};
|
|
109
119
|
(0, react_1.useEffect)(() => {
|
|
110
120
|
if (value) {
|
|
111
121
|
fetchResults();
|
|
112
122
|
}
|
|
113
123
|
}, [value]);
|
|
114
124
|
return (react_1.default.createElement(Root, Object.assign({ id: id, className: (0, classnames_1.default)(classes.root, className), blurOnSelect: blurOnSelect, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, freeSolo: true, autoComplete: true, disableClearable: true, loading: isLoading, loadingText: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.searchAutocomplete.loading", defaultMessage: "ui.searchAutocomplete.loading" }), noOptionsText: react_1.default.createElement(react_intl_1.FormattedMessage, { id: "ui.searchAutocomplete.noOptions", defaultMessage: "ui.searchAutocomplete.noOptions" }), options: options, getOptionLabel: (option) => {
|
|
115
|
-
var _a;
|
|
116
125
|
if (typeof option === 'string') {
|
|
117
126
|
return option;
|
|
118
127
|
}
|
|
119
|
-
return (
|
|
128
|
+
return optionLabel(option);
|
|
120
129
|
}, renderOption: (props, option) => (react_1.default.createElement(material_1.Box, Object.assign({ component: "li" }, props),
|
|
121
130
|
react_1.default.createElement(material_1.Avatar, { alt: getOptionData(option).name, src: getOptionData(option).image, variant: getOptionData(option).variant }),
|
|
122
131
|
react_1.default.createElement(material_1.Typography, { ml: 1 }, getOptionData(option).name))), renderInput: (params) => (react_1.default.createElement(material_1.TextField, Object.assign({}, params, { placeholder: `${intl.formatMessage(messages.placeholder, {
|
|
@@ -104,17 +104,26 @@ export default function SearchAutocomplete(inProps) {
|
|
|
104
104
|
console.log(error);
|
|
105
105
|
});
|
|
106
106
|
}
|
|
107
|
+
const optionLabel = (option) => {
|
|
108
|
+
switch (option.type) {
|
|
109
|
+
case SuggestionType.CATEGORY:
|
|
110
|
+
return option[option.type]['name_synonyms'];
|
|
111
|
+
case SuggestionType.USER:
|
|
112
|
+
return option[option.type]['username'];
|
|
113
|
+
default:
|
|
114
|
+
return option[option.type]['name'];
|
|
115
|
+
}
|
|
116
|
+
};
|
|
107
117
|
useEffect(() => {
|
|
108
118
|
if (value) {
|
|
109
119
|
fetchResults();
|
|
110
120
|
}
|
|
111
121
|
}, [value]);
|
|
112
122
|
return (React.createElement(Root, Object.assign({ id: id, className: classNames(classes.root, className), blurOnSelect: blurOnSelect, onChange: handleChange, onInputChange: handleInputChange, inputValue: value, freeSolo: true, autoComplete: true, disableClearable: true, loading: isLoading, loadingText: React.createElement(FormattedMessage, { id: "ui.searchAutocomplete.loading", defaultMessage: "ui.searchAutocomplete.loading" }), noOptionsText: React.createElement(FormattedMessage, { id: "ui.searchAutocomplete.noOptions", defaultMessage: "ui.searchAutocomplete.noOptions" }), options: options, getOptionLabel: (option) => {
|
|
113
|
-
var _a;
|
|
114
123
|
if (typeof option === 'string') {
|
|
115
124
|
return option;
|
|
116
125
|
}
|
|
117
|
-
return (
|
|
126
|
+
return optionLabel(option);
|
|
118
127
|
}, renderOption: (props, option) => (React.createElement(Box, Object.assign({ component: "li" }, props),
|
|
119
128
|
React.createElement(Avatar, { alt: getOptionData(option).name, src: getOptionData(option).image, variant: getOptionData(option).variant }),
|
|
120
129
|
React.createElement(Typography, { ml: 1 }, getOptionData(option).name))), renderInput: (params) => (React.createElement(TextField, Object.assign({}, params, { placeholder: `${intl.formatMessage(messages.placeholder, {
|