@symply.io/basic-components 1.0.0-beta.1 → 1.0.0-beta.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.
package/Autocomplete/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
declare function CustomAutocomplete(props:
|
|
1
|
+
import { AutocompleteProps } from "./types";
|
|
2
|
+
declare function CustomAutocomplete<T, multiple extends boolean | undefined>(props: AutocompleteProps<T, multiple>): JSX.Element;
|
|
3
3
|
export default CustomAutocomplete;
|
|
4
4
|
export * from "./types";
|
package/Autocomplete/types.d.ts
CHANGED
|
@@ -1,15 +1,14 @@
|
|
|
1
1
|
import { CSSProperties } from "react";
|
|
2
2
|
import { TextFieldProps } from "@mui/material/TextField";
|
|
3
|
-
export
|
|
3
|
+
export declare type AutocompleteOptionType<T> = T & {
|
|
4
4
|
label: string;
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
export
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
value: Array<AutocompleteOptionType> | AutocompleteOptionType | null;
|
|
5
|
+
};
|
|
6
|
+
export declare type AutocompleteValueType<T, multiple> = multiple extends false | undefined ? AutocompleteOptionType<T> | null : Array<AutocompleteOptionType<T>> | null;
|
|
7
|
+
export interface AutocompleteProps<T, multiple> extends Omit<TextFieldProps, "onChange"> {
|
|
8
|
+
multiple?: multiple;
|
|
9
|
+
options: Array<AutocompleteOptionType<T>>;
|
|
10
|
+
value: AutocompleteValueType<T, multiple>;
|
|
12
11
|
primaryColor?: CSSProperties["color"];
|
|
13
12
|
secondaryColor?: CSSProperties["color"];
|
|
14
|
-
onChange: (value:
|
|
13
|
+
onChange: (value: AutocompleteValueType<T, multiple>) => void;
|
|
15
14
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
declare function AutocompleteWithFilter(props:
|
|
1
|
+
import { AutocompleteWithFilterProps } from "./types";
|
|
2
|
+
declare function AutocompleteWithFilter<T, multiple extends boolean | undefined>(props: AutocompleteWithFilterProps<T, multiple>): JSX.Element;
|
|
3
3
|
export default AutocompleteWithFilter;
|
|
4
4
|
export * from "./types";
|
|
@@ -36,18 +36,16 @@ function AutocompleteWithFilter(props) {
|
|
|
36
36
|
ignoreCase: true,
|
|
37
37
|
ignoreAccents: true,
|
|
38
38
|
trim: true,
|
|
39
|
-
stringify: function (option) {
|
|
40
|
-
return typeof option === "string" ? option : option.label;
|
|
41
|
-
}
|
|
39
|
+
stringify: function (option) { return option.label; }
|
|
42
40
|
});
|
|
43
41
|
var theme = useCustomTheme({ primaryColor: primaryColor, secondaryColor: secondaryColor });
|
|
44
42
|
return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsx(Autocomplete, { size: size, fullWidth: true, limitTags: 1, options: options, multiple: multiple, filterOptions: filter, onChange: function (_, value) {
|
|
45
43
|
onChange(value);
|
|
46
44
|
}, disableCloseOnSelect: disableCloseOnSelect || multiple, getOptionLabel: function (option) {
|
|
47
|
-
return
|
|
45
|
+
return option.label || "";
|
|
48
46
|
}, renderOption: function (props, option, _a) {
|
|
49
47
|
var selected = _a.selected;
|
|
50
|
-
return (_jsxs("li", __assign({}, props, { children: [_jsx(Checkbox, { icon: icon, color: "primary", checkedIcon: checkedIcon, style: { marginRight: 8 }, checked: selected }),
|
|
48
|
+
return (_jsxs("li", __assign({}, props, { children: [_jsx(Checkbox, { icon: icon, color: "primary", checkedIcon: checkedIcon, style: { marginRight: 8 }, checked: selected }), option.label || ""] })));
|
|
51
49
|
}, renderInput: function (params) { return (_jsx(TextField, __assign({}, params, rest, { variant: "outlined" }))); } }) })));
|
|
52
50
|
}
|
|
53
51
|
export default AutocompleteWithFilter;
|
|
@@ -1,16 +1,15 @@
|
|
|
1
1
|
import { CSSProperties } from "react";
|
|
2
2
|
import { TextFieldProps } from "@mui/material/TextField";
|
|
3
|
-
export
|
|
3
|
+
export declare type AutocompleteWithFilterOptionType<T> = T & {
|
|
4
4
|
label: string;
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
export
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
value: Array<AutoCompleteWithFilterOptionType> | AutoCompleteWithFilterOptionType | null;
|
|
11
|
-
options: Array<AutoCompleteWithFilterOptionType>;
|
|
5
|
+
};
|
|
6
|
+
export declare type AutocompleteWithFilterValueType<T, multiple> = multiple extends false | undefined ? AutocompleteWithFilterOptionType<T> | null : Array<AutocompleteWithFilterOptionType<T>> | null;
|
|
7
|
+
export interface AutocompleteWithFilterProps<T, multiple> extends Omit<TextFieldProps, "onChange"> {
|
|
8
|
+
value: AutocompleteWithFilterValueType<T, multiple>;
|
|
9
|
+
options: Array<AutocompleteWithFilterOptionType<T>>;
|
|
12
10
|
disableCloseOnSelect?: boolean;
|
|
11
|
+
multiple?: multiple;
|
|
13
12
|
primaryColor?: CSSProperties["color"];
|
|
14
13
|
secondaryColor?: CSSProperties["color"];
|
|
15
|
-
onChange: (value:
|
|
14
|
+
onChange: (value: AutocompleteWithFilterValueType<T, multiple>) => void;
|
|
16
15
|
}
|
package/README.md
CHANGED
|
@@ -116,7 +116,7 @@ import { Autocomplete } from '@symply.io/basic-components/';
|
|
|
116
116
|
import Autocomplete from '@symply.io/basic-components/Autocomplete';
|
|
117
117
|
```
|
|
118
118
|
|
|
119
|
-
<h5>Option Props (
|
|
119
|
+
<h5>Option Props (AutocompleteOptionType)</h5>
|
|
120
120
|
|
|
121
121
|
| Name | Type | Default | Required | Description |
|
|
122
122
|
| ------ | ------- | ------- | -------- | -------------------------- |
|
|
@@ -125,12 +125,12 @@ import Autocomplete from '@symply.io/basic-components/Autocomplete';
|
|
|
125
125
|
|
|
126
126
|
<h5>Props</h5>
|
|
127
127
|
|
|
128
|
-
| Name | Type
|
|
129
|
-
| -------- |
|
|
130
|
-
| multiple | bool
|
|
131
|
-
| onChange | func
|
|
132
|
-
| options | Array
|
|
133
|
-
| value |
|
|
128
|
+
| Name | Type | Default | Required | Description |
|
|
129
|
+
| -------- | ------------------------------- | ------- | -------- | ------------------------------------------------------------ |
|
|
130
|
+
| multiple | bool | false | false | If `true`, `value` must be an array and the menu will support multiple selections. |
|
|
131
|
+
| onChange | func | | true | Callback fired when the `Input` value is changed.<br />**Signature:**<br/>`function(value: Array<AutocompleteOptionType)|AutocompleteOptionType|null => void`<br/>*value:* The value of the `Input` element. |
|
|
132
|
+
| options | Array\<AutocompleteOptionType\> | | true | Array of suggestion options. |
|
|
133
|
+
| value | AutocompleteOptionType | | true | The value of the `Input` element. |
|
|
134
134
|
|
|
135
135
|
|
|
136
136
|
|
|
@@ -148,7 +148,7 @@ import { AutocompleteWithFilter } from '@symply.io/basic-components/';
|
|
|
148
148
|
import AutocompleteWithFilter from '@symply.io/basic-components/AutocompleteWithFilter';
|
|
149
149
|
```
|
|
150
150
|
|
|
151
|
-
<h5>Option Props (
|
|
151
|
+
<h5>Option Props (AutocompleteOptionType)</h5>
|
|
152
152
|
|
|
153
153
|
| Name | Type | Default | Required | Description |
|
|
154
154
|
| ------ | ------- | ------- | -------- | -------------------------- |
|
|
@@ -157,13 +157,13 @@ import AutocompleteWithFilter from '@symply.io/basic-components/AutocompleteWith
|
|
|
157
157
|
|
|
158
158
|
<h5>Props</h5>
|
|
159
159
|
|
|
160
|
-
| Name | Type
|
|
161
|
-
| -------------------- |
|
|
162
|
-
| disableCloseOnSelect | bool
|
|
163
|
-
| multiple | bool
|
|
164
|
-
| onChange | func
|
|
165
|
-
| options | Array
|
|
166
|
-
| value |
|
|
160
|
+
| Name | Type | Default | Required | Description |
|
|
161
|
+
| -------------------- | ------------------------------- | ------- | -------- | ------------------------------------------------------------ |
|
|
162
|
+
| disableCloseOnSelect | bool | false | false | If `true`, the popup won't close when a value is selected. |
|
|
163
|
+
| multiple | bool | false | false | If `true`, `value` must be an array and the menu will support multiple selections. |
|
|
164
|
+
| onChange | func | | true | Callback fired when the `Input` value is changed.<br />**Signature:**<br/>`function(value: Array<AutocompleteOptionType)|AutocompleteOptionType|null => void`<br/>*value:* The value of the `Input` element. |
|
|
165
|
+
| options | Array\<AutocompleteOptionType\> | | true | Array of suggestion options. |
|
|
166
|
+
| value | AutocompleteOptionType | | true | The value of the `Input` element. |
|
|
167
167
|
|
|
168
168
|
|
|
169
169
|
|