@ably/ui 13.1.0 → 13.2.2-dev.78815ed

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.
@@ -0,0 +1,16 @@
1
+ @layer components {
2
+ .ui-featured-link {
3
+ @apply font-sans font-medium block;
4
+ @apply text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus;
5
+ }
6
+
7
+ .ui-featured-link:hover svg {
8
+ @apply left-0;
9
+ }
10
+
11
+ .ui-featured-link-icon {
12
+ transition: left 100ms ease-in-out;
13
+ @apply align-middle ml-8 relative -top-1 -left-4;
14
+ }
15
+ }
16
+
@@ -158,9 +158,29 @@ __webpack_require__.r(__webpack_exports__);
158
158
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
159
159
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
160
160
  /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9008);
161
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
162
+
163
+
164
+
165
+ // When generating links with target=_blank, we only add `noreferrer` to
166
+ // links that don't start with `/`, so we can continue tracking referrers
167
+ // across our own domains
161
168
 
169
+ var buildTargetAndRel = function buildTargetAndRel(url, newWindow) {
170
+ var props = {};
162
171
 
172
+ if (newWindow) {
173
+ props.target = "_blank";
163
174
 
175
+ if (url.startsWith("/") && !url.startsWith("//")) {
176
+ props.rel = "noopener";
177
+ } else {
178
+ props.rel = "noopenner noreferrer";
179
+ }
180
+ }
181
+
182
+ return props;
183
+ };
164
184
 
165
185
  var FeaturedLink = function FeaturedLink(_ref) {
166
186
  var url = _ref.url,
@@ -174,14 +194,21 @@ var FeaturedLink = function FeaturedLink(_ref) {
174
194
  reverse = _ref$reverse === void 0 ? false : _ref$reverse,
175
195
  _ref$additionalCSS = _ref.additionalCSS,
176
196
  additionalCSS = _ref$additionalCSS === void 0 ? "" : _ref$additionalCSS,
197
+ _ref$newWindow = _ref.newWindow,
198
+ newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
199
+ _ref$onClick = _ref.onClick,
200
+ onClick = _ref$onClick === void 0 ? undefined : _ref$onClick,
177
201
  children = _ref.children;
178
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
202
+ var targetAndRel = buildTargetAndRel(url, newWindow);
203
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", _extends({
179
204
  href: url,
180
205
  className: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-".concat(textSize, " ").concat(flush ? "" : "py-8", " ").concat(additionalCSS),
181
206
  style: {
182
207
  "--featured-link-icon-size": "var(".concat(textSize.replace("text", "--fs"), ")")
183
208
  }
184
- }, reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
209
+ }, targetAndRel, {
210
+ onClick: onClick
211
+ }), reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
185
212
  name: "icon-gui-link-arrow",
186
213
  size: "calc(var(--featured-link-icon-size) * 1.25)",
187
214
  color: iconColor,
@@ -201,7 +228,9 @@ FeaturedLink.propTypes = {
201
228
  iconColor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
202
229
  flush: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
203
230
  reverse: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
204
- additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
231
+ additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
232
+ newWindow: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
233
+ onClick: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
205
234
  };
206
235
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FeaturedLink);
207
236
  })();
package/core/Meganav.jsx CHANGED
@@ -104,9 +104,29 @@ var ConnectStateWrapper = function ConnectStateWrapper(Component, selectors) {
104
104
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
105
105
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
106
106
  /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9008);
107
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
108
+
109
+
107
110
 
111
+ // When generating links with target=_blank, we only add `noreferrer` to
112
+ // links that don't start with `/`, so we can continue tracking referrers
113
+ // across our own domains
108
114
 
115
+ var buildTargetAndRel = function buildTargetAndRel(url, newWindow) {
116
+ var props = {};
117
+
118
+ if (newWindow) {
119
+ props.target = "_blank";
120
+
121
+ if (url.startsWith("/") && !url.startsWith("//")) {
122
+ props.rel = "noopener";
123
+ } else {
124
+ props.rel = "noopenner noreferrer";
125
+ }
126
+ }
109
127
 
128
+ return props;
129
+ };
110
130
 
