@atlaskit/primitives 11.0.1 → 11.0.2

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 CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/primitives
2
2
 
3
+ ## 11.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [#120336](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/120336)
8
+ [`62381baf0d2e1`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/62381baf0d2e1) -
9
+ Update 'opens new window' for anchor and link with a nicer AT announcement
10
+
3
11
  ## 11.0.1
4
12
 
5
13
  ### Patch Changes
@@ -19,7 +19,7 @@ var _interactionContext = _interopRequireDefault(require("@atlaskit/interaction-
19
19
  var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
20
20
  var _styleMaps = require("../xcss/style-maps.partial");
21
21
  var _xcss = require("../xcss/xcss");
22
- var _excluded = ["href", "children", "backgroundColor", "padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "onClick", "interactionName", "componentName", "analyticsContext", "aria-label", "aria-labelledby", "style", "target", "testId", "xcss"],
22
+ var _excluded = ["href", "children", "backgroundColor", "newWindowLabel", "padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "onClick", "interactionName", "componentName", "analyticsContext", "aria-label", "aria-labelledby", "style", "target", "testId", "xcss"],
23
23
  _excluded2 = ["className"];
24
24
  /**
25
25
  * @jsxRuntime classic
@@ -53,6 +53,7 @@ var baseStyles = (0, _react2.css)({
53
53
  });
54
54
  var IS_EXTERNAL_LINK_REGEX = /^(?:(http|https):\/\/)/;
55
55
  var IS_NON_HTTP_BASED = /^(((mailto|tel|sms):)|(#))/;
56
+ // Comma is added here to add a slight pause between announcing the anchor label and "opens in new window"
56
57
  var OPENS_NEW_WINDOW_LABEL = '(opens new window)';
57
58
 
58
59
  /**
@@ -68,6 +69,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
68
69
  var href = _ref.href,
69
70
  children = _ref.children,
70
71
  backgroundColor = _ref.backgroundColor,
72
+ newWindowLabel = _ref.newWindowLabel,
71
73
  padding = _ref.padding,
72
74
  paddingBlock = _ref.paddingBlock,
73
75
  paddingBlockStart = _ref.paddingBlockStart,
@@ -103,7 +105,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
103
105
  action: 'clicked',
104
106
  componentName: componentName || 'Anchor',
105
107
  packageName: "@atlaskit/primitives",
106
- packageVersion: "11.0.1",
108
+ packageVersion: "11.0.2",
107
109
  analyticsData: analyticsContext,
108
110
  actionSubject: 'link'
109
111
  });
@@ -142,7 +144,8 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
142
144
  href: !isRouterLink && typeof href !== 'string' ? undefined : href,
143
145
  target: target,
144
146
  onClick: onClick,
145
- "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? "".concat(ariaLabel, " ").concat(OPENS_NEW_WINDOW_LABEL) : ariaLabel,
147
+ "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? //`${ariaLabel} ${OPENS_NEW_WINDOW_LABEL}`
148
+ "".concat(ariaLabel, " , ").concat(newWindowLabel ? newWindowLabel : OPENS_NEW_WINDOW_LABEL) : ariaLabel,
146
149
  "aria-labelledby": ariaLabelledBy && target === '_blank' ? "".concat(ariaLabelledBy, " ").concat(opensNewWindowLabelId) : ariaLabelledBy,
147
150
  css: [baseStyles, focusRingStyles,
148
151
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -167,7 +170,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
167
170
  "data-is-router-link": testId ? isRouterLink ? 'true' : 'false' : undefined
168
171
  }), children, target === '_blank' && (children && !ariaLabel && !ariaLabelledBy || ariaLabelledBy) && (0, _react2.jsx)(_visuallyHidden.default, {
169
172
  id: opensNewWindowLabelId
170
- }, OPENS_NEW_WINDOW_LABEL));
173
+ }, ", ".concat(newWindowLabel ? newWindowLabel : OPENS_NEW_WINDOW_LABEL)));
171
174
  };
172
175
 
173
176
  // Workarounds to support generic types with forwardRef
@@ -95,7 +95,7 @@ var Pressable = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
95
95
  action: 'clicked',
96
96
  componentName: componentName || 'Pressable',
97
97
  packageName: "@atlaskit/primitives",
98
- packageVersion: "11.0.1",
98
+ packageVersion: "11.0.2",
99
99
  analyticsData: analyticsContext,
100
100
  actionSubject: 'button'
101
101
  });
@@ -43,6 +43,7 @@ const baseStyles = css({
43
43
  });
44
44
  const IS_EXTERNAL_LINK_REGEX = /^(?:(http|https):\/\/)/;
45
45
  const IS_NON_HTTP_BASED = /^(((mailto|tel|sms):)|(#))/;
46
+ // Comma is added here to add a slight pause between announcing the anchor label and "opens in new window"
46
47
  const OPENS_NEW_WINDOW_LABEL = '(opens new window)';
47
48
 
48
49
  /**
@@ -58,6 +59,7 @@ const AnchorNoRef = ({
58
59
  href,
59
60
  children,
60
61
  backgroundColor,
62
+ newWindowLabel,
61
63
  padding,
62
64
  paddingBlock,
63
65
  paddingBlockStart,
@@ -93,7 +95,7 @@ const AnchorNoRef = ({
93
95
  action: 'clicked',
94
96
  componentName: componentName || 'Anchor',
95
97
  packageName: "@atlaskit/primitives",
96
- packageVersion: "11.0.1",
98
+ packageVersion: "11.0.2",
97
99
  analyticsData: analyticsContext,
98
100
  actionSubject: 'link'
99
101
  });
@@ -134,7 +136,9 @@ const AnchorNoRef = ({
134
136
  href: !isRouterLink && typeof href !== 'string' ? undefined : href,
135
137
  target: target,
136
138
  onClick: onClick,
137
- "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? `${ariaLabel} ${OPENS_NEW_WINDOW_LABEL}` : ariaLabel,
139
+ "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ?
140
+ //`${ariaLabel} ${OPENS_NEW_WINDOW_LABEL}`
141
+ `${ariaLabel} , ${newWindowLabel ? newWindowLabel : OPENS_NEW_WINDOW_LABEL}` : ariaLabel,
138
142
  "aria-labelledby": ariaLabelledBy && target === '_blank' ? `${ariaLabelledBy} ${opensNewWindowLabelId}` : ariaLabelledBy,
139
143
  css: [baseStyles, focusRingStyles,
140
144
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -159,7 +163,7 @@ const AnchorNoRef = ({
159
163
  "data-is-router-link": testId ? isRouterLink ? 'true' : 'false' : undefined
160
164
  }), children, target === '_blank' && (children && !ariaLabel && !ariaLabelledBy || ariaLabelledBy) && jsx(VisuallyHidden, {
161
165
  id: opensNewWindowLabelId
162
- }, OPENS_NEW_WINDOW_LABEL));
166
+ }, `, ${newWindowLabel ? newWindowLabel : OPENS_NEW_WINDOW_LABEL}`));
163
167
  };
164
168
 
165
169
  // Workarounds to support generic types with forwardRef
@@ -85,7 +85,7 @@ const Pressable = /*#__PURE__*/forwardRef(({
85
85
  action: 'clicked',
86
86
  componentName: componentName || 'Pressable',
87
87
  packageName: "@atlaskit/primitives",
88
- packageVersion: "11.0.1",
88
+ packageVersion: "11.0.2",
89
89
  analyticsData: analyticsContext,
90
90
  actionSubject: 'button'
91
91
  });
@@ -1,7 +1,7 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _typeof from "@babel/runtime/helpers/typeof";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
4
- var _excluded = ["href", "children", "backgroundColor", "padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "onClick", "interactionName", "componentName", "analyticsContext", "aria-label", "aria-labelledby", "style", "target", "testId", "xcss"],
4
+ var _excluded = ["href", "children", "backgroundColor", "newWindowLabel", "padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "onClick", "interactionName", "componentName", "analyticsContext", "aria-label", "aria-labelledby", "style", "target", "testId", "xcss"],
5
5
  _excluded2 = ["className"];
6
6
  /**
7
7
  * @jsxRuntime classic
@@ -47,6 +47,7 @@ var baseStyles = css({
47
47
  });
48
48
  var IS_EXTERNAL_LINK_REGEX = /^(?:(http|https):\/\/)/;
49
49
  var IS_NON_HTTP_BASED = /^(((mailto|tel|sms):)|(#))/;
50
+ // Comma is added here to add a slight pause between announcing the anchor label and "opens in new window"
50
51
  var OPENS_NEW_WINDOW_LABEL = '(opens new window)';
51
52
 
52
53
  /**
@@ -62,6 +63,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
62
63
  var href = _ref.href,
63
64
  children = _ref.children,
64
65
  backgroundColor = _ref.backgroundColor,
66
+ newWindowLabel = _ref.newWindowLabel,
65
67
  padding = _ref.padding,
66
68
  paddingBlock = _ref.paddingBlock,
67
69
  paddingBlockStart = _ref.paddingBlockStart,
@@ -97,7 +99,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
97
99
  action: 'clicked',
98
100
  componentName: componentName || 'Anchor',
99
101
  packageName: "@atlaskit/primitives",
100
- packageVersion: "11.0.1",
102
+ packageVersion: "11.0.2",
101
103
  analyticsData: analyticsContext,
102
104
  actionSubject: 'link'
103
105
  });
@@ -136,7 +138,8 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
136
138
  href: !isRouterLink && typeof href !== 'string' ? undefined : href,
137
139
  target: target,
138
140
  onClick: onClick,
139
- "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? "".concat(ariaLabel, " ").concat(OPENS_NEW_WINDOW_LABEL) : ariaLabel,
141
+ "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? //`${ariaLabel} ${OPENS_NEW_WINDOW_LABEL}`
142
+ "".concat(ariaLabel, " , ").concat(newWindowLabel ? newWindowLabel : OPENS_NEW_WINDOW_LABEL) : ariaLabel,
140
143
  "aria-labelledby": ariaLabelledBy && target === '_blank' ? "".concat(ariaLabelledBy, " ").concat(opensNewWindowLabelId) : ariaLabelledBy,
141
144
  css: [baseStyles, focusRingStyles,
142
145
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -161,7 +164,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
161
164
  "data-is-router-link": testId ? isRouterLink ? 'true' : 'false' : undefined
162
165
  }), children, target === '_blank' && (children && !ariaLabel && !ariaLabelledBy || ariaLabelledBy) && jsx(VisuallyHidden, {
163
166
  id: opensNewWindowLabelId
164
- }, OPENS_NEW_WINDOW_LABEL));
167
+ }, ", ".concat(newWindowLabel ? newWindowLabel : OPENS_NEW_WINDOW_LABEL)));
165
168
  };
166
169
 
167
170
  // Workarounds to support generic types with forwardRef
@@ -89,7 +89,7 @@ var Pressable = /*#__PURE__*/forwardRef(function (_ref, ref) {
89
89
  action: 'clicked',
90
90
  componentName: componentName || 'Pressable',
91
91
  packageName: "@atlaskit/primitives",
92
- packageVersion: "11.0.1",
92
+ packageVersion: "11.0.2",
93
93
  analyticsData: analyticsContext,
94
94
  actionSubject: 'button'
95
95
  });
@@ -33,6 +33,10 @@ type BaseAnchorProps = {
33
33
  * Token representing background color with a built-in fallback value.
34
34
  */
35
35
  backgroundColor?: BackgroundColor;
36
+ /**
37
+ * Use this to set a label for assistive technology that describes the link as opening in a new window. The default label is "(opens new window)".
38
+ */
39
+ newWindowLabel?: string;
36
40
  /**
37
41
  * Tokens representing CSS shorthand for `paddingBlock` and `paddingInline` together.
38
42
  *
@@ -85,7 +89,7 @@ export type AnchorProps<RouterLinkConfig extends Record<string, any> = never> =
85
89
  * - [Code](https://atlassian.design/components/primitives/anchor/code)
86
90
  * - [Usage](https://atlassian.design/components/primitives/anchor/usage)
87
91
  */
88
- declare const AnchorNoRef: <RouterLinkConfig extends Record<string, any> = never>({ href, children, backgroundColor, padding, paddingBlock, paddingBlockStart, paddingBlockEnd, paddingInline, paddingInlineStart, paddingInlineEnd, onClick: providedOnClick, interactionName, componentName, analyticsContext, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, style, target, testId, xcss, ...htmlAttributes }: AnchorProps<RouterLinkConfig>, ref?: Ref<HTMLAnchorElement>) => jsx.JSX.Element;
92
+ declare const AnchorNoRef: <RouterLinkConfig extends Record<string, any> = never>({ href, children, backgroundColor, newWindowLabel, padding, paddingBlock, paddingBlockStart, paddingBlockEnd, paddingInline, paddingInlineStart, paddingInlineEnd, onClick: providedOnClick, interactionName, componentName, analyticsContext, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, style, target, testId, xcss, ...htmlAttributes }: AnchorProps<RouterLinkConfig>, ref?: Ref<HTMLAnchorElement>) => jsx.JSX.Element;
89
93
  /**
90
94
  * __Anchor__
91
95
  *
@@ -33,6 +33,10 @@ type BaseAnchorProps = {
33
33
  * Token representing background color with a built-in fallback value.
34
34
  */
35
35
  backgroundColor?: BackgroundColor;
36
+ /**
37
+ * Use this to set a label for assistive technology that describes the link as opening in a new window. The default label is "(opens new window)".
38
+ */
39
+ newWindowLabel?: string;
36
40
  /**
37
41
  * Tokens representing CSS shorthand for `paddingBlock` and `paddingInline` together.
38
42
  *
@@ -85,7 +89,7 @@ export type AnchorProps<RouterLinkConfig extends Record<string, any> = never> =
85
89
  * - [Code](https://atlassian.design/components/primitives/anchor/code)
86
90
  * - [Usage](https://atlassian.design/components/primitives/anchor/usage)
87
91
  */
88
- declare const AnchorNoRef: <RouterLinkConfig extends Record<string, any> = never>({ href, children, backgroundColor, padding, paddingBlock, paddingBlockStart, paddingBlockEnd, paddingInline, paddingInlineStart, paddingInlineEnd, onClick: providedOnClick, interactionName, componentName, analyticsContext, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, style, target, testId, xcss, ...htmlAttributes }: AnchorProps<RouterLinkConfig>, ref?: Ref<HTMLAnchorElement>) => jsx.JSX.Element;
92
+ declare const AnchorNoRef: <RouterLinkConfig extends Record<string, any> = never>({ href, children, backgroundColor, newWindowLabel, padding, paddingBlock, paddingBlockStart, paddingBlockEnd, paddingInline, paddingInlineStart, paddingInlineEnd, onClick: providedOnClick, interactionName, componentName, analyticsContext, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, style, target, testId, xcss, ...htmlAttributes }: AnchorProps<RouterLinkConfig>, ref?: Ref<HTMLAnchorElement>) => jsx.JSX.Element;
89
93
  /**
90
94
  * __Anchor__
91
95
  *
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/primitives",
3
- "version": "11.0.1",
3
+ "version": "11.0.2",
4
4
  "description": "Primitives are token-backed low-level building blocks.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"