@atlaskit/button 21.1.4 → 21.1.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +15 -0
- package/dist/cjs/new-button/containers/split-button/split-button.compiled.css +34 -0
- package/dist/cjs/new-button/containers/split-button/split-button.js +58 -118
- package/dist/cjs/new-button/variants/default/button.js +36 -41
- package/dist/cjs/new-button/variants/default/link.compiled.css +119 -0
- package/dist/cjs/new-button/variants/default/link.js +111 -59
- package/dist/cjs/new-button/variants/icon/button.js +128 -143
- package/dist/cjs/new-button/variants/icon/link.compiled.css +104 -0
- package/dist/cjs/new-button/variants/icon/link.js +101 -75
- package/dist/cjs/new-button/variants/shared/button-base.compiled.css +137 -0
- package/dist/cjs/new-button/variants/shared/button-base.js +223 -0
- package/dist/cjs/new-button/variants/shared/content.compiled.css +19 -0
- package/dist/cjs/new-button/variants/shared/content.js +13 -53
- package/dist/cjs/old-button/shared/button-base.js +1 -1
- package/dist/es2019/new-button/containers/split-button/split-button.compiled.css +34 -0
- package/dist/es2019/new-button/containers/split-button/split-button.js +54 -117
- package/dist/es2019/new-button/variants/default/button.js +47 -56
- package/dist/es2019/new-button/variants/default/link.compiled.css +119 -0
- package/dist/es2019/new-button/variants/default/link.js +113 -63
- package/dist/es2019/new-button/variants/icon/button.js +117 -133
- package/dist/es2019/new-button/variants/icon/link.compiled.css +104 -0
- package/dist/es2019/new-button/variants/icon/link.js +94 -70
- package/dist/es2019/new-button/variants/shared/button-base.compiled.css +137 -0
- package/dist/es2019/new-button/variants/shared/button-base.js +203 -0
- package/dist/es2019/new-button/variants/shared/content.compiled.css +19 -0
- package/dist/es2019/new-button/variants/shared/content.js +13 -52
- package/dist/es2019/old-button/shared/button-base.js +1 -1
- package/dist/esm/new-button/containers/split-button/split-button.compiled.css +34 -0
- package/dist/esm/new-button/containers/split-button/split-button.js +55 -120
- package/dist/esm/new-button/variants/default/button.js +33 -41
- package/dist/esm/new-button/variants/default/link.compiled.css +119 -0
- package/dist/esm/new-button/variants/default/link.js +111 -59
- package/dist/esm/new-button/variants/icon/button.js +128 -143
- package/dist/esm/new-button/variants/icon/link.compiled.css +104 -0
- package/dist/esm/new-button/variants/icon/link.js +98 -72
- package/dist/esm/new-button/variants/shared/button-base.compiled.css +137 -0
- package/dist/esm/new-button/variants/shared/button-base.js +213 -0
- package/dist/esm/new-button/variants/shared/content.compiled.css +19 -0
- package/dist/esm/new-button/variants/shared/content.js +13 -53
- package/dist/esm/old-button/shared/button-base.js +1 -1
- package/dist/types/new-button/containers/split-button/split-button.d.ts +4 -5
- package/dist/types/new-button/variants/default/button.d.ts +5 -1
- package/dist/types/new-button/variants/default/link.d.ts +22 -8
- package/dist/types/new-button/variants/icon/button.d.ts +5 -1
- package/dist/types/new-button/variants/icon/link.d.ts +11 -4
- package/dist/types/new-button/variants/shared/block-events.d.ts +1 -1
- package/dist/types/new-button/variants/shared/button-base.d.ts +45 -0
- package/dist/types/new-button/variants/shared/content.d.ts +5 -1
- package/dist/types/new-button/variants/types.d.ts +26 -6
- package/dist/types-ts4.5/new-button/containers/split-button/split-button.d.ts +4 -5
- package/dist/types-ts4.5/new-button/variants/default/button.d.ts +5 -1
- package/dist/types-ts4.5/new-button/variants/default/link.d.ts +22 -8
- package/dist/types-ts4.5/new-button/variants/icon/button.d.ts +5 -1
- package/dist/types-ts4.5/new-button/variants/icon/link.d.ts +11 -4
- package/dist/types-ts4.5/new-button/variants/shared/block-events.d.ts +1 -1
- package/dist/types-ts4.5/new-button/variants/shared/button-base.d.ts +45 -0
- package/dist/types-ts4.5/new-button/variants/shared/content.d.ts +5 -1
- package/dist/types-ts4.5/new-button/variants/types.d.ts +26 -6
- package/package.json +17 -15
- package/dist/cjs/new-button/variants/default/use-default-button.js +0 -98
- package/dist/cjs/new-button/variants/icon/use-icon-button.js +0 -88
- package/dist/cjs/new-button/variants/shared/use-button-base.js +0 -639
- package/dist/es2019/new-button/variants/default/use-default-button.js +0 -88
- package/dist/es2019/new-button/variants/icon/use-icon-button.js +0 -81
- package/dist/es2019/new-button/variants/shared/use-button-base.js +0 -619
- package/dist/esm/new-button/variants/default/use-default-button.js +0 -88
- package/dist/esm/new-button/variants/icon/use-icon-button.js +0 -81
- package/dist/esm/new-button/variants/shared/use-button-base.js +0 -629
- package/dist/types/new-button/variants/default/use-default-button.d.ts +0 -16
- package/dist/types/new-button/variants/icon/use-icon-button.d.ts +0 -16
- package/dist/types/new-button/variants/shared/use-button-base.d.ts +0 -46
- package/dist/types-ts4.5/new-button/variants/default/use-default-button.d.ts +0 -16
- package/dist/types-ts4.5/new-button/variants/icon/use-icon-button.d.ts +0 -16
- package/dist/types-ts4.5/new-button/variants/shared/use-button-base.d.ts +0 -46
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { xcss } from '@atlaskit/primitives';
|
|
3
|
-
import { type Appearance, type CommonButtonProps, type Spacing } from '../types';
|
|
4
|
-
export type ControlledEvents<TagName extends HTMLElement> = Pick<React.DOMAttributes<TagName>, 'onMouseDownCapture' | 'onMouseUpCapture' | 'onKeyDownCapture' | 'onKeyUpCapture' | 'onTouchStartCapture' | 'onTouchEndCapture' | 'onPointerDownCapture' | 'onPointerUpCapture' | 'onClickCapture'> & Pick<CommonButtonProps<TagName>, 'onClick'>;
|
|
5
|
-
export type UseButtonBaseArgs<TagName extends HTMLElement> = {
|
|
6
|
-
ref: React.Ref<TagName>;
|
|
7
|
-
/**
|
|
8
|
-
* The type of button. Used to pass action subject context to analytics.
|
|
9
|
-
*/
|
|
10
|
-
buttonType: 'button' | 'link';
|
|
11
|
-
isIconButton?: boolean;
|
|
12
|
-
isCircle?: boolean;
|
|
13
|
-
hasIconBefore?: boolean;
|
|
14
|
-
hasIconAfter?: boolean;
|
|
15
|
-
shouldFitContainer?: boolean;
|
|
16
|
-
appearance?: Appearance;
|
|
17
|
-
children: React.ReactNode;
|
|
18
|
-
spacing?: Spacing;
|
|
19
|
-
isLoading?: boolean;
|
|
20
|
-
ariaLabel?: string;
|
|
21
|
-
ariaLabelledBy?: string;
|
|
22
|
-
} & Pick<CommonButtonProps<TagName>, 'analyticsContext' | 'autoFocus' | 'interactionName' | 'isDisabled' | 'isSelected' | 'testId'> & ControlledEvents<TagName>;
|
|
23
|
-
type XCSS = ReturnType<typeof xcss>;
|
|
24
|
-
export type UseButtonBaseReturn<TagName extends HTMLElement> = {
|
|
25
|
-
xcss: XCSS | Array<XCSS | false | undefined>;
|
|
26
|
-
ref(node: TagName | null): void;
|
|
27
|
-
children: React.ReactNode;
|
|
28
|
-
isDisabled: boolean;
|
|
29
|
-
'aria-label'?: string;
|
|
30
|
-
'aria-labelledby'?: string;
|
|
31
|
-
} & ControlledEvents<TagName>;
|
|
32
|
-
/**
|
|
33
|
-
* __Use button base__
|
|
34
|
-
*
|
|
35
|
-
* A React hook that accepts a set of common Button props,
|
|
36
|
-
* and processes them to return consistent base props for usage
|
|
37
|
-
* across various Button components.
|
|
38
|
-
*
|
|
39
|
-
* It also:
|
|
40
|
-
* - Implements auto focus when enabled.
|
|
41
|
-
* - Appends the `onClick` event with UFO analytics tracking.
|
|
42
|
-
*
|
|
43
|
-
* @private
|
|
44
|
-
*/
|
|
45
|
-
declare const useButtonBase: <TagName extends HTMLElement>({ appearance: propAppearance, autoFocus, buttonType, isDisabled: propIsDisabled, isLoading, isSelected: propIsSelected, isIconButton, isCircle, hasIconBefore, hasIconAfter, children, onClick, onMouseDownCapture, onMouseUpCapture, onKeyDownCapture, onKeyUpCapture, onTouchStartCapture, onTouchEndCapture, onPointerDownCapture, onPointerUpCapture, onClickCapture, ref, shouldFitContainer, spacing: propSpacing, testId, ariaLabel, ariaLabelledBy, }: UseButtonBaseArgs<TagName>) => UseButtonBaseReturn<TagName>;
|
|
46
|
-
export default useButtonBase;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { type UseButtonBaseArgs, type UseButtonBaseReturn } from '../shared/use-button-base';
|
|
2
|
-
import type { CommonButtonProps } from '../types';
|
|
3
|
-
import type { CommonDefaultButtonProps } from './types';
|
|
4
|
-
type UseDefaultButtonArgs<TagName extends HTMLElement> = UseButtonBaseArgs<TagName> & CommonDefaultButtonProps & Pick<CommonButtonProps<TagName>, 'testId'>;
|
|
5
|
-
type UseButtonReturn<TagName extends HTMLElement> = UseButtonBaseReturn<TagName>;
|
|
6
|
-
/**
|
|
7
|
-
* __Use default button base__
|
|
8
|
-
*
|
|
9
|
-
* A React hook that accepts a set of default Button props,
|
|
10
|
-
* and processes them to return consistent base props for usage
|
|
11
|
-
* across Button and LinkButton variants.
|
|
12
|
-
*
|
|
13
|
-
* @private
|
|
14
|
-
*/
|
|
15
|
-
declare const useDefaultButton: <TagName extends HTMLElement>({ analyticsContext, appearance, ariaLabel, ariaLabelledBy, autoFocus, buttonType, children, iconAfter, iconBefore, interactionName, isDisabled, isLoading, isSelected, onClick, onClickCapture, onKeyDownCapture, onKeyUpCapture, onMouseDownCapture, onMouseUpCapture, onPointerDownCapture, onPointerUpCapture, onTouchEndCapture, onTouchStartCapture, ref, shouldFitContainer, spacing, testId, }: UseDefaultButtonArgs<TagName>) => UseButtonReturn<TagName>;
|
|
16
|
-
export default useDefaultButton;
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { type UseButtonBaseArgs, type UseButtonBaseReturn } from '../shared/use-button-base';
|
|
2
|
-
import type { CommonButtonProps } from '../types';
|
|
3
|
-
import type { CommonIconButtonProps } from './types';
|
|
4
|
-
type UseIconButtonArgs<TagName extends HTMLElement> = Omit<UseButtonBaseArgs<TagName>, 'children'> & Omit<CommonIconButtonProps, 'isTooltipDisabled' | 'tooltip'> & Pick<CommonButtonProps<TagName>, 'testId'>;
|
|
5
|
-
type UseIconButtonReturn<TagName extends HTMLElement> = UseButtonBaseReturn<TagName>;
|
|
6
|
-
/**
|
|
7
|
-
* __Use icon button__
|
|
8
|
-
*
|
|
9
|
-
* A React hook that accepts a set of icon Button props,
|
|
10
|
-
* and processes them to return consistent base props for usage
|
|
11
|
-
* across IconButton and LinkIconButton variants.
|
|
12
|
-
*
|
|
13
|
-
* @private
|
|
14
|
-
*/
|
|
15
|
-
declare const useIconButton: <TagName extends HTMLElement>({ analyticsContext, appearance, ariaLabel, ariaLabelledBy, autoFocus, buttonType, icon, interactionName, isDisabled, isLoading, isSelected, label, onClick, onClickCapture, onKeyDownCapture, onKeyUpCapture, onMouseDownCapture, onMouseUpCapture, onPointerDownCapture, onPointerUpCapture, onTouchEndCapture, onTouchStartCapture, ref, shape, shouldFitContainer, spacing, testId, }: UseIconButtonArgs<TagName>) => UseIconButtonReturn<TagName>;
|
|
16
|
-
export default useIconButton;
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { xcss } from '@atlaskit/primitives';
|
|
3
|
-
import { type Appearance, type CommonButtonProps, type Spacing } from '../types';
|
|
4
|
-
export type ControlledEvents<TagName extends HTMLElement> = Pick<React.DOMAttributes<TagName>, 'onMouseDownCapture' | 'onMouseUpCapture' | 'onKeyDownCapture' | 'onKeyUpCapture' | 'onTouchStartCapture' | 'onTouchEndCapture' | 'onPointerDownCapture' | 'onPointerUpCapture' | 'onClickCapture'> & Pick<CommonButtonProps<TagName>, 'onClick'>;
|
|
5
|
-
export type UseButtonBaseArgs<TagName extends HTMLElement> = {
|
|
6
|
-
ref: React.Ref<TagName>;
|
|
7
|
-
/**
|
|
8
|
-
* The type of button. Used to pass action subject context to analytics.
|
|
9
|
-
*/
|
|
10
|
-
buttonType: 'button' | 'link';
|
|
11
|
-
isIconButton?: boolean;
|
|
12
|
-
isCircle?: boolean;
|
|
13
|
-
hasIconBefore?: boolean;
|
|
14
|
-
hasIconAfter?: boolean;
|
|
15
|
-
shouldFitContainer?: boolean;
|
|
16
|
-
appearance?: Appearance;
|
|
17
|
-
children: React.ReactNode;
|
|
18
|
-
spacing?: Spacing;
|
|
19
|
-
isLoading?: boolean;
|
|
20
|
-
ariaLabel?: string;
|
|
21
|
-
ariaLabelledBy?: string;
|
|
22
|
-
} & Pick<CommonButtonProps<TagName>, 'analyticsContext' | 'autoFocus' | 'interactionName' | 'isDisabled' | 'isSelected' | 'testId'> & ControlledEvents<TagName>;
|
|
23
|
-
type XCSS = ReturnType<typeof xcss>;
|
|
24
|
-
export type UseButtonBaseReturn<TagName extends HTMLElement> = {
|
|
25
|
-
xcss: XCSS | Array<XCSS | false | undefined>;
|
|
26
|
-
ref(node: TagName | null): void;
|
|
27
|
-
children: React.ReactNode;
|
|
28
|
-
isDisabled: boolean;
|
|
29
|
-
'aria-label'?: string;
|
|
30
|
-
'aria-labelledby'?: string;
|
|
31
|
-
} & ControlledEvents<TagName>;
|
|
32
|
-
/**
|
|
33
|
-
* __Use button base__
|
|
34
|
-
*
|
|
35
|
-
* A React hook that accepts a set of common Button props,
|
|
36
|
-
* and processes them to return consistent base props for usage
|
|
37
|
-
* across various Button components.
|
|
38
|
-
*
|
|
39
|
-
* It also:
|
|
40
|
-
* - Implements auto focus when enabled.
|
|
41
|
-
* - Appends the `onClick` event with UFO analytics tracking.
|
|
42
|
-
*
|
|
43
|
-
* @private
|
|
44
|
-
*/
|
|
45
|
-
declare const useButtonBase: <TagName extends HTMLElement>({ appearance: propAppearance, autoFocus, buttonType, isDisabled: propIsDisabled, isLoading, isSelected: propIsSelected, isIconButton, isCircle, hasIconBefore, hasIconAfter, children, onClick, onMouseDownCapture, onMouseUpCapture, onKeyDownCapture, onKeyUpCapture, onTouchStartCapture, onTouchEndCapture, onPointerDownCapture, onPointerUpCapture, onClickCapture, ref, shouldFitContainer, spacing: propSpacing, testId, ariaLabel, ariaLabelledBy, }: UseButtonBaseArgs<TagName>) => UseButtonBaseReturn<TagName>;
|
|
46
|
-
export default useButtonBase;
|