111
131
  var FeaturedLink = function FeaturedLink(_ref) {
112
132
  var url = _ref.url,
@@ -120,14 +140,21 @@ var FeaturedLink = function FeaturedLink(_ref) {
120
140
  reverse = _ref$reverse === void 0 ? false : _ref$reverse,
121
141
  _ref$additionalCSS = _ref.additionalCSS,
122
142
  additionalCSS = _ref$additionalCSS === void 0 ? "" : _ref$additionalCSS,
143
+ _ref$newWindow = _ref.newWindow,
144
+ newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
145
+ _ref$onClick = _ref.onClick,
146
+ onClick = _ref$onClick === void 0 ? undefined : _ref$onClick,
123
147
  children = _ref.children;
124
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
148
+ var targetAndRel = buildTargetAndRel(url, newWindow);
149
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", _extends({
125
150
  href: url,
126
151
  className: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-".concat(textSize, " ").concat(flush ? "" : "py-8", " ").concat(additionalCSS),
127
152
  style: {
128
153
  "--featured-link-icon-size": "var(".concat(textSize.replace("text", "--fs"), ")")
129
154
  }
130
- }, reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
155
+ }, targetAndRel, {
156
+ onClick: onClick
157
+ }), reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
131
158
  name: "icon-gui-link-arrow",
132
159
  size: "calc(var(--featured-link-icon-size) * 1.25)",
133
160
  color: iconColor,
@@ -147,7 +174,9 @@ FeaturedLink.propTypes = {
147
174
  iconColor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
148
175
  flush: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
149
176
  reverse: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
150
- additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
177
+ additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
178
+ newWindow: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
179
+ onClick: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
151
180
  };
152
181
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FeaturedLink);
153
182
 
@@ -23,9 +23,29 @@ return /******/ (() => { // webpackBootstrap
23
23
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
24
24
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
25
25
  /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9008);
26
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
27
+
28
+
29
+
30
+ // When generating links with target=_blank, we only add `noreferrer` to
31
+ // links that don't start with `/`, so we can continue tracking referrers
32
+ // across our own domains
26
33
 
34
+ var buildTargetAndRel = function buildTargetAndRel(url, newWindow) {
35
+ var props = {};
27
36
 
37
+ if (newWindow) {
38
+ props.target = "_blank";
28
39
 
40
+ if (url.startsWith("/") && !url.startsWith("//")) {
41
+ props.rel = "noopener";
42
+ } else {
43
+ props.rel = "noopenner noreferrer";
44
+ }
45
+ }
46
+
47
+ return props;
48
+ };
29
49
 
30
50
  var FeaturedLink = function FeaturedLink(_ref) {
31
51
  var url = _ref.url,
@@ -39,14 +59,21 @@ var FeaturedLink = function FeaturedLink(_ref) {
39
59
  reverse = _ref$reverse === void 0 ? false : _ref$reverse,
40
60
  _ref$additionalCSS = _ref.additionalCSS,
41
61
  additionalCSS = _ref$additionalCSS === void 0 ? "" : _ref$additionalCSS,
62
+ _ref$newWindow = _ref.newWindow,
63
+ newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
64
+ _ref$onClick = _ref.onClick,
65
+ onClick = _ref$onClick === void 0 ? undefined : _ref$onClick,
42
66
  children = _ref.children;
43
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
67
+ var targetAndRel = buildTargetAndRel(url, newWindow);
68
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", _extends({
44
69
  href: url,
45
70
  className: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-".concat(textSize, " ").concat(flush ? "" : "py-8", " ").concat(additionalCSS),
46
71
  style: {
47
72
  "--featured-link-icon-size": "var(".concat(textSize.replace("text", "--fs"), ")")
48
73
  }
49
- }, reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
74
+ }, targetAndRel, {
75
+ onClick: onClick
76
+ }), reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
50
77
  name: "icon-gui-link-arrow",
51
78
  size: "calc(var(--featured-link-icon-size) * 1.25)",
52
79
  color: iconColor,
@@ -66,7 +93,9 @@ FeaturedLink.propTypes = {
66
93
  iconColor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
67
94
  flush: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
68
95
  reverse: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
69
- additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
96
+ additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
97
+ newWindow: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
98
+ onClick: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
70
99
  };
71
100
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FeaturedLink);
72
101
 
