@atlaskit/button 16.8.2 → 16.8.4

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/button
 
+## 16.8.4
+
+### Patch Changes
+
+- [`4b3cfb2276b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4b3cfb2276b) - Refactor button base to remove rest props and make props more explicit.
+
+## 16.8.3
+
+### Patch Changes
+
+- [`11cd2f83450`](https://bitbucket.org/atlassian/atlassian-frontend/commits/11cd2f83450) - Refactor loading button to use less rest props to pass props more explicitly.
+
 ## 16.8.2
 
 ### Patch Changes

package/dist/cjs/loading-button.js

@@ -10,7 +10,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = _interopRequireDefault(require("react"));
 var _button = _interopRequireDefault(require("./button"));
 var _loadingSpinner = _interopRequireDefault(require("./shared/loading-spinner"));
-var _excluded = ["isLoading"];
+var _excluded = ["appearance", "isDisabled", "isSelected", "isLoading", "spacing"];
 /**
  * __Loading button__
  *
@@ -19,14 +19,27 @@ var _excluded = ["isLoading"];
  * - [Examples](https://atlassian.design/components/button/examples#loading-button)
  */
 var LoadingButton = /*#__PURE__*/_react.default.forwardRef(function LoadingButton(_ref, ref) {
-  var _ref$isLoading = _ref.isLoading,
+  var appearance = _ref.appearance,
+    isDisabled = _ref.isDisabled,
+    isSelected = _ref.isSelected,
+    _ref$isLoading = _ref.isLoading,
     isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
+    spacing = _ref.spacing,
     rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   // Button already has React.memo, so just leaning on that
   return /*#__PURE__*/_react.default.createElement(_button.default, (0, _extends2.default)({}, rest, {
     ref: ref,
+    appearance: appearance,
     "aria-busy": isLoading,
-    overlay: isLoading ? /*#__PURE__*/_react.default.createElement(_loadingSpinner.default, rest) : null
+    isDisabled: isDisabled,
+    isSelected: isSelected,
+    overlay: isLoading ? /*#__PURE__*/_react.default.createElement(_loadingSpinner.default, {
+      spacing: spacing,
+      appearance: appearance,
+      isDisabled: isDisabled,
+      isSelected: isSelected
+    }) : null,
+    spacing: spacing
   }));
 });
 

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

@@ -19,7 +19,7 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _colors = require("@atlaskit/theme/colors");
 var _blockEvents = _interopRequireDefault(require("./block-events"));
 var _css = require("./css");
-var _excluded = ["appearance", "buttonCss", "spacing", "autoFocus", "isDisabled", "shouldFitContainer", "isSelected", "iconBefore", "iconAfter", "children", "className", "href", "overlay", "tabIndex", "type", "onMouseDown", "onClick", "component", "testId", "interactionName", "analyticsContext"];
+var _excluded = ["analyticsContext", "appearance", "autoFocus", "buttonCss", "children", "className", "href", "component", "iconAfter", "iconBefore", "interactionName", "isDisabled", "isSelected", "onBlur", "onClick", "onFocus", "onMouseDown", "overlay", "shouldFitContainer", "spacing", "tabIndex", "type", "testId"];
 /** @jsx jsx */
 // eslint-disable-next-line no-duplicate-imports
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -34,38 +34,39 @@ var noPointerEventsOnChildrenCss = {
   }
 };
 var _default = /*#__PURE__*/_react.default.forwardRef(function ButtonBase(props, ref) {
-  var _props$appearance = props.appearance,
+  var analyticsContext = props.analyticsContext,
+    _props$appearance = props.appearance,
     appearance = _props$appearance === void 0 ? 'default' : _props$appearance,
-    buttonCss = props.buttonCss,
-    _props$spacing = props.spacing,
-    spacing = _props$spacing === void 0 ? 'default' : _props$spacing,
     _props$autoFocus = props.autoFocus,
     autoFocus = _props$autoFocus === void 0 ? false : _props$autoFocus,
+    buttonCss = props.buttonCss,
+    children = props.children,
+    className = props.className,
+    href = props.href,
+    _props$component = props.component,
+    Component = _props$component === void 0 ? href ? 'a' : 'button' : _props$component,
+    iconAfter = props.iconAfter,
+    iconBefore = props.iconBefore,
+    interactionName = props.interactionName,
     _props$isDisabled = props.isDisabled,
     isDisabled = _props$isDisabled === void 0 ? false : _props$isDisabled,
-    _props$shouldFitConta = props.shouldFitContainer,
-    shouldFitContainer = _props$shouldFitConta === void 0 ? false : _props$shouldFitConta,
     _props$isSelected = props.isSelected,
     isSelected = _props$isSelected === void 0 ? false : _props$isSelected,
-    iconBefore = props.iconBefore,
-    iconAfter = props.iconAfter,
-    children = props.children,
-    className = props.className,
-    href = props.href,
+    onBlur = props.onBlur,
+    _props$onClick = props.onClick,
+    providedOnClick = _props$onClick === void 0 ? _noop.default : _props$onClick,
+    onFocus = props.onFocus,
+    _props$onMouseDown = props.onMouseDown,
+    providedOnMouseDown = _props$onMouseDown === void 0 ? _noop.default : _props$onMouseDown,
     overlay = props.overlay,
+    shouldFitContainer = props.shouldFitContainer,
+    _props$spacing = props.spacing,
+    spacing = _props$spacing === void 0 ? 'default' : _props$spacing,
     _props$tabIndex = props.tabIndex,
     tabIndex = _props$tabIndex === void 0 ? !props.component && (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.clove-sprint-a11y-button_5rz5j') ? undefined : 0 : _props$tabIndex,
     _props$type = props.type,
     type = _props$type === void 0 ? !href ? 'button' : undefined : _props$type,
-    _props$onMouseDown = props.onMouseDown,
-    providedOnMouseDown = _props$onMouseDown === void 0 ? _noop.default : _props$onMouseDown,
-    _props$onClick = props.onClick,
-    providedOnClick = _props$onClick === void 0 ? _noop.default : _props$onClick,
-    _props$component = props.component,
-    Component = _props$component === void 0 ? href ? 'a' : 'button' : _props$component,
     testId = props.testId,
-    interactionName = props.interactionName,
-    analyticsContext = props.analyticsContext,
     rest = (0, _objectWithoutProperties2.default)(props, _excluded);
   var ourRef = (0, _react.useRef)();
   var setRef = (0, _react.useCallback)(function (node) {
@@ -78,6 +79,7 @@ var _default = /*#__PURE__*/_react.default.forwardRef(function ButtonBase(props,
       return;
     }
 
+    // We can write to ref's `current` property, but Typescript does not like it.
     // @ts-ignore
     ref.current = node;
   }, [ourRef, ref]);
@@ -94,7 +96,7 @@ var _default = /*#__PURE__*/_react.default.forwardRef(function ButtonBase(props,
     action: 'clicked',
     componentName: 'button',
     packageName: "@atlaskit/button",
-    packageVersion: "16.8.2",
+    packageVersion: "16.8.4",
     analyticsData: analyticsContext
   });
 
@@ -133,23 +135,25 @@ var _default = /*#__PURE__*/_react.default.forwardRef(function ButtonBase(props,
     };
   }
   return (0, _react2.jsx)(_focusRing.default, null, (0, _react2.jsx)(Component, (0, _extends2.default)({}, rest, {
-    css: [buttonCss, isInteractive ? null : noPointerEventsOnChildrenCss],
-    className: className,
     ref: setRef,
-    onClick: onClick,
-    onMouseDown: onMouseDown,
-    disabled: isDisabled,
-    href: isInteractive ? href : undefined
+    className: className,
+    css: [buttonCss, isInteractive ? null : noPointerEventsOnChildrenCss]
     // using undefined so that the property doesn't exist when false
     ,
     "data-has-overlay": hasOverlay ? true : undefined,
     "data-testid": testId,
-    type: type
+    disabled: isDisabled,
+    href: isInteractive ? href : undefined,
+    onBlur: onBlur,
+    onClick: onClick,
+    onFocus: onFocus,
+    onMouseDown: onMouseDown
     // Adding a tab index so element is always focusable, even when not a <button> or <a>
     // Disabling focus via keyboard navigation when disabled
     // as this is standard button behaviour
     ,
-    tabIndex: isDisabled ? -1 : tabIndex
+    tabIndex: isDisabled ? -1 : tabIndex,
+    type: type
   }, (0, _blockEvents.default)({
     isInteractive: isInteractive
   })), iconBefore ? (0, _react2.jsx)("span", {

package/dist/cjs/shared/loading-spinner.js

@@ -5,10 +5,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = LoadingSpinner;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
 var _spinner = _interopRequireDefault(require("@atlaskit/spinner"));
-var _excluded = ["spacing"];
 function getSpinnerAppearance(_ref) {
   var appearance = _ref.appearance,
     isDisabled = _ref.isDisabled,
@@ -25,12 +23,18 @@ function getSpinnerAppearance(_ref) {
   return 'inherit';
 }
 function LoadingSpinner(_ref2) {
-  var _ref2$spacing = _ref2.spacing,
-    spacing = _ref2$spacing === void 0 ? 'default' : _ref2$spacing,
-    rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+  var appearance = _ref2.appearance,
+    isDisabled = _ref2.isDisabled,
+    isSelected = _ref2.isSelected,
+    _ref2$spacing = _ref2.spacing,
+    spacing = _ref2$spacing === void 0 ? 'default' : _ref2$spacing;
   var size = spacing === 'default' ? 'medium' : 'small';
   return /*#__PURE__*/_react.default.createElement(_spinner.default, {
     size: size,
-    appearance: getSpinnerAppearance(rest)
+    appearance: getSpinnerAppearance({
+      appearance: appearance,
+      isDisabled: isDisabled,
+      isSelected: isSelected
+    })
   });
 }

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/button",
-	"version": "16.8.2",
+	"version": "16.8.4",
 	"sideEffects": false
 }

package/dist/es2019/loading-button.js

@@ -10,14 +10,27 @@ import LoadingSpinner from './shared/loading-spinner';
  * - [Examples](https://atlassian.design/components/button/examples#loading-button)
  */
 const LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton({
+  appearance,
+  isDisabled,
+  isSelected,
   isLoading = false,
+  spacing,
   ...rest
 }, ref) {
   // Button already has React.memo, so just leaning on that
   return /*#__PURE__*/React.createElement(Button, _extends({}, rest, {
     ref: ref,
+    appearance: appearance,
     "aria-busy": isLoading,
-    overlay: isLoading ? /*#__PURE__*/React.createElement(LoadingSpinner, rest) : null
+    isDisabled: isDisabled,
+    isSelected: isSelected,
+    overlay: isLoading ? /*#__PURE__*/React.createElement(LoadingSpinner, {
+      spacing: spacing,
+      appearance: appearance,
+      isDisabled: isDisabled,
+      isSelected: isSelected
+    }) : null,
+    spacing: spacing
   }));
 });
 

package/dist/es2019/shared/button-base.js

@@ -24,33 +24,36 @@ const noPointerEventsOnChildrenCss = {
 };
 export default /*#__PURE__*/React.forwardRef(function ButtonBase(props, ref) {
   const {
+    // I don't think analytics should be in button, but for now it is
+    analyticsContext,
     appearance = 'default',
-    buttonCss,
-    spacing = 'default',
     autoFocus = false,
-    isDisabled = false,
-    shouldFitContainer = false,
-    isSelected = false,
-    iconBefore,
-    iconAfter,
+    buttonCss,
     children,
     className,
     href,
+    // use the provided component prop,
+    // else default to anchor if there is a href, and button if there is no href
+    component: Component = href ? 'a' : 'button',
+    iconAfter,
+    iconBefore,
+    interactionName,
+    isDisabled = false,
+    isSelected = false,
+    onBlur,
+    onClick: providedOnClick = noop,
+    onFocus,
+    onMouseDown: providedOnMouseDown = noop,
     overlay,
+    // Pulling out so it doesn't spread on rendered component
+    shouldFitContainer,
+    spacing = 'default',
     // Don't set unnecessary tabIndex for focus if using standard <button> or <a>
     // html elements. Set to `0` for custom components to ensure other elements can
     // be focused (although the custom component could be a <button> or <a>...)
     tabIndex = !props.component && getBooleanFF('platform.design-system-team.clove-sprint-a11y-button_5rz5j') ? undefined : 0,
     type = !href ? 'button' : undefined,
-    onMouseDown: providedOnMouseDown = noop,
-    onClick: providedOnClick = noop,
-    // use the provided component prop,
-    // else default to anchor if there is a href, and button if there is no href
-    component: Component = href ? 'a' : 'button',
     testId,
-    interactionName,
-    // I don't think this should be in button, but for now it is
-    analyticsContext,
     ...rest
   } = props;
   const ourRef = useRef();
@@ -64,6 +67,7 @@ export default /*#__PURE__*/React.forwardRef(function ButtonBase(props, ref) {
       return;
     }
 
+    // We can write to ref's `current` property, but Typescript does not like it.
     // @ts-ignore
     ref.current = node;
   }, [ourRef, ref]);
@@ -80,7 +84,7 @@ export default /*#__PURE__*/React.forwardRef(function ButtonBase(props, ref) {
     action: 'clicked',
     componentName: 'button',
     packageName: "@atlaskit/button",
-    packageVersion: "16.8.2",
+    packageVersion: "16.8.4",
     analyticsData: analyticsContext
   });
 
@@ -119,23 +123,25 @@ export default /*#__PURE__*/React.forwardRef(function ButtonBase(props, ref) {
     };
   }
   return jsx(FocusRing, null, jsx(Component, _extends({}, rest, {
-    css: [buttonCss, isInteractive ? null : noPointerEventsOnChildrenCss],
-    className: className,
     ref: setRef,
-    onClick: onClick,
-    onMouseDown: onMouseDown,
-    disabled: isDisabled,
-    href: isInteractive ? href : undefined
+    className: className,
+    css: [buttonCss, isInteractive ? null : noPointerEventsOnChildrenCss]
     // using undefined so that the property doesn't exist when false
     ,
     "data-has-overlay": hasOverlay ? true : undefined,
     "data-testid": testId,
-    type: type
+    disabled: isDisabled,
+    href: isInteractive ? href : undefined,
+    onBlur: onBlur,
+    onClick: onClick,
+    onFocus: onFocus,
+    onMouseDown: onMouseDown
     // Adding a tab index so element is always focusable, even when not a <button> or <a>
     // Disabling focus via keyboard navigation when disabled
     // as this is standard button behaviour
     ,
-    tabIndex: isDisabled ? -1 : tabIndex
+    tabIndex: isDisabled ? -1 : tabIndex,
+    type: type
   }, blockEvents({
     isInteractive
   })), iconBefore ? jsx("span", {

package/dist/es2019/shared/loading-spinner.js

@@ -17,12 +17,18 @@ function getSpinnerAppearance({
   return 'inherit';
 }
 export default function LoadingSpinner({
-  spacing = 'default',
-  ...rest
+  appearance,
+  isDisabled,
+  isSelected,
+  spacing = 'default'
 }) {
   const size = spacing === 'default' ? 'medium' : 'small';
   return /*#__PURE__*/React.createElement(Spinner, {
     size: size,
-    appearance: getSpinnerAppearance(rest)
+    appearance: getSpinnerAppearance({
+      appearance,
+      isDisabled,
+      isSelected
+    })
   });
 }

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/button",
-	"version": "16.8.2",
+	"version": "16.8.4",
 	"sideEffects": false
 }

package/dist/esm/loading-button.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["isLoading"];
+var _excluded = ["appearance", "isDisabled", "isSelected", "isLoading", "spacing"];
 import React from 'react';
 import Button from './button';
 import LoadingSpinner from './shared/loading-spinner';
@@ -12,14 +12,27 @@ import LoadingSpinner from './shared/loading-spinner';
  * - [Examples](https://atlassian.design/components/button/examples#loading-button)
  */
 var LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(_ref, ref) {
-  var _ref$isLoading = _ref.isLoading,
+  var appearance = _ref.appearance,
+    isDisabled = _ref.isDisabled,
+    isSelected = _ref.isSelected,
+    _ref$isLoading = _ref.isLoading,
     isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
+    spacing = _ref.spacing,
     rest = _objectWithoutProperties(_ref, _excluded);
   // Button already has React.memo, so just leaning on that
   return /*#__PURE__*/React.createElement(Button, _extends({}, rest, {
     ref: ref,
+    appearance: appearance,
     "aria-busy": isLoading,
-    overlay: isLoading ? /*#__PURE__*/React.createElement(LoadingSpinner, rest) : null
+    isDisabled: isDisabled,
+    isSelected: isSelected,
+    overlay: isLoading ? /*#__PURE__*/React.createElement(LoadingSpinner, {
+      spacing: spacing,
+      appearance: appearance,
+      isDisabled: isDisabled,
+      isSelected: isSelected
+    }) : null,
+    spacing: spacing
   }));
 });
 

package/dist/esm/shared/button-base.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["appearance", "buttonCss", "spacing", "autoFocus", "isDisabled", "shouldFitContainer", "isSelected", "iconBefore", "iconAfter", "children", "className", "href", "overlay", "tabIndex", "type", "onMouseDown", "onClick", "component", "testId", "interactionName", "analyticsContext"];
+var _excluded = ["analyticsContext", "appearance", "autoFocus", "buttonCss", "children", "className", "href", "component", "iconAfter", "iconBefore", "interactionName", "isDisabled", "isSelected", "onBlur", "onClick", "onFocus", "onMouseDown", "overlay", "shouldFitContainer", "spacing", "tabIndex", "type", "testId"];
 /** @jsx jsx */
 import React, { useCallback, useContext, useEffect, useRef } from 'react';
 import { css, jsx } from '@emotion/react';
@@ -25,38 +25,39 @@ var noPointerEventsOnChildrenCss = {
   }
 };
 export default /*#__PURE__*/React.forwardRef(function ButtonBase(props, ref) {
-  var _props$appearance = props.appearance,
+  var analyticsContext = props.analyticsContext,
+    _props$appearance = props.appearance,
     appearance = _props$appearance === void 0 ? 'default' : _props$appearance,
-    buttonCss = props.buttonCss,
-    _props$spacing = props.spacing,
-    spacing = _props$spacing === void 0 ? 'default' : _props$spacing,
     _props$autoFocus = props.autoFocus,
     autoFocus = _props$autoFocus === void 0 ? false : _props$autoFocus,
+    buttonCss = props.buttonCss,
+    children = props.children,
+    className = props.className,
+    href = props.href,
+    _props$component = props.component,
+    Component = _props$component === void 0 ? href ? 'a' : 'button' : _props$component,
+    iconAfter = props.iconAfter,
+    iconBefore = props.iconBefore,
+    interactionName = props.interactionName,
     _props$isDisabled = props.isDisabled,
     isDisabled = _props$isDisabled === void 0 ? false : _props$isDisabled,
-    _props$shouldFitConta = props.shouldFitContainer,
-    shouldFitContainer = _props$shouldFitConta === void 0 ? false : _props$shouldFitConta,
     _props$isSelected = props.isSelected,
     isSelected = _props$isSelected === void 0 ? false : _props$isSelected,
-    iconBefore = props.iconBefore,
-    iconAfter = props.iconAfter,
-    children = props.children,
-    className = props.className,
-    href = props.href,
+    onBlur = props.onBlur,
+    _props$onClick = props.onClick,
+    providedOnClick = _props$onClick === void 0 ? noop : _props$onClick,
+    onFocus = props.onFocus,
+    _props$onMouseDown = props.onMouseDown,
+    providedOnMouseDown = _props$onMouseDown === void 0 ? noop : _props$onMouseDown,
     overlay = props.overlay,
+    shouldFitContainer = props.shouldFitContainer,
+    _props$spacing = props.spacing,
+    spacing = _props$spacing === void 0 ? 'default' : _props$spacing,
     _props$tabIndex = props.tabIndex,
     tabIndex = _props$tabIndex === void 0 ? !props.component && getBooleanFF('platform.design-system-team.clove-sprint-a11y-button_5rz5j') ? undefined : 0 : _props$tabIndex,
     _props$type = props.type,
     type = _props$type === void 0 ? !href ? 'button' : undefined : _props$type,
-    _props$onMouseDown = props.onMouseDown,
-    providedOnMouseDown = _props$onMouseDown === void 0 ? noop : _props$onMouseDown,
-    _props$onClick = props.onClick,
-    providedOnClick = _props$onClick === void 0 ? noop : _props$onClick,
-    _props$component = props.component,
-    Component = _props$component === void 0 ? href ? 'a' : 'button' : _props$component,
     testId = props.testId,
-    interactionName = props.interactionName,
-    analyticsContext = props.analyticsContext,
     rest = _objectWithoutProperties(props, _excluded);
   var ourRef = useRef();
   var setRef = useCallback(function (node) {
@@ -69,6 +70,7 @@ export default /*#__PURE__*/React.forwardRef(function ButtonBase(props, ref) {
       return;
     }
 
+    // We can write to ref's `current` property, but Typescript does not like it.
     // @ts-ignore
     ref.current = node;
   }, [ourRef, ref]);
@@ -85,7 +87,7 @@ export default /*#__PURE__*/React.forwardRef(function ButtonBase(props, ref) {
     action: 'clicked',
     componentName: 'button',
     packageName: "@atlaskit/button",
-    packageVersion: "16.8.2",
+    packageVersion: "16.8.4",
     analyticsData: analyticsContext
   });
 
@@ -124,23 +126,25 @@ export default /*#__PURE__*/React.forwardRef(function ButtonBase(props, ref) {
     };
   }
   return jsx(FocusRing, null, jsx(Component, _extends({}, rest, {
-    css: [buttonCss, isInteractive ? null : noPointerEventsOnChildrenCss],
-    className: className,
     ref: setRef,
-    onClick: onClick,
-    onMouseDown: onMouseDown,
-    disabled: isDisabled,
-    href: isInteractive ? href : undefined
+    className: className,
+    css: [buttonCss, isInteractive ? null : noPointerEventsOnChildrenCss]
     // using undefined so that the property doesn't exist when false
     ,
     "data-has-overlay": hasOverlay ? true : undefined,
     "data-testid": testId,
-    type: type
+    disabled: isDisabled,
+    href: isInteractive ? href : undefined,
+    onBlur: onBlur,
+    onClick: onClick,
+    onFocus: onFocus,
+    onMouseDown: onMouseDown
     // Adding a tab index so element is always focusable, even when not a <button> or <a>
     // Disabling focus via keyboard navigation when disabled
     // as this is standard button behaviour
     ,
-    tabIndex: isDisabled ? -1 : tabIndex
+    tabIndex: isDisabled ? -1 : tabIndex,
+    type: type
   }, blockEvents({
     isInteractive: isInteractive
   })), iconBefore ? jsx("span", {

package/dist/esm/shared/loading-spinner.js

@@ -1,5 +1,3 @@
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["spacing"];
 import React from 'react';
 import Spinner from '@atlaskit/spinner';
 function getSpinnerAppearance(_ref) {
@@ -18,12 +16,18 @@ function getSpinnerAppearance(_ref) {
   return 'inherit';
 }
 export default function LoadingSpinner(_ref2) {
-  var _ref2$spacing = _ref2.spacing,
-    spacing = _ref2$spacing === void 0 ? 'default' : _ref2$spacing,
-    rest = _objectWithoutProperties(_ref2, _excluded);
+  var appearance = _ref2.appearance,
+    isDisabled = _ref2.isDisabled,
+    isSelected = _ref2.isSelected,
+    _ref2$spacing = _ref2.spacing,
+    spacing = _ref2$spacing === void 0 ? 'default' : _ref2$spacing;
   var size = spacing === 'default' ? 'medium' : 'small';
   return /*#__PURE__*/React.createElement(Spinner, {
     size: size,
-    appearance: getSpinnerAppearance(rest)
+    appearance: getSpinnerAppearance({
+      appearance: appearance,
+      isDisabled: isDisabled,
+      isSelected: isSelected
+    })
   });
 }

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/button",
-	"version": "16.8.2",
+	"version": "16.8.4",
 	"sideEffects": false
 }

package/dist/types/shared/loading-spinner.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { BaseProps } from '../types';
 type LoadingSpinnerProps = Pick<BaseProps, 'appearance' | 'isDisabled' | 'isSelected' | 'spacing'>;
-export default function LoadingSpinner({ spacing, ...rest }: LoadingSpinnerProps): JSX.Element;
+export default function LoadingSpinner({ appearance, isDisabled, isSelected, spacing, }: LoadingSpinnerProps): JSX.Element;
 export {};

package/dist/types-ts4.5/shared/loading-spinner.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { BaseProps } from '../types';
 type LoadingSpinnerProps = Pick<BaseProps, 'appearance' | 'isDisabled' | 'isSelected' | 'spacing'>;
-export default function LoadingSpinner({ spacing, ...rest }: LoadingSpinnerProps): JSX.Element;
+export default function LoadingSpinner({ appearance, isDisabled, isSelected, spacing, }: LoadingSpinnerProps): JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/button",
-  "version": "16.8.2",
+  "version": "16.8.4",
   "description": "A button triggers an event or action. They let users know what will happen next.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -51,7 +51,7 @@
     "@atlaskit/platform-feature-flags": "^0.2.0",
     "@atlaskit/spinner": "^15.5.0",
     "@atlaskit/theme": "^12.5.0",
-    "@atlaskit/tokens": "^1.11.0",
+    "@atlaskit/tokens": "^1.13.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1"
   },

package/tmp/api-report-tmp.d.ts

@@ -0,0 +1,133 @@
+## API Report File for "@atlaskit/button"
+
+> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+
+```ts
+
+/// <reference types="react" />
+
+import { ComponentType } from 'react';
+import { CSSObject } from '@emotion/react';
+import { jsx } from '@emotion/react';
+import { default as React_2 } from 'react';
+import { ReactNode } from 'react';
+import { ThemeModes } from '@atlaskit/theme/types';
+import { ThemeModes as ThemeModes_2 } from '@atlaskit/theme';
+import { ThemeProp } from '@atlaskit/theme/components';
+import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
+
+// @public (undocumented)
+export type Appearance = 'danger' | 'default' | 'link' | 'primary' | 'subtle' | 'subtle-link' | 'warning';
+
+// @public (undocumented)
+export type BaseOwnProps = {
+    appearance?: Appearance;
+    autoFocus?: boolean;
+    className?: string;
+    overlay?: React_2.ReactNode;
+    href?: string;
+    iconAfter?: React_2.ReactChild;
+    iconBefore?: React_2.ReactChild;
+    isDisabled?: boolean;
+    isSelected?: boolean;
+    onBlur?: React_2.FocusEventHandler<HTMLElement>;
+    onClick?: (e: React_2.MouseEvent<HTMLElement>, analyticsEvent: UIAnalyticsEvent) => void;
+    onFocus?: React_2.FocusEventHandler<HTMLElement>;
+    spacing?: Spacing;
+    target?: React_2.AnchorHTMLAttributes<HTMLAnchorElement>['target'];
+    type?: React_2.ButtonHTMLAttributes<HTMLButtonElement>['type'];
+    shouldFitContainer?: boolean;
+    children?: React_2.ReactNode;
+    testId?: string;
+    component?: React_2.ComponentType<React_2.AllHTMLAttributes<HTMLElement>> | React_2.ElementType;
+    interactionName?: string;
+    analyticsContext?: Record<string, any>;
+};
+
+// @public (undocumented)
+export type BaseProps = Combine<Combine<Omit<React_2.AllHTMLAttributes<HTMLElement>, 'disabled'>, {
+    'data-testid'?: never;
+    'data-has-overlay'?: never;
+}>, BaseOwnProps>;
+
+// @public
+const Button: React_2.MemoExoticComponent<React_2.ForwardRefExoticComponent<ButtonProps & React_2.RefAttributes<HTMLElement>>>;
+export default Button;
+
+// @public (undocumented)
+export function ButtonGroup({ appearance, children, }: ButtonGroupProps): jsx.JSX.Element;
+
+// @public (undocumented)
+type ButtonGroupProps = {
+    appearance?: Appearance;
+    children?: React_2.ReactNode;
+};
+
+// @public (undocumented)
+export interface ButtonProps extends BaseProps {
+}
+
+// @public (undocumented)
+type Combine<First, Second> = Omit<First, keyof Second> & Second;
+
+// @public
+export const CustomThemeButton: React_2.MemoExoticComponent<React_2.ForwardRefExoticComponent<Omit<BaseProps, "overlay"> & CustomThemeButtonOwnProps & React_2.RefAttributes<HTMLElement>>>;
+
+// @public (undocumented)
+export type CustomThemeButtonOwnProps = {
+    isLoading?: boolean;
+    theme?: (current: (props: ThemeProps) => ThemeTokens, props: ThemeProps) => ThemeTokens;
+};
+
+// @public (undocumented)
+export type CustomThemeButtonProps = Omit<BaseProps, 'overlay'> & CustomThemeButtonOwnProps;
+
+// @public (undocumented)
+export type InteractionState = 'active' | 'default' | 'disabled' | 'focus' | 'focusSelected' | 'hover' | 'selected';
+
+// @public
+export const LoadingButton: React_2.ForwardRefExoticComponent<Omit<BaseProps, "overlay"> & LoadingButtonOwnProps & React_2.RefAttributes<HTMLElement>>;
+
+// @public (undocumented)
+export type LoadingButtonOwnProps = {
+    isLoading?: boolean;
+};
+
+// @public (undocumented)
+export type LoadingButtonProps = Omit<BaseProps, 'overlay'> & LoadingButtonOwnProps;
+
+// @public (undocumented)
+export type Spacing = 'compact' | 'default' | 'none';
+
+// @public (undocumented)
+export const Theme: {
+    Consumer: ComponentType<    {
+    children: (tokens: ThemeTokens) => ReactNode;
+    } & Partial<CustomThemeButtonProps> & {
+    state: InteractionState;
+    iconIsOnlyChild?: boolean | undefined;
+    mode?: ThemeModes_2 | undefined;
+    }>;
+    Provider: ComponentType<    {
+    children?: ReactNode;
+    value?: ThemeProp<ThemeTokens, ThemeProps> | undefined;
+    }>;
+    useTheme: (props: ThemeProps) => ThemeTokens;
+};
+
+// @public (undocumented)
+export type ThemeProps = Partial<CustomThemeButtonProps> & {
+    state: InteractionState;
+    iconIsOnlyChild?: boolean;
+    mode?: ThemeModes;
+};
+
+// @public (undocumented)
+export type ThemeTokens = {
+    buttonStyles: CSSObject;
+    spinnerStyles: CSSObject;
+};
+
+// (No @packageDocumentation comment for this package)
+
+```