@transferwise/components 0.0.0-experimental-e7eccea → 0.0.0-experimental-328f2cc

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.
Files changed (122) hide show
  1. package/build/avatarLayout/AvatarLayout.js +2 -9
  2. package/build/avatarLayout/AvatarLayout.js.map +1 -1
  3. package/build/avatarLayout/AvatarLayout.mjs +2 -9
  4. package/build/avatarLayout/AvatarLayout.mjs.map +1 -1
  5. package/build/button/Button.js +79 -78
  6. package/build/button/Button.js.map +1 -1
  7. package/build/button/Button.mjs +80 -79
  8. package/build/button/Button.mjs.map +1 -1
  9. package/build/criticalBanner/CriticalCommsBanner.js +2 -2
  10. package/build/criticalBanner/CriticalCommsBanner.js.map +1 -1
  11. package/build/criticalBanner/CriticalCommsBanner.mjs +1 -1
  12. package/build/header/Header.js +2 -2
  13. package/build/header/Header.js.map +1 -1
  14. package/build/header/Header.mjs +1 -1
  15. package/build/index.js +2 -2
  16. package/build/index.mjs +1 -1
  17. package/build/link/Link.js +3 -8
  18. package/build/link/Link.js.map +1 -1
  19. package/build/link/Link.mjs +3 -8
  20. package/build/link/Link.mjs.map +1 -1
  21. package/build/main.css +11 -219
  22. package/build/nudge/Nudge.js.map +1 -1
  23. package/build/nudge/Nudge.mjs.map +1 -1
  24. package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.js +3 -1
  25. package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.js.map +1 -1
  26. package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.mjs +3 -1
  27. package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.mjs.map +1 -1
  28. package/build/primitives/PrimitiveButton/src/PrimitiveButton.js +4 -1
  29. package/build/primitives/PrimitiveButton/src/PrimitiveButton.js.map +1 -1
  30. package/build/primitives/PrimitiveButton/src/PrimitiveButton.mjs +4 -1
  31. package/build/primitives/PrimitiveButton/src/PrimitiveButton.mjs.map +1 -1
  32. package/build/select/Select.js +2 -2
  33. package/build/select/Select.js.map +1 -1
  34. package/build/select/Select.mjs +1 -1
  35. package/build/styles/avatarLayout/AvatarLayout.css +0 -11
  36. package/build/styles/button/Button.css +15 -200
  37. package/build/styles/main.css +11 -219
  38. package/build/styles/nudge/Nudge.css +11 -0
  39. package/build/types/avatarLayout/AvatarLayout.d.ts +2 -1
  40. package/build/types/avatarLayout/AvatarLayout.d.ts.map +1 -1
  41. package/build/types/avatarLayout/index.d.ts +0 -1
  42. package/build/types/avatarLayout/index.d.ts.map +1 -1
  43. package/build/types/button/Button.d.ts +23 -1
  44. package/build/types/button/Button.d.ts.map +1 -1
  45. package/build/types/button/index.d.ts +2 -2
  46. package/build/types/button/index.d.ts.map +1 -1
  47. package/build/types/link/Link.d.ts +2 -2
  48. package/build/types/link/Link.d.ts.map +1 -1
  49. package/build/types/nudge/Nudge.d.ts +1 -1
  50. package/build/types/nudge/Nudge.d.ts.map +1 -1
  51. package/build/types/primitives/PrimitiveAnchor/src/PrimitiveAnchor.d.ts.map +1 -1
  52. package/build/types/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.d.ts +1 -5
  53. package/build/types/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.d.ts.map +1 -1
  54. package/build/types/primitives/PrimitiveButton/src/PrimitiveButton.d.ts.map +1 -1
  55. package/build/types/test-utils/story-config.d.ts +1 -1
  56. package/build/types/test-utils/story-config.d.ts.map +1 -1
  57. package/build/upload/steps/completeStep/completeStep.js +2 -2
  58. package/build/upload/steps/completeStep/completeStep.js.map +1 -1
  59. package/build/upload/steps/completeStep/completeStep.mjs +1 -1
  60. package/build/upload/steps/processingStep/processingStep.js +2 -2
  61. package/build/upload/steps/processingStep/processingStep.js.map +1 -1
  62. package/build/upload/steps/processingStep/processingStep.mjs +1 -1
  63. package/build/uploadInput/UploadInput.js +3 -3
  64. package/build/uploadInput/UploadInput.js.map +1 -1
  65. package/build/uploadInput/UploadInput.mjs +1 -1
  66. package/package.json +3 -3
  67. package/src/alert/Alert.tests.story.tsx +1 -1
  68. package/src/avatarLayout/AvatarLayout.css +0 -11
  69. package/src/avatarLayout/AvatarLayout.less +1 -18
  70. package/src/avatarLayout/AvatarLayout.tsx +3 -11
  71. package/src/avatarLayout/index.ts +0 -1
  72. package/src/button/Button.css +15 -200
  73. package/src/button/Button.less +14 -207
  74. package/src/button/Button.spec.tsx +227 -75
  75. package/src/button/Button.story.tsx +135 -729
  76. package/src/button/Button.tsx +132 -88
  77. package/src/button/__snapshots__/Button.spec.tsx.snap +309 -0
  78. package/src/button/index.ts +3 -2
  79. package/src/field/Field.story.tsx +1 -1
  80. package/src/flowNavigation/__snapshots__/FlowNavigation.spec.js.snap +1 -1
  81. package/src/inputs/SelectInput.story.tsx +1 -1
  82. package/src/label/Label.story.tsx +1 -1
  83. package/src/link/Link.tsx +6 -15
  84. package/src/main.css +11 -219
  85. package/src/main.less +0 -1
  86. package/src/nudge/Nudge.css +11 -0
  87. package/src/nudge/Nudge.less +3 -0
  88. package/src/nudge/Nudge.story.tsx +10 -0
  89. package/src/nudge/Nudge.tsx +2 -1
  90. package/src/primitives/PrimitiveAnchor/src/PrimitiveAnchor.tsx +7 -1
  91. package/src/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.ts +1 -6
  92. package/src/primitives/PrimitiveAnchor/test/PrimitiveAnchor.spec.tsx +3 -1
  93. package/src/primitives/PrimitiveButton/src/PrimitiveButton.tsx +8 -1
  94. package/src/primitives/PrimitiveButton/test/PrimitiveButton.spec.tsx +5 -2
  95. package/src/test-utils/Parameters.d.ts +1 -9
  96. package/src/test-utils/story-config.ts +1 -10
  97. package/build/button/Button.resolver.js +0 -86
  98. package/build/button/Button.resolver.js.map +0 -1
  99. package/build/button/Button.resolver.mjs +0 -84
  100. package/build/button/Button.resolver.mjs.map +0 -1
  101. package/build/button/LegacyButton.js +0 -114
  102. package/build/button/LegacyButton.js.map +0 -1
  103. package/build/button/LegacyButton.mjs +0 -112
  104. package/build/button/LegacyButton.mjs.map +0 -1
  105. package/build/styles/button/Button.vars.css +0 -39
  106. package/build/styles/button/LegacyButton.css +0 -23
  107. package/build/types/button/Button.resolver.d.ts +0 -31
  108. package/build/types/button/Button.resolver.d.ts.map +0 -1
  109. package/build/types/button/Button.types.d.ts +0 -65
  110. package/build/types/button/Button.types.d.ts.map +0 -1
  111. package/build/types/button/LegacyButton.d.ts +0 -30
  112. package/build/types/button/LegacyButton.d.ts.map +0 -1
  113. package/src/button/Button.resolver.tsx +0 -134
  114. package/src/button/Button.tests.story.tsx +0 -27
  115. package/src/button/Button.types.ts +0 -86
  116. package/src/button/Button.vars.css +0 -39
  117. package/src/button/Button.vars.less +0 -50
  118. package/src/button/LegacyButton.css +0 -23
  119. package/src/button/LegacyButton.less +0 -24
  120. package/src/button/LegacyButton.spec.tsx +0 -146
  121. package/src/button/LegacyButton.story.tsx +0 -225
  122. package/src/button/LegacyButton.tsx +0 -161