@@ -104,9 +104,29 @@ var ConnectStateWrapper = function ConnectStateWrapper(Component, selectors) {
104
104
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
105
105
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
106
106
  /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9008);
107
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
108
+
109
+
107
110
 
111
+ // When generating links with target=_blank, we only add `noreferrer` to
112
+ // links that don't start with `/`, so we can continue tracking referrers
113
+ // across our own domains
108
114
 
115
+ var buildTargetAndRel = function buildTargetAndRel(url, newWindow) {
116
+ var props = {};
109
117
 
118
+ if (newWindow) {
119
+ props.target = "_blank";
120
+
121
+ if (url.startsWith("/") && !url.startsWith("//")) {
122
+ props.rel = "noopener";
123
+ } else {
124
+ props.rel = "noopenner noreferrer";
125
+ }
126
+ }
127
+
128
+ return props;
129
+ };
110
130
 
111
131
  var FeaturedLink = function FeaturedLink(_ref) {
112
132
  var url = _ref.url,
@@ -120,14 +140,21 @@ var FeaturedLink = function FeaturedLink(_ref) {
120
140
  reverse = _ref$reverse === void 0 ? false : _ref$reverse,
121
141
  _ref$additionalCSS = _ref.additionalCSS,
122
142
  additionalCSS = _ref$additionalCSS === void 0 ? "" : _ref$additionalCSS,
143
+ _ref$newWindow = _ref.newWindow,
144
+ newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
145
+ _ref$onClick = _ref.onClick,
146
+ onClick = _ref$onClick === void 0 ? undefined : _ref$onClick,
123
147
  children = _ref.children;
124
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
148
+ var targetAndRel = buildTargetAndRel(url, newWindow);
149
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", _extends({
125
150
  href: url,
126
151
  className: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-".concat(textSize, " ").concat(flush ? "" : "py-8", " ").concat(additionalCSS),
127
152
  style: {
128
153
  "--featured-link-icon-size": "var(".concat(textSize.replace("text", "--fs"), ")")
129
154
  }
130
- }, reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
155
+ }, targetAndRel, {
156
+ onClick: onClick
157
+ }), reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
131
158
  name: "icon-gui-link-arrow",
132
159
  size: "calc(var(--featured-link-icon-size) * 1.25)",
133
160
  color: iconColor,
@@ -147,7 +174,9 @@ FeaturedLink.propTypes = {
147
174
  iconColor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
148
175
  flush: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
149
176
  reverse: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
150
- additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
177
+ additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
178
+ newWindow: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
179
+ onClick: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
151
180
  };
152
181
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FeaturedLink);
153
182
 
@@ -23,9 +23,29 @@ return /******/ (() => { // webpackBootstrap
23
23
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
24
24
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
25
25
  /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9008);
26
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
27
+
28
+
29
+
30
+ // When generating links with target=_blank, we only add `noreferrer` to
31
+ // links that don't start with `/`, so we can continue tracking referrers
32
+ // across our own domains
26
33
 
34
+ var buildTargetAndRel = function buildTargetAndRel(url, newWindow) {
35
+ var props = {};
27
36
 
37
+ if (newWindow) {
38
+ props.target = "_blank";
28
39
 
40
+ if (url.startsWith("/") && !url.startsWith("//")) {
41
+ props.rel = "noopener";
42
+ } else {
43
+ props.rel = "noopenner noreferrer";
44
+ }
45
+ }
46
+
47
+ return props;
48
+ };
29
49
 
30
50
  var FeaturedLink = function FeaturedLink(_ref) {
31
51
  var url = _ref.url,
@@ -39,14 +59,21 @@ var FeaturedLink = function FeaturedLink(_ref) {
39
59
  reverse = _ref$reverse === void 0 ? false : _ref$reverse,
40
60
  _ref$additionalCSS = _ref.additionalCSS,
41
61
  additionalCSS = _ref$additionalCSS === void 0 ? "" : _ref$additionalCSS,
62
+ _ref$newWindow = _ref.newWindow,
63
+ newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
64
+ _ref$onClick = _ref.onClick,
65
+ onClick = _ref$onClick === void 0 ? undefined : _ref$onClick,
42
66
  children = _ref.children;
43
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
67
+ var targetAndRel = buildTargetAndRel(url, newWindow);
68
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", _extends({
44
69
  href: url,
45
70
  className: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-".concat(textSize, " ").concat(flush ? "" : "py-8", " ").concat(additionalCSS),
46
71
  style: {
47
72
  "--featured-link-icon-size": "var(".concat(textSize.replace("text", "--fs"), ")")
48
73
  }
49
- }, reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
74
+ }, targetAndRel, {
75
+ onClick: onClick
76
+ }), reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
50
77
  name: "icon-gui-link-arrow",
