@atlaskit/primitives 14.6.0 → 14.7.1

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/primitives
 
+## 14.7.1
+
+### Patch Changes
+
+- [#148964](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/148964)
+  [`79dddcb8a67c0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/79dddcb8a67c0) -
+  Add tabindex="0" to Pressable for Safari so that click events are fired
+- Updated dependencies
+
+## 14.7.0
+
+### Minor Changes
+
+- [#146876](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/146876)
+  [`1f9d7feceff9f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1f9d7feceff9f) -
+  Removed deprecated unsafe anchor and unsafe anchor props.
+
 ## 14.6.0
 
 ### Minor Changes

package/dist/cjs/compiled/components/anchor.js

@@ -70,7 +70,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "14.6.0",
+    packageVersion: "14.7.1",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/cjs/compiled/components/pressable.js

@@ -15,10 +15,11 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react2 = require("@compiled/react");
 var _analyticsNext = require("@atlaskit/analytics-next");
+var _deviceCheck = require("@atlaskit/ds-lib/device-check");
 var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
 var _interactionContext = _interopRequireDefault(require("@atlaskit/interaction-context"));
 var _focusable = _interopRequireDefault(require("./focusable"));
-var _excluded = ["children", "isDisabled", "type", "onClick", "interactionName", "componentName", "analyticsContext", "style", "testId", "xcss"],
+var _excluded = ["children", "isDisabled", "type", "onClick", "interactionName", "componentName", "analyticsContext", "style", "testId", "xcss", "tabIndex"],
   _excluded2 = ["className"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -49,6 +50,7 @@ var Pressable = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     style = _ref.style,
     testId = _ref.testId,
     xcss = _ref.xcss,
+    tabIndex = _ref.tabIndex,
     htmlAttributes = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var interactionContext = (0, _react.useContext)(_interactionContext.default);
   var handleClick = (0, _react.useCallback)(function (e, analyticsEvent) {
@@ -60,7 +62,7 @@ var Pressable = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "14.6.0",
+    packageVersion: "14.7.1",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });
@@ -73,6 +75,11 @@ var Pressable = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   // @ts-expect-error we don't allow `button` on Focusable for makers as they should use Pressable instead
   , (0, _extends2.default)({
     as: "button"
+    // Safari does not apply focus to buttons on click like other browsers, which means click events will not be fired.
+    // Adding a tabIndex of 0 to the button will allow it to be focused on click.
+    // This is a known issue in Safari that is meant to be "intended", see https://bugs.webkit.org/show_bug.cgi?id=22261
+    ,
+    tabIndex: tabIndex !== null && tabIndex !== void 0 ? tabIndex : (0, _deviceCheck.isSafari)() && !isDisabled ? 0 : undefined
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- TODO: Properly type this and allow pass-through if we can determine the type
     ,
     style: style

package/dist/cjs/components/anchor.js

@@ -100,7 +100,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "14.6.0",
+    packageVersion: "14.7.1",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/cjs/components/pressable.js

@@ -95,7 +95,7 @@ var Pressable = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "14.6.0",
+    packageVersion: "14.7.1",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/cjs/index.js

@@ -58,12 +58,6 @@ Object.defineProperty(exports, "Text", {
     return _text.default;
   }
 });
-Object.defineProperty(exports, "UNSAFE_ANCHOR", {
-  enumerable: true,
-  get: function get() {
-    return _anchor.default;
-  }
-});
 Object.defineProperty(exports, "UNSAFE_BREAKPOINTS_CONFIG", {
   enumerable: true,
   get: function get() {

package/dist/es2019/compiled/components/anchor.js

@@ -55,7 +55,7 @@ const AnchorNoRef = ({
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "14.6.0",
+    packageVersion: "14.7.1",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/es2019/compiled/components/pressable.js

@@ -6,6 +6,7 @@ import { ax, ix } from "@compiled/react/runtime";
 import { forwardRef, useCallback, useContext } from 'react';
 import { cx } from '@compiled/react';
 import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next';
+import { isSafari } from '@atlaskit/ds-lib/device-check';
 import noop from '@atlaskit/ds-lib/noop';
 import InteractionContext from '@atlaskit/interaction-context';
 import Focusable from './focusable';
@@ -34,6 +35,7 @@ const Pressable = /*#__PURE__*/forwardRef(({
   style,
   testId,
   xcss,
+  tabIndex,
   ...htmlAttributes
 }, ref) => {
   const interactionContext = useContext(InteractionContext);
@@ -46,7 +48,7 @@ const Pressable = /*#__PURE__*/forwardRef(({
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "14.6.0",
+    packageVersion: "14.7.1",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });
@@ -61,6 +63,11 @@ const Pressable = /*#__PURE__*/forwardRef(({
   // @ts-expect-error we don't allow `button` on Focusable for makers as they should use Pressable instead
   , _extends({
     as: "button"
+    // Safari does not apply focus to buttons on click like other browsers, which means click events will not be fired.
+    // Adding a tabIndex of 0 to the button will allow it to be focused on click.
+    // This is a known issue in Safari that is meant to be "intended", see https://bugs.webkit.org/show_bug.cgi?id=22261
+    ,
+    tabIndex: tabIndex !== null && tabIndex !== void 0 ? tabIndex : isSafari() && !isDisabled ? 0 : undefined
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- TODO: Properly type this and allow pass-through if we can determine the type
     ,
     style: style

package/dist/es2019/components/anchor.js

@@ -90,7 +90,7 @@ const AnchorNoRef = ({
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "14.6.0",
+    packageVersion: "14.7.1",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/es2019/components/pressable.js

@@ -85,7 +85,7 @@ const Pressable = /*#__PURE__*/forwardRef(({
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "14.6.0",
+    packageVersion: "14.7.1",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/es2019/index.js

@@ -7,11 +7,7 @@ export { default as Grid } from './components/grid';
 export { default as Bleed } from './components/bleed';
 export { default as Text } from './components/text';
 export { default as Pressable } from './components/pressable';
-export {
-/**
- * @deprecated Use `Anchor` instead. This will be removed in a future major release.
- */
-default as UNSAFE_ANCHOR, default as Anchor } from './components/anchor';
+export { default as Anchor } from './components/anchor';
 export { media, UNSAFE_media, UNSAFE_BREAKPOINTS_CONFIG } from './responsive';
 export { useSurface as UNSAFE_useSurface } from './utils/surface-provider';
 export { inverseColorMap as UNSAFE_inverseColorMap } from './xcss/style-maps.partial';

package/dist/esm/compiled/components/anchor.js

@@ -60,7 +60,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "14.6.0",
+    packageVersion: "14.7.1",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/esm/compiled/components/pressable.js

@@ -1,7 +1,7 @@
 /* pressable.tsx generated by @compiled/babel-plugin v0.36.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["children", "isDisabled", "type", "onClick", "interactionName", "componentName", "analyticsContext", "style", "testId", "xcss"],
+var _excluded = ["children", "isDisabled", "type", "onClick", "interactionName", "componentName", "analyticsContext", "style", "testId", "xcss", "tabIndex"],
   _excluded2 = ["className"];
 import "./pressable.compiled.css";
 import * as React from 'react';
@@ -9,6 +9,7 @@ import { ax, ix } from "@compiled/react/runtime";
 import { forwardRef, useCallback, useContext } from 'react';
 import { cx } from '@compiled/react';
 import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next';
+import { isSafari } from '@atlaskit/ds-lib/device-check';
 import noop from '@atlaskit/ds-lib/noop';
 import InteractionContext from '@atlaskit/interaction-context';
 import Focusable from './focusable';
@@ -39,6 +40,7 @@ var Pressable = /*#__PURE__*/forwardRef(function (_ref, ref) {
     style = _ref.style,
     testId = _ref.testId,
     xcss = _ref.xcss,
+    tabIndex = _ref.tabIndex,
     htmlAttributes = _objectWithoutProperties(_ref, _excluded);
   var interactionContext = useContext(InteractionContext);
   var handleClick = useCallback(function (e, analyticsEvent) {
@@ -50,7 +52,7 @@ var Pressable = /*#__PURE__*/forwardRef(function (_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "14.6.0",
+    packageVersion: "14.7.1",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });
@@ -63,6 +65,11 @@ var Pressable = /*#__PURE__*/forwardRef(function (_ref, ref) {
   // @ts-expect-error we don't allow `button` on Focusable for makers as they should use Pressable instead
   , _extends({
     as: "button"
+    // Safari does not apply focus to buttons on click like other browsers, which means click events will not be fired.
+    // Adding a tabIndex of 0 to the button will allow it to be focused on click.
+    // This is a known issue in Safari that is meant to be "intended", see https://bugs.webkit.org/show_bug.cgi?id=22261
+    ,
+    tabIndex: tabIndex !== null && tabIndex !== void 0 ? tabIndex : isSafari() && !isDisabled ? 0 : undefined
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- TODO: Properly type this and allow pass-through if we can determine the type
     ,
     style: style

package/dist/esm/components/anchor.js

@@ -94,7 +94,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "14.6.0",
+    packageVersion: "14.7.1",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });

package/dist/esm/components/pressable.js

@@ -89,7 +89,7 @@ var Pressable = /*#__PURE__*/forwardRef(function (_ref, ref) {
     action: 'clicked',
     componentName: componentName || 'Pressable',
     packageName: "@atlaskit/primitives",
-    packageVersion: "14.6.0",
+    packageVersion: "14.7.1",
     analyticsData: analyticsContext,
     actionSubject: 'button'
   });

package/dist/esm/index.js

@@ -7,11 +7,7 @@ export { default as Grid } from './components/grid';
 export { default as Bleed } from './components/bleed';
 export { default as Text } from './components/text';
 export { default as Pressable } from './components/pressable';
-export {
-/**
- * @deprecated Use `Anchor` instead. This will be removed in a future major release.
- */
-default as UNSAFE_ANCHOR, default as Anchor } from './components/anchor';
+export { default as Anchor } from './components/anchor';
 export { media, UNSAFE_media, UNSAFE_BREAKPOINTS_CONFIG } from './responsive';
 export { useSurface as UNSAFE_useSurface } from './utils/surface-provider';
 export { inverseColorMap as UNSAFE_inverseColorMap } from './xcss/style-maps.partial';

package/dist/types/index.d.ts

@@ -17,16 +17,8 @@ export { default as Text } from './components/text';
 export type { TextProps } from './components/text';
 export { default as Pressable } from './components/pressable';
 export type { PressableProps } from './components/pressable';
-export { 
-/**
- * @deprecated Use `Anchor` instead. This will be removed in a future major release.
- */
-default as UNSAFE_ANCHOR, default as Anchor, } from './components/anchor';
-export type { 
-/**
- * @deprecated Use `AnchorProps` instead. This will be removed in a future major release.
- */
-AnchorProps as UNSAFE_AnchorProps, AnchorProps, } from './components/anchor';
+export { default as Anchor } from './components/anchor';
+export type { AnchorProps } from './components/anchor';
 export { media, UNSAFE_media, UNSAFE_BREAKPOINTS_CONFIG } from './responsive';
 export type { Breakpoint, MediaQuery } from './responsive';
 export { useSurface as UNSAFE_useSurface } from './utils/surface-provider';

package/dist/types-ts4.5/index.d.ts

@@ -17,16 +17,8 @@ export { default as Text } from './components/text';
 export type { TextProps } from './components/text';
 export { default as Pressable } from './components/pressable';
 export type { PressableProps } from './components/pressable';
-export { 
-/**
- * @deprecated Use `Anchor` instead. This will be removed in a future major release.
- */
-default as UNSAFE_ANCHOR, default as Anchor, } from './components/anchor';
-export type { 
-/**
- * @deprecated Use `AnchorProps` instead. This will be removed in a future major release.
- */
-AnchorProps as UNSAFE_AnchorProps, AnchorProps, } from './components/anchor';
+export { default as Anchor } from './components/anchor';
+export type { AnchorProps } from './components/anchor';
 export { media, UNSAFE_media, UNSAFE_BREAKPOINTS_CONFIG } from './responsive';
 export type { Breakpoint, MediaQuery } from './responsive';
 export { useSurface as UNSAFE_useSurface } from './utils/surface-provider';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/primitives",
-	"version": "14.6.0",
+	"version": "14.7.1",
 	"description": "Primitives are token-backed low-level building blocks.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -159,7 +159,7 @@
 		"@atlaskit/icon-object": "^7.1.0",
 		"@atlaskit/image": "^3.0.0",
 		"@atlaskit/link": "^3.1.0",
-		"@atlaskit/logo": "^16.0.0",
+		"@atlaskit/logo": "^18.0.0",
 		"@atlaskit/lozenge": "^12.2.0",
 		"@atlaskit/motion": "^5.1.0",
 		"@atlaskit/range": "^9.0.0",
@@ -173,6 +173,7 @@
 		"@atlassian/ssr-tests": "^0.2.0",
 		"@testing-library/react": "^13.4.0",
 		"@testing-library/react-hooks": "^8.0.1",
+		"@testing-library/user-event": "^14.4.3",
 		"csstype": "^3.1.0",
 		"jscodeshift": "^17.0.0",
 		"react-dom": "^18.2.0",