@@ -1,161 +0,0 @@
1
- import { clsx } from 'clsx';
2
- import { ElementType, forwardRef, MouseEvent } from 'react';
3
- import { useIntl } from 'react-intl';
4
-
5
- import {
6
- Size,
7
- ControlType,
8
- Priority,
9
- ControlTypeAccent,
10
- ControlTypeNegative,
11
- ControlTypePositive,
12
- PriorityPrimary,
13
- PrioritySecondary,
14
- PriorityTertiary,
15
- SizeExtraSmall,
16
- SizeSmall,
17
- SizeMedium,
18
- SizeLarge,
19
- } from '../common';
20
- import ProcessIndicator from '../processIndicator';
21
-
22
- import messages from '../i18n/commonMessages/Button.messages';
23
- import { typeClassMap, priorityClassMap } from './classMap';
24
- import { establishNewPriority, establishNewType, logDeprecationNotices } from './legacyUtils';
25
-
26
- /** @deprecated */
27
- type DeprecatedTypes = 'primary' | 'pay' | 'secondary' | 'danger' | 'link';
28
-
29
- /** @deprecated */
30
- type DeprecatedSizes = SizeExtraSmall;
31
-
32
- type CommonProps = {
33
- block?: boolean;
34
- disabled?: boolean;
35
- loading?: boolean;
36
- /** @deprecated */
37
- type?: ControlTypeAccent | ControlTypeNegative | ControlTypePositive | DeprecatedTypes | null;
38
- priority?: PriorityPrimary | PrioritySecondary | PriorityTertiary | null;
39
- size?: SizeSmall | SizeMedium | SizeLarge | DeprecatedSizes;
40
- htmlType?: 'submit' | 'reset' | 'button';
41
- };
42
-
43
- export type ButtonProps = CommonProps &
44
- Omit<React.ComponentPropsWithRef<'button'>, 'type'> & {
45
- as?: 'button';
46
- };
47
-
48
- export type AnchorProps = CommonProps &
49
- Omit<React.ComponentPropsWithRef<'a'>, 'type'> & {
50
- as?: 'a';
51
- href?: string;
52
- };
53
-
54
- export type LegacyButtonProps = ButtonProps | AnchorProps;
55
-
56
- export type ButtonReferenceType = HTMLButtonElement | HTMLAnchorElement;
57
-
58
- /**
59
- * @deprecated make sure you use new Button component via `<Button v2 .. />` and new props
60
- */
61
- const LegacyButton = forwardRef<ButtonReferenceType, LegacyButtonProps>(
62
- (
63
- {
64
- as: component = 'button',
65
- block = false,
66
- children,
67
- className,
68
- disabled,
69
- loading = false,
70
- priority = Priority.PRIMARY,
71
- size = Size.MEDIUM,
72
- type = ControlType.ACCENT,
73
- onClick,
74
- ...rest
75
- }: LegacyButtonProps,
76
- ref,
77
- ) => {
78
- const intl = useIntl();
79
-
80
- logDeprecationNotices({ size, type });
81
-
82
- const newType = establishNewType(type);
83
- const newPriority = establishNewPriority(priority, type);
84
-
85
- const classes = clsx(
86
- `btn btn-${size}`,
87
- `np-btn np-btn-${size}`,
88
- {
89
- 'btn-loading': loading,
90
- 'btn-block np-btn-block': block,
91
- disabled,
92
- },
93
- // @ts-expect-error fix when refactor `typeClassMap` to TypeScript
94
- // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
95
- typeClassMap[newType],
96
- // @ts-expect-error fix when refactor `typeClassMap` to TypeScript
97
- // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
98
- priorityClassMap[newPriority],
99
- className,
100
- );
101
-
102
- function processIndicatorSize() {
103
- return ['sm', 'xs'].includes(size) ? 'xxs' : 'xs';
104
- }
105
-
106
- const Element = (component as ElementType) ?? 'button';
107
- let props;
108
-
109
- if (Element === 'button') {
110
- const { htmlType = 'button', ...restProps } = rest as ButtonProps;
111
- props = {
112
- ...restProps,
113
- disabled,
114
- 'aria-disabled': loading,
115
- type: htmlType,
116
- };
117
- } else {
118
- props = {
119
- ...rest,
120
- 'aria-disabled': loading,
121
- } as AnchorProps;
122
- }
123
-
124
- /**
125
- * Ensures that the button cannot be activated in loading or disabled mode,
126
- * when `aria-disabled` might be used over the `disabled` HTML attribute
127
- */
128
- const handleClick =
129
- (handler: LegacyButtonProps['onClick']) =>
130
- (event: MouseEvent<HTMLButtonElement> & MouseEvent<HTMLAnchorElement>) => {
131
- if (disabled || loading) {
132
- event.preventDefault();
133
- } else if (typeof handler === 'function') {
134
- handler(event);
135
- }
136
- };
137
-
138
- return (
139
- <Element
140
- ref={ref as React.Ref<ButtonReferenceType>}
141
- className={classes}
142
- onClick={handleClick(onClick)}
143
- {...props}
144
- aria-live={loading ? 'polite' : 'off'}
145
- aria-busy={loading}
146
- aria-label={loading ? intl.formatMessage(messages.loadingAriaLabel) : rest['aria-label']}
147
- >
148
- {children}
149
- {loading && (
150
- <ProcessIndicator
151
- size={processIndicatorSize()}
152
- className="btn-loader"
153
- data-testid="ButtonProgressIndicator"
154
- />
155
- )}
156
- </Element>
157
- );
158
- },
159
- );
160
-
161
- export default LegacyButton;