51
78
  size: "calc(var(--featured-link-icon-size) * 1.25)",
52
79
  color: iconColor,
@@ -66,7 +93,9 @@ FeaturedLink.propTypes = {
66
93
  iconColor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
67
94
  flush: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
68
95
  reverse: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
69
- additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
96
+ additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
97
+ newWindow: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
98
+ onClick: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
70
99
  };
71
100
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FeaturedLink);
72
101
 
@@ -23,9 +23,29 @@ return /******/ (() => { // webpackBootstrap
23
23
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
24
24
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
25
25
  /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9008);
26
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
27
+
28
+
29
+
30
+ // When generating links with target=_blank, we only add `noreferrer` to
31
+ // links that don't start with `/`, so we can continue tracking referrers
32
+ // across our own domains
33
+
34
+ var buildTargetAndRel = function buildTargetAndRel(url, newWindow) {
35
+ var props = {};
26
36
 
37
+ if (newWindow) {
38
+ props.target = "_blank";
27
39
 
40
+ if (url.startsWith("/") && !url.startsWith("//")) {
41
+ props.rel = "noopener";
42
+ } else {
43
+ props.rel = "noopenner noreferrer";
44
+ }
45
+ }
28
46
 
47
+ return props;
48
+ };
29
49
 
30
50
  var FeaturedLink = function FeaturedLink(_ref) {
31
51
  var url = _ref.url,
@@ -39,14 +59,21 @@ var FeaturedLink = function FeaturedLink(_ref) {
39
59
  reverse = _ref$reverse === void 0 ? false : _ref$reverse,
40
60
  _ref$additionalCSS = _ref.additionalCSS,
41
61
  additionalCSS = _ref$additionalCSS === void 0 ? "" : _ref$additionalCSS,
62
+ _ref$newWindow = _ref.newWindow,
63
+ newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
64
+ _ref$onClick = _ref.onClick,
65
+ onClick = _ref$onClick === void 0 ? undefined : _ref$onClick,
42
66
  children = _ref.children;
43
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
67
+ var targetAndRel = buildTargetAndRel(url, newWindow);
68
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", _extends({
44
69
  href: url,
45
70
  className: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-".concat(textSize, " ").concat(flush ? "" : "py-8", " ").concat(additionalCSS),
46
71
  style: {
47
72
  "--featured-link-icon-size": "var(".concat(textSize.replace("text", "--fs"), ")")
48
73
  }
49
- }, reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
74
+ }, targetAndRel, {
75
+ onClick: onClick
76
+ }), reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
50
77
  name: "icon-gui-link-arrow",
51
78
  size: "calc(var(--featured-link-icon-size) * 1.25)",
52
79
  color: iconColor,
@@ -66,7 +93,9 @@ FeaturedLink.propTypes = {
66
93
  iconColor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
67
94
  flush: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
68
95
  reverse: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
69
- additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
96
+ additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
97
+ newWindow: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
98
+ onClick: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
70
99
  };
71
100
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FeaturedLink);
72
101
 
