@khanacademy/wonder-blocks-clickable 6.1.0 → 6.1.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.
- package/CHANGELOG.md +9 -0
- package/dist/es/index.js +12 -12
- package/dist/index.js +29 -24
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
# @khanacademy/wonder-blocks-clickable
|
|
2
2
|
|
|
3
|
+
## 6.1.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- ee8d95a: Rollback rollup version from v4 to v2 to prevent an issue with CJS builds in unit tests
|
|
8
|
+
- Updated dependencies [ee8d95a]
|
|
9
|
+
- @khanacademy/wonder-blocks-core@12.1.1
|
|
10
|
+
- @khanacademy/wonder-blocks-tokens@4.2.1
|
|
11
|
+
|
|
3
12
|
## 6.1.0
|
|
4
13
|
|
|
5
14
|
### Minor Changes
|
package/dist/es/index.js
CHANGED
|
@@ -33,16 +33,16 @@ const getAppropriateTriggersForRole = role => {
|
|
|
33
33
|
}
|
|
34
34
|
};
|
|
35
35
|
const disabledHandlers = {
|
|
36
|
-
onClick: () =>
|
|
37
|
-
onMouseEnter: () =>
|
|
38
|
-
onMouseLeave: () =>
|
|
39
|
-
onMouseDown: () =>
|
|
40
|
-
onMouseUp: () =>
|
|
41
|
-
onTouchStart: () =>
|
|
42
|
-
onTouchEnd: () =>
|
|
43
|
-
onTouchCancel: () =>
|
|
44
|
-
onKeyDown: () =>
|
|
45
|
-
onKeyUp: () =>
|
|
36
|
+
onClick: () => void 0,
|
|
37
|
+
onMouseEnter: () => void 0,
|
|
38
|
+
onMouseLeave: () => void 0,
|
|
39
|
+
onMouseDown: () => void 0,
|
|
40
|
+
onMouseUp: () => void 0,
|
|
41
|
+
onTouchStart: () => void 0,
|
|
42
|
+
onTouchEnd: () => void 0,
|
|
43
|
+
onTouchCancel: () => void 0,
|
|
44
|
+
onKeyDown: () => void 0,
|
|
45
|
+
onKeyUp: () => void 0
|
|
46
46
|
};
|
|
47
47
|
const startState = {
|
|
48
48
|
hovered: false,
|
|
@@ -62,8 +62,8 @@ class ClickableBehavior extends React.Component {
|
|
|
62
62
|
}
|
|
63
63
|
constructor(props) {
|
|
64
64
|
super(props);
|
|
65
|
-
this.waitingForClick =
|
|
66
|
-
this.enterClick =
|
|
65
|
+
this.waitingForClick = void 0;
|
|
66
|
+
this.enterClick = void 0;
|
|
67
67
|
this.handleClick = e => {
|
|
68
68
|
const {
|
|
69
69
|
onClick = undefined,
|
package/dist/index.js
CHANGED
|
@@ -11,7 +11,10 @@ var reactRouter = require('react-router');
|
|
|
11
11
|
var wonderBlocksCore = require('@khanacademy/wonder-blocks-core');
|
|
12
12
|
var wonderBlocksTokens = require('@khanacademy/wonder-blocks-tokens');
|
|
13
13
|
|
|
14
|
-
function
|
|
14
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
15
|
+
|
|
16
|
+
function _interopNamespace(e) {
|
|
17
|
+
if (e && e.__esModule) return e;
|
|
15
18
|
var n = Object.create(null);
|
|
16
19
|
if (e) {
|
|
17
20
|
Object.keys(e).forEach(function (k) {
|
|
@@ -24,11 +27,13 @@ function _interopNamespaceDefault(e) {
|
|
|
24
27
|
}
|
|
25
28
|
});
|
|
26
29
|
}
|
|
27
|
-
n
|
|
30
|
+
n["default"] = e;
|
|
28
31
|
return Object.freeze(n);
|
|
29
32
|
}
|
|
30
33
|
|
|
31
|
-
var
|
|
34
|
+
var _objectWithoutPropertiesLoose__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutPropertiesLoose);
|
|
35
|
+
var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
|
|
36
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
32
37
|
|
|
33
38
|
const getAppropriateTriggersForRole = role => {
|
|
34
39
|
switch (role) {
|
|
@@ -56,16 +61,16 @@ const getAppropriateTriggersForRole = role => {
|
|
|
56
61
|
}
|
|
57
62
|
};
|
|
58
63
|
const disabledHandlers = {
|
|
59
|
-
onClick: () =>
|
|
60
|
-
onMouseEnter: () =>
|
|
61
|
-
onMouseLeave: () =>
|
|
62
|
-
onMouseDown: () =>
|
|
63
|
-
onMouseUp: () =>
|
|
64
|
-
onTouchStart: () =>
|
|
65
|
-
onTouchEnd: () =>
|
|
66
|
-
onTouchCancel: () =>
|
|
67
|
-
onKeyDown: () =>
|
|
68
|
-
onKeyUp: () =>
|
|
64
|
+
onClick: () => void 0,
|
|
65
|
+
onMouseEnter: () => void 0,
|
|
66
|
+
onMouseLeave: () => void 0,
|
|
67
|
+
onMouseDown: () => void 0,
|
|
68
|
+
onMouseUp: () => void 0,
|
|
69
|
+
onTouchStart: () => void 0,
|
|
70
|
+
onTouchEnd: () => void 0,
|
|
71
|
+
onTouchCancel: () => void 0,
|
|
72
|
+
onKeyDown: () => void 0,
|
|
73
|
+
onKeyUp: () => void 0
|
|
69
74
|
};
|
|
70
75
|
const startState = {
|
|
71
76
|
hovered: false,
|
|
@@ -76,7 +81,7 @@ const startState = {
|
|
|
76
81
|
class ClickableBehavior extends React__namespace.Component {
|
|
77
82
|
static getDerivedStateFromProps(props, state) {
|
|
78
83
|
if (props.disabled) {
|
|
79
|
-
return
|
|
84
|
+
return _extends__default["default"]({}, startState, {
|
|
80
85
|
focused: state.focused
|
|
81
86
|
});
|
|
82
87
|
} else {
|
|
@@ -85,8 +90,8 @@ class ClickableBehavior extends React__namespace.Component {
|
|
|
85
90
|
}
|
|
86
91
|
constructor(props) {
|
|
87
92
|
super(props);
|
|
88
|
-
this.waitingForClick =
|
|
89
|
-
this.enterClick =
|
|
93
|
+
this.waitingForClick = void 0;
|
|
94
|
+
this.enterClick = void 0;
|
|
90
95
|
this.handleClick = e => {
|
|
91
96
|
const {
|
|
92
97
|
onClick = undefined,
|
|
@@ -325,7 +330,7 @@ class ClickableBehavior extends React__namespace.Component {
|
|
|
325
330
|
}
|
|
326
331
|
render() {
|
|
327
332
|
const rel = this.props.rel || (this.props.target === "_blank" ? "noopener noreferrer" : undefined);
|
|
328
|
-
const childrenProps = this.props.disabled ?
|
|
333
|
+
const childrenProps = this.props.disabled ? _extends__default["default"]({}, disabledHandlers, {
|
|
329
334
|
onFocus: this.handleFocus,
|
|
330
335
|
onBlur: this.handleBlur,
|
|
331
336
|
tabIndex: this.props.tabIndex,
|
|
@@ -380,7 +385,7 @@ const Clickable = React__namespace.forwardRef(function Clickable(props, ref) {
|
|
|
380
385
|
const activeHref = props.href && !props.disabled;
|
|
381
386
|
const useClient = router && !props.skipClientNav && isClientSideUrl(props.href || "");
|
|
382
387
|
if (activeHref && useClient && props.href) {
|
|
383
|
-
return React__namespace.createElement(StyledLink,
|
|
388
|
+
return React__namespace.createElement(StyledLink, _extends__default["default"]({}, commonProps, {
|
|
384
389
|
to: props.href,
|
|
385
390
|
role: props.role,
|
|
386
391
|
target: props.target || undefined,
|
|
@@ -388,7 +393,7 @@ const Clickable = React__namespace.forwardRef(function Clickable(props, ref) {
|
|
|
388
393
|
ref: ref
|
|
389
394
|
}), props.children(clickableState));
|
|
390
395
|
} else if (activeHref && !useClient) {
|
|
391
|
-
return React__namespace.createElement(StyledA,
|
|
396
|
+
return React__namespace.createElement(StyledA, _extends__default["default"]({}, commonProps, {
|
|
392
397
|
href: props.href,
|
|
393
398
|
role: props.role,
|
|
394
399
|
target: props.target || undefined,
|
|
@@ -396,7 +401,7 @@ const Clickable = React__namespace.forwardRef(function Clickable(props, ref) {
|
|
|
396
401
|
ref: ref
|
|
397
402
|
}), props.children(clickableState));
|
|
398
403
|
} else {
|
|
399
|
-
return React__namespace.createElement(StyledButton,
|
|
404
|
+
return React__namespace.createElement(StyledButton, _extends__default["default"]({}, commonProps, {
|
|
400
405
|
type: "button",
|
|
401
406
|
"aria-disabled": props.disabled,
|
|
402
407
|
ref: ref
|
|
@@ -423,7 +428,7 @@ const Clickable = React__namespace.forwardRef(function Clickable(props, ref) {
|
|
|
423
428
|
disabled,
|
|
424
429
|
tabIndex
|
|
425
430
|
} = props,
|
|
426
|
-
restProps =
|
|
431
|
+
restProps = _objectWithoutPropertiesLoose__default["default"](props, _excluded);
|
|
427
432
|
const ClickableBehavior = getClickableBehavior(href, skipClientNav, router);
|
|
428
433
|
const getStyle = state => [styles.reset, styles.link, !hideDefaultFocusRing && state.focused && (light ? styles.focusedLight : styles.focused), disabled && styles.disabled, style];
|
|
429
434
|
if (beforeNav) {
|
|
@@ -439,7 +444,7 @@ const Clickable = React__namespace.forwardRef(function Clickable(props, ref) {
|
|
|
439
444
|
onMouseUp: onMouseUp,
|
|
440
445
|
disabled: disabled,
|
|
441
446
|
tabIndex: tabIndex
|
|
442
|
-
}, (state, childrenProps) => getCorrectTag(state, router,
|
|
447
|
+
}, (state, childrenProps) => getCorrectTag(state, router, _extends__default["default"]({}, restProps, {
|
|
443
448
|
"data-testid": testId,
|
|
444
449
|
style: getStyle(state)
|
|
445
450
|
}, childrenProps)));
|
|
@@ -456,7 +461,7 @@ const Clickable = React__namespace.forwardRef(function Clickable(props, ref) {
|
|
|
456
461
|
target: target,
|
|
457
462
|
disabled: disabled,
|
|
458
463
|
tabIndex: tabIndex
|
|
459
|
-
}, (state, childrenProps) => getCorrectTag(state, router,
|
|
464
|
+
}, (state, childrenProps) => getCorrectTag(state, router, _extends__default["default"]({}, restProps, {
|
|
460
465
|
"data-testid": testId,
|
|
461
466
|
style: getStyle(state)
|
|
462
467
|
}, childrenProps)));
|
|
@@ -511,6 +516,6 @@ const styles = aphrodite.StyleSheet.create({
|
|
|
511
516
|
});
|
|
512
517
|
|
|
513
518
|
exports.ClickableBehavior = ClickableBehavior;
|
|
514
|
-
exports
|
|
519
|
+
exports["default"] = Clickable;
|
|
515
520
|
exports.getClickableBehavior = getClickableBehavior;
|
|
516
521
|
exports.isClientSideUrl = isClientSideUrl;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@khanacademy/wonder-blocks-clickable",
|
|
3
|
-
"version": "6.1.
|
|
3
|
+
"version": "6.1.1",
|
|
4
4
|
"design": "v1",
|
|
5
5
|
"description": "Clickable component for Wonder-Blocks.",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -13,8 +13,8 @@
|
|
|
13
13
|
},
|
|
14
14
|
"dependencies": {
|
|
15
15
|
"@babel/runtime": "^7.24.5",
|
|
16
|
-
"@khanacademy/wonder-blocks-core": "12.1.
|
|
17
|
-
"@khanacademy/wonder-blocks-tokens": "4.2.
|
|
16
|
+
"@khanacademy/wonder-blocks-core": "12.1.1",
|
|
17
|
+
"@khanacademy/wonder-blocks-tokens": "4.2.1"
|
|
18
18
|
},
|
|
19
19
|
"peerDependencies": {
|
|
20
20
|
"aphrodite": "^1.2.5",
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
"react-router-dom": "5.3.4"
|
|
25
25
|
},
|
|
26
26
|
"devDependencies": {
|
|
27
|
-
"@khanacademy/wb-dev-build-settings": "2.1.
|
|
27
|
+
"@khanacademy/wb-dev-build-settings": "2.1.1"
|
|
28
28
|
},
|
|
29
29
|
"scripts": {
|
|
30
30
|
"test": "echo \"Error: no test specified\" && exit 1"
|