@atlaskit/primitives 7.0.2 → 7.1.0

package/CHANGELOG.md

@@ -1,5 +1,50 @@
 # @atlaskit/primitives
 
+## 7.1.0
+
+### Minor Changes
+
+- [#110702](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/110702)
+  [`b8c2eefeb195b`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b8c2eefeb195b) - -
+  Anchor and Pressable primitives no longer require `children`, so labels can be supplied through
+  aria attributes if required
+
+### Patch Changes
+
+- [#110702](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/110702)
+  [`b8c2eefeb195b`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/b8c2eefeb195b) - -
+  Fixed a bug with Anchor, where the "(opens new window)" label was not being automatically appended
+  to `aria-label` or `aria-labelledby`.
+
+## 7.0.3
+
+### Patch Changes
+
+- [#110975](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/110975)
+  [`c462a22b33940`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c462a22b33940) -
+  Removed type hinting for size values in the following properties in XCSS:
+
+  - blockSize
+  - height
+  - inlineSize
+  - maxBlockSize
+  - maxHeight
+  - maxInlineSize
+  - maxWidth
+  - minBlockSize
+  - minHeight
+  - minInlineSize
+  - minWidth
+  - width
+
+  These properties optionally accept size values like `width: 'size.100'`. However `size` will be
+  deprecated in the future. Therefore, the type hinting that displayed `size.XXX` has been removed
+  to discourage its usage until it is officially deprecated.
+
+  No changes in functionality have been introduced. The syntax `width: 'size.100'` remains valid for
+  now, so existing code will not be broken. However, consumers are encouraged to use hard-coded
+  values, like `width: '8px'`, instead.
+
 ## 7.0.2
 
 ### Patch Changes

package/dist/cjs/components/anchor.js

@@ -11,6 +11,7 @@ var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
+var _reactUid = require("react-uid");
 var _tinyInvariant = _interopRequireDefault(require("tiny-invariant"));
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _appProvider = require("@atlaskit/app-provider");
@@ -19,7 +20,7 @@ var _interactionContext = _interopRequireDefault(require("@atlaskit/interaction-
 var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
 var _xcss = require("../xcss/xcss");
 var _box = _interopRequireDefault(require("./box"));
-var _excluded = ["href", "children", "backgroundColor", "padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "testId", "xcss", "target", "onClick", "interactionName", "componentName", "analyticsContext"];
+var _excluded = ["href", "children", "backgroundColor", "padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "testId", "xcss", "target", "onClick", "interactionName", "componentName", "analyticsContext", "aria-label", "aria-labelledby"];
 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" != _typeof3(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 && Object.prototype.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; }
 // TODO: Duplicated FocusRing styles due to lack of `xcss` support
@@ -46,6 +47,7 @@ var focusRingStyles = (0, _xcss.xcss)({
 });
 var IS_EXTERNAL_LINK_REGEX = /^(?:(http|https):\/\/)/;
 var IS_NON_HTTP_BASED = /^(((mailto|tel|sms):)|(#))/;
+var OPENS_NEW_WINDOW_LABEL = '(opens new window)';
 var AnchorNoRef = function AnchorNoRef(_ref, ref) {
   var href = _ref.href,
     children = _ref.children,
@@ -65,18 +67,25 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     interactionName = _ref.interactionName,
     componentName = _ref.componentName,
     analyticsContext = _ref.analyticsContext,
+    ariaLabel = _ref['aria-label'],
+    ariaLabelledBy = _ref['aria-labelledby'],
     htmlAttributes = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var interactionContext = (0, _react.useContext)(_interactionContext.default);
   var handleClick = (0, _react.useCallback)(function (e, analyticsEvent) {
     interactionContext && interactionContext.tracePress(interactionName, e.timeStamp);
     providedOnClick(e, analyticsEvent);
   }, [providedOnClick, interactionContext, interactionName]);
+  // TODO: Use React 18's useId() hook when we update.
+  // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
+  var opensNewWindowLabelId = (0, _reactUid.uid)({
+    ariaLabelledBy: ariaLabelledBy
+  });
   var onClick = (0, _analyticsNext.usePlatformLeafEventHandler)({
     fn: handleClick,
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "7.0.2",
+    packageVersion: "7.1.0",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });
@@ -117,11 +126,15 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     paddingInline: paddingInline,
     paddingInlineStart: paddingInlineStart,
     paddingInlineEnd: paddingInlineEnd,
-    onClick: onClick
+    onClick: onClick,
+    "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? "".concat(ariaLabel, " ").concat(OPENS_NEW_WINDOW_LABEL) : ariaLabel,
+    "aria-labelledby": ariaLabelledBy && target === '_blank' ? "".concat(ariaLabelledBy, " ").concat(opensNewWindowLabelId) : ariaLabelledBy
     // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
     ,
     xcss: styles
-  }), children, target === '_blank' && /*#__PURE__*/_react.default.createElement(_visuallyHidden.default, null, "(opens new window)"));
+  }), children, target === '_blank' && (children && !ariaLabel && !ariaLabelledBy || ariaLabelledBy) && /*#__PURE__*/_react.default.createElement(_visuallyHidden.default, {
+    id: opensNewWindowLabelId
+  }, OPENS_NEW_WINDOW_LABEL));
 };
 
 // Workarounds to support generic types with forwardRef

package/dist/cjs/components/box.js

@@ -65,8 +65,26 @@ var Box = exports.Box = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref)
     className: resolvedStyles.static
     // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
   }, safeHtmlAttributes, {
-    css: [baseStyles, backgroundColor && _styleMaps.backgroundColorStylesMap[backgroundColor], (0, _styleMaps.isSurfaceColorToken)(backgroundColor) && _styleMaps.surfaceColorStylesMap[backgroundColor], padding && _styleMaps.paddingStylesMap.padding[padding], paddingBlock && _styleMaps.paddingStylesMap.paddingBlock[paddingBlock], paddingBlockStart && _styleMaps.paddingStylesMap.paddingBlockStart[paddingBlockStart], paddingBlockEnd && _styleMaps.paddingStylesMap.paddingBlockEnd[paddingBlockEnd], paddingInline && _styleMaps.paddingStylesMap.paddingInline[paddingInline], paddingInlineStart && _styleMaps.paddingStylesMap.paddingInlineStart[paddingInlineStart], paddingInlineEnd && _styleMaps.paddingStylesMap.paddingInlineEnd[paddingInlineEnd],
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    css: [baseStyles,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    backgroundColor && _styleMaps.backgroundColorStylesMap[backgroundColor],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    (0, _styleMaps.isSurfaceColorToken)(backgroundColor) && _styleMaps.surfaceColorStylesMap[backgroundColor],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    padding && _styleMaps.paddingStylesMap.padding[padding],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingBlock && _styleMaps.paddingStylesMap.paddingBlock[paddingBlock],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingBlockStart && _styleMaps.paddingStylesMap.paddingBlockStart[paddingBlockStart],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingBlockEnd && _styleMaps.paddingStylesMap.paddingBlockEnd[paddingBlockEnd],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingInline && _styleMaps.paddingStylesMap.paddingInline[paddingInline],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingInlineStart && _styleMaps.paddingStylesMap.paddingInlineStart[paddingInlineStart],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingInlineEnd && _styleMaps.paddingStylesMap.paddingInlineEnd[paddingInlineEnd],
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     resolvedStyles.emotion],
     "data-testid": testId
   }), children);

