@atlaskit/menu 2.4.0 → 2.5.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 +20 -1
- package/__perf__/button.tsx +7 -9
- package/__perf__/custom.tsx +13 -17
- package/__perf__/link.tsx +6 -6
- package/__perf__/utils/example-runner.tsx +36 -41
- package/__perf__/utils/interaction-tasks.tsx +63 -86
- package/codemods/0.7.0-change-css-fn-prop.tsx +128 -156
- package/codemods/2.1.0-invalid-link-item-to-button-item.tsx +121 -145
- package/codemods/__tests__/0.7.0-change-css-fn-prop.tsx +77 -77
- package/codemods/__tests__/next-invalid-link-item-to-button-item.tsx +117 -117
- package/codemods/helpers/generic.tsx +528 -564
- package/dist/cjs/internal/components/menu-item-primitive.js +13 -2
- package/dist/cjs/internal/components/skeleton-shimmer.js +6 -0
- package/dist/cjs/menu-item/button-item.js +4 -0
- package/dist/cjs/menu-item/custom-item.js +8 -2
- package/dist/cjs/menu-item/heading-item.js +12 -2
- package/dist/cjs/menu-item/link-item.js +4 -0
- package/dist/cjs/menu-item/skeleton-heading-item.js +12 -1
- package/dist/cjs/menu-item/skeleton-item.js +25 -1
- package/dist/cjs/menu-section/menu-group.js +4 -0
- package/dist/cjs/menu-section/popup-menu-group.js +4 -0
- package/dist/cjs/menu-section/section.js +19 -4
- package/dist/es2019/internal/components/menu-item-primitive.js +13 -2
- package/dist/es2019/internal/components/skeleton-shimmer.js +5 -0
- package/dist/es2019/menu-item/button-item.js +5 -0
- package/dist/es2019/menu-item/custom-item.js +9 -2
- package/dist/es2019/menu-item/heading-item.js +13 -2
- package/dist/es2019/menu-item/link-item.js +5 -0
- package/dist/es2019/menu-item/skeleton-heading-item.js +11 -1
- package/dist/es2019/menu-item/skeleton-item.js +24 -1
- package/dist/es2019/menu-section/menu-group.js +4 -0
- package/dist/es2019/menu-section/popup-menu-group.js +4 -0
- package/dist/es2019/menu-section/section.js +20 -4
- package/dist/esm/internal/components/menu-item-primitive.js +13 -2
- package/dist/esm/internal/components/skeleton-shimmer.js +5 -0
- package/dist/esm/menu-item/button-item.js +5 -0
- package/dist/esm/menu-item/custom-item.js +9 -2
- package/dist/esm/menu-item/heading-item.js +13 -2
- package/dist/esm/menu-item/link-item.js +5 -0
- package/dist/esm/menu-item/skeleton-heading-item.js +11 -1
- package/dist/esm/menu-item/skeleton-item.js +24 -1
- package/dist/esm/menu-section/menu-group.js +4 -0
- package/dist/esm/menu-section/popup-menu-group.js +4 -0
- package/dist/esm/menu-section/section.js +20 -4
- package/dist/types/internal/components/skeleton-shimmer.d.ts +4 -1
- package/dist/types/menu-item/custom-item.d.ts +3 -0
- package/dist/types/menu-section/menu-group.d.ts +3 -0
- package/dist/types/menu-section/popup-menu-group.d.ts +3 -0
- package/dist/types-ts4.5/internal/components/skeleton-shimmer.d.ts +4 -1
- package/dist/types-ts4.5/menu-item/custom-item.d.ts +3 -0
- package/dist/types-ts4.5/menu-section/menu-group.d.ts +3 -0
- package/dist/types-ts4.5/menu-section/popup-menu-group.d.ts +3 -0
- package/package.json +133 -133
- package/report.api.md +130 -138
package/report.api.md
CHANGED
|
@@ -2,7 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
## API Report File for "@atlaskit/menu"
|
|
4
4
|
|
|
5
|
-
> Do not edit this file. This report is auto-generated using
|
|
5
|
+
> Do not edit this file. This report is auto-generated using
|
|
6
|
+
> [API Extractor](https://api-extractor.com/).
|
|
6
7
|
> [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
|
|
7
8
|
|
|
8
9
|
### Table of contents
|
|
@@ -29,38 +30,38 @@ import { RefAttributes } from 'react';
|
|
|
29
30
|
|
|
30
31
|
// @public (undocumented)
|
|
31
32
|
export interface BaseItemProps {
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
33
|
+
children?: React.ReactNode;
|
|
34
|
+
// @deprecated
|
|
35
|
+
cssFn?: CSSFn;
|
|
36
|
+
description?: JSX.Element | string;
|
|
37
|
+
iconAfter?: React.ReactNode;
|
|
38
|
+
iconBefore?: React.ReactNode;
|
|
39
|
+
isDisabled?: boolean;
|
|
40
|
+
isSelected?: boolean;
|
|
41
|
+
onClick?: (event: React.KeyboardEvent | React.MouseEvent) => void;
|
|
42
|
+
onMouseDown?: React.MouseEventHandler;
|
|
43
|
+
// @deprecated
|
|
44
|
+
overrides?: Overrides;
|
|
45
|
+
shouldDescriptionWrap?: boolean;
|
|
46
|
+
shouldTitleWrap?: boolean;
|
|
47
|
+
testId?: string;
|
|
47
48
|
}
|
|
48
49
|
|
|
49
50
|
// @public
|
|
50
51
|
export const ButtonItem: MemoExoticComponent<
|
|
51
|
-
|
|
52
|
+
ForwardRefExoticComponent<ButtonItemProps & RefAttributes<HTMLElement>>
|
|
52
53
|
>;
|
|
53
54
|
|
|
54
55
|
// @public (undocumented)
|
|
55
56
|
export interface ButtonItemProps extends BaseItemProps {
|
|
56
|
-
|
|
57
|
-
|
|
57
|
+
id?: string;
|
|
58
|
+
role?: string;
|
|
58
59
|
}
|
|
59
60
|
|
|
60
61
|
// @public @deprecated
|
|
61
62
|
export interface CSSFn<TState = ItemState extends void ? void : ItemState> {
|
|
62
|
-
|
|
63
|
-
|
|
63
|
+
// (undocumented)
|
|
64
|
+
(currentState: TState): CSSObject | CSSObject[];
|
|
64
65
|
}
|
|
65
66
|
|
|
66
67
|
// @public
|
|
@@ -68,33 +69,32 @@ export const CustomItem: CustomItemTypeGenericHackProps;
|
|
|
68
69
|
|
|
69
70
|
// @public (undocumented)
|
|
70
71
|
export interface CustomItemComponentProps {
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
72
|
+
'data-testid'?: string;
|
|
73
|
+
children: React.ReactNode;
|
|
74
|
+
className: string;
|
|
75
|
+
disabled?: boolean;
|
|
76
|
+
draggable: boolean;
|
|
77
|
+
onClick?: (event: React.MouseEvent<HTMLElement>) => void;
|
|
78
|
+
onDragStart?: (event: React.DragEvent) => void;
|
|
79
|
+
onMouseDown?: (event: React.MouseEvent<HTMLElement>) => void;
|
|
80
|
+
ref?: Ref<any>;
|
|
81
|
+
tabIndex?: number;
|
|
81
82
|
}
|
|
82
83
|
|
|
83
84
|
// @public (undocumented)
|
|
84
|
-
export interface CustomItemProps<
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
component?: React.ComponentType<TCustomComponentProps>;
|
|
85
|
+
export interface CustomItemProps<TCustomComponentProps = CustomItemComponentProps>
|
|
86
|
+
extends BaseItemProps {
|
|
87
|
+
component?: React.ComponentType<TCustomComponentProps>;
|
|
88
88
|
}
|
|
89
89
|
|
|
90
90
|
// @public (undocumented)
|
|
91
91
|
interface CustomItemTypeGenericHackProps {
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
92
|
+
// (undocumented)
|
|
93
|
+
<TComponentProps>(
|
|
94
|
+
props: CustomItemProps<TComponentProps> & {
|
|
95
|
+
ref?: any;
|
|
96
|
+
} & Omit<TComponentProps, keyof CustomItemComponentProps>,
|
|
97
|
+
): JSX.Element | null;
|
|
98
98
|
}
|
|
99
99
|
|
|
100
100
|
// @public (undocumented)
|
|
@@ -102,159 +102,151 @@ export type Dimension = number | string;
|
|
|
102
102
|
|
|
103
103
|
// @public
|
|
104
104
|
export const HeadingItem: MemoExoticComponent<
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
105
|
+
({
|
|
106
|
+
children,
|
|
107
|
+
testId,
|
|
108
|
+
id,
|
|
109
|
+
cssFn,
|
|
110
|
+
className: UNSAFE_className,
|
|
111
|
+
...rest
|
|
112
|
+
}: HeadingItemProps) => jsx.JSX.Element
|
|
113
113
|
>;
|
|
114
114
|
|
|
115
115
|
// @public (undocumented)
|
|
116
116
|
export interface HeadingItemProps {
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
117
|
+
children: React.ReactNode;
|
|
118
|
+
// @deprecated
|
|
119
|
+
cssFn?: StatelessCSSFn;
|
|
120
|
+
id?: string;
|
|
121
|
+
testId?: string;
|
|
122
122
|
}
|
|
123
123
|
|
|
124
124
|
// @public (undocumented)
|
|
125
125
|
export type ItemState = {
|
|
126
|
-
|
|
127
|
-
|
|
126
|
+
isSelected: boolean;
|
|
127
|
+
isDisabled: boolean;
|
|
128
128
|
};
|
|
129
129
|
|
|
130
130
|
// @public
|
|
131
131
|
export const LinkItem: MemoExoticComponent<
|
|
132
|
-
|
|
132
|
+
ForwardRefExoticComponent<LinkItemProps & RefAttributes<HTMLElement>>
|
|
133
133
|
>;
|
|
134
134
|
|
|
135
135
|
// @public (undocumented)
|
|
136
136
|
export interface LinkItemProps extends BaseItemProps {
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
137
|
+
href?: string;
|
|
138
|
+
rel?: string;
|
|
139
|
+
role?: string;
|
|
140
|
+
target?: string;
|
|
141
141
|
}
|
|
142
142
|
|
|
143
143
|
// @public
|
|
144
144
|
export const MenuGroup: ({
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
145
|
+
isLoading,
|
|
146
|
+
maxWidth,
|
|
147
|
+
minWidth,
|
|
148
|
+
minHeight,
|
|
149
|
+
maxHeight,
|
|
150
|
+
testId,
|
|
151
|
+
role,
|
|
152
|
+
spacing,
|
|
153
|
+
className: UNSAFE_className,
|
|
154
|
+
...rest
|
|
155
155
|
}: MenuGroupProps) => jsx.JSX.Element;
|
|
156
156
|
|
|
157
157
|
// @public (undocumented)
|
|
158
158
|
export interface MenuGroupProps extends MenuGroupSizing {
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
159
|
+
children: React.ReactNode;
|
|
160
|
+
isLoading?: boolean;
|
|
161
|
+
onClick?: (event: React.KeyboardEvent | React.MouseEvent) => void;
|
|
162
|
+
role?: string;
|
|
163
|
+
spacing?: SpacingMode;
|
|
164
|
+
testId?: string;
|
|
165
165
|
}
|
|
166
166
|
|
|
167
167
|
// @public (undocumented)
|
|
168
168
|
export interface MenuGroupSizing {
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
169
|
+
maxHeight?: Dimension;
|
|
170
|
+
maxWidth?: Dimension;
|
|
171
|
+
minHeight?: Dimension;
|
|
172
|
+
minWidth?: Dimension;
|
|
173
173
|
}
|
|
174
174
|
|
|
175
175
|
// @public @deprecated (undocumented)
|
|
176
176
|
export interface Overrides {
|
|
177
|
-
|
|
178
|
-
|
|
177
|
+
// (undocumented)
|
|
178
|
+
Title?: TitleOverrides;
|
|
179
179
|
}
|
|
180
180
|
|
|
181
181
|
// @public @deprecated (undocumented)
|
|
182
|
-
export const PopupMenuGroup: ({
|
|
183
|
-
maxWidth,
|
|
184
|
-
minWidth,
|
|
185
|
-
...rest
|
|
186
|
-
}: MenuGroupProps) => jsx.JSX.Element;
|
|
182
|
+
export const PopupMenuGroup: ({ maxWidth, minWidth, ...rest }: MenuGroupProps) => jsx.JSX.Element;
|
|
187
183
|
|
|
188
184
|
// @public (undocumented)
|
|
189
185
|
export interface RenderFunction<TProps = {}> {
|
|
190
|
-
|
|
191
|
-
|
|
186
|
+
// (undocumented)
|
|
187
|
+
(Component: ComponentType | string, props: TProps): React.ReactNode;
|
|
192
188
|
}
|
|
193
189
|
|
|
194
190
|
// @public
|
|
195
|
-
export const Section: ForwardRefExoticComponent<
|
|
196
|
-
SectionProps & RefAttributes<HTMLElement>
|
|
197
|
-
>;
|
|
191
|
+
export const Section: ForwardRefExoticComponent<SectionProps & RefAttributes<HTMLElement>>;
|
|
198
192
|
|
|
199
193
|
// @public (undocumented)
|
|
200
194
|
interface SectionProps {
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
195
|
+
children: React.ReactNode;
|
|
196
|
+
hasSeparator?: boolean;
|
|
197
|
+
id?: string;
|
|
198
|
+
isList?: boolean;
|
|
199
|
+
isScrollable?: boolean;
|
|
200
|
+
// @deprecated (undocumented)
|
|
201
|
+
overrides?: {
|
|
202
|
+
HeadingItem?: {
|
|
203
|
+
cssFn?: StatelessCSSFn;
|
|
204
|
+
};
|
|
205
|
+
};
|
|
206
|
+
testId?: string;
|
|
207
|
+
title?: string;
|
|
214
208
|
}
|
|
215
209
|
export { SectionProps as SectionBaseProps };
|
|
216
210
|
export { SectionProps };
|
|
217
211
|
|
|
218
212
|
// @internal
|
|
219
|
-
export const SELECTION_STYLE_CONTEXT_DO_NOT_USE: Context<
|
|
220
|
-
'border' | 'none' | 'notch'
|
|
221
|
-
>;
|
|
213
|
+
export const SELECTION_STYLE_CONTEXT_DO_NOT_USE: Context<'border' | 'none' | 'notch'>;
|
|
222
214
|
|
|
223
215
|
// @public
|
|
224
216
|
export const SkeletonHeadingItem: ({
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
217
|
+
isShimmering,
|
|
218
|
+
testId,
|
|
219
|
+
width,
|
|
220
|
+
cssFn,
|
|
229
221
|
}: SkeletonHeadingItemProps) => jsx.JSX.Element;
|
|
230
222
|
|
|
231
223
|
// @public (undocumented)
|
|
232
224
|
export interface SkeletonHeadingItemProps {
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
225
|
+
// @deprecated
|
|
226
|
+
cssFn?: StatelessCSSFn;
|
|
227
|
+
isShimmering?: boolean;
|
|
228
|
+
testId?: string;
|
|
229
|
+
width?: Dimension;
|
|
238
230
|
}
|
|
239
231
|
|
|
240
232
|
// @public
|
|
241
233
|
export const SkeletonItem: ({
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
234
|
+
hasAvatar,
|
|
235
|
+
hasIcon,
|
|
236
|
+
isShimmering,
|
|
237
|
+
testId,
|
|
238
|
+
width,
|
|
239
|
+
cssFn,
|
|
248
240
|
}: SkeletonItemProps) => jsx.JSX.Element;
|
|
249
241
|
|
|
250
242
|
// @public (undocumented)
|
|
251
243
|
export interface SkeletonItemProps {
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
244
|
+
cssFn?: StatelessCSSFn;
|
|
245
|
+
hasAvatar?: boolean;
|
|
246
|
+
hasIcon?: boolean;
|
|
247
|
+
isShimmering?: boolean;
|
|
248
|
+
testId?: string;
|
|
249
|
+
width?: Dimension;
|
|
258
250
|
}
|
|
259
251
|
|
|
260
252
|
// @internal
|
|
@@ -268,12 +260,12 @@ export type StatelessCSSFn = CSSFn<void>;
|
|
|
268
260
|
|
|
269
261
|
// @public @deprecated (undocumented)
|
|
270
262
|
export interface TitleOverrides {
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
263
|
+
// (undocumented)
|
|
264
|
+
render?: RenderFunction<{
|
|
265
|
+
className?: string;
|
|
266
|
+
children: ReactNode;
|
|
267
|
+
'data-item-title': boolean;
|
|
268
|
+
}>;
|
|
277
269
|
}
|
|
278
270
|
|
|
279
271
|
// (No @packageDocumentation comment for this package)
|
|
@@ -287,8 +279,8 @@ export interface TitleOverrides {
|
|
|
287
279
|
|
|
288
280
|
```json
|
|
289
281
|
{
|
|
290
|
-
|
|
291
|
-
|
|
282
|
+
"react": "^16.8.0",
|
|
283
|
+
"react-dom": "^16.8.0"
|
|
292
284
|
}
|
|
293
285
|
```
|
|
294
286
|
|