@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.
Files changed (107) hide show
  1. package/build/index.js +11 -35
  2. package/build/index.js.map +1 -1
  3. package/build/index.mjs +11 -35
  4. package/build/index.mjs.map +1 -1
  5. package/build/types/accordion/AccordionItem/AccordionItem.d.ts.map +1 -1
  6. package/build/types/actionOption/ActionOption.d.ts +5 -5
  7. package/build/types/actionOption/ActionOption.d.ts.map +1 -1
  8. package/build/types/alert/Alert.d.ts +1 -1
  9. package/build/types/alert/Alert.d.ts.map +1 -1
  10. package/build/types/body/Body.d.ts +1 -1
  11. package/build/types/body/Body.d.ts.map +1 -1
  12. package/build/types/chips/Chip.d.ts +2 -2
  13. package/build/types/chips/Chip.d.ts.map +1 -1
  14. package/build/types/chips/Chips.d.ts +2 -2
  15. package/build/types/chips/Chips.d.ts.map +1 -1
  16. package/build/types/common/bottomSheet/BottomSheet.d.ts +2 -2
  17. package/build/types/common/bottomSheet/BottomSheet.d.ts.map +1 -1
  18. package/build/types/common/closeButton/CloseButton.d.ts +1 -1
  19. package/build/types/common/closeButton/CloseButton.d.ts.map +1 -1
  20. package/build/types/common/flowHeader/FlowHeader.d.ts +1 -1
  21. package/build/types/common/flowHeader/FlowHeader.d.ts.map +1 -1
  22. package/build/types/common/hooks/useResizeObserver.d.ts +1 -1
  23. package/build/types/common/hooks/useResizeObserver.d.ts.map +1 -1
  24. package/build/types/common/panel/Panel.d.ts +3 -3
  25. package/build/types/common/panel/Panel.d.ts.map +1 -1
  26. package/build/types/common/polymorphicWithOverrides/PolymorphicWithOverrides.d.ts +1 -1
  27. package/build/types/common/polymorphicWithOverrides/PolymorphicWithOverrides.d.ts.map +1 -1
  28. package/build/types/common/responsivePanel/ResponsivePanel.d.ts +1 -1
  29. package/build/types/dimmer/Dimmer.d.ts +3 -3
  30. package/build/types/dimmer/Dimmer.d.ts.map +1 -1
  31. package/build/types/emphasis/Emphasis.d.ts +2 -2
  32. package/build/types/emphasis/Emphasis.d.ts.map +1 -1
  33. package/build/types/inputs/Input.d.ts +1 -1
  34. package/build/types/inputs/Input.d.ts.map +1 -1
  35. package/build/types/inputs/SearchInput.d.ts +1 -1
  36. package/build/types/inputs/SearchInput.d.ts.map +1 -1
  37. package/build/types/inputs/TextArea.d.ts +1 -1
  38. package/build/types/inputs/TextArea.d.ts.map +1 -1
  39. package/build/types/inputs/_BottomSheet.d.ts +1 -1
  40. package/build/types/inputs/_BottomSheet.d.ts.map +1 -1
  41. package/build/types/inputs/_ButtonInput.d.ts +1 -1
  42. package/build/types/inputs/_ButtonInput.d.ts.map +1 -1
  43. package/build/types/moneyInput/MoneyInput.d.ts.map +1 -1
  44. package/build/types/progress/Progress.d.ts +2 -2
  45. package/build/types/progress/Progress.d.ts.map +1 -1
  46. package/build/types/progressBar/ProgressBar.d.ts +2 -2
  47. package/build/types/progressBar/ProgressBar.d.ts.map +1 -1
  48. package/build/types/promoCard/PromoCard.d.ts +1 -1
  49. package/build/types/promoCard/PromoCard.d.ts.map +1 -1
  50. package/build/types/provider/direction/DirectionProvider.d.ts +2 -2
  51. package/build/types/provider/direction/DirectionProvider.d.ts.map +1 -1
  52. package/build/types/provider/language/LanguageProvider.d.ts +2 -2
  53. package/build/types/provider/language/LanguageProvider.d.ts.map +1 -1
  54. package/build/types/select/option/Option.d.ts +2 -1
  55. package/build/types/select/option/Option.d.ts.map +1 -1
  56. package/build/types/slidingPanel/SlidingPanel.d.ts +1 -1
  57. package/build/types/slidingPanel/SlidingPanel.d.ts.map +1 -1
  58. package/build/types/switchOption/SwitchOption.d.ts +4 -4
  59. package/build/types/switchOption/SwitchOption.d.ts.map +1 -1
  60. package/build/types/tabs/Tabs.d.ts +1 -1
  61. package/build/types/tabs/Tabs.d.ts.map +1 -1
  62. package/build/types/tooltip/Tooltip.d.ts.map +1 -1
  63. package/build/types/uploadInput/UploadInput.d.ts +2 -2
  64. package/build/types/uploadInput/UploadInput.d.ts.map +1 -1
  65. package/build/types/uploadInput/uploadItem/UploadItem.d.ts.map +1 -1
  66. package/build/types/withDisplayFormat/WithDisplayFormat.d.ts +4 -4
  67. package/build/types/withDisplayFormat/WithDisplayFormat.d.ts.map +1 -1
  68. package/package.json +3 -3
  69. package/src/accordion/AccordionItem/AccordionItem.tsx +5 -2
  70. package/src/actionOption/ActionOption.tsx +4 -5
  71. package/src/alert/Alert.tsx +1 -1
  72. package/src/body/Body.tsx +4 -3
  73. package/src/chips/Chip.tsx +5 -6
  74. package/src/chips/Chips.tsx +1 -2
  75. package/src/common/bottomSheet/BottomSheet.tsx +2 -9
  76. package/src/common/closeButton/CloseButton.tsx +1 -1
  77. package/src/common/flowHeader/FlowHeader.tsx +1 -1
  78. package/src/common/hooks/useResizeObserver.ts +1 -1
  79. package/src/common/panel/Panel.spec.tsx +1 -1
  80. package/src/common/panel/Panel.tsx +7 -7
  81. package/src/common/polymorphicWithOverrides/PolymorphicWithOverrides.tsx +1 -1
  82. package/src/dimmer/Dimmer.tsx +2 -10
  83. package/src/emphasis/Emphasis.tsx +1 -3
  84. package/src/inputs/Input.tsx +1 -1
  85. package/src/inputs/SearchInput.tsx +1 -1
  86. package/src/inputs/SelectInput.tsx +4 -4
  87. package/src/inputs/TextArea.tsx +1 -1
  88. package/src/inputs/_BottomSheet.tsx +1 -1
  89. package/src/inputs/_ButtonInput.tsx +1 -1
  90. package/src/moneyInput/MoneyInput.story.tsx +40 -2
  91. package/src/moneyInput/MoneyInput.tsx +1 -4
  92. package/src/progress/Progress.tsx +3 -15
  93. package/src/progressBar/ProgressBar.tsx +1 -2
  94. package/src/promoCard/PromoCard.tsx +2 -2
  95. package/src/promoCard/PromoCardContext.spec.tsx +1 -1
  96. package/src/provider/direction/DirectionProvider.tsx +2 -5
  97. package/src/provider/language/LanguageProvider.tsx +2 -2
  98. package/src/segmentedControl/SegmentedControl.tsx +2 -2
  99. package/src/select/option/Option.tsx +6 -18
  100. package/src/slidingPanel/SlidingPanel.tsx +1 -1
  101. package/src/ssr.spec.js +6 -0
  102. package/src/switchOption/SwitchOption.tsx +5 -7
  103. package/src/tabs/Tabs.js +3 -3
  104. package/src/tooltip/Tooltip.tsx +2 -1
  105. package/src/uploadInput/UploadInput.tsx +2 -2
  106. package/src/uploadInput/uploadItem/UploadItem.tsx +3 -4
  107. 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 && closeButton['aria-label'],
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 React.Component {
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 Number(amount);
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
- value: value,
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: isModern ? 'm-l-1' : 'm-l-1 body-2',
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: secondaryElementClassNames(),
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
- if (event.nativeEvent && event.nativeEvent.stopImmediatePropagation) {
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,