@@ -23,9 +23,29 @@ return /******/ (() => { // webpackBootstrap
23
23
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
24
24
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
25
25
  /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9008);
26
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
27
+
28
+
26
29
 
30
+ // When generating links with target=_blank, we only add `noreferrer` to
31
+ // links that don't start with `/`, so we can continue tracking referrers
32
+ // across our own domains
27
33
 
34
+ var buildTargetAndRel = function buildTargetAndRel(url, newWindow) {
35
+ var props = {};
28
36
 
37
+ if (newWindow) {
38
+ props.target = "_blank";
39
+
40
+ if (url.startsWith("/") && !url.startsWith("//")) {
41
+ props.rel = "noopener";
42
+ } else {
43
+ props.rel = "noopenner noreferrer";
44
+ }
45
+ }
46
+
47
+ return props;
48
+ };
29
49
 
30
50
  var FeaturedLink = function FeaturedLink(_ref) {
31
51
  var url = _ref.url,
@@ -39,14 +59,21 @@ var FeaturedLink = function FeaturedLink(_ref) {
39
59
  reverse = _ref$reverse === void 0 ? false : _ref$reverse,
40
60
  _ref$additionalCSS = _ref.additionalCSS,
41
61
  additionalCSS = _ref$additionalCSS === void 0 ? "" : _ref$additionalCSS,
62
+ _ref$newWindow = _ref.newWindow,
63
+ newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
64
+ _ref$onClick = _ref.onClick,
65
+ onClick = _ref$onClick === void 0 ? undefined : _ref$onClick,
42
66
  children = _ref.children;
43
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
67
+ var targetAndRel = buildTargetAndRel(url, newWindow);
68
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", _extends({
44
69
  href: url,
45
70
  className: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-".concat(textSize, " ").concat(flush ? "" : "py-8", " ").concat(additionalCSS),
46
71
  style: {
47
72
  "--featured-link-icon-size": "var(".concat(textSize.replace("text", "--fs"), ")")
48
73
  }
49
- }, reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
74
+ }, targetAndRel, {
75
+ onClick: onClick
76
+ }), reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
50
77
  name: "icon-gui-link-arrow",
51
78
  size: "calc(var(--featured-link-icon-size) * 1.25)",
52
79
  color: iconColor,
@@ -66,7 +93,9 @@ FeaturedLink.propTypes = {
66
93
  iconColor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
67
94
  flush: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
68
95
  reverse: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
69
- additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
96
+ additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
97
+ newWindow: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
98
+ onClick: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
70
99
  };
71
100
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FeaturedLink);
72
101
 
@@ -23,9 +23,29 @@ return /******/ (() => { // webpackBootstrap
23
23
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
24
24
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
25
25
  /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9008);
26
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
27
+
28
+
29
+
30
+ // When generating links with target=_blank, we only add `noreferrer` to
31
+ // links that don't start with `/`, so we can continue tracking referrers
32
+ // across our own domains
26
33
 
34
+ var buildTargetAndRel = function buildTargetAndRel(url, newWindow) {
35
+ var props = {};
27
36
 
37
+ if (newWindow) {
38
+ props.target = "_blank";
28
39
 
40
+ if (url.startsWith("/") && !url.startsWith("//")) {
41
+ props.rel = "noopener";
42
+ } else {
43
+ props.rel = "noopenner noreferrer";
44
+ }
45
+ }
46
+
47
+ return props;
48
+ };
29
49
 
30
50
  var FeaturedLink = function FeaturedLink(_ref) {
31
51
  var url = _ref.url,
@@ -39,14 +59,21 @@ var FeaturedLink = function FeaturedLink(_ref) {
39
59
  reverse = _ref$reverse === void 0 ? false : _ref$reverse,
40
60
  _ref$additionalCSS = _ref.additionalCSS,
41
61
  additionalCSS = _ref$additionalCSS === void 0 ? "" : _ref$additionalCSS,
62
+ _ref$newWindow = _ref.newWindow,
63
+ newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
64
+ _ref$onClick = _ref.onClick,
65
+ onClick = _ref$onClick === void 0 ? undefined : _ref$onClick,
42
66
  children = _ref.children;
43
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
67
+ var targetAndRel = buildTargetAndRel(url, newWindow);
68
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", _extends({
44
69
  href: url,
45
70
  className: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-".concat(textSize, " ").concat(flush ? "" : "py-8", " ").concat(additionalCSS),
46
71
  style: {
47
72
  "--featured-link-icon-size": "var(".concat(textSize.replace("text", "--fs"), ")")
48
73
  }
49
- }, reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
74
+ }, targetAndRel, {
75
+ onClick: onClick
76
+ }), reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
50
77
  name: "icon-gui-link-arrow",
51
78
  size: "calc(var(--featured-link-icon-size) * 1.25)",
52
79
  color: iconColor,
