@transferwise/components 0.0.0-experimental-db4013c → 0.0.0-experimental-bd6f8cc

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