@magento/venia-ui 9.6.0-alpha.1 → 9.6.0-beta.1

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.
Files changed (4) hide show
  1. package/lib/components/CartPage/ProductListing/__tests__/__snapshots__/product.spec.js.snap +56 -4
  2. package/lib/components/LegacyMiniCart/__tests__/__snapshots__/section.spec.js.snap +64 -4
  3. package/lib/components/LegacyMiniCart/section.js +11 -2
  4. package/package.json +2 -2
package/lib/components/CartPage/ProductListing/__tests__/__snapshots__/product.spec.js.snap CHANGED
@@ -267,8 +267,21 @@ exports[`renders configurable product with options 1`] = `
267
267
  className="menuItem"
268
268
  >
269
269
  <button
270
+ aria-label="Edit item"
270
271
  className="button"
271
- onMouseDown={[MockFunction]}
272
+ onClick={[Function]}
273
+ onDragStart={[Function]}
274
+ onKeyDown={[Function]}
275
+ onKeyUp={[Function]}
276
+ onMouseDown={[Function]}
277
+ onMouseEnter={[Function]}
278
+ onMouseLeave={[Function]}
279
+ onMouseUp={[Function]}
280
+ onTouchCancel={[Function]}
281
+ onTouchEnd={[Function]}
282
+ onTouchMove={[Function]}
283
+ onTouchStart={[Function]}
284
+ type="button"
272
285
  >
273
286
  <span
274
287
  className="root"
@@ -301,8 +314,21 @@ exports[`renders configurable product with options 1`] = `
301
314
  className="menuItem"
302
315
  >
303
316
  <button
317
+ aria-label="Remove from cart"
304
318
  className="button"
305
- onMouseDown={[MockFunction]}
319
+ onClick={[Function]}
320
+ onDragStart={[Function]}
321
+ onKeyDown={[Function]}
322
+ onKeyUp={[Function]}
323
+ onMouseDown={[Function]}
324
+ onMouseEnter={[Function]}
325
+ onMouseLeave={[Function]}
326
+ onMouseUp={[Function]}
327
+ onTouchCancel={[Function]}
328
+ onTouchEnd={[Function]}
329
+ onTouchMove={[Function]}
330
+ onTouchStart={[Function]}
331
+ type="button"
306
332
  >
307
333
  <span
308
334
  className="root"
@@ -601,8 +627,21 @@ exports[`renders out of stock product 1`] = `
601
627
  className="menuItem"
602
628
  >
603
629
  <button
630
+ aria-label="Remove from cart"
604
631
  className="button"
605
- onMouseDown={[MockFunction]}
632
+ onClick={[Function]}
633
+ onDragStart={[Function]}
634
+ onKeyDown={[Function]}
635
+ onKeyUp={[Function]}
636
+ onMouseDown={[Function]}
637
+ onMouseEnter={[Function]}
638
+ onMouseLeave={[Function]}
639
+ onMouseUp={[Function]}
640
+ onTouchCancel={[Function]}
641
+ onTouchEnd={[Function]}
642
+ onTouchMove={[Function]}
643
+ onTouchStart={[Function]}
644
+ type="button"
606
645
  >
607
646
  <span
608
647
  className="root"
@@ -901,8 +940,21 @@ exports[`renders simple product correctly 1`] = `
901
940
  className="menuItem"
902
941
  >
903
942
  <button
943
+ aria-label="Remove from cart"
904
944
  className="button"
905
- onMouseDown={[MockFunction]}
945
+ onClick={[Function]}
946
+ onDragStart={[Function]}
947
+ onKeyDown={[Function]}
948
+ onKeyUp={[Function]}
949
+ onMouseDown={[Function]}
950
+ onMouseEnter={[Function]}
951
+ onMouseLeave={[Function]}
952
+ onMouseUp={[Function]}
953
+ onTouchCancel={[Function]}
954
+ onTouchEnd={[Function]}
955
+ onTouchMove={[Function]}
956
+ onTouchStart={[Function]}
957
+ type="button"
906
958
  >
907
959
  <span
908
960
  className="root"
package/lib/components/LegacyMiniCart/__tests__/__snapshots__/section.spec.js.snap CHANGED
@@ -2,7 +2,22 @@
2
2
 
3
3
  exports[`it does not render an icon when not passed one 1`] = `
4
4
  <li>
5
- <button>
5
+ <button
6
+ aria-label="Unit Test Text"
7
+ onClick={[Function]}
8
+ onDragStart={[Function]}
9
+ onKeyDown={[Function]}
10
+ onKeyUp={[Function]}
11
+ onMouseDown={[Function]}
12
+ onMouseEnter={[Function]}
13
+ onMouseLeave={[Function]}
14
+ onMouseUp={[Function]}
15
+ onTouchCancel={[Function]}
16
+ onTouchEnd={[Function]}
17
+ onTouchMove={[Function]}
18
+ onTouchStart={[Function]}
19
+ type="button"
20
+ >
6
21
  <Icon
7
22
  classes={
8
23
  Object {
@@ -20,7 +35,22 @@ exports[`it does not render an icon when not passed one 1`] = `
20
35
 
