@atlaskit/button 18.4.1 → 19.1.0

package/CHANGELOG.md

@@ -1,5 +1,59 @@
 # @atlaskit/button
 
+## 19.1.0
+
+### Minor Changes
+
+- [#123598](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/123598)
+  [`83919d6adb836`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/83919d6adb836) -
+  Remove unsafe spread on new buttons.
+
+## 19.0.0
+
+### Major Changes
+
+- [#120669](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/120669)
+  [`9e1c531090ea4`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/9e1c531090ea4) -
+  Removed these deprecated props for overriding icon sizes:
+
+  - `UNSAFE_size`
+  - `UNSAFE_iconBefore_size`
+  - `UNSAFE_iconAfter_size`
+
+  See
+  [the examples for overriding icon props](https://atlassian.design/components/button/examples#overriding-icon-props)
+  for the new method of customizing icon sizes in buttons. To automate migration of these props, use
+  [the button codemod](https://atlassian.design/components/button/button-legacy/migration-guide#use-the-codemod-for-automated-migration-assistance).
+
+- [#121331](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/121331)
+  [`a8c984f9b3956`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/a8c984f9b3956) -
+  ButtonGroup's deprecated `appearance` prop has been removed. Apply the `appearance` prop on each
+  button instead.
+
+  **Before**:
+
+  ```jsx
+  <ButtonGroup appearance="primary">
+  	<Button>First button</Button>
+  	<Button>Second button</Button>
+  	<Button>Third button</Button>
+  </ButtonGroup>
+  ```
+
+  **After**:
+
+  ```jsx
+  <ButtonGroup>
+  	<Button appearance="primary">First button</Button>
+  	<Button appearance="primary">Second button</Button>
+  	<Button appearance="primary">Third button</Button>
+  </ButtonGroup>
+  ```
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 18.4.1
 
 ### Patch Changes

package/dist/cjs/containers/button-group.js

@@ -11,8 +11,8 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 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 && 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; }
 /**
  * @jsxRuntime classic
+ * @jsx jsx
  */
-/** @jsx jsx */
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
@@ -25,8 +25,7 @@ var buttonGroupStyles = (0, _react2.css)({
   }
 });
 function ButtonGroup(_ref) {
-  var appearance = _ref.appearance,
-    children = _ref.children,
+  var children = _ref.children,
     testId = _ref.testId,
     label = _ref.label,
     titleId = _ref.titleId;
@@ -42,11 +41,6 @@ function ButtonGroup(_ref) {
     }
     return (0, _react2.jsx)(_react.Fragment, {
       key: idx
-    }, appearance ?
-    /*#__PURE__*/
-    // eslint-disable-next-line @repo/internal/react/no-clone-element
-    _react.default.cloneElement(child, {
-      appearance: appearance
-    }) : child);
+    }, child);
   }));
 }

package/dist/cjs/new-button/containers/split-button/split-button.js

@@ -10,8 +10,8 @@ var _splitButtonContext = require("./split-button-context");
 var _utils = require("./utils");
 /**
  * @jsxRuntime classic
+ * @jsx jsx
  */
