@transferwise/components 0.0.0-experimental-7a83d86 → 0.0.0-experimental-b2a535a

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 (52) hide show
  1. package/build/index.js +17 -22
  2. package/build/index.js.map +1 -1
  3. package/build/index.mjs +17 -22
  4. package/build/index.mjs.map +1 -1
  5. package/build/types/alert/Alert.d.ts.map +1 -1
  6. package/build/types/dimmer/Dimmer.d.ts.map +1 -1
  7. package/build/types/loader/Loader.d.ts.map +1 -1
  8. package/build/types/phoneNumberInput/PhoneNumberInput.d.ts.map +1 -1
  9. package/build/types/popover/Popover.d.ts.map +1 -1
  10. package/build/types/segmentedControl/SegmentedControl.d.ts +2 -2
  11. package/build/types/segmentedControl/SegmentedControl.d.ts.map +1 -1
  12. package/build/types/select/Select.d.ts.map +1 -1
  13. package/build/types/stepper/deviceDetection.d.ts.map +1 -1
  14. package/build/types/uploadInput/uploadButton/UploadButton.d.ts.map +1 -1
  15. package/package.json +3 -3
  16. package/src/accordion/Accordion.story.tsx +1 -1
  17. package/src/alert/Alert.tsx +1 -2
  18. package/src/avatar/colors/colors.ts +1 -1
  19. package/src/body/Body.spec.tsx +1 -1
  20. package/src/body/Body.story.tsx +8 -8
  21. package/src/checkbox/Checkbox.js +1 -1
  22. package/src/checkboxButton/CheckboxButton.spec.tsx +1 -0
  23. package/src/common/Option/Option.tsx +1 -1
  24. package/src/common/deviceDetection/deviceDetection.js +1 -1
  25. package/src/common/deviceDetection/deviceDetection.spec.js +2 -4
  26. package/src/common/responsivePanel/ResponsivePanel.spec.js +15 -11
  27. package/src/decision/Decision.spec.js +1 -0
  28. package/src/dimmer/Dimmer.tsx +2 -6
  29. package/src/inlineAlert/InlineAlert.story.tsx +7 -8
  30. package/src/link/Link.story.tsx +16 -16
  31. package/src/loader/Loader.tsx +1 -0
  32. package/src/logo/Logo.js +2 -2
  33. package/src/moneyInput/MoneyInput.story.tsx +3 -3
  34. package/src/nudge/Nudge.spec.tsx +5 -5
  35. package/src/phoneNumberInput/PhoneNumberInput.tsx +1 -2
  36. package/src/phoneNumberInput/utils/cleanNumber/cleanNumber.ts +1 -1
  37. package/src/popover/Popover.tsx +1 -2
  38. package/src/promoCard/PromoCard.tsx +1 -1
  39. package/src/radioGroup/RadioGroup.spec.js +1 -1
  40. package/src/section/Section.story.tsx +1 -2
  41. package/src/segmentedControl/SegmentedControl.spec.tsx +41 -3
  42. package/src/segmentedControl/SegmentedControl.story.tsx +51 -13
  43. package/src/segmentedControl/SegmentedControl.tsx +3 -4
  44. package/src/select/Select.js +3 -2
  45. package/src/stepper/deviceDetection.js +2 -1
  46. package/src/stepper/deviceDetection.spec.js +3 -8
  47. package/src/test-utils/index.js +1 -1
  48. package/src/test-utils/story-config.ts +1 -1
  49. package/src/title/Title.spec.tsx +1 -1
  50. package/src/typeahead/Typeahead.spec.js +2 -4
  51. package/src/upload/Upload.spec.js +4 -8
  52. package/src/uploadInput/uploadButton/UploadButton.tsx +0 -1
package/build/index.js CHANGED
@@ -95,7 +95,7 @@ var HistoryNavigator$1 = HistoryNavigator;
95
95
  function isIosDevice() {
96
96
  const sampleTouchDevices = ['iphone', 'ipad', 'ipod'];
97
97
  const matchString = sampleTouchDevices.map(device => `(${device})`).join('|');
98
- const regex = new RegExp(matchString, 'gi');
98
+ const regex = new RegExp(matchString, 'ig');
99
99
  return typeof navigator !== 'undefined' && !!navigator.userAgent.match(regex);
100
100
  }
