@atlaskit/button 17.7.2 → 17.9.0

package/dist/types/new-button/variants/icon/use-icon-button.d.ts

@@ -11,5 +11,5 @@ type UseIconButtonReturn<TagName extends HTMLElement> = UseButtonBaseReturn<TagN
  *
  * @private
  */
-declare const useIconButton: <TagName extends HTMLElement>({ analyticsContext, appearance, autoFocus, buttonType, icon: Icon, interactionName, isDisabled, isSelected, label, onClick, onMouseDownCapture, onMouseUpCapture, onKeyDownCapture, onKeyUpCapture, onTouchStartCapture, onTouchEndCapture, onPointerDownCapture, onPointerUpCapture, onClickCapture, overlay, ref, shape, shouldFitContainer, spacing, UNSAFE_size, }: UseIconButtonArgs<TagName>) => UseIconButtonReturn<TagName>;
+declare const useIconButton: <TagName extends HTMLElement>({ analyticsContext, appearance, autoFocus, buttonType, icon: Icon, interactionName, isDisabled, isSelected, isLoading, label, onClick, onMouseDownCapture, onMouseUpCapture, onKeyDownCapture, onKeyUpCapture, onTouchStartCapture, onTouchEndCapture, onPointerDownCapture, onPointerUpCapture, onClickCapture, overlay, ref, shape, shouldFitContainer, spacing, UNSAFE_size, }: UseIconButtonArgs<TagName>) => UseIconButtonReturn<TagName>;
 export default useIconButton;

package/dist/types/new-button/variants/shared/colors.d.ts

@@ -5,10 +5,12 @@ export type ColorGroup<T extends BackgroundColor | TextColor> = {
     hover?: T;
     active?: T;
     disabled?: T;
-    selected?: T;
 };