-/** @jsx jsx */
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 
@@ -79,7 +79,7 @@ var Divider = exports.Divider = function Divider(_ref) {
   return (
     // I find it funny to provide a div for Divider
     (0, _react.jsx)("div", {
-      css: [baseDividerStyles, dividerHeight[spacing], isDisabled && ((0, _platformFeatureFlags.fg)('platform.design-system-team.component-visual-refresh_t8zbo') ? dividerDisabledRefreshedStyles : dividerDisabledStyles), !isDisabled && dividerAppearance[appearance], (0, _platformFeatureFlags.fg)('platform.design-system-team.component-visual-refresh_t8zbo') && dividerRefreshedOffsetStyles]
+      css: [baseDividerStyles, dividerHeight[spacing], isDisabled && ((0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? dividerDisabledRefreshedStyles : dividerDisabledStyles), !isDisabled && dividerAppearance[appearance], (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && dividerRefreshedOffsetStyles]
     })
   );
 };
@@ -120,7 +120,7 @@ var SplitButtonContainer = exports.SplitButtonContainer = function SplitButtonCo
     _ref2$isDisabled = _ref2.isDisabled,
     isDisabled = _ref2$isDisabled === void 0 ? false : _ref2$isDisabled;
   return (0, _react.jsx)("div", {
-    css: [appearance === 'default' && !isDisabled && (0, _platformFeatureFlags.fg)('platform.design-system-team.component-visual-refresh_t8zbo') && defaultAppearanceContainerStyles, splitButtonStyles]
+    css: [appearance === 'default' && !isDisabled && (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && defaultAppearanceContainerStyles, splitButtonStyles]
   }, children);
 };
 

package/dist/cjs/new-button/variants/default/button.js

@@ -8,10 +8,9 @@ exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _pressable = _interopRequireDefault(require("@atlaskit/primitives/pressable"));
 var _useDefaultButton = _interopRequireDefault(require("./use-default-button"));
-var _excluded = ["analyticsContext", "appearance", "aria-label", "aria-labelledby", "autoFocus", "children", "iconAfter", "iconBefore", "interactionName", "isDisabled", "isLoading", "isSelected", "onClick", "onClickCapture", "onKeyDownCapture", "onKeyUpCapture", "onMouseDownCapture", "onMouseUpCapture", "onPointerDownCapture", "onPointerUpCapture", "onTouchEndCapture", "onTouchStartCapture", "shouldFitContainer", "spacing", "testId", "type", "UNSAFE_iconAfter_size", "UNSAFE_iconBefore_size"],
+var _excluded = ["analyticsContext", "appearance", "aria-label", "aria-labelledby", "autoFocus", "children", "iconAfter", "iconBefore", "interactionName", "isDisabled", "isLoading", "isSelected", "onClick", "onClickCapture", "onKeyDownCapture", "onKeyUpCapture", "onMouseDownCapture", "onMouseUpCapture", "onPointerDownCapture", "onPointerUpCapture", "onTouchEndCapture", "onTouchStartCapture", "shouldFitContainer", "spacing", "testId", "type"],
   _excluded2 = ["className", "css", "as", "style"];
 /**
  * __Button__
@@ -50,8 +49,6 @@ var Button = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
     testId = _ref.testId,
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? 'button' : _ref$type,
-    UNSAFE_iconAfter_size = _ref.UNSAFE_iconAfter_size,
-    UNSAFE_iconBefore_size = _ref.UNSAFE_iconBefore_size,
     unsafeRest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   // @ts-expect-error
   var _className = unsafeRest.className,
@@ -59,7 +56,6 @@ var Button = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
     _as = unsafeRest.as,
     _style = unsafeRest.style,
     saferRest = (0, _objectWithoutProperties2.default)(unsafeRest, _excluded2);
-  var rest = (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.remove-unsafe-spread-from-new-button_a2xhw') ? saferRest : unsafeRest;
   var baseProps = (0, _useDefaultButton.default)({
     ariaLabel: ariaLabel,
     ariaLabelledBy: ariaLabelledBy,
@@ -87,13 +83,11 @@ var Button = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
     ref: ref,
     shouldFitContainer: shouldFitContainer,
     spacing: spacing,
-    testId: testId,
-    UNSAFE_iconAfter_size: UNSAFE_iconAfter_size,
-    UNSAFE_iconBefore_size: UNSAFE_iconBefore_size
+    testId: testId
   });
   return /*#__PURE__*/_react.default.createElement(_pressable.default
   // TODO: Remove spread props
-  , (0, _extends2.default)({}, rest, {
+  , (0, _extends2.default)({}, saferRest, {
     "aria-label": baseProps['aria-label'],
     "aria-labelledby": baseProps['aria-labelledby'],
     ref: baseProps.ref,

package/dist/cjs/new-button/variants/default/link.js

@@ -9,10 +9,9 @@ exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _anchor = _interopRequireDefault(require("@atlaskit/primitives/anchor"));
 var _useDefaultButton = _interopRequireDefault(require("./use-default-button"));
-var _excluded = ["analyticsContext", "appearance", "aria-label", "aria-labelledby", "autoFocus", "children", "href", "iconAfter", "iconBefore", "interactionName", "isDisabled", "isSelected", "onClick", "onClickCapture", "onKeyDownCapture", "onKeyUpCapture", "onMouseDownCapture", "onMouseUpCapture", "onPointerDownCapture", "onPointerUpCapture", "onTouchEndCapture", "onTouchStartCapture", "shouldFitContainer", "spacing", "testId", "UNSAFE_iconAfter_size", "UNSAFE_iconBefore_size"],
+var _excluded = ["analyticsContext", "appearance", "aria-label", "aria-labelledby", "autoFocus", "children", "href", "iconAfter", "iconBefore", "interactionName", "isDisabled", "isSelected", "onClick", "onClickCapture", "onKeyDownCapture", "onKeyUpCapture", "onMouseDownCapture", "onMouseUpCapture", "onPointerDownCapture", "onPointerUpCapture", "onTouchEndCapture", "onTouchStartCapture", "shouldFitContainer", "spacing", "testId"],
   _excluded2 = ["className", "css", "as", "style"];
 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 && 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; }
@@ -42,8 +41,6 @@ var LinkButtonBase = function LinkButtonBase(_ref, ref) {
     shouldFitContainer = _ref.shouldFitContainer,
     spacing = _ref.spacing,
     testId = _ref.testId,
-    UNSAFE_iconAfter_size = _ref.UNSAFE_iconAfter_size,
-    UNSAFE_iconBefore_size = _ref.UNSAFE_iconBefore_size,
     unsafeRest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   // @ts-expect-error
   var _className = unsafeRest.className,
@@ -51,7 +48,6 @@ var LinkButtonBase = function LinkButtonBase(_ref, ref) {
     _as = unsafeRest.as,
     _style = unsafeRest.style,
     saferRest = (0, _objectWithoutProperties2.default)(unsafeRest, _excluded2);
-  var rest = (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.remove-unsafe-spread-from-new-button_a2xhw') ? saferRest : unsafeRest;
   var baseProps = (0, _useDefaultButton.default)({
     analyticsContext: analyticsContext,
     appearance: appearance,
@@ -78,13 +74,11 @@ var LinkButtonBase = function LinkButtonBase(_ref, ref) {
     ref: ref,
     shouldFitContainer: shouldFitContainer,
     spacing: spacing,
-    testId: testId,
-    UNSAFE_iconAfter_size: UNSAFE_iconAfter_size,
-    UNSAFE_iconBefore_size: UNSAFE_iconBefore_size
+    testId: testId
   });
   return /*#__PURE__*/_react.default.createElement(_anchor.default
   // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
-  , (0, _extends2.default)({}, rest, {
+  , (0, _extends2.default)({}, saferRest, {
     "aria-label": baseProps['aria-label'],
     "aria-labelledby": baseProps['aria-labelledby'],
     ref: baseProps.ref,

package/dist/cjs/new-button/variants/default/use-default-button.js

@@ -49,9 +49,7 @@ var useDefaultButton = function useDefaultButton(_ref) {
     ref = _ref.ref,
     shouldFitContainer = _ref.shouldFitContainer,
     spacing = _ref.spacing,
-    testId = _ref.testId,
-    UNSAFE_iconAfter_size = _ref.UNSAFE_iconAfter_size,
-    UNSAFE_iconBefore_size = _ref.UNSAFE_iconBefore_size;
+    testId = _ref.testId;
   var baseProps = (0, _useButtonBase.default)({
     analyticsContext: analyticsContext,
     appearance: appearance,
@@ -64,8 +62,7 @@ var useDefaultButton = function useDefaultButton(_ref) {
       position: "before",
       isLoading: isLoading
     }, /*#__PURE__*/_react.default.createElement(_iconRenderer.default, {
-      icon: iconBefore,
-      size: UNSAFE_iconBefore_size
+      icon: iconBefore
     })), children && /*#__PURE__*/_react.default.createElement(_content.default, {
       isLoading: isLoading
     }, children), iconAfter && /*#__PURE__*/_react.default.createElement(_content.default, {
@@ -73,8 +70,7 @@ var useDefaultButton = function useDefaultButton(_ref) {
       position: "after",
       isLoading: isLoading
     }, /*#__PURE__*/_react.default.createElement(_iconRenderer.default, {
-      icon: iconAfter,
-      size: UNSAFE_iconAfter_size
+      icon: iconAfter
     }))),
     interactionName: interactionName,
     isDisabled: isDisabled,

package/dist/cjs/new-button/variants/icon/button.js

@@ -8,11 +8,10 @@ exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _pressable = _interopRequireDefault(require("@atlaskit/primitives/pressable"));
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _useIconButton = _interopRequireDefault(require("./use-icon-button"));
-var _excluded = ["aria-label", "aria-labelledby", "analyticsContext", "appearance", "autoFocus", "icon", "interactionName", "isDisabled", "isLoading", "isSelected", "isTooltipDisabled", "label", "onClick", "onClickCapture", "onKeyDownCapture", "onKeyUpCapture", "onMouseDownCapture", "onMouseUpCapture", "onPointerDownCapture", "onPointerUpCapture", "onTouchEndCapture", "onTouchStartCapture", "shape", "spacing", "testId", "tooltip", "type", "UNSAFE_size"],
+var _excluded = ["aria-label", "aria-labelledby", "analyticsContext", "appearance", "autoFocus", "icon", "interactionName", "isDisabled", "isLoading", "isSelected", "isTooltipDisabled", "label", "onClick", "onClickCapture", "onKeyDownCapture", "onKeyUpCapture", "onMouseDownCapture", "onMouseUpCapture", "onPointerDownCapture", "onPointerUpCapture", "onTouchEndCapture", "onTouchStartCapture", "shape", "spacing", "testId", "tooltip", "type"],
   _excluded2 = ["className", "css", "as", "style"];
 /**
  * __Icon Button__
@@ -53,7 +52,6 @@ var IconButton = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
     tooltip = _ref.tooltip,
     _ref$type = _ref.type,
     type = _ref$type === void 0 ? 'button' : _ref$type,
-    UNSAFE_size = _ref.UNSAFE_size,
     unsafeRest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   // @ts-expect-error
   var _className = unsafeRest.className,
@@ -61,7 +59,6 @@ var IconButton = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
     _as = unsafeRest.as,
     _style = unsafeRest.style,
     saferRest = (0, _objectWithoutProperties2.default)(unsafeRest, _excluded2);
-  var rest = (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.remove-unsafe-spread-from-new-button_a2xhw') ? saferRest : unsafeRest;
 
   /**
    * TODO: At some stage I'll look into re-using more logic across 'default' and 'icon'
@@ -92,8 +89,7 @@ var IconButton = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
     ref: ref,
     shape: shape,
     spacing: spacing,
-    testId: testId,
-    UNSAFE_size: UNSAFE_size
+    testId: testId
   });
   if (!isTooltipDisabled) {
     var _tooltip$content;
@@ -113,7 +109,7 @@ var IconButton = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
       hideTooltipOnClick: tooltip === null || tooltip === void 0 ? void 0 : tooltip.hideTooltipOnClick,
       hideTooltipOnMouseDown: tooltip === null || tooltip === void 0 ? void 0 : tooltip.hideTooltipOnMouseDown
     }, function (triggerProps) {
-      return /*#__PURE__*/_react.default.createElement(_pressable.default, (0, _extends2.default)({}, rest, {
+      return /*#__PURE__*/_react.default.createElement(_pressable.default, (0, _extends2.default)({}, saferRest, {
         // Top level props
         "aria-labelledby": baseProps['aria-labelledby'],
         type: type,
@@ -124,34 +120,34 @@ var IconButton = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
         // Shared between tooltip and native props
         ,
         onMouseOver: function onMouseOver(e) {
-          var _triggerProps$onMouse, _rest$onMouseOver;
+          var _triggerProps$onMouse, _saferRest$onMouseOve;
           (_triggerProps$onMouse = triggerProps.onMouseOver) === null || _triggerProps$onMouse === void 0 || _triggerProps$onMouse.call(triggerProps, e);
-          (_rest$onMouseOver = rest.onMouseOver) === null || _rest$onMouseOver === void 0 || _rest$onMouseOver.call(rest, e);
+          (_saferRest$onMouseOve = saferRest.onMouseOver) === null || _saferRest$onMouseOve === void 0 || _saferRest$onMouseOve.call(saferRest, e);
         },
         onMouseOut: function onMouseOut(e) {
-          var _triggerProps$onMouse2, _rest$onMouseOut;
+          var _triggerProps$onMouse2, _saferRest$onMouseOut;
           (_triggerProps$onMouse2 = triggerProps.onMouseOut) === null || _triggerProps$onMouse2 === void 0 || _triggerProps$onMouse2.call(triggerProps, e);
-          (_rest$onMouseOut = rest.onMouseOut) === null || _rest$onMouseOut === void 0 || _rest$onMouseOut.call(rest, e);
+          (_saferRest$onMouseOut = saferRest.onMouseOut) === null || _saferRest$onMouseOut === void 0 || _saferRest$onMouseOut.call(saferRest, e);
         },
         onMouseMove: function onMouseMove(e) {
-          var _triggerProps$onMouse3, _rest$onMouseMove;
+          var _triggerProps$onMouse3, _saferRest$onMouseMov;
           (_triggerProps$onMouse3 = triggerProps.onMouseMove) === null || _triggerProps$onMouse3 === void 0 || _triggerProps$onMouse3.call(triggerProps, e);
-          (_rest$onMouseMove = rest.onMouseMove) === null || _rest$onMouseMove === void 0 || _rest$onMouseMove.call(rest, e);
+          (_saferRest$onMouseMov = saferRest.onMouseMove) === null || _saferRest$onMouseMov === void 0 || _saferRest$onMouseMov.call(saferRest, e);
         },
         onMouseDown: function onMouseDown(e) {
-          var _triggerProps$onMouse4, _rest$onMouseDown;
+          var _triggerProps$onMouse4, _saferRest$onMouseDow;
           (_triggerProps$onMouse4 = triggerProps.onMouseDown) === null || _triggerProps$onMouse4 === void 0 || _triggerProps$onMouse4.call(triggerProps, e);
-          (_rest$onMouseDown = rest.onMouseDown) === null || _rest$onMouseDown === void 0 || _rest$onMouseDown.call(rest, e);
+          (_saferRest$onMouseDow = saferRest.onMouseDown) === null || _saferRest$onMouseDow === void 0 || _saferRest$onMouseDow.call(saferRest, e);
         },
         onFocus: function onFocus(e) {
-          var _triggerProps$onFocus, _rest$onFocus;
+          var _triggerProps$onFocus, _saferRest$onFocus;
           (_triggerProps$onFocus = triggerProps.onFocus) === null || _triggerProps$onFocus === void 0 || _triggerProps$onFocus.call(triggerProps, e);
-          (_rest$onFocus = rest.onFocus) === null || _rest$onFocus === void 0 || _rest$onFocus.call(rest, e);
+          (_saferRest$onFocus = saferRest.onFocus) === null || _saferRest$onFocus === void 0 || _saferRest$onFocus.call(saferRest, e);
         },
         onBlur: function onBlur(e) {
-          var _triggerProps$onBlur, _rest$onBlur;
+          var _triggerProps$onBlur, _saferRest$onBlur;
           (_triggerProps$onBlur = triggerProps.onBlur) === null || _triggerProps$onBlur === void 0 || _triggerProps$onBlur.call(triggerProps, e);
-          (_rest$onBlur = rest.onBlur) === null || _rest$onBlur === void 0 || _rest$onBlur.call(rest, e);
+          (_saferRest$onBlur = saferRest.onBlur) === null || _saferRest$onBlur === void 0 || _saferRest$onBlur.call(saferRest, e);
         }
         // Shared between tooltip and base props
         ,
@@ -181,7 +177,7 @@ var IconButton = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.f
       }), baseProps.children);
     });
   }
-  return /*#__PURE__*/_react.default.createElement(_pressable.default, (0, _extends2.default)({}, rest, {
+  return /*#__PURE__*/_react.default.createElement(_pressable.default, (0, _extends2.default)({}, saferRest, {
     "aria-labelledby": baseProps['aria-labelledby'],
     ref: baseProps.ref,
     xcss: baseProps.xcss,

package/dist/cjs/new-button/variants/icon/link.js

@@ -9,11 +9,10 @@ exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _anchor = _interopRequireDefault(require("@atlaskit/primitives/anchor"));
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _useIconButton = _interopRequireDefault(require("./use-icon-button"));
-var _excluded = ["aria-label", "aria-labelledby", "analyticsContext", "appearance", "autoFocus", "href", "icon", "interactionName", "isDisabled", "isSelected", "isTooltipDisabled", "label", "onClick", "onClickCapture", "onKeyDownCapture", "onKeyUpCapture", "onMouseDownCapture", "onMouseUpCapture", "onPointerDownCapture", "onPointerUpCapture", "onTouchEndCapture", "onTouchStartCapture", "shape", "spacing", "testId", "tooltip", "UNSAFE_size"],
+var _excluded = ["aria-label", "aria-labelledby", "analyticsContext", "appearance", "autoFocus", "href", "icon", "interactionName", "isDisabled", "isSelected", "isTooltipDisabled", "label", "onClick", "onClickCapture", "onKeyDownCapture", "onKeyUpCapture", "onMouseDownCapture", "onMouseUpCapture", "onPointerDownCapture", "onPointerUpCapture", "onTouchEndCapture", "onTouchStartCapture", "shape", "spacing", "testId", "tooltip"],
   _excluded2 = ["className", "css", "as", "style"];
 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 && 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; }
@@ -45,7 +44,6 @@ var LinkIconButtonBase = function LinkIconButtonBase(_ref, ref) {
     spacing = _ref.spacing,
     testId = _ref.testId,
     tooltip = _ref.tooltip,
-    UNSAFE_size = _ref.UNSAFE_size,
     unsafeRest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   // @ts-expect-error
   var _className = unsafeRest.className,
@@ -53,7 +51,6 @@ var LinkIconButtonBase = function LinkIconButtonBase(_ref, ref) {
     _as = unsafeRest.as,
     _style = unsafeRest.style,
     saferRest = (0, _objectWithoutProperties2.default)(unsafeRest, _excluded2);
-  var rest = (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.remove-unsafe-spread-from-new-button_a2xhw') ? saferRest : unsafeRest;
   var baseProps = (0, _useIconButton.default)({
     analyticsContext: analyticsContext,
     appearance: appearance,
@@ -78,8 +75,7 @@ var LinkIconButtonBase = function LinkIconButtonBase(_ref, ref) {
     ref: ref,
     shape: shape,
     spacing: spacing,
-    testId: testId,
-    UNSAFE_size: UNSAFE_size
+    testId: testId
   });
   if (!isTooltipDisabled) {
     var _tooltip$content;
@@ -101,7 +97,7 @@ var LinkIconButtonBase = function LinkIconButtonBase(_ref, ref) {
     }, function (triggerProps) {
       return /*#__PURE__*/_react.default.createElement(_anchor.default
       // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
-      , (0, _extends2.default)({}, rest, {
+      , (0, _extends2.default)({}, saferRest, {
         "aria-labelledby": baseProps['aria-labelledby'],
         testId: testId,
         componentName: "LinkIconButton",
@@ -110,34 +106,34 @@ var LinkIconButtonBase = function LinkIconButtonBase(_ref, ref) {
         // Shared between tooltip and native props
         ,
         onMouseOver: function onMouseOver(e) {
-          var _triggerProps$onMouse, _rest$onMouseOver;
+          var _triggerProps$onMouse, _saferRest$onMouseOve;
           (_triggerProps$onMouse = triggerProps.onMouseOver) === null || _triggerProps$onMouse === void 0 || _triggerProps$onMouse.call(triggerProps, e);
-          (_rest$onMouseOver = rest.onMouseOver) === null || _rest$onMouseOver === void 0 || _rest$onMouseOver.call(rest, e);
+          (_saferRest$onMouseOve = saferRest.onMouseOver) === null || _saferRest$onMouseOve === void 0 || _saferRest$onMouseOve.call(saferRest, e);
         },
         onMouseOut: function onMouseOut(e) {
-          var _triggerProps$onMouse2, _rest$onMouseOut;
+          var _triggerProps$onMouse2, _saferRest$onMouseOut;
           (_triggerProps$onMouse2 = triggerProps.onMouseOut) === null || _triggerProps$onMouse2 === void 0 || _triggerProps$onMouse2.call(triggerProps, e);
-          (_rest$onMouseOut = rest.onMouseOut) === null || _rest$onMouseOut === void 0 || _rest$onMouseOut.call(rest, e);
+          (_saferRest$onMouseOut = saferRest.onMouseOut) === null || _saferRest$onMouseOut === void 0 || _saferRest$onMouseOut.call(saferRest, e);
         },
         onMouseMove: function onMouseMove(e) {
-          var _triggerProps$onMouse3, _rest$onMouseMove;
+          var _triggerProps$onMouse3, _saferRest$onMouseMov;
           (_triggerProps$onMouse3 = triggerProps.onMouseMove) === null || _triggerProps$onMouse3 === void 0 || _triggerProps$onMouse3.call(triggerProps, e);
-          (_rest$onMouseMove = rest.onMouseMove) === null || _rest$onMouseMove === void 0 || _rest$onMouseMove.call(rest, e);
+          (_saferRest$onMouseMov = saferRest.onMouseMove) === null || _saferRest$onMouseMov === void 0 || _saferRest$onMouseMov.call(saferRest, e);
         },
         onMouseDown: function onMouseDown(e) {
-          var _triggerProps$onMouse4, _rest$onMouseDown;
+          var _triggerProps$onMouse4, _saferRest$onMouseDow;
           (_triggerProps$onMouse4 = triggerProps.onMouseDown) === null || _triggerProps$onMouse4 === void 0 || _triggerProps$onMouse4.call(triggerProps, e);
-          (_rest$onMouseDown = rest.onMouseDown) === null || _rest$onMouseDown === void 0 || _rest$onMouseDown.call(rest, e);
+          (_saferRest$onMouseDow = saferRest.onMouseDown) === null || _saferRest$onMouseDow === void 0 || _saferRest$onMouseDow.call(saferRest, e);
         },
         onFocus: function onFocus(e) {
-          var _triggerProps$onFocus, _rest$onFocus;
+          var _triggerProps$onFocus, _saferRest$onFocus;
           (_triggerProps$onFocus = triggerProps.onFocus) === null || _triggerProps$onFocus === void 0 || _triggerProps$onFocus.call(triggerProps, e);
-          (_rest$onFocus = rest.onFocus) === null || _rest$onFocus === void 0 || _rest$onFocus.call(rest, e);
+          (_saferRest$onFocus = saferRest.onFocus) === null || _saferRest$onFocus === void 0 || _saferRest$onFocus.call(saferRest, e);
         },
         onBlur: function onBlur(e) {
-          var _triggerProps$onBlur, _rest$onBlur;
+          var _triggerProps$onBlur, _saferRest$onBlur;
           (_triggerProps$onBlur = triggerProps.onBlur) === null || _triggerProps$onBlur === void 0 || _triggerProps$onBlur.call(triggerProps, e);
-          (_rest$onBlur = rest.onBlur) === null || _rest$onBlur === void 0 || _rest$onBlur.call(rest, e);
+          (_saferRest$onBlur = saferRest.onBlur) === null || _saferRest$onBlur === void 0 || _saferRest$onBlur.call(saferRest, e);
         }
         // Shared between tooltip and base props
         ,
@@ -177,7 +173,7 @@ var LinkIconButtonBase = function LinkIconButtonBase(_ref, ref) {
   }
   return /*#__PURE__*/_react.default.createElement(_anchor.default
   // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
-  , (0, _extends2.default)({}, rest, {
+  , (0, _extends2.default)({}, saferRest, {
     "aria-labelledby": baseProps['aria-labelledby'],
     ref: baseProps.ref,
     xcss: baseProps.xcss,

package/dist/cjs/new-button/variants/icon/use-icon-button.js

@@ -47,8 +47,7 @@ var useIconButton = function useIconButton(_ref) {
     shape = _ref.shape,
     shouldFitContainer = _ref.shouldFitContainer,
     spacing = _ref.spacing,
-    testId = _ref.testId,
-    UNSAFE_size = _ref.UNSAFE_size;
+    testId = _ref.testId;
   var isCircle = shape === 'circle';
   var baseProps = (0, _useButtonBase.default)({
     analyticsContext: analyticsContext,
@@ -61,8 +60,7 @@ var useIconButton = function useIconButton(_ref) {
       type: "icon",
       isLoading: isLoading
     }, /*#__PURE__*/_react.default.createElement(_iconRenderer.default, {
-      icon: icon,
-      size: UNSAFE_size
+      icon: icon
     }), /*#__PURE__*/_react.default.createElement(_visuallyHidden.default, null, label)),
     interactionName: interactionName,
     isDisabled: isDisabled,

package/dist/cjs/new-button/variants/shared/icon-renderer.js

@@ -22,15 +22,12 @@ function isIconRenderProp(func) {
  *
  */
 var IconRenderer = function IconRenderer(_ref) {
-  var Icon = _ref.icon,
-    size = _ref.size;
+  var Icon = _ref.icon;
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isIconRenderProp(Icon) ? Icon({
     label: '',
-    size: size,
     color: 'currentColor'
   }) : /*#__PURE__*/_react.default.createElement(Icon, {
     label: "",
-    size: size,
     color: 'currentColor'
   }));
 };

package/dist/cjs/new-button/variants/shared/use-button-base.js

@@ -559,7 +559,7 @@ var useButtonBase = function useButtonBase(_ref) {
   var isSplitButton = Boolean(splitButtonContext);
   var isNavigationSplitButton = (splitButtonContext === null || splitButtonContext === void 0 ? void 0 : splitButtonContext.isNavigationSplitButton) || false;
   var isDefaultAppearanceSplitButton = (splitButtonContext === null || splitButtonContext === void 0 ? void 0 : splitButtonContext.appearance) === 'default';
-  var appearance = isDefaultAppearanceSplitButton && (0, _platformFeatureFlags.fg)('platform.design-system-team.component-visual-refresh_t8zbo') ? 'subtle' : (splitButtonContext === null || splitButtonContext === void 0 ? void 0 : splitButtonContext.appearance) || propAppearance;
+  var appearance = isDefaultAppearanceSplitButton && (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? 'subtle' : (splitButtonContext === null || splitButtonContext === void 0 ? void 0 : splitButtonContext.appearance) || propAppearance;
   var spacing = (splitButtonContext === null || splitButtonContext === void 0 ? void 0 : splitButtonContext.spacing) || propSpacing;
   var isDisabled = (splitButtonContext === null || splitButtonContext === void 0 ? void 0 : splitButtonContext.isDisabled) || propIsDisabled;
   var isInteractive = !isDisabled && !isLoading;
@@ -569,7 +569,7 @@ var useButtonBase = function useButtonBase(_ref) {
   (0, _useAutoFocus.default)(localRef, autoFocus);
   return _objectSpread({
     ref: (0, _mergeRefs.default)([localRef, ref]),
-    xcss: [(0, _platformFeatureFlags.fg)('platform.design-system-team.button-tokenised-typography-styles') ? tokenizedButtonStyles : hardCodedButtonStyles, buttonStyles, appearance === 'default' && ((0, _platformFeatureFlags.fg)('platform.design-system-team.component-visual-refresh_t8zbo') ? defaultRefreshedStyles : defaultStyles), appearance === 'default' && isInteractive && ((0, _platformFeatureFlags.fg)('platform.design-system-team.component-visual-refresh_t8zbo') ? defaultInteractiveRefreshedStyles : defaultInteractiveStyles), appearance === 'primary' && primaryStyles, appearance === 'primary' && isInteractive && primaryInteractiveStyles, appearance === 'warning' && warningStyles, appearance === 'warning' && isInteractive && warningInteractiveStyles, appearance === 'danger' && dangerStyles, appearance === 'danger' && isInteractive && dangerInteractiveStyles, appearance === 'discovery' && discoveryStyles, appearance === 'discovery' && isInteractive && discoveryInteractiveStyles, appearance === 'subtle' && ((0, _platformFeatureFlags.fg)('platform.design-system-team.component-visual-refresh_t8zbo') ? subtleRefreshedStyles : subtleStyles), appearance === 'subtle' && isInteractive && ((0, _platformFeatureFlags.fg)('platform.design-system-team.component-visual-refresh_t8zbo') ? subtleInteractiveRefreshedStyles : subtleInteractiveStyles), appearance === 'link' && linkStyles, appearance === 'subtle-link' && subtleLinkStyles, !isSelected && (appearance === 'link' || appearance === 'subtle-link') ? linkDecorationStyles : linkDecorationUnsetStyles, isSelected && ((0, _platformFeatureFlags.fg)('platform.design-system-team.component-visual-refresh_t8zbo') ? selectedRefreshedStyles : selectedStyles), isSelected && isSplitButton && selectedInsideSplitButtonStyles, isSelected && isInteractive && selectedInteractiveStyles,
+    xcss: [(0, _platformFeatureFlags.fg)('platform.design-system-team.button-tokenised-typography-styles') ? tokenizedButtonStyles : hardCodedButtonStyles, buttonStyles, appearance === 'default' && ((0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? defaultRefreshedStyles : defaultStyles), appearance === 'default' && isInteractive && ((0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? defaultInteractiveRefreshedStyles : defaultInteractiveStyles), appearance === 'primary' && primaryStyles, appearance === 'primary' && isInteractive && primaryInteractiveStyles, appearance === 'warning' && warningStyles, appearance === 'warning' && isInteractive && warningInteractiveStyles, appearance === 'danger' && dangerStyles, appearance === 'danger' && isInteractive && dangerInteractiveStyles, appearance === 'discovery' && discoveryStyles, appearance === 'discovery' && isInteractive && discoveryInteractiveStyles, appearance === 'subtle' && ((0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? subtleRefreshedStyles : subtleStyles), appearance === 'subtle' && isInteractive && ((0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? subtleInteractiveRefreshedStyles : subtleInteractiveStyles), appearance === 'link' && linkStyles, appearance === 'subtle-link' && subtleLinkStyles, !isSelected && (appearance === 'link' || appearance === 'subtle-link') ? linkDecorationStyles : linkDecorationUnsetStyles, isSelected && ((0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? selectedRefreshedStyles : selectedStyles), isSelected && isSplitButton && selectedInsideSplitButtonStyles, isSelected && isInteractive && selectedInteractiveStyles,
     // TODO: remove me once we kill color fallbacks
     isSelected && appearance === 'danger' && selectedDangerStyles,
     // TODO: remove me once we kill color fallbacks

package/dist/cjs/old-button/button.js

@@ -22,7 +22,9 @@ var isFirefox = typeof navigator !== 'undefined' && navigator.userAgent.toLowerC
 /**
  * __Button__
  *
- * CAUTION: Legacy buttons will soon be deprecated. Please use the new Button components from `@atlaskit/button/new`.
+ * @deprecated Legacy buttons are deprecated and will be removed from `atlaskit/button` in an upcoming major release. Please use the new Button components from `@atlaskit/button/new`
+ *
+ * Please refer to the [migration guide](https://atlassian.design/components/button/button-legacy/migration-guide) for further details.
  *
  * A button triggers an event or action. They let users know what will happen next.
  *

package/dist/cjs/old-button/custom-theme-button/custom-theme-button.js

@@ -64,6 +64,10 @@ var initial = {
 /**
  * __Custom theme button__
  *
+ * @deprecated Legacy buttons are deprecated and will be removed from `atlaskit/button` in an upcoming major release. Please use the new Button components from `@atlaskit/button/new`
+ *
+ * Please refer to the [migration guide](https://atlassian.design/components/button/button-legacy/migration-guide) for further details.
+ *
  * A custom theme button. Avoid using this component. It exists for those already using custom theming, which is hard to use and has performance issues.
  *
  * - [Examples](https://atlassian.design/components/button/examples#custom-theme-button)

package/dist/cjs/old-button/loading-button.js

@@ -14,7 +14,9 @@ var _excluded = ["appearance", "isDisabled", "isSelected", "isLoading", "spacing
 /**
  * __Loading button__
  *
- * CAUTION: Legacy loading buttons will soon be deprecated. Please use the new Button components from `@atlaskit/button/new` with the `isLoading` prop.
+ * @deprecated Legacy loading buttons are deprecated and will be removed from `atlaskit/button` in an upcoming major release. Please use the new Button components from `@atlaskit/button/new` with the `isLoading` prop.
+ *
+ * Please refer to the [migration guide](https://atlassian.design/components/button/button-legacy/migration-guide) for further details.
  *
  * A small wrapper around Button that allows you to show an @atlaskit/spinner as an overlay on the button when you set an isLoading prop to true.
  *

package/dist/cjs/old-button/shared/button-base.js

@@ -23,8 +23,8 @@ var _excluded = ["analyticsContext", "appearance", "autoFocus", "buttonCss", "ch
 /* eslint-disable @atlaskit/design-system/consistent-css-prop-usage */
 /**
  * @jsxRuntime classic
+ * @jsx jsx
  */
-/** @jsx jsx */
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 // eslint-disable-next-line no-duplicate-imports
 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); }
@@ -133,7 +133,7 @@ var ButtonBase = /*#__PURE__*/_react.default.forwardRef(function ButtonBase(prop
     action: 'clicked',
     componentName: 'button',
     packageName: "@atlaskit/button",
-    packageVersion: "18.4.1",
+    packageVersion: "19.1.0",
     analyticsData: analyticsContext
   });
 

package/dist/cjs/old-button/shared/css.js

@@ -222,7 +222,7 @@ function getCss(_ref3) {
     textDecoration: 'none',
     transition: 'background 0.1s ease-out, box-shadow 0.15s cubic-bezier(0.47, 0.03, 0.49, 1.38)',
     whiteSpace: 'nowrap'
-  }, !(0, _platformFeatureFlags.fg)('platform.design-system-team.component-visual-refresh_t8zbo') && baseColors), {}, {
+  }, !(0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && baseColors), {}, {
     cursor: 'pointer',
     height: heights[spacing],
     lineHeight: lineHeights[spacing],
@@ -231,7 +231,7 @@ function getCss(_ref3) {
     width: shouldFitContainer ? '100%' : 'auto',
     // justifyContent required for shouldFitContainer buttons with an icon inside
     justifyContent: 'center'
-  }, !(0, _platformFeatureFlags.fg)('platform.design-system-team.component-visual-refresh_t8zbo') && _objectSpread(_objectSpread({
+  }, !(0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && _objectSpread(_objectSpread({
     // Disabling visited styles (just using the base colors)
     '&:visited': _objectSpread({}, baseColors),
     '&:hover': _objectSpread(_objectSpread({}, getColors({
@@ -280,7 +280,7 @@ function getCss(_ref3) {
       key: isSelected ? 'selected' : 'default',
       mode: mode
     }))
-  })), (0, _platformFeatureFlags.fg)('platform.design-system-team.component-visual-refresh_t8zbo') && (isSelected ? selectedStyles : _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, appearance === 'default' && defaultStyles), appearance === 'primary' && primaryStyles), appearance === 'link' && linkStyles), appearance === 'subtle' && subtleStyles), appearance === 'subtle-link' && subtleLinkStyles), appearance === 'warning' && warningStyles), appearance === 'danger' && dangerStyles), {}, {
+  })), (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && (isSelected ? selectedStyles : _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, appearance === 'default' && defaultStyles), appearance === 'primary' && primaryStyles), appearance === 'link' && linkStyles), appearance === 'subtle' && subtleStyles), appearance === 'subtle-link' && subtleLinkStyles), appearance === 'warning' && warningStyles), appearance === 'danger' && dangerStyles), {}, {
     '&[disabled]': {
       color: "var(--ds-text-disabled, #091E424F)",
       backgroundColor: HAS_DISABLED_BACKGROUND.includes(appearance) ? "var(--ds-background-disabled, #091E4208)" : 'transparent',