21
36
  exports[`it does not render an icon when passed an invalid one 1`] = `
22
37
  <li>
23
- <button>
38
+ <button
39
+ aria-label="Unit Test Text"
40
+ onClick={[Function]}
41
+ onDragStart={[Function]}
42
+ onKeyDown={[Function]}
43
+ onKeyUp={[Function]}
44
+ onMouseDown={[Function]}
45
+ onMouseEnter={[Function]}
46
+ onMouseLeave={[Function]}
47
+ onMouseUp={[Function]}
48
+ onTouchCancel={[Function]}
49
+ onTouchEnd={[Function]}
50
+ onTouchMove={[Function]}
51
+ onTouchStart={[Function]}
52
+ type="button"
53
+ >
24
54
  <Icon
25
55
  classes={
26
56
  Object {
@@ -38,7 +68,22 @@ exports[`it does not render an icon when passed an invalid one 1`] = `
38
68
 
39
69
  exports[`it fills the icon when isFilled is true 1`] = `
40
70
  <li>
41
- <button>
71
+ <button
72
+ aria-label="Unit Test Text"
73
+ onClick={[Function]}
74
+ onDragStart={[Function]}
75
+ onKeyDown={[Function]}
76
+ onKeyUp={[Function]}
77
+ onMouseDown={[Function]}
78
+ onMouseEnter={[Function]}
79
+ onMouseLeave={[Function]}
80
+ onMouseUp={[Function]}
81
+ onTouchCancel={[Function]}
82
+ onTouchEnd={[Function]}
83
+ onTouchMove={[Function]}
84
+ onTouchStart={[Function]}
85
+ type="button"
86
+ >
42
87
  <Icon
43
88
  classes={
44
89
  Object {
@@ -66,7 +111,22 @@ exports[`it fills the icon when isFilled is true 1`] = `
66
111
 
67
112
  exports[`it renders an icon when passed a valid one 1`] = `
68
113
  <li>
69
- <button>
114
+ <button
115
+ aria-label="Unit Test Text"
116
+ onClick={[Function]}
117
+ onDragStart={[Function]}
118
+ onKeyDown={[Function]}
119
+ onKeyUp={[Function]}
120
+ onMouseDown={[Function]}
121
+ onMouseEnter={[Function]}
122
+ onMouseLeave={[Function]}
123
+ onMouseUp={[Function]}
124
+ onTouchCancel={[Function]}
125
+ onTouchEnd={[Function]}
126
+ onTouchMove={[Function]}
127
+ onTouchStart={[Function]}
128
+ type="button"
129
+ >
70
130
  <Icon
71
131
  classes={
72
132
  Object {
package/lib/components/LegacyMiniCart/section.js CHANGED
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React, { useRef } from 'react';
2
2
  import { bool, func, oneOf, shape, string } from 'prop-types';
3
3
  import {
4
4
  Edit2 as Edit2Icon,
@@ -10,6 +10,7 @@ import { useStyle } from '../../classify';
10
10
  import Icon from '../Icon';
11
11
 
12
12
  import defaultClasses from './section.module.css';
13
+ import { useButton } from 'react-aria';
13
14
 
14
15
  const icons = new Map()
15
16
  .set('Heart', HeartIcon)
@@ -30,6 +31,13 @@ const Section = props => {
30
31
  const iconClasses = { root: classes.icon };
31
32
  const iconSrc = icons.get(icon);
32
33
 
34
+ const buttonRef = useRef();
35
+
36
+ const { buttonProps: buttonAriaProps } = useButton(
37
+ { type: 'button', onPress: onClick, 'aria-label': text },
38
+ buttonRef
39
+ );
40
+
33
41
  if (isFilled) {
34
42
  iconClasses.root = classes.icon_filled;
35
43
  }
@@ -37,8 +45,9 @@ const Section = props => {
37
45
  return (
38
46
  <li className={classes.menuItem} {...restProps}>
39
47
  <button
48
+ ref={buttonRef}
40
49
  className={classes.button}
41
- onMouseDown={onClick}
50
+ {...buttonAriaProps}
42
51
  data-cy="LegacyMiniCart-Section-button"
43
52
  >
44
53
  <Icon classes={iconClasses} size={16} src={iconSrc} />
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@magento/venia-ui",
3
- "version": "9.6.0-alpha.1",
3
+ "version": "9.6.0-beta.1",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -80,7 +80,7 @@
80
80
  "peerDependencies": {
81
81
  "@apollo/client": "~3.5.0",
82
82
  "@magento/babel-preset-peregrine": "~1.2.1",
83
- "@magento/peregrine": "12.5.1-alpha.1",
83
+ "@magento/peregrine": "12.5.1-beta.1",
84
84
  "@magento/pwa-buildpack": "~11.4.0",
85
85
  "apollo-cache-persist": "~0.1.1",
86
86
  "braintree-web-drop-in": "~1.33.3",