@pingux/astro 1.12.0-alpha.4 → 1.12.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 +17 -0
- package/NOTICE.html +4311 -0
- package/lib/cjs/components/Avatar/Avatar.js +3 -8
- package/lib/cjs/components/Avatar/Avatar.test.js +0 -10
- package/lib/cjs/components/Breadcrumbs/Breadcrumbs.js +2 -1
- package/lib/cjs/components/Button/Button.js +3 -9
- package/lib/cjs/components/CodeView/CodeView.test.js +4 -4
- package/lib/cjs/components/ComboBox/ComboBoxInput.js +1 -2
- package/lib/cjs/components/CopyText/CopyButton.js +1 -1
- package/lib/cjs/components/CopyText/CopyText.js +1 -5
- package/lib/cjs/components/CopyText/CopyText.test.js +20 -11
- package/lib/cjs/components/Menu/Menu.js +1 -4
- package/lib/cjs/components/Menu/Menu.test.js +0 -3
- package/lib/components/Avatar/Avatar.js +3 -8
- package/lib/components/Avatar/Avatar.test.js +0 -8
- package/lib/components/Breadcrumbs/Breadcrumbs.js +2 -1
- package/lib/components/Button/Button.js +3 -9
- package/lib/components/CodeView/CodeView.test.js +4 -4
- package/lib/components/ComboBox/ComboBoxInput.js +1 -2
- package/lib/components/CopyText/CopyButton.js +1 -1
- package/lib/components/CopyText/CopyText.js +1 -5
- package/lib/components/CopyText/CopyText.test.js +16 -11
- package/lib/components/Menu/Menu.js +1 -3
- package/lib/components/Menu/Menu.test.js +0 -2
- package/package.json +1 -1
@@ -36,18 +36,13 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
36
36
|
*/
|
37
37
|
var Avatar = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
38
38
|
return (0, _react2.jsx)(_themeUi.Avatar, (0, _extends2["default"])({
|
39
|
-
ref: ref
|
39
|
+
ref: ref,
|
40
|
+
alt: "Avatar"
|
40
41
|
}, props));
|
41
42
|
});
|
42
43
|
Avatar.propTypes = {
|
43
44
|
/** Source of avatar. */
|
44
|
-
src: _propTypes["default"].string.isRequired
|
45
|
-
|
46
|
-
/** Alternative text for avatar. */
|
47
|
-
alt: _propTypes["default"].string
|
48
|
-
};
|
49
|
-
Avatar.defaultProps = {
|
50
|
-
alt: 'Avatar'
|
45
|
+
src: _propTypes["default"].string.isRequired
|
51
46
|
};
|
52
47
|
Avatar.displayName = 'Avatar';
|
53
48
|
var _default = Avatar;
|
@@ -34,14 +34,4 @@ test('an avatar is rendered', function () {
|
|
34
34
|
|
35
35
|
expect(img).toBeInstanceOf(HTMLImageElement);
|
36
36
|
expect(img).toBeInTheDocument();
|
37
|
-
expect(img).toHaveAttribute('alt', 'Avatar');
|
38
|
-
});
|
39
|
-
test('an avatar is rendered with custom alt', function () {
|
40
|
-
getComponent({
|
41
|
-
alt: 'Custom Alt'
|
42
|
-
});
|
43
|
-
|
44
|
-
var img = _testWrapper.screen.getByRole('img');
|
45
|
-
|
46
|
-
expect(img).toHaveAttribute('alt', 'Custom Alt');
|
47
37
|
});
|
@@ -101,7 +101,8 @@ var Breadcrumbs = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
101
101
|
ref: breadcrumbsRef,
|
102
102
|
isRow: true,
|
103
103
|
sx: {
|
104
|
-
overflow: 'auto'
|
104
|
+
overflow: 'auto',
|
105
|
+
paddingInlineStart: 'unset'
|
105
106
|
},
|
106
107
|
as: "ol"
|
107
108
|
}, (0, _utils.mergeProps)(wrapperProps, others)), (0, _isArray["default"])(filteredChildren) ? (0, _map["default"])(filteredChildren).call(filteredChildren, createBreadcrumb) : createBreadcrumb(children)));
|
@@ -54,7 +54,7 @@ var _Loader = _interopRequireDefault(require("../Loader"));
|
|
54
54
|
|
55
55
|
var _react2 = require("@emotion/react");
|
56
56
|
|
57
|
-
var _excluded = ["className", "isDisabled", "isLoading", "onHoverStart", "onHoverChange", "onHoverEnd", "onPress", "onPressStart", "onPressEnd", "onPressChange", "onPressUp", "children", "variant"
|
57
|
+
var _excluded = ["className", "isDisabled", "isLoading", "onHoverStart", "onHoverChange", "onHoverEnd", "onPress", "onPressStart", "onPressEnd", "onPressChange", "onPressUp", "children", "variant"];
|
58
58
|
|
59
59
|
function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
60
60
|
|
@@ -78,7 +78,6 @@ var Button = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
78
78
|
onPressUp = props.onPressUp,
|
79
79
|
children = props.children,
|
80
80
|
variant = props.variant,
|
81
|
-
tabIndex = props.tabIndex,
|
82
81
|
others = (0, _objectWithoutProperties2["default"])(props, _excluded);
|
83
82
|
var buttonRef = (0, _react.useRef)();
|
84
83
|
(0, _hooks.usePropWarning)(props, 'disabled', 'isDisabled');
|
@@ -133,9 +132,7 @@ var Button = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
133
132
|
alignItems: 'center'
|
134
133
|
},
|
135
134
|
variant: variant
|
136
|
-
}, others, (0, _utils.mergeProps)(hoverProps, focusProps,
|
137
|
-
tabIndex: tabIndex
|
138
|
-
}))), isLoading ? (0, _react2.jsx)("span", {
|
135
|
+
}, others, (0, _utils.mergeProps)(hoverProps, focusProps, buttonProps)), isLoading ? (0, _react2.jsx)("span", {
|
139
136
|
style: {
|
140
137
|
visibility: 'hidden'
|
141
138
|
}
|
@@ -207,10 +204,7 @@ Button.propTypes = {
|
|
207
204
|
onPressUp: _propTypes["default"].func,
|
208
205
|
|
209
206
|
/** The styling variation of the button. */
|
210
|
-
variant: _propTypes["default"].string
|
211
|
-
|
212
|
-
/** The focus variation of the button. */
|
213
|
-
tabIndex: _propTypes["default"].number
|
207
|
+
variant: _propTypes["default"].string
|
214
208
|
};
|
215
209
|
Button.defaultProps = {
|
216
210
|
isDisabled: false,
|
@@ -85,7 +85,7 @@ test('renders component in the default state', function () {
|
|
85
85
|
test('copy button is hovered and renders tooltip via mouse', function () {
|
86
86
|
getComponent();
|
87
87
|
|
88
|
-
var copyBtn = _testWrapper.screen.getByLabelText('copy
|
88
|
+
var copyBtn = _testWrapper.screen.getByLabelText('copy');
|
89
89
|
|
90
90
|
expect(copyBtn).not.toHaveFocus();
|
91
91
|
|
@@ -98,7 +98,7 @@ test('copy button is hovered and renders tooltip via mouse', function () {
|
|
98
98
|
test('copy button is focused and renders tooltip via keyboard', function () {
|
99
99
|
getComponent();
|
100
100
|
|
101
|
-
var copyBtn = _testWrapper.screen.getByLabelText('copy
|
101
|
+
var copyBtn = _testWrapper.screen.getByLabelText('copy');
|
102
102
|
|
103
103
|
expect(copyBtn).not.toHaveFocus();
|
104
104
|
|
@@ -141,7 +141,7 @@ test('click on copy button copies data to the clipboard', /*#__PURE__*/(0, _asyn
|
|
141
141
|
switch (_context2.prev = _context2.next) {
|
142
142
|
case 0:
|
143
143
|
getComponent();
|
144
|
-
button = _testWrapper.screen.getByLabelText('copy
|
144
|
+
button = _testWrapper.screen.getByLabelText('copy');
|
145
145
|
_context2.next = 4;
|
146
146
|
return (0, _testWrapper.act)( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
|
147
147
|
return _regenerator["default"].wrap(function _callee$(_context) {
|
@@ -176,7 +176,7 @@ test('after button click, the tooltip renders with the text "Copied!"', /*#__PUR
|
|
176
176
|
switch (_context4.prev = _context4.next) {
|
177
177
|
case 0:
|
178
178
|
getComponent();
|
179
|
-
button = _testWrapper.screen.getByLabelText('copy
|
179
|
+
button = _testWrapper.screen.getByLabelText('copy');
|
180
180
|
_context4.next = 4;
|
181
181
|
return (0, _testWrapper.act)( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3() {
|
182
182
|
return _regenerator["default"].wrap(function _callee3$(_context3) {
|
@@ -159,8 +159,7 @@ var ComboBoxInput = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
159
159
|
variant: "comboBox"
|
160
160
|
}, triggerProps, {
|
161
161
|
ref: triggerRef,
|
162
|
-
isDisabled: isDisabled || isReadOnly
|
163
|
-
tabIndex: -1
|
162
|
+
isDisabled: isDisabled || isReadOnly
|
164
163
|
}), (0, _react2.jsx)(_index.Icon, {
|
165
164
|
icon: _MenuDownIcon["default"],
|
166
165
|
sx: isOpen ? {
|
@@ -39,7 +39,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
39
39
|
var CopyButton = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
40
40
|
return (0, _react2.jsx)(_IconButton["default"], (0, _extends2["default"])({
|
41
41
|
ref: ref,
|
42
|
-
"aria-label": "copy
|
42
|
+
"aria-label": "copy",
|
43
43
|
variant: "buttons.copy"
|
44
44
|
}, (0, _lodash.omit)(props, 'iconProps')), (0, _react2.jsx)(_Icon["default"], (0, _extends2["default"])({
|
45
45
|
icon: _ContentCopyIcon["default"],
|
@@ -34,8 +34,6 @@ var _interactions = require("@react-aria/interactions");
|
|
34
34
|
|
35
35
|
var _utils = require("@react-aria/utils");
|
36
36
|
|
37
|
-
var _liveAnnouncer = require("@react-aria/live-announcer");
|
38
|
-
|
39
37
|
var _index = require("../../index");
|
40
38
|
|
41
39
|
var _CopyButton = _interopRequireDefault(require("./CopyButton"));
|
@@ -103,7 +101,6 @@ var CopyText = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
103
101
|
|
104
102
|
(0, _react.useEffect)(function () {
|
105
103
|
if (isCopied) {
|
106
|
-
(0, _liveAnnouncer.announce)('Copied!', 'polite');
|
107
104
|
var timer = (0, _setTimeout2["default"])(function () {
|
108
105
|
setIsCopied(false);
|
109
106
|
}, 1000);
|
@@ -118,8 +115,7 @@ var CopyText = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
118
115
|
var content = mode === 'link' || mode === 'nonClickableContent' ? children : (0, _react2.jsx)(_index.Button, (0, _extends2["default"])({
|
119
116
|
variant: "quiet",
|
120
117
|
onPress: copyToClipboard,
|
121
|
-
"aria-label": "copy-content"
|
122
|
-
tabIndex: -1
|
118
|
+
"aria-label": "copy-content"
|
123
119
|
}, focusProps), children);
|
124
120
|
var tooltip = isCopied ? 'Copied!' : tooltipText;
|
125
121
|
var isTooltipOpen = isFocusVisible || isHovered || isCopied;
|
@@ -88,10 +88,19 @@ describe('Text mode', function () {
|
|
88
88
|
expect(_testWrapper.screen.queryByRole('tooltip')).toBeInTheDocument();
|
89
89
|
expect(_testWrapper.screen.queryByRole('tooltip')).toHaveTextContent('Copy to clipboard');
|
90
90
|
});
|
91
|
-
test('copy
|
91
|
+
test('content and copy buttons are focused with keyboard', function () {
|
92
92
|
getComponent();
|
93
93
|
|
94
|
-
var
|
94
|
+
var contentBtn = _testWrapper.screen.getByLabelText('copy-content');
|
95
|
+
|
96
|
+
expect(contentBtn).not.toHaveFocus();
|
97
|
+
|
98
|
+
_userEvent["default"].tab();
|
99
|
+
|
100
|
+
expect(contentBtn).toHaveFocus();
|
101
|
+
expect(contentBtn).toHaveClass('is-focused');
|
102
|
+
|
103
|
+
var copyBtn = _testWrapper.screen.getByLabelText('copy');
|
95
104
|
|
96
105
|
expect(copyBtn).not.toHaveFocus();
|
97
106
|
|
@@ -155,7 +164,7 @@ describe('Text mode', function () {
|
|
155
164
|
switch (_context4.prev = _context4.next) {
|
156
165
|
case 0:
|
157
166
|
getComponent();
|
158
|
-
button = _testWrapper.screen.getByLabelText('copy
|
167
|
+
button = _testWrapper.screen.getByLabelText('copy');
|
159
168
|
_context4.next = 4;
|
160
169
|
return (0, _testWrapper.act)( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3() {
|
161
170
|
return _regenerator["default"].wrap(function _callee3$(_context3) {
|
@@ -193,7 +202,7 @@ describe('Text mode', function () {
|
|
193
202
|
getComponent({
|
194
203
|
textToCopy: textToCopy
|
195
204
|
});
|
196
|
-
button = _testWrapper.screen.getByLabelText('copy
|
205
|
+
button = _testWrapper.screen.getByLabelText('copy');
|
197
206
|
_context6.next = 5;
|
198
207
|
return (0, _testWrapper.act)( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5() {
|
199
208
|
return _regenerator["default"].wrap(function _callee5$(_context5) {
|
@@ -229,7 +238,7 @@ describe('Text mode', function () {
|
|
229
238
|
case 0:
|
230
239
|
global.navigator.clipboard = undefined;
|
231
240
|
getComponent();
|
232
|
-
button = _testWrapper.screen.getByLabelText('copy
|
241
|
+
button = _testWrapper.screen.getByLabelText('copy');
|
233
242
|
_context8.next = 5;
|
234
243
|
return (0, _testWrapper.act)( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee7() {
|
235
244
|
return _regenerator["default"].wrap(function _callee7$(_context7) {
|
@@ -274,7 +283,7 @@ describe('Text mode', function () {
|
|
274
283
|
getComponent();
|
275
284
|
spy = jest.spyOn(console, 'error');
|
276
285
|
expect(spy).not.toHaveBeenCalled();
|
277
|
-
button = _testWrapper.screen.getByLabelText('copy
|
286
|
+
button = _testWrapper.screen.getByLabelText('copy');
|
278
287
|
_context10.next = 9;
|
279
288
|
return (0, _testWrapper.act)( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee9() {
|
280
289
|
return _regenerator["default"].wrap(function _callee9$(_context9) {
|
@@ -310,7 +319,7 @@ describe('Text mode', function () {
|
|
310
319
|
switch (_context12.prev = _context12.next) {
|
311
320
|
case 0:
|
312
321
|
getComponent();
|
313
|
-
button = _testWrapper.screen.getByLabelText('copy
|
322
|
+
button = _testWrapper.screen.getByLabelText('copy');
|
314
323
|
_context12.next = 4;
|
315
324
|
return (0, _testWrapper.act)( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee11() {
|
316
325
|
return _regenerator["default"].wrap(function _callee11$(_context11) {
|
@@ -345,7 +354,7 @@ describe('Text mode', function () {
|
|
345
354
|
switch (_context14.prev = _context14.next) {
|
346
355
|
case 0:
|
347
356
|
getComponent();
|
348
|
-
button = _testWrapper.screen.getByLabelText('copy
|
357
|
+
button = _testWrapper.screen.getByLabelText('copy');
|
349
358
|
_context14.next = 4;
|
350
359
|
return (0, _testWrapper.act)( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee13() {
|
351
360
|
return _regenerator["default"].wrap(function _callee13$(_context13) {
|
@@ -406,7 +415,7 @@ describe('Link mode', function () {
|
|
406
415
|
|
407
416
|
expect(_testWrapper.screen.queryByRole('tooltip')).not.toBeInTheDocument();
|
408
417
|
|
409
|
-
var button = _testWrapper.screen.getByLabelText('copy
|
418
|
+
var button = _testWrapper.screen.getByLabelText('copy');
|
410
419
|
|
411
420
|
_testWrapper.fireEvent.mouseMove(button);
|
412
421
|
|
@@ -417,7 +426,7 @@ describe('Link mode', function () {
|
|
417
426
|
test('copy button is focused with keyboard', function () {
|
418
427
|
getComponent();
|
419
428
|
|
420
|
-
var copyBtn = _testWrapper.screen.getByLabelText('copy
|
429
|
+
var copyBtn = _testWrapper.screen.getByLabelText('copy');
|
421
430
|
|
422
431
|
expect(copyBtn).not.toHaveFocus();
|
423
432
|
|
@@ -445,7 +454,7 @@ describe('Link mode', function () {
|
|
445
454
|
switch (_context16.prev = _context16.next) {
|
446
455
|
case 0:
|
447
456
|
getComponent();
|
448
|
-
button = _testWrapper.screen.getByLabelText('copy
|
457
|
+
button = _testWrapper.screen.getByLabelText('copy');
|
449
458
|
_context16.next = 4;
|
450
459
|
return (0, _testWrapper.act)( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee15() {
|
451
460
|
return _regenerator["default"].wrap(function _callee15$(_context15) {
|
@@ -58,8 +58,6 @@ var _MenuItem = _interopRequireDefault(require("../MenuItem"));
|
|
58
58
|
|
59
59
|
var _Box = _interopRequireDefault(require("../Box"));
|
60
60
|
|
61
|
-
var _orientation = _interopRequireDefault(require("../../utils/devUtils/constants/orientation"));
|
62
|
-
|
63
61
|
var _react2 = require("@emotion/react");
|
64
62
|
|
65
63
|
var _excluded = ["isDisabled", "onAction", "onSelectionChange", "isNotFocusedOnHover"];
|
@@ -113,8 +111,7 @@ var Menu = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
113
111
|
return (0, _react2.jsx)(_Box["default"], (0, _extends2["default"])({
|
114
112
|
as: "ul",
|
115
113
|
ref: menuRef,
|
116
|
-
variant: "menu"
|
117
|
-
"aria-orientation": _orientation["default"].VERTICAL
|
114
|
+
variant: "menu"
|
118
115
|
}, others, (0, _utils.mergeProps)(focusProps, menuProps)), (0, _map["default"])(_context = (0, _from["default"])(state.collection)).call(_context, function (item) {
|
119
116
|
return (0, _react2.jsx)(_MenuItem["default"], {
|
120
117
|
key: item.key,
|
@@ -20,8 +20,6 @@ var _testWrapper = require("../../utils/testUtils/testWrapper");
|
|
20
20
|
|
21
21
|
var _index = require("../../index");
|
22
22
|
|
23
|
-
var _orientation = _interopRequireDefault(require("../../utils/devUtils/constants/orientation"));
|
24
|
-
|
25
23
|
var _react2 = require("@emotion/react");
|
26
24
|
|
27
25
|
var testTitle = 'Test Title';
|
@@ -61,7 +59,6 @@ test('should render basic menu with children', function () {
|
|
61
59
|
var menuItems = _testWrapper.screen.queryAllByRole('menuitem');
|
62
60
|
|
63
61
|
expect(menuItems).toHaveLength(3);
|
64
|
-
expect(menu).toHaveAttribute('aria-orientation', _orientation["default"].VERTICAL);
|
65
62
|
});
|
66
63
|
test('should render items when selectionMode is set to single', function () {
|
67
64
|
getComponent({
|
@@ -10,18 +10,13 @@ import { Avatar as ThemeUIAvatar } from 'theme-ui';
|
|
10
10
|
import { jsx as ___EmotionJSX } from "@emotion/react";
|
11
11
|
var Avatar = /*#__PURE__*/forwardRef(function (props, ref) {
|
12
12
|
return ___EmotionJSX(ThemeUIAvatar, _extends({
|
13
|
-
ref: ref
|
13
|
+
ref: ref,
|
14
|
+
alt: "Avatar"
|
14
15
|
}, props));
|
15
16
|
});
|
16
17
|
Avatar.propTypes = {
|
17
18
|
/** Source of avatar. */
|
18
|
-
src: PropTypes.string.isRequired
|
19
|
-
|
20
|
-
/** Alternative text for avatar. */
|
21
|
-
alt: PropTypes.string
|
22
|
-
};
|
23
|
-
Avatar.defaultProps = {
|
24
|
-
alt: 'Avatar'
|
19
|
+
src: PropTypes.string.isRequired
|
25
20
|
};
|
26
21
|
Avatar.displayName = 'Avatar';
|
27
22
|
export default Avatar;
|
@@ -21,12 +21,4 @@ test('an avatar is rendered', function () {
|
|
21
21
|
var img = screen.getByRole('img');
|
22
22
|
expect(img).toBeInstanceOf(HTMLImageElement);
|
23
23
|
expect(img).toBeInTheDocument();
|
24
|
-
expect(img).toHaveAttribute('alt', 'Avatar');
|
25
|
-
});
|
26
|
-
test('an avatar is rendered with custom alt', function () {
|
27
|
-
getComponent({
|
28
|
-
alt: 'Custom Alt'
|
29
|
-
});
|
30
|
-
var img = screen.getByRole('img');
|
31
|
-
expect(img).toHaveAttribute('alt', 'Custom Alt');
|
32
24
|
});
|
@@ -67,7 +67,8 @@ var Breadcrumbs = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
67
67
|
ref: breadcrumbsRef,
|
68
68
|
isRow: true,
|
69
69
|
sx: {
|
70
|
-
overflow: 'auto'
|
70
|
+
overflow: 'auto',
|
71
|
+
paddingInlineStart: 'unset'
|
71
72
|
},
|
72
73
|
as: "ol"
|
73
74
|
}, mergeProps(wrapperProps, others)), _Array$isArray(filteredChildren) ? _mapInstanceProperty(filteredChildren).call(filteredChildren, createBreadcrumb) : createBreadcrumb(children)));
|
@@ -9,7 +9,7 @@ import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
|
|
9
9
|
import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
|
10
10
|
import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
|
11
11
|
import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
|
12
|
-
var _excluded = ["className", "isDisabled", "isLoading", "onHoverStart", "onHoverChange", "onHoverEnd", "onPress", "onPressStart", "onPressEnd", "onPressChange", "onPressUp", "children", "variant"
|
12
|
+
var _excluded = ["className", "isDisabled", "isLoading", "onHoverStart", "onHoverChange", "onHoverEnd", "onPress", "onPressStart", "onPressEnd", "onPressChange", "onPressUp", "children", "variant"];
|
13
13
|
|
14
14
|
function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
15
15
|
|
@@ -39,7 +39,6 @@ var Button = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
39
39
|
onPressUp = props.onPressUp,
|
40
40
|
children = props.children,
|
41
41
|
variant = props.variant,
|
42
|
-
tabIndex = props.tabIndex,
|
43
42
|
others = _objectWithoutProperties(props, _excluded);
|
44
43
|
|
45
44
|
var buttonRef = useRef();
|
@@ -95,9 +94,7 @@ var Button = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
95
94
|
alignItems: 'center'
|
96
95
|
},
|
97
96
|
variant: variant
|
98
|
-
}, others, mergeProps(hoverProps, focusProps,
|
99
|
-
tabIndex: tabIndex
|
100
|
-
}))), isLoading ? ___EmotionJSX("span", {
|
97
|
+
}, others, mergeProps(hoverProps, focusProps, buttonProps)), isLoading ? ___EmotionJSX("span", {
|
101
98
|
style: {
|
102
99
|
visibility: 'hidden'
|
103
100
|
}
|
@@ -169,10 +166,7 @@ Button.propTypes = {
|
|
169
166
|
onPressUp: PropTypes.func,
|
170
167
|
|
171
168
|
/** The styling variation of the button. */
|
172
|
-
variant: PropTypes.string
|
173
|
-
|
174
|
-
/** The focus variation of the button. */
|
175
|
-
tabIndex: PropTypes.number
|
169
|
+
variant: PropTypes.string
|
176
170
|
};
|
177
171
|
Button.defaultProps = {
|
178
172
|
isDisabled: false,
|
@@ -60,7 +60,7 @@ test('renders component in the default state', function () {
|
|
60
60
|
});
|
61
61
|
test('copy button is hovered and renders tooltip via mouse', function () {
|
62
62
|
getComponent();
|
63
|
-
var copyBtn = screen.getByLabelText('copy
|
63
|
+
var copyBtn = screen.getByLabelText('copy');
|
64
64
|
expect(copyBtn).not.toHaveFocus();
|
65
65
|
userEvent.hover(copyBtn);
|
66
66
|
expect(copyBtn).toHaveClass('is-hovered');
|
@@ -69,7 +69,7 @@ test('copy button is hovered and renders tooltip via mouse', function () {
|
|
69
69
|
});
|
70
70
|
test('copy button is focused and renders tooltip via keyboard', function () {
|
71
71
|
getComponent();
|
72
|
-
var copyBtn = screen.getByLabelText('copy
|
72
|
+
var copyBtn = screen.getByLabelText('copy');
|
73
73
|
expect(copyBtn).not.toHaveFocus();
|
74
74
|
userEvent.tab();
|
75
75
|
expect(copyBtn).toHaveFocus();
|
@@ -105,7 +105,7 @@ test('click on copy button copies data to the clipboard', /*#__PURE__*/_asyncToG
|
|
105
105
|
switch (_context2.prev = _context2.next) {
|
106
106
|
case 0:
|
107
107
|
getComponent();
|
108
|
-
button = screen.getByLabelText('copy
|
108
|
+
button = screen.getByLabelText('copy');
|
109
109
|
_context2.next = 4;
|
110
110
|
return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
|
111
111
|
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
@@ -140,7 +140,7 @@ test('after button click, the tooltip renders with the text "Copied!"', /*#__PUR
|
|
140
140
|
switch (_context4.prev = _context4.next) {
|
141
141
|
case 0:
|
142
142
|
getComponent();
|
143
|
-
button = screen.getByLabelText('copy
|
143
|
+
button = screen.getByLabelText('copy');
|
144
144
|
_context4.next = 4;
|
145
145
|
return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
|
146
146
|
return _regeneratorRuntime.wrap(function _callee3$(_context3) {
|
@@ -117,8 +117,7 @@ var ComboBoxInput = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
117
117
|
variant: "comboBox"
|
118
118
|
}, triggerProps, {
|
119
119
|
ref: triggerRef,
|
120
|
-
isDisabled: isDisabled || isReadOnly
|
121
|
-
tabIndex: -1
|
120
|
+
isDisabled: isDisabled || isReadOnly
|
122
121
|
}), ___EmotionJSX(Icon, {
|
123
122
|
icon: MenuDown,
|
124
123
|
sx: isOpen ? {
|
@@ -9,7 +9,7 @@ import { jsx as ___EmotionJSX } from "@emotion/react";
|
|
9
9
|
var CopyButton = /*#__PURE__*/forwardRef(function (props, ref) {
|
10
10
|
return ___EmotionJSX(IconButton, _extends({
|
11
11
|
ref: ref,
|
12
|
-
"aria-label": "copy
|
12
|
+
"aria-label": "copy",
|
13
13
|
variant: "buttons.copy"
|
14
14
|
}, omit(props, 'iconProps')), ___EmotionJSX(Icon, _extends({
|
15
15
|
icon: ContentCopy,
|
@@ -9,7 +9,6 @@ import PropTypes from 'prop-types';
|
|
9
9
|
import { useFocusRing } from '@react-aria/focus';
|
10
10
|
import { Pressable, useHover } from '@react-aria/interactions';
|
11
11
|
import { mergeProps } from '@react-aria/utils';
|
12
|
-
import { announce } from '@react-aria/live-announcer';
|
13
12
|
import { Box, Button, Tooltip, TooltipTrigger } from '../../index';
|
14
13
|
import CopyButton from './CopyButton';
|
15
14
|
import useCopyToClipboard from '../../hooks/useCopyToClipboard';
|
@@ -69,8 +68,6 @@ var CopyText = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
69
68
|
|
70
69
|
useEffect(function () {
|
71
70
|
if (isCopied) {
|
72
|
-
announce('Copied!', 'polite');
|
73
|
-
|
74
71
|
var timer = _setTimeout(function () {
|
75
72
|
setIsCopied(false);
|
76
73
|
}, 1000);
|
@@ -86,8 +83,7 @@ var CopyText = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
86
83
|
var content = mode === 'link' || mode === 'nonClickableContent' ? children : ___EmotionJSX(Button, _extends({
|
87
84
|
variant: "quiet",
|
88
85
|
onPress: copyToClipboard,
|
89
|
-
"aria-label": "copy-content"
|
90
|
-
tabIndex: -1
|
86
|
+
"aria-label": "copy-content"
|
91
87
|
}, focusProps), children);
|
92
88
|
var tooltip = isCopied ? 'Copied!' : tooltipText;
|
93
89
|
var isTooltipOpen = isFocusVisible || isHovered || isCopied;
|
@@ -60,9 +60,14 @@ describe('Text mode', function () {
|
|
60
60
|
expect(screen.queryByRole('tooltip')).toBeInTheDocument();
|
61
61
|
expect(screen.queryByRole('tooltip')).toHaveTextContent('Copy to clipboard');
|
62
62
|
});
|
63
|
-
test('copy
|
63
|
+
test('content and copy buttons are focused with keyboard', function () {
|
64
64
|
getComponent();
|
65
|
-
var
|
65
|
+
var contentBtn = screen.getByLabelText('copy-content');
|
66
|
+
expect(contentBtn).not.toHaveFocus();
|
67
|
+
userEvent.tab();
|
68
|
+
expect(contentBtn).toHaveFocus();
|
69
|
+
expect(contentBtn).toHaveClass('is-focused');
|
70
|
+
var copyBtn = screen.getByLabelText('copy');
|
66
71
|
expect(copyBtn).not.toHaveFocus();
|
67
72
|
userEvent.tab();
|
68
73
|
expect(copyBtn).toHaveFocus();
|
@@ -123,7 +128,7 @@ describe('Text mode', function () {
|
|
123
128
|
switch (_context4.prev = _context4.next) {
|
124
129
|
case 0:
|
125
130
|
getComponent();
|
126
|
-
button = screen.getByLabelText('copy
|
131
|
+
button = screen.getByLabelText('copy');
|
127
132
|
_context4.next = 4;
|
128
133
|
return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
|
129
134
|
return _regeneratorRuntime.wrap(function _callee3$(_context3) {
|
@@ -161,7 +166,7 @@ describe('Text mode', function () {
|
|
161
166
|
getComponent({
|
162
167
|
textToCopy: textToCopy
|
163
168
|
});
|
164
|
-
button = screen.getByLabelText('copy
|
169
|
+
button = screen.getByLabelText('copy');
|
165
170
|
_context6.next = 5;
|
166
171
|
return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
|
167
172
|
return _regeneratorRuntime.wrap(function _callee5$(_context5) {
|
@@ -197,7 +202,7 @@ describe('Text mode', function () {
|
|
197
202
|
case 0:
|
198
203
|
global.navigator.clipboard = undefined;
|
199
204
|
getComponent();
|
200
|
-
button = screen.getByLabelText('copy
|
205
|
+
button = screen.getByLabelText('copy');
|
201
206
|
_context8.next = 5;
|
202
207
|
return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee7() {
|
203
208
|
return _regeneratorRuntime.wrap(function _callee7$(_context7) {
|
@@ -242,7 +247,7 @@ describe('Text mode', function () {
|
|
242
247
|
getComponent();
|
243
248
|
spy = jest.spyOn(console, 'error');
|
244
249
|
expect(spy).not.toHaveBeenCalled();
|
245
|
-
button = screen.getByLabelText('copy
|
250
|
+
button = screen.getByLabelText('copy');
|
246
251
|
_context10.next = 9;
|
247
252
|
return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee9() {
|
248
253
|
return _regeneratorRuntime.wrap(function _callee9$(_context9) {
|
@@ -278,7 +283,7 @@ describe('Text mode', function () {
|
|
278
283
|
switch (_context12.prev = _context12.next) {
|
279
284
|
case 0:
|
280
285
|
getComponent();
|
281
|
-
button = screen.getByLabelText('copy
|
286
|
+
button = screen.getByLabelText('copy');
|
282
287
|
_context12.next = 4;
|
283
288
|
return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee11() {
|
284
289
|
return _regeneratorRuntime.wrap(function _callee11$(_context11) {
|
@@ -313,7 +318,7 @@ describe('Text mode', function () {
|
|
313
318
|
switch (_context14.prev = _context14.next) {
|
314
319
|
case 0:
|
315
320
|
getComponent();
|
316
|
-
button = screen.getByLabelText('copy
|
321
|
+
button = screen.getByLabelText('copy');
|
317
322
|
_context14.next = 4;
|
318
323
|
return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee13() {
|
319
324
|
return _regeneratorRuntime.wrap(function _callee13$(_context13) {
|
@@ -369,14 +374,14 @@ describe('Link mode', function () {
|
|
369
374
|
fireEvent.mouseMove(container);
|
370
375
|
fireEvent.mouseEnter(container);
|
371
376
|
expect(screen.queryByRole('tooltip')).not.toBeInTheDocument();
|
372
|
-
var button = screen.getByLabelText('copy
|
377
|
+
var button = screen.getByLabelText('copy');
|
373
378
|
fireEvent.mouseMove(button);
|
374
379
|
fireEvent.mouseEnter(button);
|
375
380
|
expect(screen.queryByRole('tooltip')).toBeInTheDocument();
|
376
381
|
});
|
377
382
|
test('copy button is focused with keyboard', function () {
|
378
383
|
getComponent();
|
379
|
-
var copyBtn = screen.getByLabelText('copy
|
384
|
+
var copyBtn = screen.getByLabelText('copy');
|
380
385
|
expect(copyBtn).not.toHaveFocus();
|
381
386
|
userEvent.tab();
|
382
387
|
userEvent.tab();
|
@@ -400,7 +405,7 @@ describe('Link mode', function () {
|
|
400
405
|
switch (_context16.prev = _context16.next) {
|
401
406
|
case 0:
|
402
407
|
getComponent();
|
403
|
-
button = screen.getByLabelText('copy
|
408
|
+
button = screen.getByLabelText('copy');
|
404
409
|
_context16.next = 4;
|
405
410
|
return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee15() {
|
406
411
|
return _regeneratorRuntime.wrap(function _callee15$(_context15) {
|
@@ -27,7 +27,6 @@ import { MenuContext } from '../../context/MenuContext';
|
|
27
27
|
import { usePropWarning } from '../../hooks';
|
28
28
|
import MenuItem from '../MenuItem';
|
29
29
|
import Box from '../Box';
|
30
|
-
import ORIENTATION from '../../utils/devUtils/constants/orientation';
|
31
30
|
/**
|
32
31
|
* Menu component intended to be used as a wrapper for MenuItem.
|
33
32
|
* This component is typically used alongside others such as PopoverMenu.
|
@@ -72,8 +71,7 @@ var Menu = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
72
71
|
return ___EmotionJSX(Box, _extends({
|
73
72
|
as: "ul",
|
74
73
|
ref: menuRef,
|
75
|
-
variant: "menu"
|
76
|
-
"aria-orientation": ORIENTATION.VERTICAL
|
74
|
+
variant: "menu"
|
77
75
|
}, others, mergeProps(focusProps, menuProps)), _mapInstanceProperty(_context = _Array$from(state.collection)).call(_context, function (item) {
|
78
76
|
return ___EmotionJSX(MenuItem, {
|
79
77
|
key: item.key,
|
@@ -7,7 +7,6 @@ import userEvent from '@testing-library/user-event';
|
|
7
7
|
import axeTest from '../../utils/testUtils/testAxe';
|
8
8
|
import { render, screen, fireEvent } from '../../utils/testUtils/testWrapper';
|
9
9
|
import { Menu, Item } from '../../index';
|
10
|
-
import ORIENTATION from '../../utils/devUtils/constants/orientation';
|
11
10
|
import { jsx as ___EmotionJSX } from "@emotion/react";
|
12
11
|
var testTitle = 'Test Title';
|
13
12
|
var defaultProps = {
|
@@ -42,7 +41,6 @@ test('should render basic menu with children', function () {
|
|
42
41
|
expect(menu).toBeInTheDocument();
|
43
42
|
var menuItems = screen.queryAllByRole('menuitem');
|
44
43
|
expect(menuItems).toHaveLength(3);
|
45
|
-
expect(menu).toHaveAttribute('aria-orientation', ORIENTATION.VERTICAL);
|
46
44
|
});
|
47
45
|
test('should render items when selectionMode is set to single', function () {
|
48
46
|
getComponent({
|