-export type ColorPreset<T extends BackgroundColor | TextColor> = {
-    [key in Appearance]: ColorGroup<T>;
+export type ColorGroupWithSelected<T extends BackgroundColor | TextColor> = ColorGroup<T> & {
+    selected?: ColorGroup<T>;
+};
+export type ColorPreset<T extends BackgroundColor | TextColor> = Record<Appearance, ColorGroupWithSelected<T>> & {
+    selected: ColorGroup<T>;
 };
 type Values = {
     background: ColorPreset<BackgroundColor>;

package/dist/types/new-button/variants/shared/loading-overlay.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { Appearance, type ButtonSpacing } from '../types';
+export default function renderLoadingOverlay({ appearance, spacing, isDisabled, isSelected, }: {
+    spacing?: ButtonSpacing;
+    appearance?: Appearance;
+    isDisabled?: boolean;
+    isSelected?: boolean;
+}): JSX.Element;

package/dist/types-ts4.5/entry-points/standard-button.d.ts

@@ -1,7 +1,2 @@
-/**
- * Must import '@emotion/core' in order to resolve type error
- * https://product-fabric.atlassian.net/browse/DSP-3222
- */
-import '@emotion/react';
 export { default } from '../old-button/button';
 export type { ButtonProps } from '../old-button/button';

package/dist/types-ts4.5/new-button/variants/default/types.d.ts

@@ -1,6 +1,10 @@
 /// <reference types="react" />
 import { type ButtonSpacing, type IconProp, type IconSize } from '../types';
 export type CommonDefaultButtonProps = {
+    /**
+     * Conditionally show a spinner over the top of a button
+     */
+    isLoading?: boolean;
     /**
      * Text content to be rendered in the button. Required so that screen readers always have an accessible label provided for the button.
      */

package/dist/types-ts4.5/new-button/variants/default/use-default-button.d.ts

@@ -11,5 +11,5 @@ type UseButtonReturn<TagName extends HTMLElement> = UseButtonBaseReturn<TagName>
  *
  * @private
  */
-declare const useDefaultButton: <TagName extends HTMLElement>({ analyticsContext, appearance, autoFocus, buttonType, iconBefore: IconBefore, UNSAFE_iconBefore_size, iconAfter: IconAfter, UNSAFE_iconAfter_size, interactionName, isDisabled, isSelected, children, onClick, onMouseDownCapture, onMouseUpCapture, onKeyDownCapture, onKeyUpCapture, onTouchStartCapture, onTouchEndCapture, onPointerDownCapture, onPointerUpCapture, onClickCapture, overlay, ref, shouldFitContainer, spacing, }: UseDefaultButtonArgs<TagName>) => UseButtonReturn<TagName>;
+declare const useDefaultButton: <TagName extends HTMLElement>({ analyticsContext, appearance, autoFocus, buttonType, iconBefore: IconBefore, UNSAFE_iconBefore_size, iconAfter: IconAfter, UNSAFE_iconAfter_size, interactionName, isDisabled, isSelected, isLoading, children, onClick, onMouseDownCapture, onMouseUpCapture, onKeyDownCapture, onKeyUpCapture, onTouchStartCapture, onTouchEndCapture, onPointerDownCapture, onPointerUpCapture, onClickCapture, overlay, ref, shouldFitContainer, spacing, }: UseDefaultButtonArgs<TagName>) => UseButtonReturn<TagName>;
 export default useDefaultButton;

package/dist/types-ts4.5/new-button/variants/icon/types.d.ts

@@ -1,5 +1,9 @@
 import { type IconButtonAppearance, type IconButtonSpacing, type IconProp, type IconSize } from '../types';
 export type CommonIconButtonProps = {
+    /**
+     * Conditionally show a spinner over the top of a button
+     */
+    isLoading?: boolean;
     /**
      * The button style variation.
      */

package/dist/types-ts4.5/new-button/variants/icon/use-icon-button.d.ts

@@ -11,5 +11,5 @@ type UseIconButtonReturn<TagName extends HTMLElement> = UseButtonBaseReturn<TagN
  *
  * @private
  */
-declare const useIconButton: <TagName extends HTMLElement>({ analyticsContext, appearance, autoFocus, buttonType, icon: Icon, interactionName, isDisabled, isSelected, label, onClick, onMouseDownCapture, onMouseUpCapture, onKeyDownCapture, onKeyUpCapture, onTouchStartCapture, onTouchEndCapture, onPointerDownCapture, onPointerUpCapture, onClickCapture, overlay, ref, shape, shouldFitContainer, spacing, UNSAFE_size, }: UseIconButtonArgs<TagName>) => UseIconButtonReturn<TagName>;
+declare const useIconButton: <TagName extends HTMLElement>({ analyticsContext, appearance, autoFocus, buttonType, icon: Icon, interactionName, isDisabled, isSelected, isLoading, label, onClick, onMouseDownCapture, onMouseUpCapture, onKeyDownCapture, onKeyUpCapture, onTouchStartCapture, onTouchEndCapture, onPointerDownCapture, onPointerUpCapture, onClickCapture, overlay, ref, shape, shouldFitContainer, spacing, UNSAFE_size, }: UseIconButtonArgs<TagName>) => UseIconButtonReturn<TagName>;
 export default useIconButton;

package/dist/types-ts4.5/new-button/variants/shared/colors.d.ts

@@ -5,10 +5,12 @@ export type ColorGroup<T extends BackgroundColor | TextColor> = {
     hover?: T;
     active?: T;
     disabled?: T;
-    selected?: T;
 };
-export type ColorPreset<T extends BackgroundColor | TextColor> = {
-    [key in Appearance]: ColorGroup<T>;
+export type ColorGroupWithSelected<T extends BackgroundColor | TextColor> = ColorGroup<T> & {
+    selected?: ColorGroup<T>;
+};
+export type ColorPreset<T extends BackgroundColor | TextColor> = Record<Appearance, ColorGroupWithSelected<T>> & {
+    selected: ColorGroup<T>;
 };
 type Values = {
     background: ColorPreset<BackgroundColor>;

package/dist/types-ts4.5/new-button/variants/shared/loading-overlay.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { Appearance, type ButtonSpacing } from '../types';
+export default function renderLoadingOverlay({ appearance, spacing, isDisabled, isSelected, }: {
+    spacing?: ButtonSpacing;
+    appearance?: Appearance;
+    isDisabled?: boolean;
+    isSelected?: boolean;
+}): JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/button",
-  "version": "17.7.2",
+  "version": "17.9.0",
   "description": "A button triggers an event or action. They let users know what will happen next.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -87,10 +87,10 @@
     "@atlaskit/focus-ring": "^1.3.0",
     "@atlaskit/icon": "^22.1.0",
     "@atlaskit/interaction-context": "^2.1.0",
-    "@atlaskit/primitives": "^5.1.0",
+    "@atlaskit/primitives": "^5.5.0",
     "@atlaskit/spinner": "^16.0.0",
-    "@atlaskit/theme": "^12.6.0",
-    "@atlaskit/tokens": "^1.42.0",
+    "@atlaskit/theme": "^12.7.0",
+    "@atlaskit/tokens": "^1.43.0",
     "@atlaskit/visually-hidden": "^1.2.4",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1"
@@ -102,7 +102,7 @@
     "@af/accessibility-testing": "*",
     "@af/integration-testing": "*",
     "@af/visual-regression": "*",
-    "@atlaskit/app-provider": "^1.0.0",
+    "@atlaskit/app-provider": "^1.2.0",
     "@atlaskit/ssr": "*",
     "@atlaskit/visual-regression": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",