@intility/bifrost-react-select 4.0.0-beta.2 → 4.0.0-beta.21
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 +152 -0
- package/dist/Select.d.ts +15 -2
- package/dist/Select.js +11 -11
- package/package.json +6 -5
- package/src/Select.tsx +13 -13
- package/dist/index.d.ts +0 -1
- package/dist/index.js +0 -1
- package/src/index.ts +0 -9
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,157 @@
|
|
|
1
1
|
# @intility/bifrost-react-select
|
|
2
2
|
|
|
3
|
+
## 4.0.0-beta.21
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies [4dc5591a]
|
|
8
|
+
- Updated dependencies [6edfa7a4]
|
|
9
|
+
- Updated dependencies [14a9b64b]
|
|
10
|
+
- Updated dependencies [4dc5591a]
|
|
11
|
+
- @intility/bifrost-react@4.0.0-beta.20
|
|
12
|
+
|
|
13
|
+
## 4.0.0-beta.20
|
|
14
|
+
|
|
15
|
+
### Patch Changes
|
|
16
|
+
|
|
17
|
+
- Updated dependencies [ae6a87d3]
|
|
18
|
+
- @intility/bifrost-react@4.0.0-beta.19
|
|
19
|
+
|
|
20
|
+
## 4.0.0-beta.19
|
|
21
|
+
|
|
22
|
+
### Patch Changes
|
|
23
|
+
|
|
24
|
+
- @intility/bifrost-react@4.0.0-beta.18
|
|
25
|
+
|
|
26
|
+
## 4.0.0-beta.18
|
|
27
|
+
|
|
28
|
+
### Patch Changes
|
|
29
|
+
|
|
30
|
+
- Updated dependencies [9814ef52]
|
|
31
|
+
- Updated dependencies [be0a4fcf]
|
|
32
|
+
- @intility/bifrost-react@4.0.0-beta.17
|
|
33
|
+
|
|
34
|
+
## 4.0.0-beta.17
|
|
35
|
+
|
|
36
|
+
### Patch Changes
|
|
37
|
+
|
|
38
|
+
- @intility/bifrost-react@4.0.0-beta.16
|
|
39
|
+
|
|
40
|
+
## 4.0.0-beta.16
|
|
41
|
+
|
|
42
|
+
### Patch Changes
|
|
43
|
+
|
|
44
|
+
- Updated dependencies [cc16df41]
|
|
45
|
+
- Updated dependencies [50b76941]
|
|
46
|
+
- @intility/bifrost-react@4.0.0-beta.15
|
|
47
|
+
|
|
48
|
+
## 4.0.0-beta.15
|
|
49
|
+
|
|
50
|
+
### Patch Changes
|
|
51
|
+
|
|
52
|
+
- Updated dependencies [ec250594]
|
|
53
|
+
- @intility/bifrost-react@4.0.0-beta.14
|
|
54
|
+
|
|
55
|
+
## 4.0.0-beta.14
|
|
56
|
+
|
|
57
|
+
### Patch Changes
|
|
58
|
+
|
|
59
|
+
- Updated dependencies [710afa88]
|
|
60
|
+
- @intility/bifrost-react@4.0.0-beta.13
|
|
61
|
+
|
|
62
|
+
## 4.0.0-beta.13
|
|
63
|
+
|
|
64
|
+
### Minor Changes
|
|
65
|
+
|
|
66
|
+
- 62b02461: Include JSDoc comments in typescript definition output
|
|
67
|
+
|
|
68
|
+
### Patch Changes
|
|
69
|
+
|
|
70
|
+
- Updated dependencies [62b02461]
|
|
71
|
+
- @intility/bifrost-react@4.0.0-beta.12
|
|
72
|
+
|
|
73
|
+
## 4.0.0-beta.12
|
|
74
|
+
|
|
75
|
+
### Patch Changes
|
|
76
|
+
|
|
77
|
+
- Updated dependencies [18c2b063]
|
|
78
|
+
- @intility/bifrost-react@4.0.0-beta.11
|
|
79
|
+
|
|
80
|
+
## 4.0.0-beta.11
|
|
81
|
+
|
|
82
|
+
### Patch Changes
|
|
83
|
+
|
|
84
|
+
- ea861dbc: Update lint config, add displayName for components
|
|
85
|
+
- Updated dependencies [ea861dbc]
|
|
86
|
+
- @intility/bifrost-react@4.0.0-beta.10
|
|
87
|
+
|
|
88
|
+
## 4.0.0-beta.10
|
|
89
|
+
|
|
90
|
+
### Patch Changes
|
|
91
|
+
|
|
92
|
+
- Updated dependencies [17165424]
|
|
93
|
+
- @intility/bifrost-react@4.0.0-beta.9
|
|
94
|
+
|
|
95
|
+
## 4.0.0-beta.9
|
|
96
|
+
|
|
97
|
+
### Patch Changes
|
|
98
|
+
|
|
99
|
+
- Updated dependencies [5504294e]
|
|
100
|
+
- Updated dependencies [7db473c6]
|
|
101
|
+
- @intility/bifrost-react@4.0.0-beta.8
|
|
102
|
+
|
|
103
|
+
## 4.0.0-beta.8
|
|
104
|
+
|
|
105
|
+
### Patch Changes
|
|
106
|
+
|
|
107
|
+
- Updated dependencies [3849abc3]
|
|
108
|
+
- @intility/bifrost-react@4.0.0-beta.7
|
|
109
|
+
|
|
110
|
+
## 4.0.0-beta.7
|
|
111
|
+
|
|
112
|
+
### Patch Changes
|
|
113
|
+
|
|
114
|
+
- Updated dependencies [82ab21b5]
|
|
115
|
+
- Updated dependencies [81af701b]
|
|
116
|
+
- @intility/bifrost-react@4.0.0-beta.6
|
|
117
|
+
|
|
118
|
+
## 4.0.0-beta.6
|
|
119
|
+
|
|
120
|
+
### Minor Changes
|
|
121
|
+
|
|
122
|
+
- 6b355639: New styling for inputs, now always outlined. Removed `variant` prop from `<Input>`.
|
|
123
|
+
|
|
124
|
+
### Patch Changes
|
|
125
|
+
|
|
126
|
+
- Updated dependencies [6b355639]
|
|
127
|
+
- Updated dependencies [6b355639]
|
|
128
|
+
- @intility/bifrost-react@4.0.0-beta.5
|
|
129
|
+
|
|
130
|
+
## 4.0.0-beta.5
|
|
131
|
+
|
|
132
|
+
### Patch Changes
|
|
133
|
+
|
|
134
|
+
- e410a910: New base color values for light mode #711
|
|
135
|
+
- Updated dependencies [e410a910]
|
|
136
|
+
- @intility/bifrost-react@4.0.0-beta.4
|
|
137
|
+
|
|
138
|
+
## 4.0.0-beta.4
|
|
139
|
+
|
|
140
|
+
### Patch Changes
|
|
141
|
+
|
|
142
|
+
- a903f282: fix: export typescript types used in react components
|
|
143
|
+
- Updated dependencies [a903f282]
|
|
144
|
+
- Updated dependencies [19500ce7]
|
|
145
|
+
- Updated dependencies [8263586d]
|
|
146
|
+
- @intility/bifrost-react@4.0.0-beta.3
|
|
147
|
+
|
|
148
|
+
## 4.0.0-beta.3
|
|
149
|
+
|
|
150
|
+
### Patch Changes
|
|
151
|
+
|
|
152
|
+
- Updated dependencies [b60c063d]
|
|
153
|
+
- @intility/bifrost-react@4.0.0-beta.2
|
|
154
|
+
|
|
3
155
|
## 4.0.0-beta.2
|
|
4
156
|
|
|
5
157
|
### Major Changes
|
package/dist/Select.d.ts
CHANGED
|
@@ -29,15 +29,25 @@ export declare const selectComponents: Partial<typeof components>;
|
|
|
29
29
|
declare const selectStates: readonly ["default", "alert"];
|
|
30
30
|
export type SelectState = (typeof selectStates)[number];
|
|
31
31
|
export type SelectProps = {
|
|
32
|
+
/** Required label text */
|
|
32
33
|
label: ReactNode;
|
|
34
|
+
/** Hide label text, will add label prop as aria-label for screen readers */
|
|
33
35
|
hideLabel?: boolean;
|
|
36
|
+
/** Description text to show more information */
|
|
34
37
|
description?: ReactNode;
|
|
38
|
+
/** Available states: `default` and `alert` */
|
|
35
39
|
state?: SelectState;
|
|
40
|
+
/** Feedback text below the Select component */
|
|
36
41
|
feedback?: ReactNode;
|
|
42
|
+
/** Required prop indicating mandatory field */
|
|
37
43
|
required?: boolean;
|
|
44
|
+
/** Bool to mark Select component required, but hides the required label */
|
|
38
45
|
requiredNoLabel?: boolean;
|
|
46
|
+
/** Marks Select component as optional */
|
|
39
47
|
optional?: boolean;
|
|
48
|
+
/** Inline CSS styles */
|
|
40
49
|
style?: CSSProperties;
|
|
50
|
+
/** Displays a loading spinner */
|
|
41
51
|
loading?: boolean;
|
|
42
52
|
};
|
|
43
53
|
export type SelectType = {
|
|
@@ -47,7 +57,10 @@ export type SelectType = {
|
|
|
47
57
|
}, 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
58
|
displayName?: string;
|
|
49
59
|
};
|
|
50
|
-
|
|
60
|
+
/**
|
|
61
|
+
* Select component - dropdown list
|
|
62
|
+
*/
|
|
63
|
+
export declare const Select: SelectType;
|
|
51
64
|
export type AsyncType = {
|
|
52
65
|
<OptionType = {
|
|
53
66
|
label: string;
|
|
@@ -82,4 +95,4 @@ export type AsyncCreatableType = {
|
|
|
82
95
|
};
|
|
83
96
|
declare const AsyncCreatableSelect: AsyncCreatableType;
|
|
84
97
|
export { AsyncSelect, CreatableSelect, AsyncCreatableSelect };
|
|
85
|
-
export default
|
|
98
|
+
export default Select;
|
package/dist/Select.js
CHANGED
|
@@ -22,18 +22,17 @@ export const selectStyles = {
|
|
|
22
22
|
control: (provided, state)=>({
|
|
23
23
|
...provided,
|
|
24
24
|
"&:hover": {
|
|
25
|
-
|
|
25
|
+
borderColor: state.isFocused ? "var(--bfc-theme-3)" : "var(--bfc-base-c-inverted-2)",
|
|
26
26
|
// Change color of dropdown icon when hover on Select
|
|
27
27
|
".bf-select__dropdown-indicator": {
|
|
28
28
|
color: "var(--bfc-theme-3)"
|
|
29
29
|
}
|
|
30
30
|
},
|
|
31
31
|
backgroundColor: state.isDisabled ? "var(--bfc-base-dimmed)" : "var(--bfc-base-3)",
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
boxShadow: state.isFocused && "0 0 0 1px var(--bfc-theme-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",
|
|
37
36
|
borderRadius: state.selectProps.menuIsOpen ? " var(--bf-radius-xs) var(--bf-radius-xs) 0 0" : "var(--bf-radius-xs)",
|
|
38
37
|
minHeight: "var(--bfs40)",
|
|
39
38
|
cursor: "text"
|
|
@@ -84,7 +83,8 @@ export const selectStyles = {
|
|
|
84
83
|
menuList: (provided)=>({
|
|
85
84
|
...provided,
|
|
86
85
|
padding: 0,
|
|
87
|
-
|
|
86
|
+
border: "1px solid var(--bfc-theme-3)",
|
|
87
|
+
borderTop: "none",
|
|
88
88
|
borderRadius: "0 0 var(--bf-radius-xs) var(--bf-radius-xs)"
|
|
89
89
|
}),
|
|
90
90
|
placeholder: (provided)=>({
|
|
@@ -185,7 +185,7 @@ const selectStates = [
|
|
|
185
185
|
* Select HOC
|
|
186
186
|
*/ const SelectHOC = (Selector)=>{
|
|
187
187
|
// @ts-ignore
|
|
188
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
188
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any, react/display-name
|
|
189
189
|
const GeneratedSelect = /*#__PURE__*/ forwardRef(({ label, hideLabel = false, isDisabled = false, state, feedback, required = false, description, requiredNoLabel = false, optional = false, inputId, className, style, loading = false, components, ...props }, ref)=>{
|
|
190
190
|
const selectId = useUniqueId(inputId);
|
|
191
191
|
return /*#__PURE__*/ _jsxs("div", {
|
|
@@ -237,8 +237,8 @@ const selectStates = [
|
|
|
237
237
|
};
|
|
238
238
|
/**
|
|
239
239
|
* Select component - dropdown list
|
|
240
|
-
*/ const
|
|
241
|
-
|
|
240
|
+
*/ export const Select = SelectHOC(ReactSelect);
|
|
241
|
+
Select.displayName = "Select";
|
|
242
242
|
const AsyncSelect = SelectHOC(AsyncReactSelect);
|
|
243
243
|
AsyncSelect.displayName = "AsyncSelect";
|
|
244
244
|
const CreatableSelect = SelectHOC(CreatableReactSelect);
|
|
@@ -246,4 +246,4 @@ CreatableSelect.displayName = "CreatableSelect";
|
|
|
246
246
|
const AsyncCreatableSelect = SelectHOC(AsyncCreatableReactSelect);
|
|
247
247
|
AsyncCreatableSelect.displayName = "AsyncCreatableSelect";
|
|
248
248
|
export { AsyncSelect, CreatableSelect, AsyncCreatableSelect };
|
|
249
|
-
export default
|
|
249
|
+
export default Select;
|
package/package.json
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@intility/bifrost-react-select",
|
|
3
|
-
"version": "4.0.0-beta.
|
|
3
|
+
"version": "4.0.0-beta.21",
|
|
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",
|
|
@@ -11,11 +11,12 @@
|
|
|
11
11
|
"start": "run-p watch:*",
|
|
12
12
|
"watch:module": "npm run build:module -- --watch",
|
|
13
13
|
"watch:types": "npm run build:types -- --watch --preserveWatchOutput",
|
|
14
|
-
"clean": "rimraf dist"
|
|
14
|
+
"clean": "rimraf dist",
|
|
15
|
+
"lint": "eslint ./src/**/*.{ts,tsx}"
|
|
15
16
|
},
|
|
16
17
|
"exports": {
|
|
17
18
|
"./package.json": "./package.json",
|
|
18
|
-
".": "./dist/
|
|
19
|
+
".": "./dist/Select.js"
|
|
19
20
|
},
|
|
20
21
|
"homepage": "https://bifrost.intility.com",
|
|
21
22
|
"keywords": [
|
|
@@ -40,7 +41,7 @@
|
|
|
40
41
|
"@fortawesome/fontawesome-svg-core": "^6.4.2",
|
|
41
42
|
"@fortawesome/free-solid-svg-icons": "^6.4.2",
|
|
42
43
|
"@fortawesome/react-fontawesome": "^0.2.0",
|
|
43
|
-
"@intility/bifrost-react": "4.0.0-beta.
|
|
44
|
+
"@intility/bifrost-react": "4.0.0-beta.20",
|
|
44
45
|
"classnames": "^2.2.6",
|
|
45
46
|
"react-select": "^5.7.7"
|
|
46
47
|
}
|
package/src/Select.tsx
CHANGED
|
@@ -49,8 +49,8 @@ export const selectStyles = {
|
|
|
49
49
|
control: (provided, state) => ({
|
|
50
50
|
...provided,
|
|
51
51
|
"&:hover": {
|
|
52
|
-
|
|
53
|
-
? "var(--bfc-
|
|
52
|
+
borderColor: state.isFocused
|
|
53
|
+
? "var(--bfc-theme-3)"
|
|
54
54
|
: "var(--bfc-base-c-inverted-2)",
|
|
55
55
|
// Change color of dropdown icon when hover on Select
|
|
56
56
|
".bf-select__dropdown-indicator": {
|
|
@@ -60,15 +60,14 @@ export const selectStyles = {
|
|
|
60
60
|
backgroundColor: state.isDisabled
|
|
61
61
|
? "var(--bfc-base-dimmed)"
|
|
62
62
|
: "var(--bfc-base-3)",
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
? "var(--bfc-base-c-theme)"
|
|
63
|
+
borderWidth: "1px",
|
|
64
|
+
borderStyle: "solid",
|
|
65
|
+
borderColor: state.isFocused
|
|
66
|
+
? "var(--bfc-theme-3)"
|
|
68
67
|
: state.isDisabled
|
|
69
68
|
? "transparent"
|
|
70
69
|
: "var(--bfc-base-c-wcag)",
|
|
71
|
-
boxShadow:
|
|
70
|
+
boxShadow: "none",
|
|
72
71
|
borderRadius: state.selectProps.menuIsOpen
|
|
73
72
|
? " var(--bf-radius-xs) var(--bf-radius-xs) 0 0"
|
|
74
73
|
: "var(--bf-radius-xs)",
|
|
@@ -121,7 +120,8 @@ export const selectStyles = {
|
|
|
121
120
|
menuList: (provided) => ({
|
|
122
121
|
...provided,
|
|
123
122
|
padding: 0,
|
|
124
|
-
|
|
123
|
+
border: "1px solid var(--bfc-theme-3)",
|
|
124
|
+
borderTop: "none",
|
|
125
125
|
borderRadius: "0 0 var(--bf-radius-xs) var(--bf-radius-xs)",
|
|
126
126
|
}),
|
|
127
127
|
placeholder: (provided) => ({
|
|
@@ -238,7 +238,7 @@ export type SelectState = (typeof selectStates)[number];
|
|
|
238
238
|
*/
|
|
239
239
|
const SelectHOC = <Type, Selector>(Selector: Selector) => {
|
|
240
240
|
// @ts-ignore
|
|
241
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
241
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any, react/display-name
|
|
242
242
|
const GeneratedSelect: Type = forwardRef<any, any>(
|
|
243
243
|
(
|
|
244
244
|
{
|
|
@@ -355,10 +355,10 @@ export type SelectType = {
|
|
|
355
355
|
/**
|
|
356
356
|
* Select component - dropdown list
|
|
357
357
|
*/
|
|
358
|
-
const
|
|
358
|
+
export const Select: SelectType = SelectHOC<SelectType, typeof ReactSelect>(
|
|
359
359
|
ReactSelect,
|
|
360
360
|
);
|
|
361
|
-
|
|
361
|
+
Select.displayName = "Select";
|
|
362
362
|
|
|
363
363
|
// Async Select
|
|
364
364
|
export type AsyncType = {
|
|
@@ -431,4 +431,4 @@ const AsyncCreatableSelect = SelectHOC<
|
|
|
431
431
|
AsyncCreatableSelect.displayName = "AsyncCreatableSelect";
|
|
432
432
|
|
|
433
433
|
export { AsyncSelect, CreatableSelect, AsyncCreatableSelect };
|
|
434
|
-
export default
|
|
434
|
+
export default Select;
|
package/dist/index.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { default, default as Select, AsyncSelect, CreatableSelect, AsyncCreatableSelect, selectStyles, selectComponents, } from "./Select.js";
|
package/dist/index.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { default, default as Select, AsyncSelect, CreatableSelect, AsyncCreatableSelect, selectStyles, selectComponents } from "./Select.js";
|