@transferwise/components 0.0.0-experimental-a656242 → 0.0.0-experimental-887f2e6
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/build/avatarLayout/AvatarLayout.js +9 -2
- package/build/avatarLayout/AvatarLayout.js.map +1 -1
- package/build/avatarLayout/AvatarLayout.mjs +9 -2
- package/build/avatarLayout/AvatarLayout.mjs.map +1 -1
- package/build/avatarView/AvatarView.js +1 -12
- package/build/avatarView/AvatarView.js.map +1 -1
- package/build/avatarView/AvatarView.mjs +1 -12
- package/build/avatarView/AvatarView.mjs.map +1 -1
- package/build/button/Button.js +78 -79
- package/build/button/Button.js.map +1 -1
- package/build/button/Button.mjs +79 -80
- package/build/button/Button.mjs.map +1 -1
- package/build/button/Button.resolver.js +78 -0
- package/build/button/Button.resolver.js.map +1 -0
- package/build/button/Button.resolver.mjs +76 -0
- package/build/button/Button.resolver.mjs.map +1 -0
- package/build/button/LegacyButton.js +114 -0
- package/build/button/LegacyButton.js.map +1 -0
- package/build/button/LegacyButton.mjs +112 -0
- package/build/button/LegacyButton.mjs.map +1 -0
- package/build/circularButton/CircularButton.js +21 -18
- package/build/circularButton/CircularButton.js.map +1 -1
- package/build/circularButton/CircularButton.mjs +22 -19
- package/build/circularButton/CircularButton.mjs.map +1 -1
- package/build/criticalBanner/CriticalCommsBanner.js +2 -2
- package/build/criticalBanner/CriticalCommsBanner.js.map +1 -1
- package/build/criticalBanner/CriticalCommsBanner.mjs +1 -1
- package/build/definitionList/DefinitionList.js.map +1 -1
- package/build/definitionList/DefinitionList.mjs.map +1 -1
- package/build/header/Header.js +2 -2
- package/build/header/Header.js.map +1 -1
- package/build/header/Header.mjs +1 -1
- package/build/i18n/de.json +0 -1
- package/build/i18n/de.json.js +0 -1
- package/build/i18n/de.json.js.map +1 -1
- package/build/i18n/de.json.mjs +0 -1
- package/build/i18n/de.json.mjs.map +1 -1
- package/build/i18n/it.json +0 -1
- package/build/i18n/it.json.js +0 -1
- package/build/i18n/it.json.js.map +1 -1
- package/build/i18n/it.json.mjs +0 -1
- package/build/i18n/it.json.mjs.map +1 -1
- package/build/i18n/th.json +0 -1
- package/build/i18n/th.json.js +0 -1
- package/build/i18n/th.json.js.map +1 -1
- package/build/i18n/th.json.mjs +0 -1
- package/build/i18n/th.json.mjs.map +1 -1
- package/build/index.js +2 -2
- package/build/index.mjs +1 -1
- package/build/link/Link.js +8 -3
- package/build/link/Link.js.map +1 -1
- package/build/link/Link.mjs +8 -3
- package/build/link/Link.mjs.map +1 -1
- package/build/main.css +416 -17
- package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.js +1 -3
- package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.js.map +1 -1
- package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.mjs +1 -3
- package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.mjs.map +1 -1
- package/build/primitives/PrimitiveButton/src/PrimitiveButton.js +1 -4
- package/build/primitives/PrimitiveButton/src/PrimitiveButton.js.map +1 -1
- package/build/primitives/PrimitiveButton/src/PrimitiveButton.mjs +1 -4
- package/build/primitives/PrimitiveButton/src/PrimitiveButton.mjs.map +1 -1
- package/build/select/Select.js +5 -3
- package/build/select/Select.js.map +1 -1
- package/build/select/Select.mjs +4 -2
- package/build/select/Select.mjs.map +1 -1
- package/build/styles/avatarLayout/AvatarLayout.css +11 -0
- package/build/styles/button/Button.css +240 -16
- package/build/styles/button/Button.vars.css +55 -0
- package/build/styles/button/LegacyButton.css +23 -0
- package/build/styles/circularButton/CircularButton.css +158 -17
- package/build/styles/main.css +416 -17
- package/build/types/avatarLayout/AvatarLayout.d.ts +1 -2
- package/build/types/avatarLayout/AvatarLayout.d.ts.map +1 -1
- package/build/types/avatarLayout/index.d.ts +1 -0
- package/build/types/avatarLayout/index.d.ts.map +1 -1
- package/build/types/avatarView/AvatarView.d.ts.map +1 -1
- package/build/types/button/Button.d.ts +1 -23
- package/build/types/button/Button.d.ts.map +1 -1
- package/build/types/button/Button.resolver.d.ts +31 -0
- package/build/types/button/Button.resolver.d.ts.map +1 -0
- package/build/types/button/Button.types.d.ts +67 -0
- package/build/types/button/Button.types.d.ts.map +1 -0
- package/build/types/button/LegacyButton.d.ts +30 -0
- package/build/types/button/LegacyButton.d.ts.map +1 -0
- package/build/types/button/index.d.ts +2 -2
- package/build/types/button/index.d.ts.map +1 -1
- package/build/types/circularButton/CircularButton.d.ts +4 -11
- package/build/types/circularButton/CircularButton.d.ts.map +1 -1
- package/build/types/definitionList/DefinitionList.d.ts +2 -1
- package/build/types/definitionList/DefinitionList.d.ts.map +1 -1
- package/build/types/link/Link.d.ts +2 -2
- package/build/types/link/Link.d.ts.map +1 -1
- package/build/types/primitives/PrimitiveAnchor/src/PrimitiveAnchor.d.ts.map +1 -1
- package/build/types/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.d.ts +1 -1
- package/build/types/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.d.ts.map +1 -1
- package/build/types/primitives/PrimitiveButton/src/PrimitiveButton.d.ts.map +1 -1
- package/build/types/select/Select.d.ts.map +1 -1
- package/build/upload/steps/completeStep/completeStep.js +2 -2
- package/build/upload/steps/completeStep/completeStep.js.map +1 -1
- package/build/upload/steps/completeStep/completeStep.mjs +1 -1
- package/build/upload/steps/processingStep/processingStep.js +2 -2
- package/build/upload/steps/processingStep/processingStep.js.map +1 -1
- package/build/upload/steps/processingStep/processingStep.mjs +1 -1
- package/build/uploadInput/UploadInput.js +3 -3
- package/build/uploadInput/UploadInput.js.map +1 -1
- package/build/uploadInput/UploadInput.mjs +1 -1
- package/package.json +3 -3
- package/src/avatarLayout/AvatarLayout.css +11 -0
- package/src/avatarLayout/AvatarLayout.less +18 -1
- package/src/avatarLayout/AvatarLayout.tsx +11 -3
- package/src/avatarLayout/index.ts +1 -0
- package/src/avatarView/AvatarView.tsx +1 -15
- package/src/button/Button.css +240 -16
- package/src/button/Button.less +208 -14
- package/src/button/Button.resolver.tsx +120 -0
- package/src/button/Button.spec.tsx +54 -231
- package/src/button/Button.story.tsx +610 -137
- package/src/button/Button.tsx +88 -132
- package/src/button/Button.types.ts +88 -0
- package/src/button/Button.vars.css +55 -0
- package/src/button/Button.vars.less +69 -0
- package/src/button/LegacyButton.css +23 -0
- package/src/button/LegacyButton.less +24 -0
- package/src/button/LegacyButton.spec.tsx +146 -0
- package/src/button/LegacyButton.story.tsx +224 -0
- package/src/button/LegacyButton.tsx +161 -0
- package/src/button/index.ts +2 -3
- package/src/circularButton/CircularButton.css +158 -17
- package/src/circularButton/CircularButton.less +91 -22
- package/src/circularButton/CircularButton.story.tsx +24 -45
- package/src/circularButton/CircularButton.tsx +25 -38
- package/src/circularButton/_button-label-states.less +34 -0
- package/src/definitionList/DefinitionList.spec.js +91 -0
- package/src/definitionList/DefinitionList.story.tsx +57 -57
- package/src/definitionList/DefinitionList.tsx +1 -1
- package/src/flowNavigation/__snapshots__/FlowNavigation.spec.js.snap +1 -1
- package/src/i18n/de.json +0 -1
- package/src/i18n/it.json +0 -1
- package/src/i18n/th.json +0 -1
- package/src/iconButton/IconButton.story.tsx +6 -6
- package/src/inputs/SelectInput.story.tsx +1 -1
- package/src/link/Link.tsx +15 -6
- package/src/main.css +416 -17
- package/src/main.less +1 -0
- package/src/primitives/PrimitiveAnchor/src/PrimitiveAnchor.tsx +1 -7
- package/src/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.ts +1 -1
- package/src/primitives/PrimitiveAnchor/test/PrimitiveAnchor.spec.tsx +1 -3
- package/src/primitives/PrimitiveButton/src/PrimitiveButton.tsx +1 -8
- package/src/primitives/PrimitiveButton/test/PrimitiveButton.spec.tsx +2 -5
- package/src/select/Select.tsx +1 -0
- package/src/slidingPanel/SlidingPanel.spec.js +56 -0
- package/src/button/__snapshots__/Button.spec.tsx.snap +0 -309
- package/src/slidingPanel/SlidingPanel.spec.tsx +0 -69
package/build/button/Button.mjs
CHANGED
|
@@ -1,12 +1,15 @@
|
|
|
1
|
-
import { clsx } from 'clsx';
|
|
2
1
|
import { forwardRef } from 'react';
|
|
3
|
-
import
|
|
2
|
+
import PrimitiveButton from '../primitives/PrimitiveButton/src/PrimitiveButton.mjs';
|
|
3
|
+
import PrimitiveAnchor from '../primitives/PrimitiveAnchor/src/PrimitiveAnchor.mjs';
|
|
4
|
+
import AvatarLayout from '../avatarLayout/AvatarLayout.mjs';
|
|
5
|
+
import ProcessIndicator from '../processIndicator/ProcessIndicator.mjs';
|
|
6
|
+
import { clsx } from 'clsx';
|
|
4
7
|
import '../common/theme.mjs';
|
|
5
8
|
import '../common/direction.mjs';
|
|
6
|
-
import
|
|
9
|
+
import '../common/propsValues/control.mjs';
|
|
7
10
|
import '../common/propsValues/breakpoint.mjs';
|
|
8
|
-
import
|
|
9
|
-
import '../common/propsValues/typography.mjs';
|
|
11
|
+
import '../common/propsValues/size.mjs';
|
|
12
|
+
import { Typography } from '../common/propsValues/typography.mjs';
|
|
10
13
|
import '../common/propsValues/width.mjs';
|
|
11
14
|
import '../common/propsValues/type.mjs';
|
|
12
15
|
import '../common/propsValues/dateMode.mjs';
|
|
@@ -21,90 +24,86 @@ import '../common/propsValues/scroll.mjs';
|
|
|
21
24
|
import '../common/propsValues/markdownNodeType.mjs';
|
|
22
25
|
import '../common/fileType.mjs';
|
|
23
26
|
import '@transferwise/icons';
|
|
27
|
+
import 'react-intl';
|
|
24
28
|
import '../common/closeButton/CloseButton.messages.mjs';
|
|
25
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
26
|
-
import
|
|
27
|
-
import messages from '../i18n/commonMessages/Button.messages.mjs';
|
|
28
|
-
import { typeClassMap, priorityClassMap } from './classMap.mjs';
|
|
29
|
-
import { logDeprecationNotices, establishNewType, establishNewPriority } from './legacyUtils/legacyUtils.mjs';
|
|
29
|
+
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
30
|
+
import Body from '../body/Body.mjs';
|
|
30
31
|
|
|
32
|
+
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
|
|
31
33
|
const Button = /*#__PURE__*/forwardRef(({
|
|
32
|
-
as
|
|
33
|
-
block = false,
|
|
34
|
+
as = 'button',
|
|
34
35
|
children,
|
|
35
36
|
className,
|
|
36
|
-
|
|
37
|
+
size = 'lg',
|
|
38
|
+
href,
|
|
39
|
+
disabled = false,
|
|
40
|
+
priority = 'primary',
|
|
41
|
+
sentiment = 'default',
|
|
42
|
+
iconStart: IconStart,
|
|
43
|
+
iconEnd: IconEnd,
|
|
44
|
+
avatars,
|
|
45
|
+
type = 'button',
|
|
37
46
|
loading = false,
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
47
|
+
block = false,
|
|
48
|
+
...props
|
|
49
|
+
}, ref) => {
|
|
50
|
+
const classNames = clsx('wds-Button', {
|
|
51
|
+
[`wds-Button--block`]: block,
|
|
52
|
+
[`wds-Button--disabled`]: disabled,
|
|
53
|
+
[`wds-Button--loading`]: loading
|
|
54
|
+
}, `wds-Button--${{
|
|
55
|
+
sm: 'small',
|
|
56
|
+
md: 'medium',
|
|
57
|
+
lg: 'large'
|
|
58
|
+
}[size]}`, `wds-Button--${priority}`, `wds-Button--${sentiment}`, className);
|
|
59
|
+
const contentClassNames = clsx('wds-Button-content', {
|
|
60
|
+
[`wds-Button-content--loading`]: loading
|
|
48
61
|
});
|
|
49
|
-
const
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
62
|
+
const content = /*#__PURE__*/jsxs(Body, {
|
|
63
|
+
as: "span",
|
|
64
|
+
type: size === 'sm' ? Typography.BODY_DEFAULT_BOLD : Typography.BODY_LARGE_BOLD,
|
|
65
|
+
className: contentClassNames,
|
|
66
|
+
children: [loading && /*#__PURE__*/jsx(ProcessIndicator, {
|
|
67
|
+
size: "xs",
|
|
68
|
+
className: "wds-Button-loader",
|
|
69
|
+
"data-testid": "button-loader-indicator"
|
|
70
|
+
}), /*#__PURE__*/jsx("span", {
|
|
71
|
+
className: "wds-Button-label",
|
|
72
|
+
"aria-hidden": loading,
|
|
73
|
+
children: size === 'lg' ? children : /*#__PURE__*/jsxs(Fragment, {
|
|
74
|
+
children: [size === 'md' && avatars && /*#__PURE__*/jsx("span", {
|
|
75
|
+
className: "wds-Button-avatars",
|
|
76
|
+
children: /*#__PURE__*/jsx(AvatarLayout, {
|
|
77
|
+
orientation: "horizontal",
|
|
78
|
+
avatars: avatars,
|
|
79
|
+
size: 24
|
|
80
|
+
})
|
|
81
|
+
}), !avatars && IconStart && /*#__PURE__*/jsx(IconStart, {
|
|
82
|
+
className: "wds-Button-icon wds-Button-icon--start"
|
|
83
|
+
}), children, IconEnd && /*#__PURE__*/jsx(IconEnd, {
|
|
84
|
+
className: "wds-Button-icon wds-Button-icon--end"
|
|
85
|
+
})]
|
|
86
|
+
})
|
|
87
|
+
})]
|
|
88
|
+
});
|
|
89
|
+
if (as === 'a') {
|
|
90
|
+
return /*#__PURE__*/jsx(PrimitiveAnchor, {
|
|
91
|
+
ref: ref,
|
|
92
|
+
...props,
|
|
93
|
+
href: href,
|
|
94
|
+
className: classNames,
|
|
95
|
+
disabled: disabled,
|
|
96
|
+
children: content
|
|
97
|
+
});
|
|
83
98
|
}
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
* when `aria-disabled` might be used over the `disabled` HTML attribute
|
|
87
|
-
*/
|
|
88
|
-
const handleClick = handler => event => {
|
|
89
|
-
if (disabled || loading) {
|
|
90
|
-
event.preventDefault();
|
|
91
|
-
} else if (typeof handler === 'function') {
|
|
92
|
-
handler(event);
|
|
93
|
-
}
|
|
94
|
-
};
|
|
95
|
-
return /*#__PURE__*/jsxs(Element, {
|
|
96
|
-
ref: reference,
|
|
97
|
-
className: classes,
|
|
98
|
-
onClick: handleClick(onClick),
|
|
99
|
+
return /*#__PURE__*/jsx(PrimitiveButton, {
|
|
100
|
+
ref: ref,
|
|
99
101
|
...props,
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
className: "btn-loader",
|
|
106
|
-
"data-testid": "ButtonProgressIndicator"
|
|
107
|
-
})]
|
|
102
|
+
className: classNames,
|
|
103
|
+
disabled: disabled,
|
|
104
|
+
loading: loading,
|
|
105
|
+
type: type,
|
|
106
|
+
children: content
|
|
108
107
|
});
|
|
109
108
|
});
|
|
110
109
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.mjs","sources":["../../src/button/Button.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"Button.mjs","sources":["../../src/button/Button.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { forwardRef } from 'react';\nimport { ButtonProps as NewButtonProps } from './Button.types';\nimport { PrimitiveAnchor, PrimitiveButton } from '../primitives';\nimport AvatarLayout from '../avatarLayout';\nimport ProcessIndicator from '../processIndicator';\nimport { clsx } from 'clsx';\nimport { Typography } from '../common';\nimport Body from '../body';\n\nconst Button = forwardRef<HTMLButtonElement | HTMLAnchorElement, NewButtonProps>(\n (\n {\n as = 'button',\n children,\n className,\n size = 'lg',\n href,\n disabled = false,\n priority = 'primary',\n sentiment = 'default',\n iconStart: IconStart,\n iconEnd: IconEnd,\n avatars,\n type = 'button',\n loading = false,\n block = false,\n ...props\n },\n ref,\n ) => {\n const classNames = clsx(\n 'wds-Button',\n {\n [`wds-Button--block`]: block,\n [`wds-Button--disabled`]: disabled,\n [`wds-Button--loading`]: loading,\n },\n `wds-Button--${{ sm: 'small', md: 'medium', lg: 'large' }[size]}`,\n `wds-Button--${priority}`,\n `wds-Button--${sentiment}`,\n className,\n );\n\n const contentClassNames = clsx('wds-Button-content', {\n [`wds-Button-content--loading`]: loading,\n });\n\n const content = (\n <Body\n as=\"span\"\n type={size === 'sm' ? Typography.BODY_DEFAULT_BOLD : Typography.BODY_LARGE_BOLD}\n className={contentClassNames}\n >\n {loading && (\n <ProcessIndicator\n size=\"xs\"\n className=\"wds-Button-loader\"\n data-testid=\"button-loader-indicator\"\n />\n )}\n <span className=\"wds-Button-label\" aria-hidden={loading}>\n {size === 'lg' ? (\n children\n ) : (\n <>\n {size === 'md' && avatars && (\n <span className=\"wds-Button-avatars\">\n <AvatarLayout orientation=\"horizontal\" avatars={avatars} size={24} />\n </span>\n )}\n {!avatars && IconStart && (\n <IconStart className=\"wds-Button-icon wds-Button-icon--start\" />\n )}\n {children}\n {IconEnd && <IconEnd className=\"wds-Button-icon wds-Button-icon--end\" />}\n </>\n )}\n </span>\n </Body>\n );\n\n if (as === 'a') {\n return (\n <PrimitiveAnchor\n ref={ref as React.Ref<HTMLAnchorElement>}\n {...(props as any)}\n href={href}\n className={classNames}\n disabled={disabled}\n >\n {content}\n </PrimitiveAnchor>\n );\n }\n\n return (\n <PrimitiveButton\n ref={ref as React.Ref<HTMLButtonElement>}\n {...(props as any)}\n className={classNames}\n disabled={disabled}\n loading={loading}\n type={type}\n >\n {content}\n </PrimitiveButton>\n );\n },\n);\n\nexport default Button;\n"],"names":["Button","forwardRef","as","children","className","size","href","disabled","priority","sentiment","iconStart","IconStart","iconEnd","IconEnd","avatars","type","loading","block","props","ref","classNames","clsx","sm","md","lg","contentClassNames","content","_jsxs","Body","Typography","BODY_DEFAULT_BOLD","BODY_LARGE_BOLD","_jsx","ProcessIndicator","_Fragment","AvatarLayout","orientation","PrimitiveAnchor","PrimitiveButton"],"mappings":"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"}
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var LegacyButton = require('./LegacyButton.js');
|
|
5
|
+
var Button$1 = require('./Button.js');
|
|
6
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
|
|
8
|
+
const mapProps = props => {
|
|
9
|
+
const {
|
|
10
|
+
priority,
|
|
11
|
+
size,
|
|
12
|
+
type,
|
|
13
|
+
as,
|
|
14
|
+
...newProps
|
|
15
|
+
} = props;
|
|
16
|
+
const priorityMapping = {
|
|
17
|
+
accent: {
|
|
18
|
+
primary: 'primary',
|
|
19
|
+
secondary: 'tertiary',
|
|
20
|
+
tertiary: 'minimal'
|
|
21
|
+
},
|
|
22
|
+
positive: {
|
|
23
|
+
primary: 'primary',
|
|
24
|
+
secondary: 'tertiary',
|
|
25
|
+
tertiary: 'tertiary'
|
|
26
|
+
},
|
|
27
|
+
negative: {
|
|
28
|
+
primary: 'primary',
|
|
29
|
+
secondary: 'secondary',
|
|
30
|
+
tertiary: 'secondary'
|
|
31
|
+
}
|
|
32
|
+
};
|
|
33
|
+
const mappedPriority = type && priority ? priorityMapping[type]?.[priority] || priority : priority || undefined;
|
|
34
|
+
const mappedSentiment = type === 'negative' ? 'negative' : undefined;
|
|
35
|
+
const legacyButtonTypes = ['accent', 'negative', 'positive', 'primary', 'pay', 'secondary', 'danger', 'link'];
|
|
36
|
+
const resolveSize = () => {
|
|
37
|
+
if (size) {
|
|
38
|
+
return {
|
|
39
|
+
xs: 'sm',
|
|
40
|
+
sm: 'sm',
|
|
41
|
+
md: 'md',
|
|
42
|
+
lg: 'lg'
|
|
43
|
+
}[size] || size;
|
|
44
|
+
}
|
|
45
|
+
return size;
|
|
46
|
+
};
|
|
47
|
+
return {
|
|
48
|
+
...newProps,
|
|
49
|
+
size: resolveSize(),
|
|
50
|
+
priority: mappedPriority,
|
|
51
|
+
sentiment: mappedSentiment || ('sentiment' in props ? props.sentiment : null),
|
|
52
|
+
type: type && !legacyButtonTypes.includes(type) ? type : props.htmlType || null,
|
|
53
|
+
href: as === 'a' ? props.href || '' : null
|
|
54
|
+
};
|
|
55
|
+
};
|
|
56
|
+
const Button = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
57
|
+
const {
|
|
58
|
+
v2 = false,
|
|
59
|
+
as,
|
|
60
|
+
...rest
|
|
61
|
+
} = props;
|
|
62
|
+
if (v2) {
|
|
63
|
+
const mappedProps = mapProps(props);
|
|
64
|
+
return /*#__PURE__*/jsxRuntime.jsx(Button$1, {
|
|
65
|
+
...mappedProps,
|
|
66
|
+
ref: ref,
|
|
67
|
+
as: as
|
|
68
|
+
});
|
|
69
|
+
}
|
|
70
|
+
return /*#__PURE__*/jsxRuntime.jsx(LegacyButton, {
|
|
71
|
+
...rest,
|
|
72
|
+
ref: ref
|
|
73
|
+
});
|
|
74
|
+
});
|
|
75
|
+
Button.displayName = 'Button';
|
|
76
|
+
|
|
77
|
+
module.exports = Button;
|
|
78
|
+
//# sourceMappingURL=Button.resolver.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Button.resolver.js","sources":["../../src/button/Button.resolver.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport LegacyButton, { LegacyButtonProps } from './LegacyButton';\nimport { ButtonProps as NewButtonProps } from './Button.types';\nimport NewButton from './Button';\n\ntype LegacyButtonType =\n | 'accent'\n | 'negative'\n | 'positive'\n | 'primary'\n | 'pay'\n | 'secondary'\n | 'danger'\n | 'link'\n | null\n | undefined;\n\ntype NewButtonType = 'button' | 'submit' | 'reset' | LegacyButtonType | undefined;\n\ntype CommonButtonProps = {\n href?: string;\n target?: string;\n ref?: React.Ref<HTMLButtonElement | HTMLAnchorElement>;\n};\n\nexport type ButtonProps =\n | (Omit<LegacyButtonProps, 'ref'> &\n CommonButtonProps & {\n priority?: LegacyButtonProps['priority'];\n type?: LegacyButtonType;\n htmlType?: string;\n v2?: false;\n })\n | (Omit<Omit<NewButtonProps, 'type'>, 'ref'> &\n CommonButtonProps & {\n priority?: NewButtonProps['priority'];\n type?: NewButtonType;\n v2: true;\n });\n\nconst mapProps = (props: LegacyButtonProps): NewButtonProps => {\n const { priority, size, type, as, ...newProps } = props;\n\n const priorityMapping: Record<string, Record<string, NewButtonProps['priority']>> = {\n accent: {\n primary: 'primary',\n secondary: 'tertiary',\n tertiary: 'minimal',\n },\n positive: {\n primary: 'primary',\n secondary: 'tertiary',\n tertiary: 'tertiary',\n },\n negative: {\n primary: 'primary',\n secondary: 'secondary',\n tertiary: 'secondary',\n },\n };\n\n const mappedPriority =\n type && priority ? priorityMapping[type]?.[priority] || priority : priority || undefined;\n const mappedSentiment = type === 'negative' ? 'negative' : undefined;\n\n const legacyButtonTypes: LegacyButtonType[] = [\n 'accent',\n 'negative',\n 'positive',\n 'primary',\n 'pay',\n 'secondary',\n 'danger',\n 'link',\n ];\n\n const resolveSize = () => {\n if (size) {\n return { xs: 'sm', sm: 'sm', md: 'md', lg: 'lg' }[size] || size;\n }\n\n return size;\n };\n\n return {\n ...newProps,\n size: resolveSize(),\n priority: mappedPriority,\n sentiment: mappedSentiment || ('sentiment' in props ? props.sentiment : null),\n type:\n type && !legacyButtonTypes.includes(type as LegacyButtonType) ? type : props.htmlType || null,\n href: as === 'a' ? props.href || '' : null,\n } as NewButtonProps;\n};\n\nconst Button = forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>((props, ref) => {\n const { v2 = false, as, ...rest } = props;\n\n if (v2) {\n const mappedProps = mapProps(props as LegacyButtonProps);\n return (\n <NewButton\n {...mappedProps}\n ref={ref as React.Ref<HTMLButtonElement | HTMLAnchorElement>}\n as={as}\n />\n );\n }\n\n return (\n <LegacyButton\n {...(rest as LegacyButtonProps)}\n ref={ref as React.Ref<HTMLButtonElement | HTMLAnchorElement>}\n />\n );\n});\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"names":["mapProps","props","priority","size","type","as","newProps","priorityMapping","accent","primary","secondary","tertiary","positive","negative","mappedPriority","undefined","mappedSentiment","legacyButtonTypes","resolveSize","xs","sm","md","lg","sentiment","includes","htmlType","href","Button","forwardRef","ref","v2","rest","mappedProps","_jsx","NewButton","LegacyButton","displayName"],"mappings":"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"}
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import { forwardRef } from 'react';
|
|
2
|
+
import LegacyButton from './LegacyButton.mjs';
|
|
3
|
+
import Button$1 from './Button.mjs';
|
|
4
|
+
import { jsx } from 'react/jsx-runtime';
|
|
5
|
+
|
|
6
|
+
const mapProps = props => {
|
|
7
|
+
const {
|
|
8
|
+
priority,
|
|
9
|
+
size,
|
|
10
|
+
type,
|
|
11
|
+
as,
|
|
12
|
+
...newProps
|
|
13
|
+
} = props;
|
|
14
|
+
const priorityMapping = {
|
|
15
|
+
accent: {
|
|
16
|
+
primary: 'primary',
|
|
17
|
+
secondary: 'tertiary',
|
|
18
|
+
tertiary: 'minimal'
|
|
19
|
+
},
|
|
20
|
+
positive: {
|
|
21
|
+
primary: 'primary',
|
|
22
|
+
secondary: 'tertiary',
|
|
23
|
+
tertiary: 'tertiary'
|
|
24
|
+
},
|
|
25
|
+
negative: {
|
|
26
|
+
primary: 'primary',
|
|
27
|
+
secondary: 'secondary',
|
|
28
|
+
tertiary: 'secondary'
|
|
29
|
+
}
|
|
30
|
+
};
|
|
31
|
+
const mappedPriority = type && priority ? priorityMapping[type]?.[priority] || priority : priority || undefined;
|
|
32
|
+
const mappedSentiment = type === 'negative' ? 'negative' : undefined;
|
|
33
|
+
const legacyButtonTypes = ['accent', 'negative', 'positive', 'primary', 'pay', 'secondary', 'danger', 'link'];
|
|
34
|
+
const resolveSize = () => {
|
|
35
|
+
if (size) {
|
|
36
|
+
return {
|
|
37
|
+
xs: 'sm',
|
|
38
|
+
sm: 'sm',
|
|
39
|
+
md: 'md',
|
|
40
|
+
lg: 'lg'
|
|
41
|
+
}[size] || size;
|
|
42
|
+
}
|
|
43
|
+
return size;
|
|
44
|
+
};
|
|
45
|
+
return {
|
|
46
|
+
...newProps,
|
|
47
|
+
size: resolveSize(),
|
|
48
|
+
priority: mappedPriority,
|
|
49
|
+
sentiment: mappedSentiment || ('sentiment' in props ? props.sentiment : null),
|
|
50
|
+
type: type && !legacyButtonTypes.includes(type) ? type : props.htmlType || null,
|
|
51
|
+
href: as === 'a' ? props.href || '' : null
|
|
52
|
+
};
|
|
53
|
+
};
|
|
54
|
+
const Button = /*#__PURE__*/forwardRef((props, ref) => {
|
|
55
|
+
const {
|
|
56
|
+
v2 = false,
|
|
57
|
+
as,
|
|
58
|
+
...rest
|
|
59
|
+
} = props;
|
|
60
|
+
if (v2) {
|
|
61
|
+
const mappedProps = mapProps(props);
|
|
62
|
+
return /*#__PURE__*/jsx(Button$1, {
|
|
63
|
+
...mappedProps,
|
|
64
|
+
ref: ref,
|
|
65
|
+
as: as
|
|
66
|
+
});
|
|
67
|
+
}
|
|
68
|
+
return /*#__PURE__*/jsx(LegacyButton, {
|
|
69
|
+
...rest,
|
|
70
|
+
ref: ref
|
|
71
|
+
});
|
|
72
|
+
});
|
|
73
|
+
Button.displayName = 'Button';
|
|
74
|
+
|
|
75
|
+
export { Button as default };
|
|
76
|
+
//# sourceMappingURL=Button.resolver.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Button.resolver.mjs","sources":["../../src/button/Button.resolver.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport LegacyButton, { LegacyButtonProps } from './LegacyButton';\nimport { ButtonProps as NewButtonProps } from './Button.types';\nimport NewButton from './Button';\n\ntype LegacyButtonType =\n | 'accent'\n | 'negative'\n | 'positive'\n | 'primary'\n | 'pay'\n | 'secondary'\n | 'danger'\n | 'link'\n | null\n | undefined;\n\ntype NewButtonType = 'button' | 'submit' | 'reset' | LegacyButtonType | undefined;\n\ntype CommonButtonProps = {\n href?: string;\n target?: string;\n ref?: React.Ref<HTMLButtonElement | HTMLAnchorElement>;\n};\n\nexport type ButtonProps =\n | (Omit<LegacyButtonProps, 'ref'> &\n CommonButtonProps & {\n priority?: LegacyButtonProps['priority'];\n type?: LegacyButtonType;\n htmlType?: string;\n v2?: false;\n })\n | (Omit<Omit<NewButtonProps, 'type'>, 'ref'> &\n CommonButtonProps & {\n priority?: NewButtonProps['priority'];\n type?: NewButtonType;\n v2: true;\n });\n\nconst mapProps = (props: LegacyButtonProps): NewButtonProps => {\n const { priority, size, type, as, ...newProps } = props;\n\n const priorityMapping: Record<string, Record<string, NewButtonProps['priority']>> = {\n accent: {\n primary: 'primary',\n secondary: 'tertiary',\n tertiary: 'minimal',\n },\n positive: {\n primary: 'primary',\n secondary: 'tertiary',\n tertiary: 'tertiary',\n },\n negative: {\n primary: 'primary',\n secondary: 'secondary',\n tertiary: 'secondary',\n },\n };\n\n const mappedPriority =\n type && priority ? priorityMapping[type]?.[priority] || priority : priority || undefined;\n const mappedSentiment = type === 'negative' ? 'negative' : undefined;\n\n const legacyButtonTypes: LegacyButtonType[] = [\n 'accent',\n 'negative',\n 'positive',\n 'primary',\n 'pay',\n 'secondary',\n 'danger',\n 'link',\n ];\n\n const resolveSize = () => {\n if (size) {\n return { xs: 'sm', sm: 'sm', md: 'md', lg: 'lg' }[size] || size;\n }\n\n return size;\n };\n\n return {\n ...newProps,\n size: resolveSize(),\n priority: mappedPriority,\n sentiment: mappedSentiment || ('sentiment' in props ? props.sentiment : null),\n type:\n type && !legacyButtonTypes.includes(type as LegacyButtonType) ? type : props.htmlType || null,\n href: as === 'a' ? props.href || '' : null,\n } as NewButtonProps;\n};\n\nconst Button = forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>((props, ref) => {\n const { v2 = false, as, ...rest } = props;\n\n if (v2) {\n const mappedProps = mapProps(props as LegacyButtonProps);\n return (\n <NewButton\n {...mappedProps}\n ref={ref as React.Ref<HTMLButtonElement | HTMLAnchorElement>}\n as={as}\n />\n );\n }\n\n return (\n <LegacyButton\n {...(rest as LegacyButtonProps)}\n ref={ref as React.Ref<HTMLButtonElement | HTMLAnchorElement>}\n />\n );\n});\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"names":["mapProps","props","priority","size","type","as","newProps","priorityMapping","accent","primary","secondary","tertiary","positive","negative","mappedPriority","undefined","mappedSentiment","legacyButtonTypes","resolveSize","xs","sm","md","lg","sentiment","includes","htmlType","href","Button","forwardRef","ref","v2","rest","mappedProps","_jsx","NewButton","LegacyButton","displayName"],"mappings":"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"}
|
|
@@ -0,0 +1,114 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var clsx = require('clsx');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
var reactIntl = require('react-intl');
|
|
6
|
+
require('../common/theme.js');
|
|
7
|
+
require('../common/direction.js');
|
|
8
|
+
var control = require('../common/propsValues/control.js');
|
|
9
|
+
require('../common/propsValues/breakpoint.js');
|
|
10
|
+
var size = require('../common/propsValues/size.js');
|
|
11
|
+
require('../common/propsValues/typography.js');
|
|
12
|
+
require('../common/propsValues/width.js');
|
|
13
|
+
require('../common/propsValues/type.js');
|
|
14
|
+
require('../common/propsValues/dateMode.js');
|
|
15
|
+
require('../common/propsValues/monthFormat.js');
|
|
16
|
+
require('../common/propsValues/position.js');
|
|
17
|
+
require('../common/propsValues/layouts.js');
|
|
18
|
+
require('../common/propsValues/status.js');
|
|
19
|
+
require('../common/propsValues/sentiment.js');
|
|
20
|
+
require('../common/propsValues/profileType.js');
|
|
21
|
+
require('../common/propsValues/variant.js');
|
|
22
|
+
require('../common/propsValues/scroll.js');
|
|
23
|
+
require('../common/propsValues/markdownNodeType.js');
|
|
24
|
+
require('../common/fileType.js');
|
|
25
|
+
require('@transferwise/icons');
|
|
26
|
+
require('../common/closeButton/CloseButton.messages.js');
|
|
27
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
28
|
+
var ProcessIndicator = require('../processIndicator/ProcessIndicator.js');
|
|
29
|
+
var Button_messages = require('../i18n/commonMessages/Button.messages.js');
|
|
30
|
+
var classMap = require('./classMap.js');
|
|
31
|
+
var legacyUtils = require('./legacyUtils/legacyUtils.js');
|
|
32
|
+
|
|
33
|
+
const LegacyButton = /*#__PURE__*/React.forwardRef(({
|
|
34
|
+
as: component = 'button',
|
|
35
|
+
block = false,
|
|
36
|
+
children,
|
|
37
|
+
className,
|
|
38
|
+
disabled,
|
|
39
|
+
loading = false,
|
|
40
|
+
priority = control.Priority.PRIMARY,
|
|
41
|
+
size: size$1 = size.Size.MEDIUM,
|
|
42
|
+
type = control.ControlType.ACCENT,
|
|
43
|
+
onClick,
|
|
44
|
+
...rest
|
|
45
|
+
}, ref) => {
|
|
46
|
+
const intl = reactIntl.useIntl();
|
|
47
|
+
legacyUtils.logDeprecationNotices({
|
|
48
|
+
size: size$1,
|
|
49
|
+
type
|
|
50
|
+
});
|
|
51
|
+
const newType = legacyUtils.establishNewType(type);
|
|
52
|
+
const newPriority = legacyUtils.establishNewPriority(priority, type);
|
|
53
|
+
const classes = clsx.clsx(`btn btn-${size$1}`, `np-btn np-btn-${size$1}`, {
|
|
54
|
+
'btn-loading': loading,
|
|
55
|
+
'btn-block np-btn-block': block,
|
|
56
|
+
disabled
|
|
57
|
+
},
|
|
58
|
+
// @ts-expect-error fix when refactor `typeClassMap` to TypeScript
|
|
59
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
|
|
60
|
+
classMap.typeClassMap[newType],
|
|
61
|
+
// @ts-expect-error fix when refactor `typeClassMap` to TypeScript
|
|
62
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
|
|
63
|
+
classMap.priorityClassMap[newPriority], className);
|
|
64
|
+
function processIndicatorSize() {
|
|
65
|
+
return ['sm', 'xs'].includes(size$1) ? 'xxs' : 'xs';
|
|
66
|
+
}
|
|
67
|
+
const Element = component ?? 'button';
|
|
68
|
+
let props;
|
|
69
|
+
if (Element === 'button') {
|
|
70
|
+
const {
|
|
71
|
+
htmlType = 'button',
|
|
72
|
+
...restProps
|
|
73
|
+
} = rest;
|
|
74
|
+
props = {
|
|
75
|
+
...restProps,
|
|
76
|
+
disabled,
|
|
77
|
+
'aria-disabled': loading,
|
|
78
|
+
type: htmlType
|
|
79
|
+
};
|
|
80
|
+
} else {
|
|
81
|
+
props = {
|
|
82
|
+
...rest,
|
|
83
|
+
'aria-disabled': loading
|
|
84
|
+
};
|
|
85
|
+
}
|
|
86
|
+
/**
|
|
87
|
+
* Ensures that the button cannot be activated in loading or disabled mode,
|
|
88
|
+
* when `aria-disabled` might be used over the `disabled` HTML attribute
|
|
89
|
+
*/
|
|
90
|
+
const handleClick = handler => event => {
|
|
91
|
+
if (disabled || loading) {
|
|
92
|
+
event.preventDefault();
|
|
93
|
+
} else if (typeof handler === 'function') {
|
|
94
|
+
handler(event);
|
|
95
|
+
}
|
|
96
|
+
};
|
|
97
|
+
return /*#__PURE__*/jsxRuntime.jsxs(Element, {
|
|
98
|
+
ref: ref,
|
|
99
|
+
className: classes,
|
|
100
|
+
onClick: handleClick(onClick),
|
|
101
|
+
...props,
|
|
102
|
+
"aria-live": loading ? 'polite' : 'off',
|
|
103
|
+
"aria-busy": loading,
|
|
104
|
+
"aria-label": loading ? intl.formatMessage(Button_messages.loadingAriaLabel) : rest['aria-label'],
|
|
105
|
+
children: [children, loading && /*#__PURE__*/jsxRuntime.jsx(ProcessIndicator, {
|
|
106
|
+
size: processIndicatorSize(),
|
|
107
|
+
className: "btn-loader",
|
|
108
|
+
"data-testid": "ButtonProgressIndicator"
|
|
109
|
+
})]
|
|
110
|
+
});
|
|
111
|
+
});
|
|
112
|
+
|
|
113
|
+
module.exports = LegacyButton;
|
|
114
|
+
//# sourceMappingURL=LegacyButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LegacyButton.js","sources":["../../src/button/LegacyButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ElementType, forwardRef, MouseEvent } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport {\n Size,\n ControlType,\n Priority,\n ControlTypeAccent,\n ControlTypeNegative,\n ControlTypePositive,\n PriorityPrimary,\n PrioritySecondary,\n PriorityTertiary,\n SizeExtraSmall,\n SizeSmall,\n SizeMedium,\n SizeLarge,\n} from '../common';\nimport ProcessIndicator from '../processIndicator';\n\nimport messages from '../i18n/commonMessages/Button.messages';\nimport { typeClassMap, priorityClassMap } from './classMap';\nimport { establishNewPriority, establishNewType, logDeprecationNotices } from './legacyUtils';\n\n/** @deprecated */\ntype DeprecatedTypes = 'primary' | 'pay' | 'secondary' | 'danger' | 'link';\n\n/** @deprecated */\ntype DeprecatedSizes = SizeExtraSmall;\n\ntype CommonProps = {\n block?: boolean;\n disabled?: boolean;\n loading?: boolean;\n /** @deprecated */\n type?: ControlTypeAccent | ControlTypeNegative | ControlTypePositive | DeprecatedTypes | null;\n priority?: PriorityPrimary | PrioritySecondary | PriorityTertiary | null;\n size?: SizeSmall | SizeMedium | SizeLarge | DeprecatedSizes;\n htmlType?: 'submit' | 'reset' | 'button';\n};\n\nexport type ButtonProps = CommonProps &\n Omit<React.ComponentPropsWithRef<'button'>, 'type'> & {\n as?: 'button';\n };\n\nexport type AnchorProps = CommonProps &\n Omit<React.ComponentPropsWithRef<'a'>, 'type'> & {\n as?: 'a';\n href?: string;\n };\n\nexport type LegacyButtonProps = ButtonProps | AnchorProps;\n\nexport type ButtonReferenceType = HTMLButtonElement | HTMLAnchorElement;\n\n/**\n * @deprecated make sure you use new Button component via `<Button v2 .. />` and new props\n */\nconst LegacyButton = forwardRef<ButtonReferenceType, LegacyButtonProps>(\n (\n {\n as: component = 'button',\n block = false,\n children,\n className,\n disabled,\n loading = false,\n priority = Priority.PRIMARY,\n size = Size.MEDIUM,\n type = ControlType.ACCENT,\n onClick,\n ...rest\n }: LegacyButtonProps,\n ref,\n ) => {\n const intl = useIntl();\n\n logDeprecationNotices({ size, type });\n\n const newType = establishNewType(type);\n const newPriority = establishNewPriority(priority, type);\n\n const classes = clsx(\n `btn btn-${size}`,\n `np-btn np-btn-${size}`,\n {\n 'btn-loading': loading,\n 'btn-block np-btn-block': block,\n disabled,\n },\n // @ts-expect-error fix when refactor `typeClassMap` to TypeScript\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n typeClassMap[newType],\n // @ts-expect-error fix when refactor `typeClassMap` to TypeScript\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n priorityClassMap[newPriority],\n className,\n );\n\n function processIndicatorSize() {\n return ['sm', 'xs'].includes(size) ? 'xxs' : 'xs';\n }\n\n const Element = (component as ElementType) ?? 'button';\n let props;\n\n if (Element === 'button') {\n const { htmlType = 'button', ...restProps } = rest as ButtonProps;\n props = {\n ...restProps,\n disabled,\n 'aria-disabled': loading,\n type: htmlType,\n };\n } else {\n props = {\n ...rest,\n 'aria-disabled': loading,\n } as AnchorProps;\n }\n\n /**\n * Ensures that the button cannot be activated in loading or disabled mode,\n * when `aria-disabled` might be used over the `disabled` HTML attribute\n */\n const handleClick =\n (handler: LegacyButtonProps['onClick']) =>\n (event: MouseEvent<HTMLButtonElement> & MouseEvent<HTMLAnchorElement>) => {\n if (disabled || loading) {\n event.preventDefault();\n } else if (typeof handler === 'function') {\n handler(event);\n }\n };\n\n return (\n <Element\n ref={ref as React.Ref<ButtonReferenceType>}\n className={classes}\n onClick={handleClick(onClick)}\n {...props}\n aria-live={loading ? 'polite' : 'off'}\n aria-busy={loading}\n aria-label={loading ? intl.formatMessage(messages.loadingAriaLabel) : rest['aria-label']}\n >\n {children}\n {loading && (\n <ProcessIndicator\n size={processIndicatorSize()}\n className=\"btn-loader\"\n data-testid=\"ButtonProgressIndicator\"\n />\n )}\n </Element>\n );\n },\n);\n\nexport default LegacyButton;\n"],"names":["LegacyButton","forwardRef","as","component","block","children","className","disabled","loading","priority","Priority","PRIMARY","size","Size","MEDIUM","type","ControlType","ACCENT","onClick","rest","ref","intl","useIntl","logDeprecationNotices","newType","establishNewType","newPriority","establishNewPriority","classes","clsx","typeClassMap","priorityClassMap","processIndicatorSize","includes","Element","props","htmlType","restProps","handleClick","handler","event","preventDefault","_jsxs","formatMessage","messages","loadingAriaLabel","_jsx","ProcessIndicator"],"mappings":"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"}
|