@intility/bifrost-react-select 4.0.0-alpha.8 → 4.0.0-beta.10
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/CHANGELOG.md +102 -0
- package/dist/Select.d.ts +7 -7
- package/dist/Select.js +107 -104
- package/dist/assets/bfSpinner.d.ts +2 -2
- package/dist/assets/bfSpinner.js +5 -5
- package/dist/overrides/ClearIndicator.internal.js +3 -3
- package/dist/overrides/CustomInput.internal.js +5 -5
- package/dist/overrides/CustomMenuList.internal.js +1 -1
- package/dist/overrides/CustomOption.internal.js +5 -5
- package/dist/overrides/DropdownIndicator.internal.js +3 -3
- package/dist/overrides/LoadingIndicator.internal.js +2 -2
- package/dist/overrides/index.d.ts +6 -6
- package/dist/overrides/index.js +6 -6
- package/package.json +4 -4
- package/src/Select.test.tsx +94 -93
- package/src/Select.tsx +203 -205
- package/src/assets/bfSpinner.ts +15 -15
- package/src/overrides/ClearIndicator.internal.tsx +7 -7
- package/src/overrides/CustomInput.internal.tsx +16 -14
- package/src/overrides/CustomMenuList.internal.tsx +7 -7
- package/src/overrides/CustomOption.internal.tsx +11 -11
- package/src/overrides/DropdownIndicator.internal.tsx +7 -7
- package/src/overrides/LoadingIndicator.internal.tsx +4 -4
- package/src/overrides/index.ts +6 -6
- package/tsconfig.json +1 -1
- package/vitest.config.ts +7 -7
- package/dist/index.d.ts +0 -1
- package/dist/index.js +0 -1
- package/src/Select.md +0 -410
- package/src/index.ts +0 -8
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,107 @@
|
|
|
1
1
|
# @intility/bifrost-react-select
|
|
2
2
|
|
|
3
|
+
## 4.0.0-beta.10
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies [17165424]
|
|
8
|
+
- @intility/bifrost-react@4.0.0-beta.9
|
|
9
|
+
|
|
10
|
+
## 4.0.0-beta.9
|
|
11
|
+
|
|
12
|
+
### Patch Changes
|
|
13
|
+
|
|
14
|
+
- Updated dependencies [5504294e]
|
|
15
|
+
- Updated dependencies [7db473c6]
|
|
16
|
+
- @intility/bifrost-react@4.0.0-beta.8
|
|
17
|
+
|
|
18
|
+
## 4.0.0-beta.8
|
|
19
|
+
|
|
20
|
+
### Patch Changes
|
|
21
|
+
|
|
22
|
+
- Updated dependencies [3849abc3]
|
|
23
|
+
- @intility/bifrost-react@4.0.0-beta.7
|
|
24
|
+
|
|
25
|
+
## 4.0.0-beta.7
|
|
26
|
+
|
|
27
|
+
### Patch Changes
|
|
28
|
+
|
|
29
|
+
- Updated dependencies [82ab21b5]
|
|
30
|
+
- Updated dependencies [81af701b]
|
|
31
|
+
- @intility/bifrost-react@4.0.0-beta.6
|
|
32
|
+
|
|
33
|
+
## 4.0.0-beta.6
|
|
34
|
+
|
|
35
|
+
### Minor Changes
|
|
36
|
+
|
|
37
|
+
- 6b355639: New styling for inputs, now always outlined. Removed `variant` prop from `<Input>`.
|
|
38
|
+
|
|
39
|
+
### Patch Changes
|
|
40
|
+
|
|
41
|
+
- Updated dependencies [6b355639]
|
|
42
|
+
- Updated dependencies [6b355639]
|
|
43
|
+
- @intility/bifrost-react@4.0.0-beta.5
|
|
44
|
+
|
|
45
|
+
## 4.0.0-beta.5
|
|
46
|
+
|
|
47
|
+
### Patch Changes
|
|
48
|
+
|
|
49
|
+
- e410a910: New base color values for light mode #711
|
|
50
|
+
- Updated dependencies [e410a910]
|
|
51
|
+
- @intility/bifrost-react@4.0.0-beta.4
|
|
52
|
+
|
|
53
|
+
## 4.0.0-beta.4
|
|
54
|
+
|
|
55
|
+
### Patch Changes
|
|
56
|
+
|
|
57
|
+
- a903f282: fix: export typescript types used in react components
|
|
58
|
+
- Updated dependencies [a903f282]
|
|
59
|
+
- Updated dependencies [19500ce7]
|
|
60
|
+
- Updated dependencies [8263586d]
|
|
61
|
+
- @intility/bifrost-react@4.0.0-beta.3
|
|
62
|
+
|
|
63
|
+
## 4.0.0-beta.3
|
|
64
|
+
|
|
65
|
+
### Patch Changes
|
|
66
|
+
|
|
67
|
+
- Updated dependencies [b60c063d]
|
|
68
|
+
- @intility/bifrost-react@4.0.0-beta.2
|
|
69
|
+
|
|
70
|
+
## 4.0.0-beta.2
|
|
71
|
+
|
|
72
|
+
### Major Changes
|
|
73
|
+
|
|
74
|
+
- 608d2083: update module output
|
|
75
|
+
|
|
76
|
+
### Patch Changes
|
|
77
|
+
|
|
78
|
+
- 165904af: use deep imports from @intility/bifrost-react
|
|
79
|
+
- Updated dependencies [165904af]
|
|
80
|
+
- Updated dependencies [608d2083]
|
|
81
|
+
- @intility/bifrost-react@4.0.0-beta.1
|
|
82
|
+
|
|
83
|
+
## 4.0.0-beta.1
|
|
84
|
+
|
|
85
|
+
### Patch Changes
|
|
86
|
+
|
|
87
|
+
- 217c8741: Named export for Select and DatePicker
|
|
88
|
+
|
|
89
|
+
## 4.0.0-beta.0
|
|
90
|
+
|
|
91
|
+
### Major Changes
|
|
92
|
+
|
|
93
|
+
- 5c7ba5a4: split react-select and react-datepicker
|
|
94
|
+
|
|
95
|
+
### Patch Changes
|
|
96
|
+
|
|
97
|
+
- Updated dependencies [3785f8d6]
|
|
98
|
+
- Updated dependencies [5c7ba5a4]
|
|
99
|
+
- Updated dependencies [5cb3ebac]
|
|
100
|
+
- Updated dependencies [d8bd3f72]
|
|
101
|
+
- Updated dependencies [df1f169d]
|
|
102
|
+
- Updated dependencies [727894c3]
|
|
103
|
+
- @intility/bifrost-react@4.0.0-beta.0
|
|
104
|
+
|
|
3
105
|
## 4.0.0-alpha.8
|
|
4
106
|
|
|
5
107
|
### Patch Changes
|
package/dist/Select.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { CSSProperties, ReactNode, RefAttributes } from
|
|
2
|
-
import { GroupBase, Props as ReactSelectProps, SelectInstance, components } from
|
|
3
|
-
import { AsyncProps as AsyncSelectProps } from
|
|
4
|
-
import { CreatableProps as CreatableSelectProps } from
|
|
5
|
-
import { AsyncCreatableProps as AsyncCreatableSelectProps } from
|
|
1
|
+
import { CSSProperties, ReactNode, RefAttributes } from "react";
|
|
2
|
+
import { GroupBase, Props as ReactSelectProps, SelectInstance, components } from "react-select";
|
|
3
|
+
import { AsyncProps as AsyncSelectProps } from "react-select/async";
|
|
4
|
+
import { CreatableProps as CreatableSelectProps } from "react-select/creatable";
|
|
5
|
+
import { AsyncCreatableProps as AsyncCreatableSelectProps } from "react-select/async-creatable";
|
|
6
6
|
export declare const selectStyles: {
|
|
7
7
|
container: (provided: any) => any;
|
|
8
8
|
control: (provided: any, state: any) => any;
|
|
@@ -47,7 +47,7 @@ export type SelectType = {
|
|
|
47
47
|
}, IsMulti extends boolean = false, Group extends GroupBase<OptionType> = GroupBase<OptionType>>(props: ReactSelectProps<OptionType, IsMulti, Group> & RefAttributes<SelectInstance<OptionType, IsMulti, Group>> & SelectProps): React.ReactElement | null;
|
|
48
48
|
displayName?: string;
|
|
49
49
|
};
|
|
50
|
-
declare const
|
|
50
|
+
export declare const Select: SelectType;
|
|
51
51
|
export type AsyncType = {
|
|
52
52
|
<OptionType = {
|
|
53
53
|
label: string;
|
|
@@ -82,4 +82,4 @@ export type AsyncCreatableType = {
|
|
|
82
82
|
};
|
|
83
83
|
declare const AsyncCreatableSelect: AsyncCreatableType;
|
|
84
84
|
export { AsyncSelect, CreatableSelect, AsyncCreatableSelect };
|
|
85
|
-
export default
|
|
85
|
+
export default Select;
|
package/dist/Select.js
CHANGED
|
@@ -1,70 +1,72 @@
|
|
|
1
|
-
/* eslint-disable @typescript-eslint/ban-ts-comment */
|
|
1
|
+
/* eslint-disable @typescript-eslint/ban-ts-comment */ "use client";
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { forwardRef } from
|
|
4
|
-
import ReactSelectDefaultExport from
|
|
5
|
-
import AsyncReactSelect from
|
|
6
|
-
import CreatableReactSelect from
|
|
7
|
-
import AsyncCreatableReactSelect from
|
|
8
|
-
import classNames from
|
|
9
|
-
import
|
|
10
|
-
import
|
|
3
|
+
import { forwardRef } from "react";
|
|
4
|
+
import ReactSelectDefaultExport from "react-select";
|
|
5
|
+
import AsyncReactSelect from "react-select/async";
|
|
6
|
+
import CreatableReactSelect from "react-select/creatable";
|
|
7
|
+
import AsyncCreatableReactSelect from "react-select/async-creatable";
|
|
8
|
+
import classNames from "classnames";
|
|
9
|
+
import Description from "@intility/bifrost-react/Description";
|
|
10
|
+
import Feedback from "@intility/bifrost-react/Feedback";
|
|
11
|
+
import Label from "@intility/bifrost-react/Label";
|
|
12
|
+
import useUniqueId from "@intility/bifrost-react/hooks/useUniqueId";
|
|
13
|
+
import { DropdownIndicator, ClearIndicator, CustomInput, CustomMenuList, CustomOption, LoadingIndicator } from "./overrides/index.js";
|
|
11
14
|
const ReactSelect = ReactSelectDefaultExport.default ?? ReactSelectDefaultExport;
|
|
12
15
|
export const selectStyles = {
|
|
13
16
|
container: (provided)=>({
|
|
14
17
|
...provided,
|
|
15
|
-
|
|
16
|
-
marginTop:
|
|
18
|
+
".bf-label-description + &, .bf-label + &": {
|
|
19
|
+
marginTop: "var(--bfs4)"
|
|
17
20
|
}
|
|
18
21
|
}),
|
|
19
22
|
control: (provided, state)=>({
|
|
20
23
|
...provided,
|
|
21
|
-
|
|
22
|
-
|
|
24
|
+
"&:hover": {
|
|
25
|
+
borderColor: state.isFocused ? "var(--bfc-theme-3)" : "var(--bfc-base-c-inverted-2)",
|
|
23
26
|
// Change color of dropdown icon when hover on Select
|
|
24
|
-
|
|
25
|
-
color:
|
|
27
|
+
".bf-select__dropdown-indicator": {
|
|
28
|
+
color: "var(--bfc-theme-3)"
|
|
26
29
|
}
|
|
27
30
|
},
|
|
28
|
-
backgroundColor: state.isDisabled ?
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
cursor: 'text'
|
|
31
|
+
backgroundColor: state.isDisabled ? "var(--bfc-base-dimmed)" : "var(--bfc-base-3)",
|
|
32
|
+
borderWidth: "1px",
|
|
33
|
+
borderStyle: "solid",
|
|
34
|
+
borderColor: state.isFocused ? "var(--bfc-theme-3)" : state.isDisabled ? "transparent" : "var(--bfc-base-c-wcag)",
|
|
35
|
+
boxShadow: "none",
|
|
36
|
+
borderRadius: state.selectProps.menuIsOpen ? " var(--bf-radius-xs) var(--bf-radius-xs) 0 0" : "var(--bf-radius-xs)",
|
|
37
|
+
minHeight: "var(--bfs40)",
|
|
38
|
+
cursor: "text"
|
|
37
39
|
}),
|
|
38
40
|
indicatorSeparator: ()=>({
|
|
39
|
-
display:
|
|
41
|
+
display: "none"
|
|
40
42
|
}),
|
|
41
43
|
indicatorsContainer: (provided)=>({
|
|
42
44
|
...provided,
|
|
43
|
-
alignItems:
|
|
44
|
-
padding:
|
|
45
|
+
alignItems: "flex-start",
|
|
46
|
+
padding: "7.5px 0"
|
|
45
47
|
}),
|
|
46
48
|
clearIndicator: (provided)=>({
|
|
47
49
|
...provided,
|
|
48
|
-
|
|
49
|
-
color:
|
|
50
|
+
"&:hover": {
|
|
51
|
+
color: "var(--bfc-base-c-1)"
|
|
50
52
|
},
|
|
51
|
-
color:
|
|
52
|
-
cursor:
|
|
53
|
-
padding:
|
|
54
|
-
margin:
|
|
53
|
+
color: "var(--bfc-base-c-2)",
|
|
54
|
+
cursor: "pointer",
|
|
55
|
+
padding: "var(--bfs4)",
|
|
56
|
+
margin: "1px var(--bfs4) 0px 0px"
|
|
55
57
|
}),
|
|
56
58
|
dropdownIndicator: (provided, state)=>({
|
|
57
59
|
...provided,
|
|
58
|
-
color: state.isDisabled ?
|
|
59
|
-
cursor:
|
|
60
|
-
padding:
|
|
61
|
-
marginRight:
|
|
60
|
+
color: state.isDisabled ? "var(--bfc-base-c-2)" : "var(--bfc-theme-1)",
|
|
61
|
+
cursor: "pointer",
|
|
62
|
+
padding: "var(--bfs4)",
|
|
63
|
+
marginRight: "var(--bfs8)"
|
|
62
64
|
}),
|
|
63
65
|
input: (provided)=>({
|
|
64
66
|
...provided,
|
|
65
|
-
color:
|
|
66
|
-
fontFamily:
|
|
67
|
-
fontSize:
|
|
67
|
+
color: "var(--bfc-base-c-1)",
|
|
68
|
+
fontFamily: "inherit",
|
|
69
|
+
fontSize: "var(--bf-font-size-l)"
|
|
68
70
|
}),
|
|
69
71
|
menuPortal: (provided)=>({
|
|
70
72
|
...provided,
|
|
@@ -72,98 +74,99 @@ export const selectStyles = {
|
|
|
72
74
|
}),
|
|
73
75
|
menu: (provided)=>({
|
|
74
76
|
...provided,
|
|
75
|
-
backgroundColor:
|
|
76
|
-
boxShadow:
|
|
77
|
-
borderRadius:
|
|
77
|
+
backgroundColor: "var(--bfc-base-3)",
|
|
78
|
+
boxShadow: "none",
|
|
79
|
+
borderRadius: "none",
|
|
78
80
|
marginTop: 0,
|
|
79
81
|
zIndex: 3
|
|
80
82
|
}),
|
|
81
83
|
menuList: (provided)=>({
|
|
82
84
|
...provided,
|
|
83
85
|
padding: 0,
|
|
84
|
-
|
|
85
|
-
|
|
86
|
+
border: "1px solid var(--bfc-theme-3)",
|
|
87
|
+
borderTop: "none",
|
|
88
|
+
borderRadius: "0 0 var(--bf-radius-xs) var(--bf-radius-xs)"
|
|
86
89
|
}),
|
|
87
90
|
placeholder: (provided)=>({
|
|
88
91
|
...provided,
|
|
89
|
-
color:
|
|
90
|
-
fontSize:
|
|
92
|
+
color: "var(--bfc-base-c-2)",
|
|
93
|
+
fontSize: "var(--bf-font-size-l)"
|
|
91
94
|
}),
|
|
92
95
|
singleValue: (provided, state)=>({
|
|
93
96
|
...provided,
|
|
94
|
-
color: state.selectProps.menuIsOpen ?
|
|
95
|
-
fontSize:
|
|
97
|
+
color: state.selectProps.menuIsOpen ? "var(--bfc-base-c-2)" : "var(--bfc-base-c)",
|
|
98
|
+
fontSize: "var(--bf-font-size-l)"
|
|
96
99
|
}),
|
|
97
100
|
option: (provided, state)=>({
|
|
98
101
|
...provided,
|
|
99
|
-
display:
|
|
100
|
-
justifyContent: !state.isMulti ?
|
|
101
|
-
alignItems:
|
|
102
|
-
padding:
|
|
103
|
-
backgroundColor: state.isDisabled ?
|
|
104
|
-
color:
|
|
105
|
-
|
|
106
|
-
marginRight:
|
|
107
|
-
color:
|
|
102
|
+
display: "flex",
|
|
103
|
+
justifyContent: !state.isMulti ? "space-between" : "normal",
|
|
104
|
+
alignItems: "baseline",
|
|
105
|
+
padding: "7px 12px",
|
|
106
|
+
backgroundColor: state.isDisabled ? "var(--bfc-base-dimmed)" : state.isFocused ? "var(--bfc-base-1)" : "var(--bfc-base-3)",
|
|
107
|
+
color: "var(--bfc-base-c)",
|
|
108
|
+
"& .bf-select-checkbox": {
|
|
109
|
+
marginRight: "var(--bfs8)",
|
|
110
|
+
color: "var(--bfc-theme)"
|
|
108
111
|
},
|
|
109
|
-
|
|
110
|
-
color:
|
|
111
|
-
marginLeft:
|
|
112
|
+
"& .bf-select-selected-icon": {
|
|
113
|
+
color: "var(--bfc-base-c-theme)",
|
|
114
|
+
marginLeft: "var(--bfs4)"
|
|
112
115
|
},
|
|
113
|
-
|
|
114
|
-
backgroundColor: state.isDisabled ?
|
|
115
|
-
cursor: state.isDisabled ?
|
|
116
|
+
"&:hover": {
|
|
117
|
+
backgroundColor: state.isDisabled ? "var(--bfc-base-dimmed)" : "var(--bfc-base-1)",
|
|
118
|
+
cursor: state.isDisabled ? "default" : "pointer"
|
|
116
119
|
},
|
|
117
|
-
fontSize:
|
|
120
|
+
fontSize: "var(--bf-font-size-l)",
|
|
118
121
|
fontWeight: state.isSelected ? 600 : 400,
|
|
119
|
-
wordBreak:
|
|
120
|
-
whiteSpace:
|
|
122
|
+
wordBreak: "break-word",
|
|
123
|
+
whiteSpace: "normal"
|
|
121
124
|
}),
|
|
122
125
|
multiValue: (provided, state)=>({
|
|
123
126
|
...provided,
|
|
124
|
-
backgroundColor: state.isDisabled ?
|
|
125
|
-
borderRadius:
|
|
127
|
+
backgroundColor: state.isDisabled ? "var(--bfc-base-c-inverted-2)" : "var(--bfc-theme-c)",
|
|
128
|
+
borderRadius: "var(--bf-radius-xs)"
|
|
126
129
|
}),
|
|
127
130
|
multiValueLabel: (provided, state)=>({
|
|
128
131
|
...provided,
|
|
129
|
-
color: state.isDisabled ?
|
|
130
|
-
fontSize:
|
|
132
|
+
color: state.isDisabled ? "var(--bfc-base-1)" : "var(--bfc-base-c-theme)",
|
|
133
|
+
fontSize: "var(--bf-font-size-m)"
|
|
131
134
|
}),
|
|
132
135
|
multiValueRemove: (provided, state)=>({
|
|
133
136
|
...provided,
|
|
134
|
-
color: state.isDisabled ?
|
|
135
|
-
borderRadius:
|
|
136
|
-
borderTopRightRadius:
|
|
137
|
-
borderBottomRightRadius:
|
|
138
|
-
paddingLeft:
|
|
139
|
-
paddingRight:
|
|
140
|
-
marginLeft:
|
|
141
|
-
background: state.isFocused &&
|
|
142
|
-
|
|
143
|
-
color:
|
|
144
|
-
cursor:
|
|
145
|
-
background:
|
|
137
|
+
color: state.isDisabled ? "var(--bfc-base-1)" : state.isFocused ? "var(--bfc-theme-c-base-3)" : "var(--bfc-theme-1)",
|
|
138
|
+
borderRadius: "unset",
|
|
139
|
+
borderTopRightRadius: "var(--bf-radius-xs)",
|
|
140
|
+
borderBottomRightRadius: "var(--bf-radius-xs)",
|
|
141
|
+
paddingLeft: "var(--bfs2)",
|
|
142
|
+
paddingRight: "var(--bfs2)",
|
|
143
|
+
marginLeft: "var(--bfs2)",
|
|
144
|
+
background: state.isFocused && "var(--bfc-theme-2)",
|
|
145
|
+
"&:hover": {
|
|
146
|
+
color: "var(--bfc-theme-c-base-3)",
|
|
147
|
+
cursor: "pointer",
|
|
148
|
+
background: "var(--bfc-theme)"
|
|
146
149
|
},
|
|
147
|
-
|
|
148
|
-
background:
|
|
150
|
+
"&:active": {
|
|
151
|
+
background: "var(--bfc-theme-2)"
|
|
149
152
|
},
|
|
150
153
|
svg: {
|
|
151
|
-
marginTop:
|
|
154
|
+
marginTop: "1px"
|
|
152
155
|
}
|
|
153
156
|
}),
|
|
154
157
|
group: (provided)=>({
|
|
155
158
|
...provided,
|
|
156
|
-
padding:
|
|
157
|
-
|
|
158
|
-
marginTop:
|
|
159
|
+
padding: "var(--bfs6) 0",
|
|
160
|
+
"&:first-of-type": {
|
|
161
|
+
marginTop: "var(--bfs4)"
|
|
159
162
|
}
|
|
160
163
|
}),
|
|
161
164
|
groupHeading: (provided)=>({
|
|
162
165
|
...provided,
|
|
163
|
-
textTransform:
|
|
164
|
-
color:
|
|
165
|
-
fontSize:
|
|
166
|
-
marginBottom:
|
|
166
|
+
textTransform: "capitalize",
|
|
167
|
+
color: "var(--bfc-base-c-2)",
|
|
168
|
+
fontSize: "var(--bf-font-size-s)",
|
|
169
|
+
marginBottom: "var(--bfs2)"
|
|
167
170
|
})
|
|
168
171
|
};
|
|
169
172
|
export const selectComponents = {
|
|
@@ -175,8 +178,8 @@ export const selectComponents = {
|
|
|
175
178
|
LoadingIndicator
|
|
176
179
|
};
|
|
177
180
|
const selectStates = [
|
|
178
|
-
|
|
179
|
-
|
|
181
|
+
"default",
|
|
182
|
+
"alert"
|
|
180
183
|
];
|
|
181
184
|
/**
|
|
182
185
|
* Select HOC
|
|
@@ -187,11 +190,11 @@ const selectStates = [
|
|
|
187
190
|
const selectId = useUniqueId(inputId);
|
|
188
191
|
return /*#__PURE__*/ _jsxs("div", {
|
|
189
192
|
className: classNames(className, {
|
|
190
|
-
|
|
193
|
+
"bf-select-container": true
|
|
191
194
|
}, {
|
|
192
|
-
|
|
195
|
+
"bf-select-disabled": isDisabled
|
|
193
196
|
}, {
|
|
194
|
-
|
|
197
|
+
"bf-select-alert": !isDisabled && state === "alert"
|
|
195
198
|
}),
|
|
196
199
|
style: style,
|
|
197
200
|
"data-testid": "bf-select-container",
|
|
@@ -234,13 +237,13 @@ const selectStates = [
|
|
|
234
237
|
};
|
|
235
238
|
/**
|
|
236
239
|
* Select component - dropdown list
|
|
237
|
-
*/ const
|
|
238
|
-
|
|
240
|
+
*/ export const Select = SelectHOC(ReactSelect);
|
|
241
|
+
Select.displayName = "Select";
|
|
239
242
|
const AsyncSelect = SelectHOC(AsyncReactSelect);
|
|
240
|
-
AsyncSelect.displayName =
|
|
243
|
+
AsyncSelect.displayName = "AsyncSelect";
|
|
241
244
|
const CreatableSelect = SelectHOC(CreatableReactSelect);
|
|
242
|
-
CreatableSelect.displayName =
|
|
245
|
+
CreatableSelect.displayName = "CreatableSelect";
|
|
243
246
|
const AsyncCreatableSelect = SelectHOC(AsyncCreatableReactSelect);
|
|
244
|
-
AsyncCreatableSelect.displayName =
|
|
247
|
+
AsyncCreatableSelect.displayName = "AsyncCreatableSelect";
|
|
245
248
|
export { AsyncSelect, CreatableSelect, AsyncCreatableSelect };
|
|
246
|
-
export default
|
|
249
|
+
export default Select;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { IconDefinition, IconName, IconPathData, IconPrefix } from
|
|
1
|
+
import { IconDefinition, IconName, IconPathData, IconPrefix } from "@fortawesome/fontawesome-svg-core";
|
|
2
2
|
declare const prefix: IconPrefix;
|
|
3
3
|
declare const iconName: IconName;
|
|
4
4
|
declare const width = 18;
|
|
@@ -7,4 +7,4 @@ declare const aliases: never[];
|
|
|
7
7
|
declare const unicode = "";
|
|
8
8
|
declare const svgPathData: IconPathData;
|
|
9
9
|
declare const definition: IconDefinition;
|
|
10
|
-
export { definition as default, definition as faIndeterminate, definition, prefix, iconName, width, height, aliases as ligatures, unicode, svgPathData, aliases };
|
|
10
|
+
export { definition as default, definition as faIndeterminate, definition, prefix, iconName, width, height, aliases as ligatures, unicode, svgPathData, aliases, };
|
package/dist/assets/bfSpinner.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
const prefix =
|
|
2
|
-
const iconName =
|
|
1
|
+
const prefix = "fac";
|
|
2
|
+
const iconName = "bf-spinner";
|
|
3
3
|
const width = 18;
|
|
4
4
|
const height = 18;
|
|
5
5
|
const aliases = [];
|
|
6
|
-
const unicode =
|
|
6
|
+
const unicode = "";
|
|
7
7
|
const svgPathData = [
|
|
8
|
-
|
|
9
|
-
|
|
8
|
+
"M9 2C5.13401 2 2 5.13401 2 9C2 12.866 5.13401 16 9 16C12.866 16 16 12.866 16 9C16 5.13401 12.866 2 9 2ZM0 9C0 4.02944 4.02944 0 9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9Z",
|
|
9
|
+
"M8 1C8 0.447715 8.44772 0 9 0C13.9706 0 18 4.02944 18 9C18 9.55229 17.5523 10 17 10C16.4477 10 16 9.55229 16 9C16 5.13401 12.866 2 9 2C8.44772 2 8 1.55228 8 1Z"
|
|
10
10
|
];
|
|
11
11
|
const definition = {
|
|
12
12
|
prefix,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { Icon } from
|
|
3
|
-
import { components } from
|
|
4
|
-
import { faXmark } from
|
|
2
|
+
import { Icon } from "@intility/bifrost-react";
|
|
3
|
+
import { components } from "react-select";
|
|
4
|
+
import { faXmark } from "@fortawesome/free-solid-svg-icons/faXmark";
|
|
5
5
|
const ClearIndicator = (props)=>{
|
|
6
6
|
return /*#__PURE__*/ _jsx(components.ClearIndicator, {
|
|
7
7
|
...props,
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
-
import { components } from
|
|
2
|
+
import { components } from "react-select";
|
|
3
3
|
const CustomInput = (props)=>{
|
|
4
4
|
const { required, value } = props.selectProps;
|
|
5
5
|
const updatedProps = {
|
|
6
6
|
...props,
|
|
7
|
-
autoComplete:
|
|
7
|
+
autoComplete: "noAutocomplete"
|
|
8
8
|
};
|
|
9
9
|
return /*#__PURE__*/ _jsxs(_Fragment, {
|
|
10
10
|
children: [
|
|
@@ -15,12 +15,12 @@ const CustomInput = (props)=>{
|
|
|
15
15
|
style: {
|
|
16
16
|
opacity: 0,
|
|
17
17
|
height: 0,
|
|
18
|
-
position:
|
|
19
|
-
pointerEvents:
|
|
18
|
+
position: "absolute",
|
|
19
|
+
pointerEvents: "none"
|
|
20
20
|
},
|
|
21
21
|
onChange: (e)=>e.preventDefault(),
|
|
22
22
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
23
|
-
value: value?.label ??
|
|
23
|
+
value: value?.label ?? "",
|
|
24
24
|
tabIndex: -1,
|
|
25
25
|
autoComplete: "noAutocomplete",
|
|
26
26
|
required: required,
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { components } from
|
|
3
|
-
import { faSquare } from
|
|
4
|
-
import { faCheckSquare } from
|
|
5
|
-
import { faCheck } from
|
|
6
|
-
import { Icon } from
|
|
2
|
+
import { components } from "react-select";
|
|
3
|
+
import { faSquare } from "@fortawesome/free-regular-svg-icons/faSquare";
|
|
4
|
+
import { faCheckSquare } from "@fortawesome/free-solid-svg-icons/faCheckSquare";
|
|
5
|
+
import { faCheck } from "@fortawesome/free-solid-svg-icons/faCheck";
|
|
6
|
+
import { Icon } from "@intility/bifrost-react";
|
|
7
7
|
const CustomOption = (props)=>{
|
|
8
8
|
return /*#__PURE__*/ _jsxs(components.Option, {
|
|
9
9
|
...props,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { components } from
|
|
3
|
-
import { faCaretDown } from
|
|
4
|
-
import { Icon } from
|
|
2
|
+
import { components } from "react-select";
|
|
3
|
+
import { faCaretDown } from "@fortawesome/free-solid-svg-icons/faCaretDown";
|
|
4
|
+
import { Icon } from "@intility/bifrost-react";
|
|
5
5
|
const DropdownIndicator = (props)=>{
|
|
6
6
|
return /*#__PURE__*/ _jsx(components.DropdownIndicator, {
|
|
7
7
|
...props,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { Icon } from
|
|
3
|
-
import bfSpinner from
|
|
2
|
+
import { Icon } from "@intility/bifrost-react";
|
|
3
|
+
import bfSpinner from "../assets/bfSpinner.js";
|
|
4
4
|
export default function LoadingIndicator() {
|
|
5
5
|
return /*#__PURE__*/ _jsx(Icon, {
|
|
6
6
|
icon: bfSpinner,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export { default as ClearIndicator } from
|
|
2
|
-
export { default as CustomInput } from
|
|
3
|
-
export { default as LoadingIndicator } from
|
|
4
|
-
export { default as CustomMenuList } from
|
|
5
|
-
export { default as DropdownIndicator } from
|
|
6
|
-
export { default as CustomOption } from
|
|
1
|
+
export { default as ClearIndicator } from "./ClearIndicator.internal.js";
|
|
2
|
+
export { default as CustomInput } from "./CustomInput.internal.js";
|
|
3
|
+
export { default as LoadingIndicator } from "./LoadingIndicator.internal.js";
|
|
4
|
+
export { default as CustomMenuList } from "./CustomMenuList.internal.js";
|
|
5
|
+
export { default as DropdownIndicator } from "./DropdownIndicator.internal.js";
|
|
6
|
+
export { default as CustomOption } from "./CustomOption.internal.js";
|
package/dist/overrides/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export { default as ClearIndicator } from
|
|
2
|
-
export { default as CustomInput } from
|
|
3
|
-
export { default as LoadingIndicator } from
|
|
4
|
-
export { default as CustomMenuList } from
|
|
5
|
-
export { default as DropdownIndicator } from
|
|
6
|
-
export { default as CustomOption } from
|
|
1
|
+
export { default as ClearIndicator } from "./ClearIndicator.internal.js";
|
|
2
|
+
export { default as CustomInput } from "./CustomInput.internal.js";
|
|
3
|
+
export { default as LoadingIndicator } from "./LoadingIndicator.internal.js";
|
|
4
|
+
export { default as CustomMenuList } from "./CustomMenuList.internal.js";
|
|
5
|
+
export { default as DropdownIndicator } from "./DropdownIndicator.internal.js";
|
|
6
|
+
export { default as CustomOption } from "./CustomOption.internal.js";
|
package/package.json
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@intility/bifrost-react-select",
|
|
3
|
-
"version": "4.0.0-
|
|
3
|
+
"version": "4.0.0-beta.10",
|
|
4
4
|
"description": "React select component for Intility's design system, Bifrost.",
|
|
5
5
|
"type": "module",
|
|
6
|
-
"main": "dist/
|
|
6
|
+
"main": "dist/Select.js",
|
|
7
7
|
"scripts": {
|
|
8
8
|
"build": "run-p build:*",
|
|
9
9
|
"build:module": "swc ./src -d dist",
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
},
|
|
16
16
|
"exports": {
|
|
17
17
|
"./package.json": "./package.json",
|
|
18
|
-
".": "./dist/
|
|
18
|
+
".": "./dist/Select.js"
|
|
19
19
|
},
|
|
20
20
|
"homepage": "https://bifrost.intility.com",
|
|
21
21
|
"keywords": [
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
"@fortawesome/fontawesome-svg-core": "^6.4.2",
|
|
41
41
|
"@fortawesome/free-solid-svg-icons": "^6.4.2",
|
|
42
42
|
"@fortawesome/react-fontawesome": "^0.2.0",
|
|
43
|
-
"@intility/bifrost-react": "4.0.0-
|
|
43
|
+
"@intility/bifrost-react": "4.0.0-beta.9",
|
|
44
44
|
"classnames": "^2.2.6",
|
|
45
45
|
"react-select": "^5.7.7"
|
|
46
46
|
}
|