package/dist/cjs/components/flex.js

@@ -111,7 +111,13 @@ var Flex = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(fu
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
     className: resolvedStyles.static,
-    css: [baseStyles, gap && _styleMaps.spaceStylesMap.gap[gap], columnGap && _styleMaps.spaceStylesMap.columnGap[columnGap], rowGap && _styleMaps.spaceStylesMap.rowGap[rowGap], alignItems && alignItemsMap[alignItems], direction && flexDirectionMap[direction], justifyContent && justifyContentMap[justifyContent], wrap && flexWrapMap[wrap],
+    css: [baseStyles,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    gap && _styleMaps.spaceStylesMap.gap[gap],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    columnGap && _styleMaps.spaceStylesMap.columnGap[columnGap],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    rowGap && _styleMaps.spaceStylesMap.rowGap[rowGap], alignItems && alignItemsMap[alignItems], direction && flexDirectionMap[direction], justifyContent && justifyContentMap[justifyContent], wrap && flexWrapMap[wrap],
     // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
     resolvedStyles.emotion],
     "data-testid": testId,

package/dist/cjs/components/grid.js

@@ -177,7 +177,13 @@ var Grid = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(fu
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
     className: resolvedStyles.static,
-    css: [baseStyles, gap && _styleMaps.spaceStylesMap.gap[gap], columnGap && _styleMaps.spaceStylesMap.columnGap[columnGap], rowGap && _styleMaps.spaceStylesMap.rowGap[rowGap], alignItems && alignItemsMap[alignItems], alignContent && alignContentMap[alignContent], justifyContent && justifyContentMap[justifyContent], autoFlow && gridAutoFlowMap[autoFlow],
+    css: [baseStyles,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    gap && _styleMaps.spaceStylesMap.gap[gap],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    columnGap && _styleMaps.spaceStylesMap.columnGap[columnGap],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    rowGap && _styleMaps.spaceStylesMap.rowGap[rowGap], alignItems && alignItemsMap[alignItems], alignContent && alignContentMap[alignContent], justifyContent && justifyContentMap[justifyContent], autoFlow && gridAutoFlowMap[autoFlow],
     // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
     resolvedStyles.emotion],
     "data-testid": testId,

package/dist/cjs/components/pressable.js

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

package/dist/es2019/components/anchor.js

@@ -1,5 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { forwardRef, useCallback, useContext } from 'react';
+import { uid } from 'react-uid';
 import invariant from 'tiny-invariant';
 import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next';
 import { useRouterLink } from '@atlaskit/app-provider';
@@ -32,6 +33,7 @@ const focusRingStyles = xcss({
 });
 const IS_EXTERNAL_LINK_REGEX = /^(?:(http|https):\/\/)/;
 const IS_NON_HTTP_BASED = /^(((mailto|tel|sms):)|(#))/;
+const OPENS_NEW_WINDOW_LABEL = '(opens new window)';
 const AnchorNoRef = ({
   href,
   children,
@@ -50,6 +52,8 @@ const AnchorNoRef = ({
   interactionName,
   componentName,
   analyticsContext,
+  'aria-label': ariaLabel,
+  'aria-labelledby': ariaLabelledBy,
   ...htmlAttributes
 }, ref) => {
   const interactionContext = useContext(InteractionContext);
@@ -57,12 +61,17 @@ const AnchorNoRef = ({
     interactionContext && interactionContext.tracePress(interactionName, e.timeStamp);
     providedOnClick(e, analyticsEvent);
   }, [providedOnClick, interactionContext, interactionName]);
+  // TODO: Use React 18's useId() hook when we update.
+  // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
+  const opensNewWindowLabelId = uid({
+    ariaLabelledBy
+  });
   const onClick = usePlatformLeafEventHandler({
     fn: handleClick,
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "7.0.2",
+    packageVersion: "7.1.0",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });
@@ -103,11 +112,15 @@ const AnchorNoRef = ({
     paddingInline: paddingInline,
     paddingInlineStart: paddingInlineStart,
     paddingInlineEnd: paddingInlineEnd,
-    onClick: onClick
+    onClick: onClick,
+    "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? `${ariaLabel} ${OPENS_NEW_WINDOW_LABEL}` : ariaLabel,
+    "aria-labelledby": ariaLabelledBy && target === '_blank' ? `${ariaLabelledBy} ${opensNewWindowLabelId}` : ariaLabelledBy
     // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
     ,
     xcss: styles
-  }), children, target === '_blank' && /*#__PURE__*/React.createElement(VisuallyHidden, null, "(opens new window)"));
+  }), children, target === '_blank' && (children && !ariaLabel && !ariaLabelledBy || ariaLabelledBy) && /*#__PURE__*/React.createElement(VisuallyHidden, {
+    id: opensNewWindowLabelId
+  }, OPENS_NEW_WINDOW_LABEL));
 };
 
 // Workarounds to support generic types with forwardRef

package/dist/es2019/components/box.js

@@ -58,8 +58,26 @@ export const Box = /*#__PURE__*/forwardRef(({
     className: resolvedStyles.static
     // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
   }, safeHtmlAttributes, {
-    css: [baseStyles, backgroundColor && backgroundColorStylesMap[backgroundColor], isSurfaceColorToken(backgroundColor) && surfaceColorStylesMap[backgroundColor], padding && paddingStylesMap.padding[padding], paddingBlock && paddingStylesMap.paddingBlock[paddingBlock], paddingBlockStart && paddingStylesMap.paddingBlockStart[paddingBlockStart], paddingBlockEnd && paddingStylesMap.paddingBlockEnd[paddingBlockEnd], paddingInline && paddingStylesMap.paddingInline[paddingInline], paddingInlineStart && paddingStylesMap.paddingInlineStart[paddingInlineStart], paddingInlineEnd && paddingStylesMap.paddingInlineEnd[paddingInlineEnd],
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    css: [baseStyles,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    backgroundColor && backgroundColorStylesMap[backgroundColor],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    isSurfaceColorToken(backgroundColor) && surfaceColorStylesMap[backgroundColor],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    padding && paddingStylesMap.padding[padding],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingBlock && paddingStylesMap.paddingBlock[paddingBlock],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingBlockStart && paddingStylesMap.paddingBlockStart[paddingBlockStart],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingBlockEnd && paddingStylesMap.paddingBlockEnd[paddingBlockEnd],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingInline && paddingStylesMap.paddingInline[paddingInline],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingInlineStart && paddingStylesMap.paddingInlineStart[paddingInlineStart],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingInlineEnd && paddingStylesMap.paddingInlineEnd[paddingInlineEnd],
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     resolvedStyles.emotion],
     "data-testid": testId
   }), children);

package/dist/es2019/components/flex.js

@@ -104,7 +104,13 @@ const Flex = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
     className: resolvedStyles.static,
-    css: [baseStyles, gap && spaceStylesMap.gap[gap], columnGap && spaceStylesMap.columnGap[columnGap], rowGap && spaceStylesMap.rowGap[rowGap], alignItems && alignItemsMap[alignItems], direction && flexDirectionMap[direction], justifyContent && justifyContentMap[justifyContent], wrap && flexWrapMap[wrap],
+    css: [baseStyles,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    gap && spaceStylesMap.gap[gap],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    columnGap && spaceStylesMap.columnGap[columnGap],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    rowGap && spaceStylesMap.rowGap[rowGap], alignItems && alignItemsMap[alignItems], direction && flexDirectionMap[direction], justifyContent && justifyContentMap[justifyContent], wrap && flexWrapMap[wrap],
     // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
     resolvedStyles.emotion],
     "data-testid": testId,

package/dist/es2019/components/grid.js

@@ -168,7 +168,13 @@ const Grid = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
     className: resolvedStyles.static,
-    css: [baseStyles, gap && spaceStylesMap.gap[gap], columnGap && spaceStylesMap.columnGap[columnGap], rowGap && spaceStylesMap.rowGap[rowGap], alignItems && alignItemsMap[alignItems], alignContent && alignContentMap[alignContent], justifyContent && justifyContentMap[justifyContent], autoFlow && gridAutoFlowMap[autoFlow],
+    css: [baseStyles,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    gap && spaceStylesMap.gap[gap],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    columnGap && spaceStylesMap.columnGap[columnGap],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    rowGap && spaceStylesMap.rowGap[rowGap], alignItems && alignItemsMap[alignItems], alignContent && alignContentMap[alignContent], justifyContent && justifyContentMap[justifyContent], autoFlow && gridAutoFlowMap[autoFlow],
     // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
     resolvedStyles.emotion],
     "data-testid": testId,

package/dist/es2019/components/pressable.js

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

package/dist/es2019/responsive/build-media-query-css.js

@@ -30,6 +30,7 @@ export const UNSAFE_buildAboveMediaQueryCSS = input => {
   return UNSAFE_BREAKPOINTS_ORDERED_LIST.reduce((acc, breakpoint) => ({
     ...acc,
     [breakpoint]: css({
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
       [media.above[breakpoint]]: typeof input === 'function' ? input(breakpoint) : input
     })
   }), {});
@@ -67,7 +68,7 @@ export const UNSAFE_buildBelowMediaQueryCSS = input => {
     return {
       ...acc,
       [breakpoint]: css({
-        // eslint-disable-next-line @atlaskit/design-system/no-nested-styles
+        // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
         [UNSAFE_media.below[breakpoint]]: typeof input === 'function' ? input(breakpoint) : input
       })
     };

package/dist/es2019/xcss/style-maps.partial.js

@@ -531,6 +531,7 @@ const spacingProperties = [
 const getSerializedStylesMap = (cssProperty, tokenMap) => {
   return Object.keys(tokenMap).reduce((emotionSpacingMap, token) => {
     emotionSpacingMap[token] = css({
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
       [cssProperty]: tokenMap[token]
     });
     return emotionSpacingMap;

package/dist/es2019/xcss/xcss.js

@@ -136,6 +136,7 @@ const transformStyles = styleObj => {
 const baseXcss = style => {
   const transformedStyles = transformStyles(style);
   return {
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
     [uniqueSymbol]: cssEmotion(transformedStyles)
   };
 };

package/dist/esm/components/anchor.js

@@ -2,8 +2,9 @@ import _extends from "@babel/runtime/helpers/extends";
 import _typeof from "@babel/runtime/helpers/typeof";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["href", "children", "backgroundColor", "padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "testId", "xcss", "target", "onClick", "interactionName", "componentName", "analyticsContext"];
+var _excluded = ["href", "children", "backgroundColor", "padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "testId", "xcss", "target", "onClick", "interactionName", "componentName", "analyticsContext", "aria-label", "aria-labelledby"];
 import React, { forwardRef, useCallback, useContext } from 'react';
+import { uid } from 'react-uid';
 import invariant from 'tiny-invariant';
 import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next';
 import { useRouterLink } from '@atlaskit/app-provider';
@@ -36,6 +37,7 @@ var focusRingStyles = xcss({
 });
 var IS_EXTERNAL_LINK_REGEX = /^(?:(http|https):\/\/)/;
 var IS_NON_HTTP_BASED = /^(((mailto|tel|sms):)|(#))/;
+var OPENS_NEW_WINDOW_LABEL = '(opens new window)';
 var AnchorNoRef = function AnchorNoRef(_ref, ref) {
   var href = _ref.href,
     children = _ref.children,
@@ -55,18 +57,25 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     interactionName = _ref.interactionName,
     componentName = _ref.componentName,
     analyticsContext = _ref.analyticsContext,
+    ariaLabel = _ref['aria-label'],
+    ariaLabelledBy = _ref['aria-labelledby'],
     htmlAttributes = _objectWithoutProperties(_ref, _excluded);
   var interactionContext = useContext(InteractionContext);
   var handleClick = useCallback(function (e, analyticsEvent) {
     interactionContext && interactionContext.tracePress(interactionName, e.timeStamp);
     providedOnClick(e, analyticsEvent);
   }, [providedOnClick, interactionContext, interactionName]);
+  // TODO: Use React 18's useId() hook when we update.
+  // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
+  var opensNewWindowLabelId = uid({
+    ariaLabelledBy: ariaLabelledBy
+  });
   var onClick = usePlatformLeafEventHandler({
     fn: handleClick,
     action: 'clicked',
     componentName: componentName || 'Anchor',
     packageName: "@atlaskit/primitives",
-    packageVersion: "7.0.2",
+    packageVersion: "7.1.0",
     analyticsData: analyticsContext,
     actionSubject: 'link'
   });
@@ -107,11 +116,15 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
     paddingInline: paddingInline,
     paddingInlineStart: paddingInlineStart,
     paddingInlineEnd: paddingInlineEnd,
-    onClick: onClick
+    onClick: onClick,
+    "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? "".concat(ariaLabel, " ").concat(OPENS_NEW_WINDOW_LABEL) : ariaLabel,
+    "aria-labelledby": ariaLabelledBy && target === '_blank' ? "".concat(ariaLabelledBy, " ").concat(opensNewWindowLabelId) : ariaLabelledBy
     // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
     ,
     xcss: styles
-  }), children, target === '_blank' && /*#__PURE__*/React.createElement(VisuallyHidden, null, "(opens new window)"));
+  }), children, target === '_blank' && (children && !ariaLabel && !ariaLabelledBy || ariaLabelledBy) && /*#__PURE__*/React.createElement(VisuallyHidden, {
+    id: opensNewWindowLabelId
+  }, OPENS_NEW_WINDOW_LABEL));
 };
 
 // Workarounds to support generic types with forwardRef

package/dist/esm/components/box.js

@@ -59,8 +59,26 @@ export var Box = /*#__PURE__*/forwardRef(function (_ref, ref) {
     className: resolvedStyles.static
     // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
   }, safeHtmlAttributes, {
-    css: [baseStyles, backgroundColor && backgroundColorStylesMap[backgroundColor], isSurfaceColorToken(backgroundColor) && surfaceColorStylesMap[backgroundColor], padding && paddingStylesMap.padding[padding], paddingBlock && paddingStylesMap.paddingBlock[paddingBlock], paddingBlockStart && paddingStylesMap.paddingBlockStart[paddingBlockStart], paddingBlockEnd && paddingStylesMap.paddingBlockEnd[paddingBlockEnd], paddingInline && paddingStylesMap.paddingInline[paddingInline], paddingInlineStart && paddingStylesMap.paddingInlineStart[paddingInlineStart], paddingInlineEnd && paddingStylesMap.paddingInlineEnd[paddingInlineEnd],
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    css: [baseStyles,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    backgroundColor && backgroundColorStylesMap[backgroundColor],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    isSurfaceColorToken(backgroundColor) && surfaceColorStylesMap[backgroundColor],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    padding && paddingStylesMap.padding[padding],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingBlock && paddingStylesMap.paddingBlock[paddingBlock],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingBlockStart && paddingStylesMap.paddingBlockStart[paddingBlockStart],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingBlockEnd && paddingStylesMap.paddingBlockEnd[paddingBlockEnd],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingInline && paddingStylesMap.paddingInline[paddingInline],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingInlineStart && paddingStylesMap.paddingInlineStart[paddingInlineStart],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    paddingInlineEnd && paddingStylesMap.paddingInlineEnd[paddingInlineEnd],
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
     resolvedStyles.emotion],
     "data-testid": testId
   }), children);

package/dist/esm/components/flex.js

@@ -104,7 +104,13 @@ var Flex = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref, ref) {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
     className: resolvedStyles.static,
-    css: [baseStyles, gap && spaceStylesMap.gap[gap], columnGap && spaceStylesMap.columnGap[columnGap], rowGap && spaceStylesMap.rowGap[rowGap], alignItems && alignItemsMap[alignItems], direction && flexDirectionMap[direction], justifyContent && justifyContentMap[justifyContent], wrap && flexWrapMap[wrap],
+    css: [baseStyles,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    gap && spaceStylesMap.gap[gap],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    columnGap && spaceStylesMap.columnGap[columnGap],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    rowGap && spaceStylesMap.rowGap[rowGap], alignItems && alignItemsMap[alignItems], direction && flexDirectionMap[direction], justifyContent && justifyContentMap[justifyContent], wrap && flexWrapMap[wrap],
     // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
     resolvedStyles.emotion],
     "data-testid": testId,

package/dist/esm/components/grid.js

@@ -169,7 +169,13 @@ var Grid = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref, ref) {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
     className: resolvedStyles.static,
-    css: [baseStyles, gap && spaceStylesMap.gap[gap], columnGap && spaceStylesMap.columnGap[columnGap], rowGap && spaceStylesMap.rowGap[rowGap], alignItems && alignItemsMap[alignItems], alignContent && alignContentMap[alignContent], justifyContent && justifyContentMap[justifyContent], autoFlow && gridAutoFlowMap[autoFlow],
+    css: [baseStyles,
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    gap && spaceStylesMap.gap[gap],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    columnGap && spaceStylesMap.columnGap[columnGap],
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    rowGap && spaceStylesMap.rowGap[rowGap], alignItems && alignItemsMap[alignItems], alignContent && alignContentMap[alignContent], justifyContent && justifyContentMap[justifyContent], autoFlow && gridAutoFlowMap[autoFlow],
     // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
     resolvedStyles.emotion],
     "data-testid": testId,

package/dist/esm/components/pressable.js

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

package/dist/types/components/anchor.d.ts

@@ -1,12 +1,8 @@
-import React, { type ReactNode, type Ref } from 'react';
+import React, { type Ref } from 'react';
 import { type UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { type RouterLinkComponentProps } from '@atlaskit/app-provider';
 import { type BoxProps } from './box';
-export type AnchorProps<RouterLinkConfig extends Record<string, any> = never> = RouterLinkComponentProps<RouterLinkConfig> & Omit<BoxProps<'a'>, 'href' | 'as' | 'children' | 'style' | 'onClick'> & {
-    /**
-     * `children` should be defined to ensure links have text.
-     */
-    children: ReactNode;
+export type AnchorProps<RouterLinkConfig extends Record<string, any> = never> = RouterLinkComponentProps<RouterLinkConfig> & Omit<BoxProps<'a'>, 'href' | 'as' | 'style' | 'onClick'> & {
     /**
      * Handler called on click. The second argument can be used to track analytics data. See the tutorial in the analytics-next package for details.
      */
@@ -26,7 +22,7 @@ export type AnchorProps<RouterLinkConfig extends Record<string, any> = never> =
      */
     analyticsContext?: Record<string, any>;
 };
-declare const AnchorNoRef: <RouterLinkConfig extends Record<string, any> = never>({ href, children, backgroundColor, padding, paddingBlock, paddingBlockStart, paddingBlockEnd, paddingInline, paddingInlineStart, paddingInlineEnd, testId, xcss: xcssStyles, target, onClick: providedOnClick, interactionName, componentName, analyticsContext, ...htmlAttributes }: AnchorProps<RouterLinkConfig>, ref: Ref<HTMLAnchorElement>) => JSX.Element;
+declare const AnchorNoRef: <RouterLinkConfig extends Record<string, any> = never>({ href, children, backgroundColor, padding, paddingBlock, paddingBlockStart, paddingBlockEnd, paddingInline, paddingInlineStart, paddingInlineEnd, testId, xcss: xcssStyles, target, onClick: providedOnClick, interactionName, componentName, analyticsContext, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...htmlAttributes }: AnchorProps<RouterLinkConfig>, ref: Ref<HTMLAnchorElement>) => JSX.Element;
 /**
  * __Anchor__
  *

package/dist/types/components/pressable.d.ts

@@ -1,12 +1,7 @@
-import React, { type ReactNode } from 'react';
+import React from 'react';
 import { type UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { type BoxProps } from './box';
-export type PressableProps = Omit<BoxProps<'button'>, 'disabled' | 'as' | 'children' | 'style' | 'onClick'> & {
-    /**
-     * `children` should be defined to ensure buttons are not empty,
-     * because they should have labels.
-     */
-    children: ReactNode;
+export type PressableProps = Omit<BoxProps<'button'>, 'disabled' | 'as' | 'style' | 'onClick'> & {
     isDisabled?: boolean;
     /**
      * Handler called on click. The second argument provides an Atlaskit UI analytics event that can be fired to a listening channel. See the ['analytics-next' package](https://atlaskit.atlassian.com/packages/analytics/analytics-next) documentation for more information.
@@ -34,12 +29,7 @@ export type PressableProps = Omit<BoxProps<'button'>, 'disabled' | 'as' | 'child
  * - [Code](https://atlassian.design/components/primitives/pressable/code)
  * - [Usage](https://atlassian.design/components/primitives/pressable/usage)
  */
-declare const Pressable: React.ForwardRefExoticComponent<Pick<Omit<BoxProps<"button">, "style" | "disabled" | "children" | "as" | "onClick"> & {
-    /**
-     * `children` should be defined to ensure buttons are not empty,
-     * because they should have labels.
-     */
-    children: ReactNode;
+declare const Pressable: React.ForwardRefExoticComponent<Pick<Omit<BoxProps<"button">, "style" | "disabled" | "as" | "onClick"> & {
     isDisabled?: boolean | undefined;
     /**
      * Handler called on click. The second argument provides an Atlaskit UI analytics event that can be fired to a listening channel. See the ['analytics-next' package](https://atlaskit.atlassian.com/packages/analytics/analytics-next) documentation for more information.

package/dist/types/xcss/style-maps.partial.d.ts

@@ -552,7 +552,7 @@ type MarginSpace = AllSpace | 'auto';
 type AutoComplete<T extends string> = T | Omit<string, T>;
 export type TokenisedProps = {
     backgroundColor?: BackgroundColor;
-    blockSize?: AutoComplete<Dimension>;
+    blockSize?: Dimension | string;
     borderBlockColor?: AutoComplete<BorderColor>;
     borderBlockEndColor?: AutoComplete<BorderColor>;
     borderBlockEndWidth?: BorderWidth | string;
@@ -589,8 +589,8 @@ export type TokenisedProps = {
     color?: TextColor;
     columnGap?: Space;
     gap?: Space;
-    height?: AutoComplete<Dimension>;
-    inlineSize?: AutoComplete<Dimension>;
+    height?: Dimension | string;
+    inlineSize?: Dimension | string;
     inset?: AutoComplete<AllSpace>;
     insetBlock?: AutoComplete<AllSpace>;
     insetBlockEnd?: AutoComplete<AllSpace>;
@@ -610,14 +610,14 @@ export type TokenisedProps = {
     marginLeft?: AutoComplete<MarginSpace>;
     marginRight?: AutoComplete<MarginSpace>;
     marginTop?: AutoComplete<MarginSpace>;
-    maxBlockSize?: AutoComplete<Dimension>;
-    maxHeight?: AutoComplete<Dimension>;
-    maxInlineSize?: AutoComplete<Dimension>;
-    maxWidth?: AutoComplete<Dimension>;
-    minBlockSize?: AutoComplete<Dimension>;
-    minHeight?: AutoComplete<Dimension>;
-    minInlineSize?: AutoComplete<Dimension>;
-    minWidth?: AutoComplete<Dimension>;
+    maxBlockSize?: Dimension | string;
+    maxHeight?: Dimension | string;
+    maxInlineSize?: Dimension | string;
+    maxWidth?: Dimension | string;
+    minBlockSize?: Dimension | string;
+    minHeight?: Dimension | string;
+    minInlineSize?: Dimension | string;
+    minWidth?: Dimension | string;
     opacity?: AutoComplete<Opacity> | number;
     outlineColor?: BorderColor;
     outlineOffset?: Space;
@@ -636,7 +636,7 @@ export type TokenisedProps = {
     right?: AutoComplete<AllSpace>;
     rowGap?: Space;
     top?: AutoComplete<AllSpace>;
-    width?: AutoComplete<Dimension>;
+    width?: Dimension | string;
     zIndex?: Layer;
 };
 declare const spacingProperties: readonly ["padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "gap", "rowGap", "columnGap"];

package/dist/types-ts4.5/components/anchor.d.ts

@@ -1,12 +1,8 @@
-import React, { type ReactNode, type Ref } from 'react';
+import React, { type Ref } from 'react';
 import { type UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { type RouterLinkComponentProps } from '@atlaskit/app-provider';
 import { type BoxProps } from './box';
-export type AnchorProps<RouterLinkConfig extends Record<string, any> = never> = RouterLinkComponentProps<RouterLinkConfig> & Omit<BoxProps<'a'>, 'href' | 'as' | 'children' | 'style' | 'onClick'> & {
-    /**
-     * `children` should be defined to ensure links have text.
-     */
-    children: ReactNode;
+export type AnchorProps<RouterLinkConfig extends Record<string, any> = never> = RouterLinkComponentProps<RouterLinkConfig> & Omit<BoxProps<'a'>, 'href' | 'as' | 'style' | 'onClick'> & {
     /**
      * Handler called on click. The second argument can be used to track analytics data. See the tutorial in the analytics-next package for details.
      */
@@ -26,7 +22,7 @@ export type AnchorProps<RouterLinkConfig extends Record<string, any> = never> =
      */
     analyticsContext?: Record<string, any>;
 };
-declare const AnchorNoRef: <RouterLinkConfig extends Record<string, any> = never>({ href, children, backgroundColor, padding, paddingBlock, paddingBlockStart, paddingBlockEnd, paddingInline, paddingInlineStart, paddingInlineEnd, testId, xcss: xcssStyles, target, onClick: providedOnClick, interactionName, componentName, analyticsContext, ...htmlAttributes }: AnchorProps<RouterLinkConfig>, ref: Ref<HTMLAnchorElement>) => JSX.Element;
+declare const AnchorNoRef: <RouterLinkConfig extends Record<string, any> = never>({ href, children, backgroundColor, padding, paddingBlock, paddingBlockStart, paddingBlockEnd, paddingInline, paddingInlineStart, paddingInlineEnd, testId, xcss: xcssStyles, target, onClick: providedOnClick, interactionName, componentName, analyticsContext, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...htmlAttributes }: AnchorProps<RouterLinkConfig>, ref: Ref<HTMLAnchorElement>) => JSX.Element;
 /**
  * __Anchor__
  *

package/dist/types-ts4.5/components/pressable.d.ts

@@ -1,12 +1,7 @@
-import React, { type ReactNode } from 'react';
+import React from 'react';
 import { type UIAnalyticsEvent } from '@atlaskit/analytics-next';
 import { type BoxProps } from './box';
-export type PressableProps = Omit<BoxProps<'button'>, 'disabled' | 'as' | 'children' | 'style' | 'onClick'> & {
-    /**
-     * `children` should be defined to ensure buttons are not empty,
-     * because they should have labels.
-     */
-    children: ReactNode;
+export type PressableProps = Omit<BoxProps<'button'>, 'disabled' | 'as' | 'style' | 'onClick'> & {
     isDisabled?: boolean;
     /**
      * Handler called on click. The second argument provides an Atlaskit UI analytics event that can be fired to a listening channel. See the ['analytics-next' package](https://atlaskit.atlassian.com/packages/analytics/analytics-next) documentation for more information.
@@ -34,12 +29,7 @@ export type PressableProps = Omit<BoxProps<'button'>, 'disabled' | 'as' | 'child
  * - [Code](https://atlassian.design/components/primitives/pressable/code)
  * - [Usage](https://atlassian.design/components/primitives/pressable/usage)
  */
-declare const Pressable: React.ForwardRefExoticComponent<Pick<Omit<BoxProps<"button">, "style" | "disabled" | "children" | "as" | "onClick"> & {
-    /**
-     * `children` should be defined to ensure buttons are not empty,
-     * because they should have labels.
-     */
-    children: ReactNode;
+declare const Pressable: React.ForwardRefExoticComponent<Pick<Omit<BoxProps<"button">, "style" | "disabled" | "as" | "onClick"> & {
     isDisabled?: boolean | undefined;
     /**
      * Handler called on click. The second argument provides an Atlaskit UI analytics event that can be fired to a listening channel. See the ['analytics-next' package](https://atlaskit.atlassian.com/packages/analytics/analytics-next) documentation for more information.

package/dist/types-ts4.5/xcss/style-maps.partial.d.ts

@@ -552,7 +552,7 @@ type MarginSpace = AllSpace | 'auto';
 type AutoComplete<T extends string> = T | Omit<string, T>;
 export type TokenisedProps = {
     backgroundColor?: BackgroundColor;
-    blockSize?: AutoComplete<Dimension>;
+    blockSize?: Dimension | string;
     borderBlockColor?: AutoComplete<BorderColor>;
     borderBlockEndColor?: AutoComplete<BorderColor>;
     borderBlockEndWidth?: BorderWidth | string;
@@ -589,8 +589,8 @@ export type TokenisedProps = {
     color?: TextColor;
     columnGap?: Space;
     gap?: Space;
-    height?: AutoComplete<Dimension>;
-    inlineSize?: AutoComplete<Dimension>;
+    height?: Dimension | string;
+    inlineSize?: Dimension | string;
     inset?: AutoComplete<AllSpace>;
     insetBlock?: AutoComplete<AllSpace>;
     insetBlockEnd?: AutoComplete<AllSpace>;
@@ -610,14 +610,14 @@ export type TokenisedProps = {
     marginLeft?: AutoComplete<MarginSpace>;
     marginRight?: AutoComplete<MarginSpace>;
     marginTop?: AutoComplete<MarginSpace>;
-    maxBlockSize?: AutoComplete<Dimension>;
-    maxHeight?: AutoComplete<Dimension>;
-    maxInlineSize?: AutoComplete<Dimension>;
-    maxWidth?: AutoComplete<Dimension>;
-    minBlockSize?: AutoComplete<Dimension>;
-    minHeight?: AutoComplete<Dimension>;
-    minInlineSize?: AutoComplete<Dimension>;
-    minWidth?: AutoComplete<Dimension>;
+    maxBlockSize?: Dimension | string;
+    maxHeight?: Dimension | string;
+    maxInlineSize?: Dimension | string;
+    maxWidth?: Dimension | string;
+    minBlockSize?: Dimension | string;
+    minHeight?: Dimension | string;
+    minInlineSize?: Dimension | string;
+    minWidth?: Dimension | string;
     opacity?: AutoComplete<Opacity> | number;
     outlineColor?: BorderColor;
     outlineOffset?: Space;
@@ -636,7 +636,7 @@ export type TokenisedProps = {
     right?: AutoComplete<AllSpace>;
     rowGap?: Space;
     top?: AutoComplete<AllSpace>;
-    width?: AutoComplete<Dimension>;
+    width?: Dimension | string;
     zIndex?: Layer;
 };
 declare const spacingProperties: readonly [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/primitives",
-  "version": "7.0.2",
+  "version": "7.1.0",
   "description": "Primitives are token-backed low-level building blocks.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -134,6 +134,7 @@
     "@emotion/react": "^11.7.1",
     "@emotion/serialize": "^1.1.0",
     "bind-event-listener": "^3.0.0",
+    "react-uid": "^2.2.0",
     "tiny-invariant": "^1.2.0"
   },
   "peerDependencies": {