101
101
 
@@ -941,9 +941,8 @@ function resolveType(type) {
941
941
  return 'neutral';
942
942
  case 'error':
943
943
  return 'negative';
944
- default:
945
- return type;
946
944
  }
945
+ return type;
947
946
  }
948
947
  function Alert({
949
948
  arrow,
@@ -1089,7 +1088,7 @@ const hashSeed = seed => {
1089
1088
  const modulo = avatarColors.length;
1090
1089
  let hashValue = 0;
1091
1090
  let basePow = 1;
1092
- for (let i = 0; i < seed.length; i += 1) {
1091
+ for (let i = 0; i < seed.length; i++) {
1093
1092
  hashValue = (hashValue + seed.charCodeAt(i) * basePow) % modulo;
1094
1093
  basePow = basePow * base % modulo;
1095
1094
  }
@@ -1381,15 +1380,11 @@ const Dimmer = ({
1381
1380
  }, [onClose]);
1382
1381
  const onEnter = () => {
1383
1382
  setHasNotExited(true);
1384
- if (dimmerReference.current) {
1385
- dimmerManager.add(dimmerReference.current);
1386
- }
1383
+ dimmerReference.current && dimmerManager.add(dimmerReference.current);
1387
1384
  };
1388
1385
  const onExited = () => {
1389
1386
  setHasNotExited(false);
1390
- if (dimmerReference.current) {
1391
- dimmerManager.remove(dimmerReference.current);
1392
- }
1387
+ dimmerReference.current && dimmerManager.remove(dimmerReference.current);
1393
1388
  };
1394
1389
  React.useEffect(() => {
1395
1390
  const localReferenceCopy = dimmerReference.current;
@@ -5206,6 +5201,7 @@ const Tooltip = ({
5206
5201
 
5207
5202
  function supportsTouchEvents() {
5208
5203
  const onTouchStartIsDefined = typeof window !== 'undefined' && window.ontouchstart !== undefined;
5204
+ // eslint-disable-next-line compat/compat
5209
5205
  const maxTouchPointsIsDefined = typeof navigator !== 'undefined' && navigator.maxTouchPoints;
5210
5206
  const documentTouchIsDefined = typeof window !== 'undefined' && window.DocumentTouch && document instanceof window.DocumentTouch;
5211
5207
  return !!(onTouchStartIsDefined || maxTouchPointsIsDefined || documentTouchIsDefined);
@@ -5213,7 +5209,7 @@ function supportsTouchEvents() {
5213
5209
  function userAgentSuggestsTouchDevice() {
5214
5210
  const sampleTouchDevices = ['android', 'iemobile', 'iphone', 'ipad', 'ipod', 'blackberry', 'bada'];
5215
5211
  const matchString = sampleTouchDevices.map(device => `(${device})`).join('|');
5216
- const regex = new RegExp(matchString, 'gi');
5212
+ const regex = new RegExp(matchString, 'ig');
5217
5213
  return typeof navigator !== 'undefined' && !!navigator.userAgent.match(regex);
5218
5214
  }
5219
5215
  // Important: this is not fool-proof! It gives false positives and negatives, and will be outdated.
@@ -5619,9 +5615,8 @@ function resolvePlacement(preferredPlacement) {
5619
5615
  case 'bottom-left':
5620
5616
  case 'bottom-right':
5621
5617
  return 'bottom';
5622
- default:
5623
- return preferredPlacement;
5624
5618
  }
5619
+ return preferredPlacement;
5625
5620
  }
5626
5621
  function Popover$1({
5627
5622
  children,
@@ -7184,6 +7179,7 @@ const Loader = ({
7184
7179
  }, 1000);
7185
7180
  }
7186
7181
  return () => {
7182
+ // eslint-disable-next-line fp/no-mutation
7187
7183
  cancelled = true;
7188
7184
  clearTimeout(timeout);
7189
7185
  };
@@ -9120,7 +9116,7 @@ const explodeNumberModel = number => {
9120
9116
  };
9121
9117
  };
9122
9118
 
9123
- const DIGITS_MATCH = /^$|^(\+)|(\d+)/g;
9119
+ const DIGITS_MATCH = /^$|^(\+)|([\d]+)/g;
9124
9120
  const cleanNumber = number => number.match(DIGITS_MATCH)?.join('') ?? '';
9125
9121
 
9126
9122
  function sortArrayByProperty(arrayToSort, property) {
@@ -9206,8 +9202,7 @@ const PhoneNumberInput = ({
9206
9202
  };
9207
9203
  React.useEffect(() => {
9208
9204
  if (broadcastedValue === null) {
9209
- setBroadcastedValue(internalValue);
9210
- return;
9205
+ return setBroadcastedValue(internalValue);
9211
9206
  }
9212
9207
  const internalPhoneNumber = `${internalValue.prefix ?? ''}${internalValue.suffix}`;
9213
9208
  const broadcastedPhoneNumber = `${broadcastedValue.prefix ?? ''}${broadcastedValue.suffix}`;
@@ -9480,7 +9475,7 @@ const PromoCard = /*#__PURE__*/React.forwardRef(({
9480
9475
  const checkedProps = (type === 'checkbox' || type === 'radio') && !href ? {
9481
9476
  ...commonProps,
9482
9477
  'aria-checked': type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,
9483
- 'aria-describedby': `${componentId}-title`,
9478
+ 'aria-describedby': `${componentId}-title` || undefined,
9484
9479
  'aria-disabled': isDisabled,
9485
9480
  'data-value': value ?? undefined,
9486
9481
  role: type === 'checkbox' || type === 'radio' ? type : undefined,
@@ -10133,8 +10128,8 @@ function Select({
10133
10128
  }
10134
10129
  };
10135
10130
  function selectKeyboardFocusedOption() {
10136
- if (keyboardFocusedOptionIndex != null && selectableOptions.length > 0) {
10137
- selectOption(selectableOptions[keyboardFocusedOptionIndex]);
10131
+ if (keyboardFocusedOptionIndex != null) {
10132
+ selectableOptions.length > 0 && selectOption(selectableOptions[keyboardFocusedOptionIndex]);
10138
10133
  }
10139
10134
  }
10140
10135
  function moveFocusWithDifference(difference) {
@@ -10361,6 +10356,7 @@ function Select({
10361
10356
  disabled: disabled,
10362
10357
  "aria-controls": listboxId,
10363
10358
  "aria-expanded": open,
10359
+ "aria-autocomplete": "none",
10364
10360
  onClick: handleOnClick,
10365
10361
  ...buttonProps,
10366
10362
  children: [selected ? /*#__PURE__*/jsxRuntime.jsx(Option$1, {
@@ -10476,12 +10472,11 @@ Select.defaultProps = {
10476
10472
 
10477
10473
  const SegmentedControl = ({
10478
10474
  name,
10479
- defaultValue,
10475
+ selectedValue,
10480
10476
  mode = 'input',
10481
10477
  segments,
10482
10478
  onChange
10483
10479
  }) => {
10484
- const [selectedValue, setSelectedValue] = React.useState(defaultValue || segments[0].value);
10485
10480
  const [animate, setAnimate] = React.useState(false);
10486
10481
  const segmentsRef = React.useRef(null);
10487
10482
  if (segments.length > 3) {
@@ -10505,6 +10500,7 @@ const SegmentedControl = ({
10505
10500
  }
10506
10501
  };
10507
10502
  React.useEffect(() => {
10503
+ setAnimate(true);
10508
10504
  updateSegmentPosition();
10509
10505
  const handleWindowSizeChange = () => {
10510
10506
  setAnimate(false);
@@ -10530,7 +10526,6 @@ const SegmentedControl = ({
10530
10526
  children: segmentsWithRefs.map(segment => {
10531
10527
  const onSelect = () => {
10532
10528
  setAnimate(true);
10533
- setSelectedValue(segment.value);
10534
10529
  onChange(segment.value);
10535
10530
  };
10536
10531
  return mode === 'input' ? /*#__PURE__*/jsxRuntime.jsxs("label", {