@transferwise/components 46.36.0 → 46.37.0
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/index.js +11 -35
- package/build/index.js.map +1 -1
- package/build/index.mjs +11 -35
- package/build/index.mjs.map +1 -1
- package/build/types/accordion/AccordionItem/AccordionItem.d.ts.map +1 -1
- package/build/types/actionOption/ActionOption.d.ts +5 -5
- package/build/types/actionOption/ActionOption.d.ts.map +1 -1
- package/build/types/alert/Alert.d.ts +1 -1
- package/build/types/alert/Alert.d.ts.map +1 -1
- package/build/types/body/Body.d.ts +1 -1
- package/build/types/body/Body.d.ts.map +1 -1
- package/build/types/chips/Chip.d.ts +2 -2
- package/build/types/chips/Chip.d.ts.map +1 -1
- package/build/types/chips/Chips.d.ts +2 -2
- package/build/types/chips/Chips.d.ts.map +1 -1
- package/build/types/common/bottomSheet/BottomSheet.d.ts +2 -2
- package/build/types/common/bottomSheet/BottomSheet.d.ts.map +1 -1
- package/build/types/common/closeButton/CloseButton.d.ts +1 -1
- package/build/types/common/closeButton/CloseButton.d.ts.map +1 -1
- package/build/types/common/flowHeader/FlowHeader.d.ts +1 -1
- package/build/types/common/flowHeader/FlowHeader.d.ts.map +1 -1
- package/build/types/common/hooks/useResizeObserver.d.ts +1 -1
- package/build/types/common/hooks/useResizeObserver.d.ts.map +1 -1
- package/build/types/common/panel/Panel.d.ts +3 -3
- package/build/types/common/panel/Panel.d.ts.map +1 -1
- package/build/types/common/polymorphicWithOverrides/PolymorphicWithOverrides.d.ts +1 -1
- package/build/types/common/polymorphicWithOverrides/PolymorphicWithOverrides.d.ts.map +1 -1
- package/build/types/common/responsivePanel/ResponsivePanel.d.ts +1 -1
- package/build/types/dimmer/Dimmer.d.ts +3 -3
- package/build/types/dimmer/Dimmer.d.ts.map +1 -1
- package/build/types/emphasis/Emphasis.d.ts +2 -2
- package/build/types/emphasis/Emphasis.d.ts.map +1 -1
- package/build/types/inputs/Input.d.ts +1 -1
- package/build/types/inputs/Input.d.ts.map +1 -1
- package/build/types/inputs/SearchInput.d.ts +1 -1
- package/build/types/inputs/SearchInput.d.ts.map +1 -1
- package/build/types/inputs/TextArea.d.ts +1 -1
- package/build/types/inputs/TextArea.d.ts.map +1 -1
- package/build/types/inputs/_BottomSheet.d.ts +1 -1
- package/build/types/inputs/_BottomSheet.d.ts.map +1 -1
- package/build/types/inputs/_ButtonInput.d.ts +1 -1
- package/build/types/inputs/_ButtonInput.d.ts.map +1 -1
- package/build/types/moneyInput/MoneyInput.d.ts.map +1 -1
- package/build/types/progress/Progress.d.ts +2 -2
- package/build/types/progress/Progress.d.ts.map +1 -1
- package/build/types/progressBar/ProgressBar.d.ts +2 -2
- package/build/types/progressBar/ProgressBar.d.ts.map +1 -1
- package/build/types/promoCard/PromoCard.d.ts +1 -1
- package/build/types/promoCard/PromoCard.d.ts.map +1 -1
- package/build/types/provider/direction/DirectionProvider.d.ts +2 -2
- package/build/types/provider/direction/DirectionProvider.d.ts.map +1 -1
- package/build/types/provider/language/LanguageProvider.d.ts +2 -2
- package/build/types/provider/language/LanguageProvider.d.ts.map +1 -1
- package/build/types/select/option/Option.d.ts +2 -1
- package/build/types/select/option/Option.d.ts.map +1 -1
- package/build/types/slidingPanel/SlidingPanel.d.ts +1 -1
- package/build/types/slidingPanel/SlidingPanel.d.ts.map +1 -1
- package/build/types/switchOption/SwitchOption.d.ts +4 -4
- package/build/types/switchOption/SwitchOption.d.ts.map +1 -1
- package/build/types/tabs/Tabs.d.ts +1 -1
- package/build/types/tabs/Tabs.d.ts.map +1 -1
- package/build/types/tooltip/Tooltip.d.ts.map +1 -1
- package/build/types/uploadInput/UploadInput.d.ts +2 -2
- package/build/types/uploadInput/UploadInput.d.ts.map +1 -1
- package/build/types/uploadInput/uploadItem/UploadItem.d.ts.map +1 -1
- package/build/types/withDisplayFormat/WithDisplayFormat.d.ts +4 -4
- package/build/types/withDisplayFormat/WithDisplayFormat.d.ts.map +1 -1
- package/package.json +3 -3
- package/src/accordion/AccordionItem/AccordionItem.tsx +5 -2
- package/src/actionOption/ActionOption.tsx +4 -5
- package/src/alert/Alert.tsx +1 -1
- package/src/body/Body.tsx +4 -3
- package/src/chips/Chip.tsx +5 -6
- package/src/chips/Chips.tsx +1 -2
- package/src/common/bottomSheet/BottomSheet.tsx +2 -9
- package/src/common/closeButton/CloseButton.tsx +1 -1
- package/src/common/flowHeader/FlowHeader.tsx +1 -1
- package/src/common/hooks/useResizeObserver.ts +1 -1
- package/src/common/panel/Panel.spec.tsx +1 -1
- package/src/common/panel/Panel.tsx +7 -7
- package/src/common/polymorphicWithOverrides/PolymorphicWithOverrides.tsx +1 -1
- package/src/dimmer/Dimmer.tsx +2 -10
- package/src/emphasis/Emphasis.tsx +1 -3
- package/src/inputs/Input.tsx +1 -1
- package/src/inputs/SearchInput.tsx +1 -1
- package/src/inputs/SelectInput.tsx +4 -4
- package/src/inputs/TextArea.tsx +1 -1
- package/src/inputs/_BottomSheet.tsx +1 -1
- package/src/inputs/_ButtonInput.tsx +1 -1
- package/src/moneyInput/MoneyInput.story.tsx +40 -2
- package/src/moneyInput/MoneyInput.tsx +1 -4
- package/src/progress/Progress.tsx +3 -15
- package/src/progressBar/ProgressBar.tsx +1 -2
- package/src/promoCard/PromoCard.tsx +2 -2
- package/src/promoCard/PromoCardContext.spec.tsx +1 -1
- package/src/provider/direction/DirectionProvider.tsx +2 -5
- package/src/provider/language/LanguageProvider.tsx +2 -2
- package/src/segmentedControl/SegmentedControl.tsx +2 -2
- package/src/select/option/Option.tsx +6 -18
- package/src/slidingPanel/SlidingPanel.tsx +1 -1
- package/src/ssr.spec.js +6 -0
- package/src/switchOption/SwitchOption.tsx +5 -7
- package/src/tabs/Tabs.js +3 -3
- package/src/tooltip/Tooltip.tsx +2 -1
- package/src/uploadInput/UploadInput.tsx +2 -2
- package/src/uploadInput/uploadItem/UploadItem.tsx +3 -4
- package/src/withDisplayFormat/WithDisplayFormat.tsx +3 -3
package/build/index.js
CHANGED
|
@@ -2432,7 +2432,7 @@ const Chip = ({
|
|
|
2432
2432
|
isModern
|
|
2433
2433
|
} = componentsTheming.useTheme();
|
|
2434
2434
|
const closeButtonReference = React.useRef(null);
|
|
2435
|
-
const previousCloseButtonShown = React.useRef();
|
|
2435
|
+
const previousCloseButtonShown = React.useRef(undefined);
|
|
2436
2436
|
React.useEffect(() => {
|
|
2437
2437
|
if (closeButtonReference.current != null && previousCloseButtonShown.current === false) {
|
|
2438
2438
|
closeButtonReference.current?.focus();
|
|
@@ -2460,7 +2460,7 @@ const Chip = ({
|
|
|
2460
2460
|
}), onRemove ? /*#__PURE__*/jsxRuntime.jsx(CloseButton, {
|
|
2461
2461
|
ref: closeButtonReference,
|
|
2462
2462
|
className: isModern ? `btn-unstyled` : `btn-unstyled m-l-1`,
|
|
2463
|
-
"aria-label": closeButton
|
|
2463
|
+
"aria-label": closeButton?.['aria-label'],
|
|
2464
2464
|
size: "sm",
|
|
2465
2465
|
filled: isModern,
|
|
2466
2466
|
onClick: onRemove
|
|
@@ -6097,7 +6097,7 @@ const getCursorPositionAfterActionStroke = (action, selectionStart, selectionEnd
|
|
|
6097
6097
|
return cursorPosition;
|
|
6098
6098
|
};
|
|
6099
6099
|
|
|
6100
|
-
class WithDisplayFormat extends
|
|
6100
|
+
class WithDisplayFormat extends React__namespace.Component {
|
|
6101
6101
|
static defaultProps = {
|
|
6102
6102
|
autoComplete: 'off',
|
|
6103
6103
|
displayPattern: '',
|
|
@@ -7462,13 +7462,10 @@ const parseNumber = ({
|
|
|
7462
7462
|
locale,
|
|
7463
7463
|
maxLengthOverride
|
|
7464
7464
|
}) => {
|
|
7465
|
-
if (!maxLengthOverride) {
|
|
7466
|
-
return parseAmount(amount, currency, locale);
|
|
7467
|
-
}
|
|
7468
7465
|
if (maxLengthOverride && amount.length > maxLengthOverride) {
|
|
7469
7466
|
return 0;
|
|
7470
7467
|
}
|
|
7471
|
-
return
|
|
7468
|
+
return parseAmount(amount, currency, locale);
|
|
7472
7469
|
};
|
|
7473
7470
|
const allowedInputKeys = new Set(['Backspace', 'Delete', ',', '.', 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight', 'Enter', 'Escape', 'Tab']);
|
|
7474
7471
|
class MoneyInput extends React.Component {
|
|
@@ -9455,16 +9452,11 @@ const Progress = ({
|
|
|
9455
9452
|
id,
|
|
9456
9453
|
progress
|
|
9457
9454
|
}) => {
|
|
9458
|
-
const [value, setValue] = React.useState(0);
|
|
9459
|
-
React.useEffect(() => {
|
|
9460
|
-
setValue(progress.value);
|
|
9461
|
-
});
|
|
9462
9455
|
return /*#__PURE__*/jsxRuntime.jsxs("progress", {
|
|
9463
9456
|
id: id,
|
|
9464
9457
|
className: classNames__default.default('np-progress d-block', className),
|
|
9465
9458
|
...progress,
|
|
9466
|
-
|
|
9467
|
-
children: [value, "%"]
|
|
9459
|
+
children: [Math.floor(progress.value / progress.max * 100), "%"]
|
|
9468
9460
|
});
|
|
9469
9461
|
};
|
|
9470
9462
|
|
|
@@ -9958,12 +9950,8 @@ function Option$1({
|
|
|
9958
9950
|
note = '',
|
|
9959
9951
|
secondary = '',
|
|
9960
9952
|
icon,
|
|
9961
|
-
classNames = {},
|
|
9962
9953
|
selected = false
|
|
9963
9954
|
}) {
|
|
9964
|
-
const {
|
|
9965
|
-
isModern
|
|
9966
|
-
} = componentsTheming.useTheme();
|
|
9967
9955
|
const iconElement = icon ? /*#__PURE__*/React.cloneElement(icon, {
|
|
9968
9956
|
size: 24,
|
|
9969
9957
|
className: 'tw-icon'
|
|
@@ -9977,22 +9965,12 @@ function Option$1({
|
|
|
9977
9965
|
className: selected ? 'text-ellipsis' : undefined,
|
|
9978
9966
|
children: [label, note && /*#__PURE__*/jsxRuntime.jsx(Body, {
|
|
9979
9967
|
as: "span",
|
|
9980
|
-
className:
|
|
9968
|
+
className: "m-l-1",
|
|
9981
9969
|
children: note
|
|
9982
9970
|
})]
|
|
9983
9971
|
});
|
|
9984
|
-
const secondaryElementClassNames = () => {
|
|
9985
|
-
let classes = undefined;
|
|
9986
|
-
if (selected) {
|
|
9987
|
-
classes = 'text-ellipsis';
|
|
9988
|
-
}
|
|
9989
|
-
if (isModern) {
|
|
9990
|
-
return classes;
|
|
9991
|
-
}
|
|
9992
|
-
return `${classes ? classes + ' ' : ''}body-2`;
|
|
9993
|
-
};
|
|
9994
9972
|
const secondaryElement = secondary && /*#__PURE__*/jsxRuntime.jsx(Body, {
|
|
9995
|
-
className:
|
|
9973
|
+
className: classNames__default.default(selected && 'text-ellipsis'),
|
|
9996
9974
|
children: secondary
|
|
9997
9975
|
});
|
|
9998
9976
|
return iconElement ? /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
@@ -10955,9 +10933,7 @@ const stopPropagation = event => {
|
|
|
10955
10933
|
if (event) {
|
|
10956
10934
|
event.stopPropagation();
|
|
10957
10935
|
event.preventDefault();
|
|
10958
|
-
|
|
10959
|
-
event.nativeEvent.stopImmediatePropagation();
|
|
10960
|
-
}
|
|
10936
|
+
event.nativeEvent?.stopImmediatePropagation?.();
|
|
10961
10937
|
}
|
|
10962
10938
|
};
|
|
10963
10939
|
const SwitchOption = ({
|
|
@@ -11159,7 +11135,7 @@ const SpacerWidth = {
|
|
|
11159
11135
|
lg: 32
|
|
11160
11136
|
};
|
|
11161
11137
|
class Tabs extends React.Component {
|
|
11162
|
-
/** @type {RefObject<HTMLDivElement>} */
|
|
11138
|
+
/** @type {React.RefObject<HTMLDivElement | null>} */
|
|
11163
11139
|
containerReference = /*#__PURE__*/React.createRef();
|
|
11164
11140
|
constructor(props) {
|
|
11165
11141
|
super(props);
|
|
@@ -11646,14 +11622,14 @@ Tabs.propTypes = {
|
|
|
11646
11622
|
disabled: PropTypes__default.default.bool.isRequired
|
|
11647
11623
|
})).isRequired,
|
|
11648
11624
|
selected: PropTypes__default.default.number.isRequired,
|
|
11649
|
-
onTabSelect: PropTypes__default.default.func.isRequired,
|
|
11650
11625
|
name: PropTypes__default.default.string.isRequired,
|
|
11651
11626
|
animatePanelsOnClick: PropTypes__default.default.bool,
|
|
11652
11627
|
changeTabOnSwipe: PropTypes__default.default.bool,
|
|
11653
11628
|
className: PropTypes__default.default.string,
|
|
11654
11629
|
transitionSpacing: PropTypes__default.default.oneOf(['default', 'xs', 'sm', 'md', 'lg']),
|
|
11655
11630
|
headerWidth: PropTypes__default.default.oneOf(['auto', 'block']),
|
|
11656
|
-
id: PropTypes__default.default.string
|
|
11631
|
+
id: PropTypes__default.default.string,
|
|
11632
|
+
onTabSelect: PropTypes__default.default.func.isRequired
|
|
11657
11633
|
};
|
|
11658
11634
|
Tabs.defaultProps = {
|
|
11659
11635
|
animatePanelsOnClick: false,
|