@@ -66,7 +93,9 @@ FeaturedLink.propTypes = {
66
93
  iconColor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
67
94
  flush: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
68
95
  reverse: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
69
- additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
96
+ additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
97
+ newWindow: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
98
+ onClick: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
70
99
  };
71
100
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FeaturedLink);
72
101
 
@@ -23,9 +23,29 @@ return /******/ (() => { // webpackBootstrap
23
23
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
24
24
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
25
25
  /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9008);
26
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
27
+
28
+
29
+
30
+ // When generating links with target=_blank, we only add `noreferrer` to
31
+ // links that don't start with `/`, so we can continue tracking referrers
32
+ // across our own domains
26
33
 
34
+ var buildTargetAndRel = function buildTargetAndRel(url, newWindow) {
35
+ var props = {};
27
36
 
37
+ if (newWindow) {
38
+ props.target = "_blank";
28
39
 
40
+ if (url.startsWith("/") && !url.startsWith("//")) {
41
+ props.rel = "noopener";
42
+ } else {
43
+ props.rel = "noopenner noreferrer";
44
+ }
45
+ }
46
+
47
+ return props;
48
+ };
29
49
 
30
50
  var FeaturedLink = function FeaturedLink(_ref) {
31
51
  var url = _ref.url,
@@ -39,14 +59,21 @@ var FeaturedLink = function FeaturedLink(_ref) {
39
59
  reverse = _ref$reverse === void 0 ? false : _ref$reverse,
40
60
  _ref$additionalCSS = _ref.additionalCSS,
41
61
  additionalCSS = _ref$additionalCSS === void 0 ? "" : _ref$additionalCSS,
62
+ _ref$newWindow = _ref.newWindow,
63
+ newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
64
+ _ref$onClick = _ref.onClick,
65
+ onClick = _ref$onClick === void 0 ? undefined : _ref$onClick,
42
66
  children = _ref.children;
43
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
67
+ var targetAndRel = buildTargetAndRel(url, newWindow);
68
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", _extends({
44
69
  href: url,
45
70
  className: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-".concat(textSize, " ").concat(flush ? "" : "py-8", " ").concat(additionalCSS),
46
71
  style: {
47
72
  "--featured-link-icon-size": "var(".concat(textSize.replace("text", "--fs"), ")")
48
73
  }
49
- }, reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
74
+ }, targetAndRel, {
75
+ onClick: onClick
76
+ }), reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
50
77
  name: "icon-gui-link-arrow",
51
78
  size: "calc(var(--featured-link-icon-size) * 1.25)",
52
79
  color: iconColor,
@@ -66,7 +93,9 @@ FeaturedLink.propTypes = {
66
93
  iconColor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
67
94
  flush: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
68
95
  reverse: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
69
- additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
96
+ additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
97
+ newWindow: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
98
+ onClick: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
70
99
  };
71
100
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FeaturedLink);
72
101
 
@@ -23,9 +23,29 @@ return /******/ (() => { // webpackBootstrap
23
23
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
24
24
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
25
25
  /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9008);
26
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
27
+
28
+
29
+
30
+ // When generating links with target=_blank, we only add `noreferrer` to
31
+ // links that don't start with `/`, so we can continue tracking referrers
32
+ // across our own domains
26
33
 
34
+ var buildTargetAndRel = function buildTargetAndRel(url, newWindow) {
35
+ var props = {};
27
36
 
37
+ if (newWindow) {
38
+ props.target = "_blank";
28
39
 
40
+ if (url.startsWith("/") && !url.startsWith("//")) {
41
+ props.rel = "noopener";
42
+ } else {
43
+ props.rel = "noopenner noreferrer";
44
+ }
45
+ }
46
+
47
+ return props;
48
+ };
29
49
 
30
50
  var FeaturedLink = function FeaturedLink(_ref) {
31
51
  var url = _ref.url,
@@ -39,14 +59,21 @@ var FeaturedLink = function FeaturedLink(_ref) {
39
59
  reverse = _ref$reverse === void 0 ? false : _ref$reverse,
40
60
  _ref$additionalCSS = _ref.additionalCSS,
41
61
  additionalCSS = _ref$additionalCSS === void 0 ? "" : _ref$additionalCSS,
62
+ _ref$newWindow = _ref.newWindow,
63
+ newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
64
+ _ref$onClick = _ref.onClick,
65
+ onClick = _ref$onClick === void 0 ? undefined : _ref$onClick,
42
66
  children = _ref.children;
43
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
67
+ var targetAndRel = buildTargetAndRel(url, newWindow);
68
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", _extends({
44
69
  href: url,
45
70
  className: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-".concat(textSize, " ").concat(flush ? "" : "py-8", " ").concat(additionalCSS),
46
71
  style: {
47
72
  "--featured-link-icon-size": "var(".concat(textSize.replace("text", "--fs"), ")")
48
73
  }
49
- }, reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
74
+ }, targetAndRel, {
75
+ onClick: onClick
76
+ }), reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
50
77
  name: "icon-gui-link-arrow",
