@selfcommunity/react-ui 0.7.9-alpha.25 → 0.7.9-alpha.26

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.
Files changed (4) hide show
  1. package/lib/cjs/components/SearchAutocomplete/SearchAutocomplete.js +22 -5
  2. package/lib/esm/components/SearchAutocomplete/SearchAutocomplete.js +22 -5
  3. package/lib/umd/react-ui.js +1 -1
  4. package/package.json +5 -5
package/lib/cjs/components/SearchAutocomplete/SearchAutocomplete.js CHANGED
@@ -75,6 +75,25 @@ function SearchAutocomplete(inProps) {
75
75
  setOptions([]);
76
76
  onClear && onClear();
77
77
  };
78
+ const getOptionData = (option) => {
79
+ let data = {};
80
+ if (option.type === types_1.SuggestionType.USER) {
81
+ data.name = option[types_1.SuggestionType.USER]['username'];
82
+ data.image = option[types_1.SuggestionType.USER]['avatar'];
83
+ data.variant = 'circular';
84
+ }
85
+ else if (option.type === types_1.SuggestionType.CATEGORY) {
86
+ data.name = option[types_1.SuggestionType.CATEGORY]['name'];
87
+ data.image = option[types_1.SuggestionType.CATEGORY]['image_medium'];
88
+ data.variant = 'square';
89
+ }
90
+ else if (option.type === types_1.SuggestionType.GROUP) {
91
+ data.name = option[types_1.SuggestionType.GROUP]['name'];
92
+ data.image = option[types_1.SuggestionType.GROUP]['image_big'];
93
+ data.variant = 'circular';
94
+ }
95
+ return data;
96
+ };
78
97
  function fetchResults() {
79
98
  setIsLoading(true);
80
99
  api_services_1.SuggestionService.getSearchSuggestion(value)
@@ -98,11 +117,9 @@ function SearchAutocomplete(inProps) {
98
117
  return option;
99
118
  }
100
119
  return (_a = option[option.type]['username']) !== null && _a !== void 0 ? _a : option[option.type]['name'];
101
- }, renderOption: (props, option) => (react_1.default.createElement(material_1.Box, Object.assign({ component: "li" }, props), option.type === types_1.SuggestionType.USER ? (react_1.default.createElement(react_1.default.Fragment, null,
102
- react_1.default.createElement(material_1.Avatar, { alt: option[types_1.SuggestionType.USER]['username'], src: option[types_1.SuggestionType.USER]['avatar'] }),
103
- react_1.default.createElement(material_1.Typography, { ml: 1 }, option[types_1.SuggestionType.USER]['username']))) : (react_1.default.createElement(react_1.default.Fragment, null,
104
- react_1.default.createElement(material_1.Avatar, { alt: option[types_1.SuggestionType.CATEGORY]['name'], src: option[types_1.SuggestionType.CATEGORY]['image_medium'], variant: "square" }),
105
- react_1.default.createElement(material_1.Typography, { ml: 1 }, option[types_1.SuggestionType.CATEGORY]['name']))))), renderInput: (params) => (react_1.default.createElement(material_1.TextField, Object.assign({}, params, { placeholder: `${intl.formatMessage(messages.placeholder, {
120
+ }, renderOption: (props, option) => (react_1.default.createElement(material_1.Box, Object.assign({ component: "li" }, props),
121
+ react_1.default.createElement(material_1.Avatar, { alt: getOptionData(option).name, src: getOptionData(option).image, variant: getOptionData(option).variant }),
122
+ 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, {
106
123
  community: scPreferences.preferences[react_core_1.SCPreferences.TEXT_APPLICATION_NAME].value
107
124
  })}`, InputProps: Object.assign(Object.assign({}, params.InputProps), { autoFocus, name: 'search-autocomplete', className: classes.input, startAdornment: react_1.default.createElement(Icon_1.default, { className: classes.icon }, "search"), endAdornment: (react_1.default.createElement(material_1.Fade, { in: value.length > 0 || Boolean(onClear), appear: false },
108
125
  react_1.default.createElement(material_1.IconButton, { className: classes.clear, onClick: handleClear, size: "small" },
package/lib/esm/components/SearchAutocomplete/SearchAutocomplete.js CHANGED
@@ -73,6 +73,25 @@ export default function SearchAutocomplete(inProps) {
73
73
  setOptions([]);
74
74
  onClear && onClear();
75
75
  };
76
+ const getOptionData = (option) => {
77
+ let data = {};
78
+ if (option.type === SuggestionType.USER) {
79
+ data.name = option[SuggestionType.USER]['username'];
80
+ data.image = option[SuggestionType.USER]['avatar'];
81
+ data.variant = 'circular';
82
+ }
83
+ else if (option.type === SuggestionType.CATEGORY) {
84
+ data.name = option[SuggestionType.CATEGORY]['name'];
85
+ data.image = option[SuggestionType.CATEGORY]['image_medium'];
86
+ data.variant = 'square';
87
+ }
88
+ else if (option.type === SuggestionType.GROUP) {
89
+ data.name = option[SuggestionType.GROUP]['name'];
90
+ data.image = option[SuggestionType.GROUP]['image_big'];
91
+ data.variant = 'circular';
92
+ }
93
+ return data;
94
+ };
76
95
  function fetchResults() {
77
96
  setIsLoading(true);
78
97
  SuggestionService.getSearchSuggestion(value)
@@ -96,11 +115,9 @@ export default function SearchAutocomplete(inProps) {
96
115
  return option;
97
116
  }
98
117
  return (_a = option[option.type]['username']) !== null && _a !== void 0 ? _a : option[option.type]['name'];
99
- }, renderOption: (props, option) => (React.createElement(Box, Object.assign({ component: "li" }, props), option.type === SuggestionType.USER ? (React.createElement(React.Fragment, null,
100
- React.createElement(Avatar, { alt: option[SuggestionType.USER]['username'], src: option[SuggestionType.USER]['avatar'] }),
101
- React.createElement(Typography, { ml: 1 }, option[SuggestionType.USER]['username']))) : (React.createElement(React.Fragment, null,
102
- React.createElement(Avatar, { alt: option[SuggestionType.CATEGORY]['name'], src: option[SuggestionType.CATEGORY]['image_medium'], variant: "square" }),
103
- React.createElement(Typography, { ml: 1 }, option[SuggestionType.CATEGORY]['name']))))), renderInput: (params) => (React.createElement(TextField, Object.assign({}, params, { placeholder: `${intl.formatMessage(messages.placeholder, {
118
+ }, renderOption: (props, option) => (React.createElement(Box, Object.assign({ component: "li" }, props),
119
+ React.createElement(Avatar, { alt: getOptionData(option).name, src: getOptionData(option).image, variant: getOptionData(option).variant }),
120
+ React.createElement(Typography, { ml: 1 }, getOptionData(option).name))), renderInput: (params) => (React.createElement(TextField, Object.assign({}, params, { placeholder: `${intl.formatMessage(messages.placeholder, {
104
121
  community: scPreferences.preferences[SCPreferences.TEXT_APPLICATION_NAME].value
105
122
  })}`, InputProps: Object.assign(Object.assign({}, params.InputProps), { autoFocus, name: 'search-autocomplete', className: classes.input, startAdornment: React.createElement(Icon, { className: classes.icon }, "search"), endAdornment: (React.createElement(Fade, { in: value.length > 0 || Boolean(onClear), appear: false },
106
123
  React.createElement(IconButton, { className: classes.clear, onClick: handleClear, size: "small" },