@atlaskit/select 17.10.3 → 17.11.0
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 +22 -1
- package/README.md +2 -1
- package/__perf__/default.tsx +8 -8
- package/codemods/13.0.0-popper-props.ts +76 -89
- package/codemods/__tests__/13.0.0-popper-props.ts +51 -51
- package/codemods/utils/helpers.ts +250 -261
- package/dist/cjs/CountrySelect.js +5 -0
- package/dist/cjs/PopupSelect/PopupSelect.js +3 -1
- package/dist/cjs/PopupSelect/components.js +4 -0
- package/dist/cjs/Select.js +1 -1
- package/dist/cjs/components/index.js +4 -0
- package/dist/cjs/components/indicators.js +4 -1
- package/dist/cjs/components/input-options.js +4 -2
- package/dist/cjs/createSelect.js +6 -2
- package/dist/es2019/CountrySelect.js +4 -0
- package/dist/es2019/PopupSelect/PopupSelect.js +3 -1
- package/dist/es2019/PopupSelect/components.js +4 -0
- package/dist/es2019/Select.js +1 -1
- package/dist/es2019/components/index.js +4 -0
- package/dist/es2019/components/indicators.js +5 -0
- package/dist/es2019/components/input-options.js +7 -1
- package/dist/es2019/createSelect.js +6 -2
- package/dist/esm/CountrySelect.js +4 -0
- package/dist/esm/PopupSelect/PopupSelect.js +3 -1
- package/dist/esm/PopupSelect/components.js +4 -0
- package/dist/esm/Select.js +1 -1
- package/dist/esm/components/index.js +4 -0
- package/dist/esm/components/indicators.js +5 -0
- package/dist/esm/components/input-options.js +5 -1
- package/dist/esm/createSelect.js +6 -2
- package/dist/types/PopupSelect/PopupSelect.d.ts +19 -21
- package/dist/types/PopupSelect/components.d.ts +3 -0
- package/dist/types/components/index.d.ts +4 -1
- package/dist/types/components/indicators.d.ts +3 -0
- package/dist/types/components/input-options.d.ts +3 -0
- package/dist/types/extract-react-types/react-popper-props.d.ts +4 -4
- package/dist/types/extract-react-types/react-select-props.d.ts +10 -10
- package/dist/types/types.d.ts +7 -7
- package/dist/types-ts4.5/PopupSelect/PopupSelect.d.ts +19 -21
- package/dist/types-ts4.5/PopupSelect/components.d.ts +3 -0
- package/dist/types-ts4.5/components/index.d.ts +4 -1
- package/dist/types-ts4.5/components/indicators.d.ts +3 -0
- package/dist/types-ts4.5/components/input-options.d.ts +3 -0
- package/dist/types-ts4.5/extract-react-types/react-popper-props.d.ts +4 -4
- package/dist/types-ts4.5/extract-react-types/react-select-props.d.ts +10 -10
- package/dist/types-ts4.5/types.d.ts +7 -7
- package/package.json +116 -116
- package/report.api.md +971 -1125
|
@@ -32,10 +32,10 @@ interface NativeReactSelectProps<Option = unknown, IsMulti extends boolean = fal
|
|
|
32
32
|
closeMenuOnSelect?: boolean;
|
|
33
33
|
closeMenuOnScroll?: boolean | EventListener;
|
|
34
34
|
/**
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
35
|
+
This complex object includes all the compositional components that are used in `react-select`. If you wish to overwrite a component, pass in an object with the appropriate namespace.
|
|
36
|
+
|
|
37
|
+
If you only wish to restyle a component, we recommend using the `styles` prop instead. For a list of the components that can be passed in, and the shape that will be passed to them, see [the components docs](/components).
|
|
38
|
+
*/
|
|
39
39
|
components?: SelectComponentsConfig<Option, IsMulti, Group>;
|
|
40
40
|
/** Whether the value of the select, e.g. SingleValue, should be displayed in the control. */
|
|
41
41
|
controlShouldRenderValue?: boolean;
|
|
@@ -50,10 +50,10 @@ interface NativeReactSelectProps<Option = unknown, IsMulti extends boolean = fal
|
|
|
50
50
|
/** Formats option labels in the menu and control as React components. */
|
|
51
51
|
formatOptionLabel?: (data?: Option, formatOptionLabelMeta?: FormatOptionLabelMeta<Option>) => ReactNode;
|
|
52
52
|
/**
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
53
|
+
Resolves option data to a string to be displayed as the label by components.
|
|
54
|
+
|
|
55
|
+
Note: Failure to resolve to a string type can interfere with filtering and assistive technology support.
|
|
56
|
+
*/
|
|
57
57
|
getOptionLabel?: GetOptionLabel<Option>;
|
|
58
58
|
/** Resolves option data to a string to compare options and specify value attributes. */
|
|
59
59
|
getOptionValue?: GetOptionValue<Option>;
|
|
@@ -75,8 +75,8 @@ interface NativeReactSelectProps<Option = unknown, IsMulti extends boolean = fal
|
|
|
75
75
|
/** Sets whether the select is in a state of loading (async). */
|
|
76
76
|
isLoading?: boolean;
|
|
77
77
|
/**
|
|
78
|
-
|
|
79
|
-
|
|
78
|
+
Override the built-in logic to detect whether an option is disabled.
|
|
79
|
+
*/
|
|
80
80
|
isOptionDisabled?: (option?: Option, selectValue?: Options<Option>) => boolean;
|
|
81
81
|
/** Override the built-in logic to detect whether an option is selected. */
|
|
82
82
|
isOptionSelected?: (option?: Option, selectValue?: Options<Option>) => boolean;
|
|
@@ -30,12 +30,12 @@ interface CustomSelectProps extends WithAnalyticsEventsProps {
|
|
|
30
30
|
/** This prop affects the backgroundColor and border of the Select field. 'subtle' makes these transparent while 'none' prevents all field styling. Take care when using the none appearance as this doesn't include accessible interactions. */
|
|
31
31
|
appearance?: 'default' | 'subtle' | 'none';
|
|
32
32
|
/**
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
33
|
+
A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests.
|
|
34
|
+
|
|
35
|
+
**WARNING:** This prop is currently broken and a test ID will not be added to select.
|
|
36
|
+
Please refer to the [select testing page](https://atlassian.design/components/select/testing)
|
|
37
|
+
for guidance on alternatives to identifying select in tests.
|
|
38
|
+
*/
|
|
39
39
|
testId?: string;
|
|
40
40
|
/** This prop indicates if the component is in an error state */
|
|
41
41
|
isInvalid?: boolean;
|
|
@@ -65,7 +65,7 @@ export type AtlaskitSelectRefType = {
|
|
|
65
65
|
focus: () => void;
|
|
66
66
|
};
|
|
67
67
|
export type { SelectInstance, FormatOptionLabelMeta, InputActionMeta, GroupType, InputProps, MultiValueProps, ReactSelectProps, SingleValueProps, ClearIndicatorProps, DropdownIndicatorProps, IndicatorSeparatorProps, LoadingIndicatorProps, NoticeProps, MultiValueRemoveProps, };
|
|
68
|
-
declare module 'react-select/
|
|
68
|
+
declare module 'react-select/base' {
|
|
69
69
|
interface Props<Option, IsMulti extends boolean, Group extends GroupType<Option>> {
|
|
70
70
|
[key: string]: any;
|
|
71
71
|
}
|
package/package.json
CHANGED
|
@@ -1,117 +1,117 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
}
|
|
2
|
+
"name": "@atlaskit/select",
|
|
3
|
+
"version": "17.11.0",
|
|
4
|
+
"description": "Select allows users to make a single selection or multiple selections from a list of options.",
|
|
5
|
+
"publishConfig": {
|
|
6
|
+
"registry": "https://registry.npmjs.org/"
|
|
7
|
+
},
|
|
8
|
+
"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
|
|
9
|
+
"author": "Atlassian Pty Ltd",
|
|
10
|
+
"license": "Apache-2.0",
|
|
11
|
+
"main": "dist/cjs/index.js",
|
|
12
|
+
"module": "dist/esm/index.js",
|
|
13
|
+
"module:es2019": "dist/es2019/index.js",
|
|
14
|
+
"types": "dist/types/index.d.ts",
|
|
15
|
+
"typesVersions": {
|
|
16
|
+
">=4.5 <4.9": {
|
|
17
|
+
"*": [
|
|
18
|
+
"dist/types-ts4.5/*",
|
|
19
|
+
"dist/types-ts4.5/index.d.ts"
|
|
20
|
+
]
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
"sideEffects": false,
|
|
24
|
+
"atlaskit:src": "src/index.tsx",
|
|
25
|
+
"atlassian": {
|
|
26
|
+
"team": "Design System Team",
|
|
27
|
+
"releaseModel": "continuous",
|
|
28
|
+
"productPushConsumption": [
|
|
29
|
+
"jira"
|
|
30
|
+
],
|
|
31
|
+
"website": {
|
|
32
|
+
"name": "Select",
|
|
33
|
+
"category": "Components"
|
|
34
|
+
},
|
|
35
|
+
"runReact18": true
|
|
36
|
+
},
|
|
37
|
+
"af:exports": {
|
|
38
|
+
"./AsyncSelect": "./src/entry-points/async-select.tsx",
|
|
39
|
+
"./Select": "./src/entry-points/select.tsx",
|
|
40
|
+
"./AsyncCreatableSelect": "./src/entry-points/async-creatable-select.tsx",
|
|
41
|
+
"./CreatableSelect": "./src/entry-points/creatable-select.tsx",
|
|
42
|
+
".": "./src/index.tsx"
|
|
43
|
+
},
|
|
44
|
+
"dependencies": {
|
|
45
|
+
"@atlaskit/analytics-next": "^9.3.0",
|
|
46
|
+
"@atlaskit/icon": "^22.4.0",
|
|
47
|
+
"@atlaskit/platform-feature-flags": "^0.2.0",
|
|
48
|
+
"@atlaskit/primitives": "^7.4.0",
|
|
49
|
+
"@atlaskit/spinner": "^16.2.0",
|
|
50
|
+
"@atlaskit/theme": "^12.10.0",
|
|
51
|
+
"@atlaskit/tokens": "^1.51.0",
|
|
52
|
+
"@atlaskit/visually-hidden": "^1.4.0",
|
|
53
|
+
"@babel/runtime": "^7.0.0",
|
|
54
|
+
"@emotion/react": "^11.7.1",
|
|
55
|
+
"@popperjs/core": "^2.11.8",
|
|
56
|
+
"bind-event-listener": "^3.0.0",
|
|
57
|
+
"react-focus-lock": "^2.9.5",
|
|
58
|
+
"react-node-resolver": "^1.0.1",
|
|
59
|
+
"react-popper": "^2.3.0",
|
|
60
|
+
"react-select": "^5.4.0",
|
|
61
|
+
"react-uid": "^2.2.0",
|
|
62
|
+
"shallow-equal": "^3.1.0"
|
|
63
|
+
},
|
|
64
|
+
"peerDependencies": {
|
|
65
|
+
"react": "^16.8.0 || ^17.0.0 || ~18.2.0",
|
|
66
|
+
"react-dom": "^16.8.0"
|
|
67
|
+
},
|
|
68
|
+
"devDependencies": {
|
|
69
|
+
"@af/accessibility-testing": "*",
|
|
70
|
+
"@af/integration-testing": "*",
|
|
71
|
+
"@af/visual-regression": "*",
|
|
72
|
+
"@atlaskit/checkbox": "^13.4.0",
|
|
73
|
+
"@atlaskit/ds-lib": "^2.3.0",
|
|
74
|
+
"@atlaskit/modal-dialog": "^12.14.0",
|
|
75
|
+
"@atlaskit/radio": "^6.4.0",
|
|
76
|
+
"@atlaskit/ssr": "*",
|
|
77
|
+
"@atlaskit/visual-regression": "*",
|
|
78
|
+
"@atlassian/feature-flags-test-utils": "*",
|
|
79
|
+
"@emotion/styled": "^11.0.0",
|
|
80
|
+
"@testing-library/react": "^12.1.5",
|
|
81
|
+
"@testing-library/user-event": "^14.4.3",
|
|
82
|
+
"@types/react-node-resolver": "^2.0.0",
|
|
83
|
+
"ast-types": "^0.13.3",
|
|
84
|
+
"jscodeshift": "^0.13.0",
|
|
85
|
+
"react-dom": "^16.8.0",
|
|
86
|
+
"react-select-event": "^5.5.0",
|
|
87
|
+
"react-value": "^0.2.0",
|
|
88
|
+
"typescript": "~5.4.2",
|
|
89
|
+
"wait-for-expect": "^1.2.0"
|
|
90
|
+
},
|
|
91
|
+
"techstack": {
|
|
92
|
+
"@repo/internal": {
|
|
93
|
+
"dom-events": "use-bind-event-listener",
|
|
94
|
+
"design-tokens": [
|
|
95
|
+
"color",
|
|
96
|
+
"spacing"
|
|
97
|
+
],
|
|
98
|
+
"deprecation": "no-deprecated-imports",
|
|
99
|
+
"styling": [
|
|
100
|
+
"emotion",
|
|
101
|
+
"static"
|
|
102
|
+
]
|
|
103
|
+
}
|
|
104
|
+
},
|
|
105
|
+
"platform-feature-flags": {
|
|
106
|
+
"platform.design-system-team.popup-select-close_8h15h": {
|
|
107
|
+
"type": "boolean"
|
|
108
|
+
},
|
|
109
|
+
"platform.design-system-team.use-default-select-in-popup-select_46rmj": {
|
|
110
|
+
"type": "boolean"
|
|
111
|
+
},
|
|
112
|
+
"platform.design-system-team.select-new-typography_7m89c": {
|
|
113
|
+
"type": "boolean"
|
|
114
|
+
}
|
|
115
|
+
},
|
|
116
|
+
"homepage": "https://atlassian.design/components/select/"
|
|
117
|
+
}
|