@atlaskit/menu 2.5.2 → 2.6.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.
Files changed (5) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/dist/cjs/menu-item/link-item.js +22 -3
  3. package/dist/es2019/menu-item/link-item.js +22 -3
  4. package/dist/esm/menu-item/link-item.js +22 -3
  5. package/package.json +5 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,16 @@
1
1
  # @atlaskit/menu
2
2
 
3
+ ## 2.6.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#115893](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/115893)
8
+ [`78d9ff4de5251`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/78d9ff4de5251) -
9
+ Updated LinkItem to conditionally render a router link if a link component is set in the app
10
+ provider and the provided href prop is not an external link or a non-HTTP-based link (e.g. emails,
11
+ phone numbers, hash links etc.). These changes are behind a feature flag and will be available in
12
+ a later release if successful.
13
+
3
14
  ## 2.5.2
4
15
 
5
16
  ### Patch Changes
package/dist/cjs/menu-item/link-item.js CHANGED
@@ -9,6 +9,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
9
9
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
10
  var _react = require("react");
11
11
  var _react2 = require("@emotion/react");
12
+ var _appProvider = require("@atlaskit/app-provider");
12
13
  var _deprecationWarning = require("@atlaskit/ds-lib/deprecation-warning");
13
14
  var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
14
15
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
@@ -19,6 +20,8 @@ var _excluded = ["children", "href", "cssFn", "description", "iconAfter", "iconB
19
20
  */
20
21
  /** @jsx jsx */
21
22
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
23
+ var IS_EXTERNAL_LINK_REGEX = /^(?:(http|https):\/\/)/;
24
+ var IS_NON_HTTP_BASED = /^(((mailto|tel|sms):)|(#))/;
22
25
  var preventEvent = function preventEvent(e) {
23
26
  e.preventDefault();
24
27
  };
@@ -54,9 +57,22 @@ function (props, ref) {
54
57
  UNSAFE_className = props.className,
55
58
  rest = (0, _objectWithoutProperties2.default)(props, _excluded);
56
59
  var onMouseDownHandler = onMouseDown;
60
+ var RouterLink = (0, _appProvider.useRouterLink)();
57
61
  if (!children) {
58
62
  return null;
59
63
  }
64
+ var isExternal = typeof href === 'string' && IS_EXTERNAL_LINK_REGEX.test(href);
65
+ var isNonHttpBased = typeof href === 'string' && IS_NON_HTTP_BASED.test(href);
66
+
67
+ /**
68
+ * Renders a router link if:
69
+ *
70
+ * - a link component is set in the app provider
71
+ * - it's not an external link (starting with `http://` or `https://`)
72
+ * - it's not a non-HTTP-based link (e.g. emails, phone numbers, hash links etc.).
73
+ */
74
+ var isRouterLink = RouterLink && !isExternal && !isNonHttpBased;
75
+ var Component = (0, _platformFeatureFlags.getBooleanFF)('platform.wanjel.use-router-links-for-the-linkitem-component') && isRouterLink ? RouterLink : 'a';
60
76
  (0, _deprecationWarning.propDeprecationWarning)("@atlaskit/menu" || '', 'cssFn', cssFn !== _noop.default, '' // TODO: Create DAC post when primitives/xcss are available as alternatives
61
77
  );
62
78
  return (0, _react2.jsx)(_menuItemPrimitive.default, (0, _extends2.default)({}, rest, {
@@ -83,11 +99,14 @@ function (props, ref) {
83
99
  }), function (_ref) {
84
100
  var children = _ref.children,
85
101
  className = _ref.className;
86
- return (0, _react2.jsx)("a", (0, _extends2.default)({
87
- "data-testid": testId
102
+ return (0, _react2.jsx)(Component, (0, _extends2.default)({
103
+ "data-testid": testId,
104
+ "data-is-router-link": testId ? isRouterLink ? 'true' : 'false' : undefined
88
105
  }, rest, {
89
106
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
90
- className: className,
107
+ className: className
108
+ // @ts-expect-error
109
+ ,
91
110
  href: isDisabled ? undefined : href,
92
111
  draggable: false
93
112
  // eslint-disable-next-line @atlaskit/design-system/no-direct-use-of-web-platform-drag-and-drop
package/dist/es2019/menu-item/link-item.js CHANGED
@@ -7,10 +7,13 @@ import { forwardRef, memo } from 'react';
7
7
 
8
8
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
9
9
  import { jsx } from '@emotion/react';
10
+ import { useRouterLink } from '@atlaskit/app-provider';
10
11
  import { propDeprecationWarning } from '@atlaskit/ds-lib/deprecation-warning';
11
12
  import noop from '@atlaskit/ds-lib/noop';
12
13
  import { getBooleanFF } from '@atlaskit/platform-feature-flags';
13
14
  import MenuItemPrimitive from '../internal/components/menu-item-primitive';
15
+ const IS_EXTERNAL_LINK_REGEX = /^(?:(http|https):\/\/)/;
16
+ const IS_NON_HTTP_BASED = /^(((mailto|tel|sms):)|(#))/;
14
17
  const preventEvent = e => {
15
18
  e.preventDefault();
16
19
  };
@@ -49,9 +52,22 @@ const LinkItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(
49
52
  ...rest
50
53
  } = props;
51
54
  const onMouseDownHandler = onMouseDown;
55
+ const RouterLink = useRouterLink();
52
56
  if (!children) {
53
57
  return null;
54
58
  }
59
+ const isExternal = typeof href === 'string' && IS_EXTERNAL_LINK_REGEX.test(href);
60
+ const isNonHttpBased = typeof href === 'string' && IS_NON_HTTP_BASED.test(href);
61
+
62
+ /**
63
+ * Renders a router link if:
64
+ *
65
+ * - a link component is set in the app provider
66
+ * - it's not an external link (starting with `http://` or `https://`)
67
+ * - it's not a non-HTTP-based link (e.g. emails, phone numbers, hash links etc.).
68
+ */
69
+ const isRouterLink = RouterLink && !isExternal && !isNonHttpBased;
70
+ const Component = getBooleanFF('platform.wanjel.use-router-links-for-the-linkitem-component') && isRouterLink ? RouterLink : 'a';
55
71
  propDeprecationWarning("@atlaskit/menu" || '', 'cssFn', cssFn !== noop, '' // TODO: Create DAC post when primitives/xcss are available as alternatives
56
72
  );
57
73
  return jsx(MenuItemPrimitive, _extends({}, rest, {
@@ -78,11 +94,14 @@ const LinkItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(
78
94
  }), ({
79
95
  children,
80
96
  className
81
- }) => jsx("a", _extends({
82
- "data-testid": testId
97
+ }) => jsx(Component, _extends({
98
+ "data-testid": testId,
99
+ "data-is-router-link": testId ? isRouterLink ? 'true' : 'false' : undefined
83
100
  }, rest, {
84
101
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
85
- className: className,
102
+ className: className
103
+ // @ts-expect-error
104
+ ,
86
105
  href: isDisabled ? undefined : href,
87
106
  draggable: false
88
107
  // eslint-disable-next-line @atlaskit/design-system/no-direct-use-of-web-platform-drag-and-drop
package/dist/esm/menu-item/link-item.js CHANGED
@@ -9,10 +9,13 @@ import { forwardRef, memo } from 'react';
9
9
 
10
10
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
11
11
  import { jsx } from '@emotion/react';
12
+ import { useRouterLink } from '@atlaskit/app-provider';
12
13
  import { propDeprecationWarning } from '@atlaskit/ds-lib/deprecation-warning';
13
14
  import noop from '@atlaskit/ds-lib/noop';
14
15
  import { getBooleanFF } from '@atlaskit/platform-feature-flags';
15
16
  import MenuItemPrimitive from '../internal/components/menu-item-primitive';
17
+ var IS_EXTERNAL_LINK_REGEX = /^(?:(http|https):\/\/)/;
18
+ var IS_NON_HTTP_BASED = /^(((mailto|tel|sms):)|(#))/;
16
19
  var preventEvent = function preventEvent(e) {
17
20
  e.preventDefault();
18
21
  };
@@ -48,9 +51,22 @@ function (props, ref) {
48
51
  UNSAFE_className = props.className,
49
52
  rest = _objectWithoutProperties(props, _excluded);
50
53
  var onMouseDownHandler = onMouseDown;
54
+ var RouterLink = useRouterLink();
51
55
  if (!children) {
52
56
  return null;
53
57
  }
58
+ var isExternal = typeof href === 'string' && IS_EXTERNAL_LINK_REGEX.test(href);
59
+ var isNonHttpBased = typeof href === 'string' && IS_NON_HTTP_BASED.test(href);
60
+
61
+ /**
62
+ * Renders a router link if:
63
+ *
64
+ * - a link component is set in the app provider
65
+ * - it's not an external link (starting with `http://` or `https://`)
66
+ * - it's not a non-HTTP-based link (e.g. emails, phone numbers, hash links etc.).
67
+ */
68
+ var isRouterLink = RouterLink && !isExternal && !isNonHttpBased;
69
+ var Component = getBooleanFF('platform.wanjel.use-router-links-for-the-linkitem-component') && isRouterLink ? RouterLink : 'a';
54
70
  propDeprecationWarning("@atlaskit/menu" || '', 'cssFn', cssFn !== noop, '' // TODO: Create DAC post when primitives/xcss are available as alternatives
55
71
  );
56
72
  return jsx(MenuItemPrimitive, _extends({}, rest, {
@@ -77,11 +93,14 @@ function (props, ref) {
77
93
  }), function (_ref) {
78
94
  var children = _ref.children,
79
95
  className = _ref.className;
80
- return jsx("a", _extends({
81
- "data-testid": testId
96
+ return jsx(Component, _extends({
97
+ "data-testid": testId,
98
+ "data-is-router-link": testId ? isRouterLink ? 'true' : 'false' : undefined
82
99
  }, rest, {
83
100
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
84
- className: className,
101
+ className: className
102
+ // @ts-expect-error
103
+ ,
85
104
  href: isDisabled ? undefined : href,
86
105
  draggable: false
87
106
  // eslint-disable-next-line @atlaskit/design-system/no-direct-use-of-web-platform-drag-and-drop
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/menu",
3
- "version": "2.5.2",
3
+ "version": "2.6.0",
4
4
  "description": "A list of options to help users navigate, or perform actions.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -43,6 +43,7 @@
43
43
  }
44
44
  },
45
45
  "dependencies": {
46
+ "@atlaskit/app-provider": "^1.3.0",
46
47
  "@atlaskit/ds-lib": "^2.3.0",
47
48
  "@atlaskit/focus-ring": "^1.5.0",
48
49
  "@atlaskit/platform-feature-flags": "^0.2.0",
@@ -128,6 +129,9 @@
128
129
  },
129
130
  "platform.design-system-team.menu-tokenised-typography-styles": {
130
131
  "type": "boolean"
132
+ },
133
+ "platform.wanjel.use-router-links-for-the-linkitem-component": {
134
+ "type": "boolean"
131
135
  }
132
136
  },
133
137
  "homepage": "https://atlassian.design/components/menu/"