@khanacademy/wonder-blocks-link 6.1.4 → 6.1.5
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 +11 -0
- package/dist/es/index.js +3 -32
- package/dist/index.js +36 -62
- package/package.json +6 -6
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,16 @@
|
|
|
1
1
|
# @khanacademy/wonder-blocks-link
|
|
2
2
|
|
|
3
|
+
## 6.1.5
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 559e82d5: Update to build tooling, generating smaller output
|
|
8
|
+
- Updated dependencies [559e82d5]
|
|
9
|
+
- @khanacademy/wonder-blocks-clickable@4.2.5
|
|
10
|
+
- @khanacademy/wonder-blocks-core@6.4.3
|
|
11
|
+
- @khanacademy/wonder-blocks-icon@4.1.3
|
|
12
|
+
- @khanacademy/wonder-blocks-tokens@1.3.1
|
|
13
|
+
|
|
3
14
|
## 6.1.4
|
|
4
15
|
|
|
5
16
|
### Patch Changes
|
package/dist/es/index.js
CHANGED
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
|
|
2
|
+
import _extends from '@babel/runtime/helpers/extends';
|
|
3
|
+
import _objectWithoutPropertiesLoose from '@babel/runtime/helpers/objectWithoutPropertiesLoose';
|
|
1
4
|
import * as React from 'react';
|
|
2
5
|
import { __RouterContext } from 'react-router';
|
|
3
6
|
import { isClientSideUrl, getClickableBehavior } from '@khanacademy/wonder-blocks-clickable';
|
|
@@ -8,38 +11,6 @@ import { spacing, mix, fade, color } from '@khanacademy/wonder-blocks-tokens';
|
|
|
8
11
|
import { PhosphorIcon } from '@khanacademy/wonder-blocks-icon';
|
|
9
12
|
import externalLinkIcon from '@phosphor-icons/core/bold/arrow-square-out-bold.svg';
|
|
10
13
|
|
|
11
|
-
function _objectDestructuringEmpty(obj) {
|
|
12
|
-
if (obj == null) throw new TypeError("Cannot destructure " + obj);
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
function _extends() {
|
|
16
|
-
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
17
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
18
|
-
var source = arguments[i];
|
|
19
|
-
for (var key in source) {
|
|
20
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
21
|
-
target[key] = source[key];
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
return target;
|
|
26
|
-
};
|
|
27
|
-
return _extends.apply(this, arguments);
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
31
|
-
if (source == null) return {};
|
|
32
|
-
var target = {};
|
|
33
|
-
var sourceKeys = Object.keys(source);
|
|
34
|
-
var key, i;
|
|
35
|
-
for (i = 0; i < sourceKeys.length; i++) {
|
|
36
|
-
key = sourceKeys[i];
|
|
37
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
38
|
-
target[key] = source[key];
|
|
39
|
-
}
|
|
40
|
-
return target;
|
|
41
|
-
}
|
|
42
|
-
|
|
43
14
|
const _excluded$1 = ["children", "skipClientNav", "focused", "hovered", "href", "inline", "kind", "light", "visitable", "pressed", "style", "testId", "waiting", "target", "startIcon", "endIcon"];
|
|
44
15
|
const StyledAnchor = addStyle("a");
|
|
45
16
|
const StyledLink = addStyle(Link$1);
|
package/dist/index.js
CHANGED
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
var _objectDestructuringEmpty = require('@babel/runtime/helpers/objectDestructuringEmpty');
|
|
4
|
+
var _extends = require('@babel/runtime/helpers/extends');
|
|
5
|
+
var _objectWithoutPropertiesLoose = require('@babel/runtime/helpers/objectWithoutPropertiesLoose');
|
|
3
6
|
var React = require('react');
|
|
4
7
|
var reactRouter = require('react-router');
|
|
5
8
|
var wonderBlocksClickable = require('@khanacademy/wonder-blocks-clickable');
|
|
@@ -13,58 +16,29 @@ var externalLinkIcon = require('@phosphor-icons/core/bold/arrow-square-out-bold.
|
|
|
13
16
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
14
17
|
|
|
15
18
|
function _interopNamespace(e) {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
19
|
+
if (e && e.__esModule) return e;
|
|
20
|
+
var n = Object.create(null);
|
|
21
|
+
if (e) {
|
|
22
|
+
Object.keys(e).forEach(function (k) {
|
|
23
|
+
if (k !== 'default') {
|
|
24
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
25
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
26
|
+
enumerable: true,
|
|
27
|
+
get: function () { return e[k]; }
|
|
28
|
+
});
|
|
29
|
+
}
|
|
25
30
|
});
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
n["default"] = e;
|
|
30
|
-
return Object.freeze(n);
|
|
31
|
+
}
|
|
32
|
+
n["default"] = e;
|
|
33
|
+
return Object.freeze(n);
|
|
31
34
|
}
|
|
32
35
|
|
|
36
|
+
var _objectDestructuringEmpty__default = /*#__PURE__*/_interopDefaultLegacy(_objectDestructuringEmpty);
|
|
37
|
+
var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
|
|
38
|
+
var _objectWithoutPropertiesLoose__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutPropertiesLoose);
|
|
33
39
|
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
34
40
|
var externalLinkIcon__default = /*#__PURE__*/_interopDefaultLegacy(externalLinkIcon);
|
|
35
41
|
|
|
36
|
-
function _objectDestructuringEmpty(obj) {
|
|
37
|
-
if (obj == null) throw new TypeError("Cannot destructure " + obj);
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
function _extends() {
|
|
41
|
-
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
42
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
43
|
-
var source = arguments[i];
|
|
44
|
-
for (var key in source) {
|
|
45
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
46
|
-
target[key] = source[key];
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
return target;
|
|
51
|
-
};
|
|
52
|
-
return _extends.apply(this, arguments);
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
56
|
-
if (source == null) return {};
|
|
57
|
-
var target = {};
|
|
58
|
-
var sourceKeys = Object.keys(source);
|
|
59
|
-
var key, i;
|
|
60
|
-
for (i = 0; i < sourceKeys.length; i++) {
|
|
61
|
-
key = sourceKeys[i];
|
|
62
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
63
|
-
target[key] = source[key];
|
|
64
|
-
}
|
|
65
|
-
return target;
|
|
66
|
-
}
|
|
67
|
-
|
|
68
42
|
const _excluded$1 = ["children", "skipClientNav", "focused", "hovered", "href", "inline", "kind", "light", "visitable", "pressed", "style", "testId", "waiting", "target", "startIcon", "endIcon"];
|
|
69
43
|
const StyledAnchor = wonderBlocksCore.addStyle("a");
|
|
70
44
|
const StyledLink = wonderBlocksCore.addStyle(reactRouterDom.Link);
|
|
@@ -87,11 +61,11 @@ const LinkCore = React__namespace.forwardRef(function LinkCore(props, ref) {
|
|
|
87
61
|
startIcon,
|
|
88
62
|
endIcon
|
|
89
63
|
} = props,
|
|
90
|
-
restProps =
|
|
64
|
+
restProps = _objectWithoutPropertiesLoose__default["default"](props, _excluded$1);
|
|
91
65
|
const linkStyles = _generateStyles(inline, kind, light, visitable);
|
|
92
66
|
const restingStyles = inline ? linkStyles.restingInline : linkStyles.resting;
|
|
93
67
|
const defaultStyles = [sharedStyles.shared, restingStyles, pressed && linkStyles.active, !pressed && hovered && linkStyles.hover, !pressed && focused && linkStyles.focus];
|
|
94
|
-
const commonProps =
|
|
68
|
+
const commonProps = _extends__default["default"]({
|
|
95
69
|
"data-testid": testId,
|
|
96
70
|
style: [defaultStyles, style],
|
|
97
71
|
target
|
|
@@ -107,24 +81,24 @@ const LinkCore = React__namespace.forwardRef(function LinkCore(props, ref) {
|
|
|
107
81
|
let startIconElement;
|
|
108
82
|
let endIconElement;
|
|
109
83
|
if (startIcon) {
|
|
110
|
-
startIconElement = React__namespace.cloneElement(startIcon,
|
|
84
|
+
startIconElement = React__namespace.cloneElement(startIcon, _extends__default["default"]({
|
|
111
85
|
style: [linkContentStyles.startIcon, linkContentStyles.centered],
|
|
112
86
|
testId: "start-icon",
|
|
113
87
|
"aria-hidden": "true"
|
|
114
88
|
}, startIcon.props));
|
|
115
89
|
}
|
|
116
90
|
if (endIcon) {
|
|
117
|
-
endIconElement = React__namespace.cloneElement(endIcon,
|
|
91
|
+
endIconElement = React__namespace.cloneElement(endIcon, _extends__default["default"]({
|
|
118
92
|
style: [linkContentStyles.endIcon, linkContentStyles.centered],
|
|
119
93
|
testId: "end-icon",
|
|
120
94
|
"aria-hidden": "true"
|
|
121
95
|
}, endIcon.props));
|
|
122
96
|
}
|
|
123
97
|
const linkContent = React__namespace.createElement(React__namespace.Fragment, null, startIcon && startIconElement, children, endIcon ? endIconElement : isExternalLink && target === "_blank" && externalIcon);
|
|
124
|
-
return router && !skipClientNav && wonderBlocksClickable.isClientSideUrl(href) ? React__namespace.createElement(StyledLink,
|
|
98
|
+
return router && !skipClientNav && wonderBlocksClickable.isClientSideUrl(href) ? React__namespace.createElement(StyledLink, _extends__default["default"]({}, commonProps, {
|
|
125
99
|
to: href,
|
|
126
100
|
ref: ref
|
|
127
|
-
}), linkContent) : React__namespace.createElement(StyledAnchor,
|
|
101
|
+
}), linkContent) : React__namespace.createElement(StyledAnchor, _extends__default["default"]({}, commonProps, {
|
|
128
102
|
href: href,
|
|
129
103
|
ref: ref
|
|
130
104
|
}), linkContent);
|
|
@@ -192,26 +166,26 @@ const _generateStyles = (inline, kind, light, visitable) => {
|
|
|
192
166
|
}
|
|
193
167
|
} : Object.freeze({});
|
|
194
168
|
const newStyles = {
|
|
195
|
-
resting:
|
|
169
|
+
resting: _extends__default["default"]({
|
|
196
170
|
color: defaultTextColor
|
|
197
171
|
}, defaultVisited),
|
|
198
|
-
restingInline:
|
|
172
|
+
restingInline: _extends__default["default"]({
|
|
199
173
|
color: defaultTextColor,
|
|
200
174
|
textDecoration: "underline currentcolor solid",
|
|
201
175
|
textUnderlineOffset: 2
|
|
202
176
|
}, defaultVisited),
|
|
203
|
-
hover:
|
|
177
|
+
hover: _extends__default["default"]({
|
|
204
178
|
textDecoration: "underline currentcolor solid",
|
|
205
179
|
color: defaultTextColor
|
|
206
180
|
}, defaultVisited),
|
|
207
181
|
focus: {
|
|
208
|
-
":focus-visible":
|
|
182
|
+
":focus-visible": _extends__default["default"]({
|
|
209
183
|
color: defaultTextColor,
|
|
210
184
|
outline: `1px solid ${light ? white : blue}`,
|
|
211
185
|
borderRadius: 3
|
|
212
186
|
}, defaultVisited)
|
|
213
187
|
},
|
|
214
|
-
active:
|
|
188
|
+
active: _extends__default["default"]({
|
|
215
189
|
color: activeColor,
|
|
216
190
|
textDecoration: "underline currentcolor solid"
|
|
217
191
|
}, activeVisited)
|
|
@@ -238,7 +212,7 @@ const Link = React__namespace.forwardRef(function Link(props, ref) {
|
|
|
238
212
|
light = false,
|
|
239
213
|
visitable = false
|
|
240
214
|
} = props,
|
|
241
|
-
sharedProps =
|
|
215
|
+
sharedProps = _objectWithoutPropertiesLoose__default["default"](props, _excluded);
|
|
242
216
|
const renderClickableBehavior = router => {
|
|
243
217
|
const ClickableBehavior = wonderBlocksClickable.getClickableBehavior(href, skipClientNav, router);
|
|
244
218
|
if (beforeNav) {
|
|
@@ -252,8 +226,8 @@ const Link = React__namespace.forwardRef(function Link(props, ref) {
|
|
|
252
226
|
onKeyDown: onKeyDown,
|
|
253
227
|
onKeyUp: onKeyUp
|
|
254
228
|
}, (state, _ref) => {
|
|
255
|
-
let childrenProps =
|
|
256
|
-
return React__namespace.createElement(LinkCore,
|
|
229
|
+
let childrenProps = _extends__default["default"]({}, (_objectDestructuringEmpty__default["default"](_ref), _ref));
|
|
230
|
+
return React__namespace.createElement(LinkCore, _extends__default["default"]({}, sharedProps, state, childrenProps, {
|
|
257
231
|
skipClientNav: skipClientNav,
|
|
258
232
|
href: href,
|
|
259
233
|
target: target,
|
|
@@ -276,8 +250,8 @@ const Link = React__namespace.forwardRef(function Link(props, ref) {
|
|
|
276
250
|
onKeyDown: onKeyDown,
|
|
277
251
|
onKeyUp: onKeyUp
|
|
278
252
|
}, (state, _ref2) => {
|
|
279
|
-
let childrenProps =
|
|
280
|
-
return React__namespace.createElement(LinkCore,
|
|
253
|
+
let childrenProps = _extends__default["default"]({}, (_objectDestructuringEmpty__default["default"](_ref2), _ref2));
|
|
254
|
+
return React__namespace.createElement(LinkCore, _extends__default["default"]({}, sharedProps, state, childrenProps, {
|
|
281
255
|
skipClientNav: skipClientNav,
|
|
282
256
|
href: href,
|
|
283
257
|
target: target,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@khanacademy/wonder-blocks-link",
|
|
3
|
-
"version": "6.1.
|
|
3
|
+
"version": "6.1.5",
|
|
4
4
|
"design": "v1",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -16,10 +16,10 @@
|
|
|
16
16
|
"license": "MIT",
|
|
17
17
|
"dependencies": {
|
|
18
18
|
"@babel/runtime": "^7.18.6",
|
|
19
|
-
"@khanacademy/wonder-blocks-clickable": "^4.2.
|
|
20
|
-
"@khanacademy/wonder-blocks-core": "^6.4.
|
|
21
|
-
"@khanacademy/wonder-blocks-icon": "^4.1.
|
|
22
|
-
"@khanacademy/wonder-blocks-tokens": "^1.3.
|
|
19
|
+
"@khanacademy/wonder-blocks-clickable": "^4.2.5",
|
|
20
|
+
"@khanacademy/wonder-blocks-core": "^6.4.3",
|
|
21
|
+
"@khanacademy/wonder-blocks-icon": "^4.1.3",
|
|
22
|
+
"@khanacademy/wonder-blocks-tokens": "^1.3.1"
|
|
23
23
|
},
|
|
24
24
|
"peerDependencies": {
|
|
25
25
|
"aphrodite": "^1.2.5",
|
|
@@ -28,6 +28,6 @@
|
|
|
28
28
|
"react-router-dom": "5.3.0"
|
|
29
29
|
},
|
|
30
30
|
"devDependencies": {
|
|
31
|
-
"@khanacademy/wb-dev-build-settings": "^1.0.
|
|
31
|
+
"@khanacademy/wb-dev-build-settings": "^1.0.1"
|
|
32
32
|
}
|
|
33
33
|
}
|