@atlaskit/menu 1.4.7 → 1.4.8

package/dist/esm/menu-item/link-item.js

@@ -1,16 +1,15 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "href", "cssFn", "description", "iconAfter", "iconBefore", "isDisabled", "isSelected", "onClick", "testId", "overrides", "onMouseDown", "shouldTitleWrap", "shouldDescriptionWrap"];
-
 /** @jsx jsx */
 import { forwardRef, memo } from 'react';
 import { jsx } from '@emotion/react';
 import noop from '@atlaskit/ds-lib/noop';
 import MenuItemPrimitive from '../internal/components/menu-item-primitive';
-
 var preventEvent = function preventEvent(e) {
   e.preventDefault();
 };
+
 /**
  * __Link item__
  *
@@ -19,35 +18,31 @@ var preventEvent = function preventEvent(e) {
  * - [Examples](https://atlaskit.atlassian.com/packages/design-system/menu/docs/link-item)
  * - [Code](https://atlaskit.atlassian.com/packages/design-system/menu)
  */
-
-
-var LinkItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef( // Type needed on props to extract types with extract react types.
+var LinkItem = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(
+// Type needed on props to extract types with extract react types.
 function (props, ref) {
   var children = props.children,
-      href = props.href,
-      _props$cssFn = props.cssFn,
-      cssFn = _props$cssFn === void 0 ? noop : _props$cssFn,
-      description = props.description,
-      iconAfter = props.iconAfter,
-      iconBefore = props.iconBefore,
-      _props$isDisabled = props.isDisabled,
-      isDisabled = _props$isDisabled === void 0 ? false : _props$isDisabled,
-      _props$isSelected = props.isSelected,
-      isSelected = _props$isSelected === void 0 ? false : _props$isSelected,
-      onClick = props.onClick,
-      testId = props.testId,
-      overrides = props.overrides,
-      onMouseDown = props.onMouseDown,
-      shouldTitleWrap = props.shouldTitleWrap,
-      shouldDescriptionWrap = props.shouldDescriptionWrap,
-      rest = _objectWithoutProperties(props, _excluded);
-
+    href = props.href,
+    _props$cssFn = props.cssFn,
+    cssFn = _props$cssFn === void 0 ? noop : _props$cssFn,
+    description = props.description,
+    iconAfter = props.iconAfter,
+    iconBefore = props.iconBefore,
+    _props$isDisabled = props.isDisabled,
+    isDisabled = _props$isDisabled === void 0 ? false : _props$isDisabled,
+    _props$isSelected = props.isSelected,
+    isSelected = _props$isSelected === void 0 ? false : _props$isSelected,
+    onClick = props.onClick,
+    testId = props.testId,
+    overrides = props.overrides,
+    onMouseDown = props.onMouseDown,
+    shouldTitleWrap = props.shouldTitleWrap,
+    shouldDescriptionWrap = props.shouldDescriptionWrap,
+    rest = _objectWithoutProperties(props, _excluded);
   var onMouseDownHandler = onMouseDown;
-
   if (!children) {
     return null;
   }
-
   return jsx(MenuItemPrimitive, _extends({}, rest, {
     // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
     overrides: overrides,
@@ -58,7 +53,8 @@ function (props, ref) {
     description: description,
     shouldTitleWrap: shouldTitleWrap,
     shouldDescriptionWrap: shouldDescriptionWrap,
-    css: // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
+    css:
+    // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
     cssFn({
       isSelected: isSelected,
       isDisabled: isDisabled
@@ -66,7 +62,7 @@ function (props, ref) {
     title: children
   }), function (_ref) {
     var children = _ref.children,
-        className = _ref.className;
+      className = _ref.className;
     return jsx("a", _extends({
       "data-testid": testId
     }, rest, {

package/dist/esm/menu-item/skeleton-heading-item.js

@@ -1,14 +1,15 @@
 /** @jsx jsx */
+
 import { css, jsx } from '@emotion/react';
 import noop from '@atlaskit/ds-lib/noop';
 import { N20A } from '@atlaskit/theme/colors';
 import SkeletonShimmer from '../internal/components/skeleton-shimmer';
 var skeletonStyles = css({
-  padding: "var(--ds-scale-0, 0px)".concat(" ", "var(--ds-scale-250, 20px)"),
+  padding: "var(--ds-space-0, 0px)".concat(" ", "var(--ds-space-250, 20px)"),
   '::after': {
     display: 'block',
     width: '30%',
-    height: "var(--ds-scale-100, 8px)",
+    height: "var(--ds-space-100, 8px)",
     backgroundColor: "var(--ds-skeleton, ".concat(N20A, ")"),
     borderRadius: 100,
     content: '""'
@@ -24,6 +25,7 @@ var customWidthStyles = css({
     width: 'var(--width)'
   }
 });
+
 /**
  * __Skeleton heading item__
  *
@@ -32,14 +34,13 @@ var customWidthStyles = css({
  * - [Examples](https://atlaskit.atlassian.com/packages/design-system/menu/docs/skeleton-heading-item)
  * - [Code](https://atlaskit.atlassian.com/packages/design-system/menu)
  */
-
 var SkeletonHeadingItem = function SkeletonHeadingItem(_ref) {
   var _ref$isShimmering = _ref.isShimmering,
-      isShimmering = _ref$isShimmering === void 0 ? false : _ref$isShimmering,
-      testId = _ref.testId,
-      width = _ref.width,
-      _ref$cssFn = _ref.cssFn,
-      cssFn = _ref$cssFn === void 0 ? noop : _ref$cssFn;
+    isShimmering = _ref$isShimmering === void 0 ? false : _ref$isShimmering,
+    testId = _ref.testId,
+    width = _ref.width,
+    _ref$cssFn = _ref.cssFn,
+    cssFn = _ref$cssFn === void 0 ? noop : _ref$cssFn;
   return jsx(SkeletonShimmer, {
     isShimmering: isShimmering
   }, function (_ref2) {
@@ -49,12 +50,12 @@ var SkeletonHeadingItem = function SkeletonHeadingItem(_ref) {
       style: {
         '--width': width
       },
-      css: [skeletonStyles, width ? customWidthStyles : defaultWidthStyles, // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
+      css: [skeletonStyles, width ? customWidthStyles : defaultWidthStyles,
+      // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
       css(cssFn(undefined))],
       "data-ds--menu--skeleton-heading-item": true,
       "data-testid": testId
     });
   });
 };
-
 export default SkeletonHeadingItem;

package/dist/esm/menu-item/skeleton-item.js

@@ -1,4 +1,5 @@
 /** @jsx jsx */
+
 import { css, jsx } from '@emotion/react';
 import noop from '@atlaskit/ds-lib/noop';
 import { N20A } from '@atlaskit/theme/colors';
@@ -78,6 +79,7 @@ var iconStyles = css({
     borderRadius: borderRadius
   }
 });
+
 /**
  * __Skeleton item__
  *
@@ -86,16 +88,15 @@ var iconStyles = css({
  * - [Examples](https://atlaskit.atlassian.com/packages/design-system/menu/docs/skeleton-item)
  * - [Code](https://atlaskit.atlassian.com/packages/design-system/menu)
  */
-
 var SkeletonItem = function SkeletonItem(_ref) {
   var hasAvatar = _ref.hasAvatar,
-      hasIcon = _ref.hasIcon,
-      _ref$isShimmering = _ref.isShimmering,
-      isShimmering = _ref$isShimmering === void 0 ? false : _ref$isShimmering,
-      testId = _ref.testId,
-      width = _ref.width,
-      _ref$cssFn = _ref.cssFn,
-      cssFn = _ref$cssFn === void 0 ? noop : _ref$cssFn;
+    hasIcon = _ref.hasIcon,
+    _ref$isShimmering = _ref.isShimmering,
+    isShimmering = _ref$isShimmering === void 0 ? false : _ref$isShimmering,
+    testId = _ref.testId,
+    width = _ref.width,
+    _ref$cssFn = _ref.cssFn,
+    cssFn = _ref$cssFn === void 0 ? noop : _ref$cssFn;
   return jsx(SkeletonShimmer, {
     isShimmering: isShimmering
   }, function (_ref2) {
@@ -105,11 +106,11 @@ var SkeletonItem = function SkeletonItem(_ref) {
       style: {
         '--width': width
       },
-      css: [skeletonStyles, (hasAvatar || hasIcon) && beforeElementStyles, hasAvatar && avatarStyles, hasIcon && iconStyles, width ? customWidthStyles : defaultWidthStyles, // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
+      css: [skeletonStyles, (hasAvatar || hasIcon) && beforeElementStyles, hasAvatar && avatarStyles, hasIcon && iconStyles, width ? customWidthStyles : defaultWidthStyles,
+      // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
       css(cssFn())],
       "data-testid": testId
     });
   });
 };
-
 export default SkeletonItem;

package/dist/esm/menu-section/menu-group.js

@@ -1,11 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["maxWidth", "minWidth", "minHeight", "maxHeight", "testId", "role"];
-
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
 import { UNSAFE_Box as Box } from '@atlaskit/ds-explorations';
-
 /**
  * __Menu group__
  *
@@ -16,14 +14,14 @@ import { UNSAFE_Box as Box } from '@atlaskit/ds-explorations';
  */
 var MenuGroup = function MenuGroup(_ref) {
   var maxWidth = _ref.maxWidth,
-      minWidth = _ref.minWidth,
-      minHeight = _ref.minHeight,
-      maxHeight = _ref.maxHeight,
-      testId = _ref.testId,
-      role = _ref.role,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
-  return (// @ts-ignore type of rest/children needs to be made stricter to fit in Box -- string shouldn't be allowed
+    minWidth = _ref.minWidth,
+    minHeight = _ref.minHeight,
+    maxHeight = _ref.maxHeight,
+    testId = _ref.testId,
+    role = _ref.role,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return (
+    // @ts-ignore type of rest/children needs to be made stricter to fit in Box -- string shouldn't be allowed
     jsx(Box, _extends({
       UNSAFE_style: {
         minWidth: minWidth,
@@ -36,10 +34,9 @@ var MenuGroup = function MenuGroup(_ref) {
       overflow: "auto",
       testId: testId,
       role: role,
-      position: "static" // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
-
+      position: "static"
+      // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
     }, rest))
   );
 };
-
 export default MenuGroup;

package/dist/esm/menu-section/popup-menu-group.js

@@ -1,27 +1,25 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["maxWidth", "minWidth"];
-
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
 import MenuGroup from './menu-group';
+
 /**
  * @deprecated
  */
-
 var PopupMenuGroup = function PopupMenuGroup(_ref) {
   var _ref$maxWidth = _ref.maxWidth,
-      maxWidth = _ref$maxWidth === void 0 ? 800 : _ref$maxWidth,
-      _ref$minWidth = _ref.minWidth,
-      minWidth = _ref$minWidth === void 0 ? 320 : _ref$minWidth,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
-  return (// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+    maxWidth = _ref$maxWidth === void 0 ? 800 : _ref$maxWidth,
+    _ref$minWidth = _ref.minWidth,
+    minWidth = _ref$minWidth === void 0 ? 320 : _ref$minWidth,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return (
+    // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
     jsx(MenuGroup, _extends({
       maxWidth: maxWidth,
       minWidth: minWidth
     }, rest))
   );
 };
-
 export default PopupMenuGroup;

package/dist/esm/menu-section/section.js

@@ -1,7 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "overrides", "title", "testId", "isScrollable", "hasSeparator", "id"];
-
 /** @jsx jsx */
 import { forwardRef, Fragment } from 'react';
 import { css, jsx } from '@emotion/react';
@@ -11,15 +10,15 @@ import { headingSizes } from '@atlaskit/theme/typography';
 import HeadingItem from '../menu-item/heading-item';
 var gridSize = gridSizeFn();
 var itemHeadingTopMargin = gridSize * 2.5;
-var itemHeadingBottomMargin = gridSize * 0.75; // Skeleton content is slightly shorter than the real content.
+var itemHeadingBottomMargin = gridSize * 0.75;
+// Skeleton content is slightly shorter than the real content.
 // Because of that we slightly increase the top margin to offset this so the
 // containing size both real and skeleton always equal approx 30px.
-
 var itemHeadingContentHeight = headingSizes.h100.lineHeight;
 var skeletonHeadingHeight = gridSize;
 var skeletonHeadingMarginOffset = 3;
-var skeletonHeadingTopMargin = itemHeadingTopMargin + (itemHeadingContentHeight - skeletonHeadingHeight) - skeletonHeadingMarginOffset; // We want to move the entire body up by 3px without affecting the height of the skeleton container.
-
+var skeletonHeadingTopMargin = itemHeadingTopMargin + (itemHeadingContentHeight - skeletonHeadingHeight) - skeletonHeadingMarginOffset;
+// We want to move the entire body up by 3px without affecting the height of the skeleton container.
 var skeletonHeadingBottomMargin = itemHeadingBottomMargin + skeletonHeadingMarginOffset;
 var sectionPaddingTopBottom = gridSize * 0.75;
 var VAR_SEPARATOR_COLOR = '--ds-menu-seperator-color';
@@ -70,6 +69,7 @@ var noSeparatorStyles = css({
     marginTop: -6
   }
 });
+
 /**
  * __Section__
  *
@@ -78,25 +78,25 @@ var noSeparatorStyles = css({
  * - [Examples](https://atlaskit.atlassian.com/packages/design-system/menu/docs/section)
  * - [Code](https://atlaskit.atlassian.com/packages/design-system/menu)
  */
-
 var Section = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var children = _ref.children,
-      overrides = _ref.overrides,
-      title = _ref.title,
-      testId = _ref.testId,
-      isScrollable = _ref.isScrollable,
-      hasSeparator = _ref.hasSeparator,
-      id = _ref.id,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
-  var childrenMarkup = title !== undefined ? jsx(Fragment, null, jsx(HeadingItem // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
+    overrides = _ref.overrides,
+    title = _ref.title,
+    testId = _ref.testId,
+    isScrollable = _ref.isScrollable,
+    hasSeparator = _ref.hasSeparator,
+    id = _ref.id,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var childrenMarkup = title !== undefined ? jsx(Fragment, null, jsx(HeadingItem
+  // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
   , {
     cssFn: overrides && overrides.HeadingItem && overrides.HeadingItem.cssFn,
     testId: testId && "".concat(testId, "--heading"),
     "aria-hidden": true
   }, title), children) : children;
   return jsx("div", _extends({}, rest, {
-    id: id // NOTE: Firefox allows elements that have "overflow: auto" to gain focus (as if it had tab-index="0")
+    id: id
+    // NOTE: Firefox allows elements that have "overflow: auto" to gain focus (as if it had tab-index="0")
     // We have made a deliberate choice to leave this behaviour as is.
     ,
     css: [sectionStyles, isScrollable ? scrollableStyles : unscrollableStyles, hasSeparator ? separatorStyles : noSeparatorStyles],

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/menu",
-	"version": "1.4.7",
+	"version": "1.4.8",
 	"sideEffects": false
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/menu",
-  "version": "1.4.7",
+  "version": "1.4.8",
   "description": "A collection of composable menu components that can be used anywhere.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"