@khanacademy/wonder-blocks-icon 4.1.5 → 5.0.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/dist/components/phosphor-icon.d.ts +2 -1
- package/dist/es/index.js +5 -3
- package/dist/index.js +5 -3
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,22 @@
|
|
|
1
1
|
# @khanacademy/wonder-blocks-icon
|
|
2
2
|
|
|
3
|
+
## 5.0.0
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- e6abdd17: Upgrade to React 18
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- Updated dependencies [e6abdd17]
|
|
12
|
+
- @khanacademy/wonder-blocks-core@8.0.0
|
|
13
|
+
|
|
14
|
+
## 4.2.0
|
|
15
|
+
|
|
16
|
+
### Minor Changes
|
|
17
|
+
|
|
18
|
+
- c1110599: defaults the role of PhosphorIcon to "img" when an aria-label is provided
|
|
19
|
+
|
|
3
20
|
## 4.1.5
|
|
4
21
|
|
|
5
22
|
### Patch Changes
|
|
@@ -41,7 +41,8 @@ export declare const PhosphorIcon: React.ForwardRefExoticComponent<Pick<AriaProp
|
|
|
41
41
|
*/
|
|
42
42
|
className?: string | undefined;
|
|
43
43
|
/**
|
|
44
|
-
* The role of the icon.
|
|
44
|
+
* The role of the icon. Will default to `img` if an `aria-label` is
|
|
45
|
+
* provided.
|
|
45
46
|
* @see https://www.w3.org/WAI/WCAG21/Techniques/aria/ARIA24
|
|
46
47
|
*/
|
|
47
48
|
role?: "img" | undefined;
|
package/dist/es/index.js
CHANGED
|
@@ -11,7 +11,7 @@ const viewportPixelsForSize = size => ({
|
|
|
11
11
|
xlarge: 96
|
|
12
12
|
})[size];
|
|
13
13
|
|
|
14
|
-
const _excluded = ["color", "icon", "size", "style", "testId", "className"];
|
|
14
|
+
const _excluded = ["color", "icon", "size", "style", "testId", "className", "role"];
|
|
15
15
|
const StyledIcon = addStyle("span");
|
|
16
16
|
const PhosphorIcon = React.forwardRef(function PhosphorIcon(props, ref) {
|
|
17
17
|
const {
|
|
@@ -20,7 +20,8 @@ const PhosphorIcon = React.forwardRef(function PhosphorIcon(props, ref) {
|
|
|
20
20
|
size = "small",
|
|
21
21
|
style,
|
|
22
22
|
testId,
|
|
23
|
-
className
|
|
23
|
+
className,
|
|
24
|
+
role
|
|
24
25
|
} = props,
|
|
25
26
|
sharedProps = _objectWithoutPropertiesLoose(props, _excluded);
|
|
26
27
|
const pixelSize = viewportPixelsForSize(size);
|
|
@@ -32,7 +33,8 @@ const PhosphorIcon = React.forwardRef(function PhosphorIcon(props, ref) {
|
|
|
32
33
|
maskImage: `url(${icon})`
|
|
33
34
|
}, style],
|
|
34
35
|
"data-testid": testId,
|
|
35
|
-
ref: ref
|
|
36
|
+
ref: ref,
|
|
37
|
+
role: (role != null ? role : sharedProps["aria-label"]) ? "img" : undefined
|
|
36
38
|
}));
|
|
37
39
|
});
|
|
38
40
|
const dynamicStyles = {};
|
package/dist/index.js
CHANGED
|
@@ -39,7 +39,7 @@ const viewportPixelsForSize = size => ({
|
|
|
39
39
|
xlarge: 96
|
|
40
40
|
})[size];
|
|
41
41
|
|
|
42
|
-
const _excluded = ["color", "icon", "size", "style", "testId", "className"];
|
|
42
|
+
const _excluded = ["color", "icon", "size", "style", "testId", "className", "role"];
|
|
43
43
|
const StyledIcon = wonderBlocksCore.addStyle("span");
|
|
44
44
|
const PhosphorIcon = React__namespace.forwardRef(function PhosphorIcon(props, ref) {
|
|
45
45
|
const {
|
|
@@ -48,7 +48,8 @@ const PhosphorIcon = React__namespace.forwardRef(function PhosphorIcon(props, re
|
|
|
48
48
|
size = "small",
|
|
49
49
|
style,
|
|
50
50
|
testId,
|
|
51
|
-
className
|
|
51
|
+
className,
|
|
52
|
+
role
|
|
52
53
|
} = props,
|
|
53
54
|
sharedProps = _objectWithoutPropertiesLoose__default["default"](props, _excluded);
|
|
54
55
|
const pixelSize = viewportPixelsForSize(size);
|
|
@@ -60,7 +61,8 @@ const PhosphorIcon = React__namespace.forwardRef(function PhosphorIcon(props, re
|
|
|
60
61
|
maskImage: `url(${icon})`
|
|
61
62
|
}, style],
|
|
62
63
|
"data-testid": testId,
|
|
63
|
-
ref: ref
|
|
64
|
+
ref: ref,
|
|
65
|
+
role: (role != null ? role : sharedProps["aria-label"]) ? "img" : undefined
|
|
64
66
|
}));
|
|
65
67
|
});
|
|
66
68
|
const dynamicStyles = {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@khanacademy/wonder-blocks-icon",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "5.0.0",
|
|
4
4
|
"design": "v1",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -16,15 +16,15 @@
|
|
|
16
16
|
"license": "MIT",
|
|
17
17
|
"dependencies": {
|
|
18
18
|
"@babel/runtime": "^7.18.6",
|
|
19
|
-
"@khanacademy/wonder-blocks-core": "^
|
|
19
|
+
"@khanacademy/wonder-blocks-core": "^8.0.0"
|
|
20
20
|
},
|
|
21
21
|
"devDependencies": {
|
|
22
22
|
"@khanacademy/wonder-stuff-core": "^1.4.2",
|
|
23
|
-
"@khanacademy/wb-dev-build-settings": "^
|
|
23
|
+
"@khanacademy/wb-dev-build-settings": "^2.0.0"
|
|
24
24
|
},
|
|
25
25
|
"peerDependencies": {
|
|
26
26
|
"@phosphor-icons/core": "^2.0.2",
|
|
27
27
|
"aphrodite": "^1.2.5",
|
|
28
|
-
"react": "
|
|
28
|
+
"react": "18.2.0"
|
|
29
29
|
}
|
|
30
30
|
}
|