51
78
  size: "calc(var(--featured-link-icon-size) * 1.25)",
52
79
  color: iconColor,
@@ -66,7 +93,9 @@ FeaturedLink.propTypes = {
66
93
  iconColor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
67
94
  flush: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
68
95
  reverse: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
69
- additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
96
+ additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
97
+ newWindow: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
98
+ onClick: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
70
99
  };
71
100
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FeaturedLink);
72
101
 
package/core/Uptime.jsx CHANGED
@@ -23,9 +23,29 @@ return /******/ (() => { // webpackBootstrap
23
23
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6073);
24
24
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
25
25
  /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9008);
26
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
27
+
28
+
26
29
 
30
+ // When generating links with target=_blank, we only add `noreferrer` to
31
+ // links that don't start with `/`, so we can continue tracking referrers
32
+ // across our own domains
27
33
 
34
+ var buildTargetAndRel = function buildTargetAndRel(url, newWindow) {
35
+ var props = {};
28
36
 
37
+ if (newWindow) {
38
+ props.target = "_blank";
39
+
40
+ if (url.startsWith("/") && !url.startsWith("//")) {
41
+ props.rel = "noopener";
42
+ } else {
43
+ props.rel = "noopenner noreferrer";
44
+ }
45
+ }
46
+
47
+ return props;
48
+ };
29
49
 
30
50
  var FeaturedLink = function FeaturedLink(_ref) {
31
51
  var url = _ref.url,
@@ -39,14 +59,21 @@ var FeaturedLink = function FeaturedLink(_ref) {
39
59
  reverse = _ref$reverse === void 0 ? false : _ref$reverse,
40
60
  _ref$additionalCSS = _ref.additionalCSS,
41
61
  additionalCSS = _ref$additionalCSS === void 0 ? "" : _ref$additionalCSS,
62
+ _ref$newWindow = _ref.newWindow,
63
+ newWindow = _ref$newWindow === void 0 ? false : _ref$newWindow,
64
+ _ref$onClick = _ref.onClick,
65
+ onClick = _ref$onClick === void 0 ? undefined : _ref$onClick,
42
66
  children = _ref.children;
43
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
67
+ var targetAndRel = buildTargetAndRel(url, newWindow);
68
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", _extends({
44
69
  href: url,
45
70
  className: "font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-".concat(textSize, " ").concat(flush ? "" : "py-8", " ").concat(additionalCSS),
46
71
  style: {
47
72
  "--featured-link-icon-size": "var(".concat(textSize.replace("text", "--fs"), ")")
48
73
  }
49
- }, reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
74
+ }, targetAndRel, {
75
+ onClick: onClick
76
+ }), reverse ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__["default"], {
50
77
  name: "icon-gui-link-arrow",
51
78
  size: "calc(var(--featured-link-icon-size) * 1.25)",
52
79
  color: iconColor,
@@ -66,7 +93,9 @@ FeaturedLink.propTypes = {
66
93
  iconColor: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
67
94
  flush: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
68
95
  reverse: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
69
- additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string)
96
+ additionalCSS: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().string),
97
+ newWindow: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().bool),
98
+ onClick: (prop_types__WEBPACK_IMPORTED_MODULE_1___default().func)
70
99
  };
71
100
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FeaturedLink);
72
101
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ably/ui",
3
- "version": "13.1.0",
3
+ "version": "13.2.2-dev.78815ed",
4
4
  "description": "Home of the Ably design system library ([design.ably.com](https://design.ably.com)). It provides a showcase, development/test environment and a publishing pipeline for different distributables.",
5
5
  "repository": {
6
6
  "type": "git",
@@ -3,37 +3,72 @@ import T from "prop-types";
3
3
 
4
4
  import Icon from "../Icon/component.jsx";
5
5
 
6
- const FeaturedLink = ({ url, textSize = "text-p2", iconColor = "text-cool-black", flush = false, reverse = false, additionalCSS = "", children }) => (
7
- <a
8
- href={url}
9
- className={`font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-${textSize} ${
10
- flush ? "" : "py-8"
11
- } ${additionalCSS}`}
12
- style={{ "--featured-link-icon-size": `var(${textSize.replace("text", "--fs")})` }}
13
- >
14
- {reverse ? (
15
- <>
16
- <Icon
17
- name="icon-gui-link-arrow"
18
- size={`calc(var(--featured-link-icon-size) * 1.25)`}
19
- color={iconColor}
20
- additionalCSS="align-middle mr-8 relative -top-1 -right-4 transition-all group-hover:right-0 transform rotate-180"
21
- />
22
- {children}
23
- </>
24
- ) : (
25
- <>
26
- {children}
27
- <Icon
28
- name="icon-gui-link-arrow"
29
- size={`calc(var(--featured-link-icon-size) * 1.25)`}
30
- color={iconColor}
31
- additionalCSS="align-middle ml-8 relative -top-1 -left-4 transition-all group-hover:left-0"
32
- />
33
- </>
34
- )}
35
- </a>
36
- );
6
+ // When generating links with target=_blank, we only add `noreferrer` to
7
+ // links that don't start with `/`, so we can continue tracking referrers
8
+ // across our own domains
9
+ const buildTargetAndRel = (url, newWindow) => {
10
+ const props = {};
11
+
12
+ if (newWindow) {
13
+ props.target = "_blank";
14
+
15
+ if (url.startsWith("/") && !url.startsWith("//")) {
16
+ props.rel = "noopener";
17
+ } else {
18
+ props.rel = "noopenner noreferrer";
19
+ }
20
+ }
21
+
22
+ return props;
23
+ };
24
+
25
+ const FeaturedLink = ({
26
+ url,
27
+ textSize = "text-p2",
28
+ iconColor = "text-cool-black",
29
+ flush = false,
30
+ reverse = false,
31
+ additionalCSS = "",
32
+ newWindow = false,
33
+ onClick = undefined,
34
+ children,
35
+ }) => {
36
+ const targetAndRel = buildTargetAndRel(url, newWindow);
37
+
38
+ return (
39
+ <a
40
+ href={url}
41
+ className={`font-sans font-bold block text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus group ui-${textSize} ${
42
+ flush ? "" : "py-8"
43
+ } ${additionalCSS}`}
44
+ style={{ "--featured-link-icon-size": `var(${textSize.replace("text", "--fs")})` }}
45
+ {...targetAndRel}
46
+ onClick={onClick}
47
+ >
48
+ {reverse ? (
49
+ <>
50
+ <Icon
51
+ name="icon-gui-link-arrow"
52
+ size={`calc(var(--featured-link-icon-size) * 1.25)`}
53
+ color={iconColor}
54
+ additionalCSS="align-middle mr-8 relative -top-1 -right-4 transition-all group-hover:right-0 transform rotate-180"
55
+ />
56
+ {children}
57
+ </>
58
+ ) : (
59
+ <>
60
+ {children}
61
+ <Icon
62
+ name="icon-gui-link-arrow"
63
+ size={`calc(var(--featured-link-icon-size) * 1.25)`}
64
+ color={iconColor}
65
+ additionalCSS="align-middle ml-8 relative -top-1 -left-4 transition-all group-hover:left-0"
66
+ />
67
+ </>
68
+ )}
69
+ </a>
70
+ );
71
+ };
37
72
 
38
73
  FeaturedLink.propTypes = {
39
74
  url: T.string,
@@ -43,6 +78,8 @@ FeaturedLink.propTypes = {
43
78
  flush: T.bool,
44
79
  reverse: T.bool,
45
80
  additionalCSS: T.string,
81
+ newWindow: T.bool,
82
+ onClick: T.func,
46
83
  };
47
84
 
48
85
  export default FeaturedLink;