@transferwise/components 46.36.1 → 46.37.0

package/build/index.mjs

@@ -2402,7 +2402,7 @@ const Chip = ({
     isModern
   } = useTheme();
   const closeButtonReference = useRef(null);
-  const previousCloseButtonShown = useRef();
+  const previousCloseButtonShown = useRef(undefined);
   useEffect(() => {
     if (closeButtonReference.current != null && previousCloseButtonShown.current === false) {
       closeButtonReference.current?.focus();
@@ -2430,7 +2430,7 @@ const Chip = ({
     }), onRemove ? /*#__PURE__*/jsx(CloseButton, {
       ref: closeButtonReference,
       className: isModern ? `btn-unstyled` : `btn-unstyled m-l-1`,
-      "aria-label": closeButton && closeButton['aria-label'],
+      "aria-label": closeButton?.['aria-label'],
       size: "sm",
       filled: isModern,
       onClick: onRemove
@@ -6067,7 +6067,7 @@ const getCursorPositionAfterActionStroke = (action, selectionStart, selectionEnd
   return cursorPosition;
 };
 
-class WithDisplayFormat extends Component {
+class WithDisplayFormat extends React.Component {
   static defaultProps = {
     autoComplete: 'off',
     displayPattern: '',
@@ -9422,16 +9422,11 @@ const Progress = ({
   id,
   progress
 }) => {
-  const [value, setValue] = useState(0);
-  useEffect(() => {
-    setValue(progress.value);
-  });
   return /*#__PURE__*/jsxs("progress", {
     id: id,
     className: classNames('np-progress d-block', className),
     ...progress,
-    value: value,
-    children: [value, "%"]
+    children: [Math.floor(progress.value / progress.max * 100), "%"]
   });
 };
 
@@ -9925,12 +9920,8 @@ function Option$1({
   note = '',
   secondary = '',
   icon,
-  classNames = {},
   selected = false
 }) {
-  const {
-    isModern
-  } = useTheme();
   const iconElement = icon ? /*#__PURE__*/cloneElement(icon, {
     size: 24,
     className: 'tw-icon'
@@ -9944,22 +9935,12 @@ function Option$1({
     className: selected ? 'text-ellipsis' : undefined,
     children: [label, note && /*#__PURE__*/jsx(Body, {
       as: "span",
-      className: isModern ? 'm-l-1' : 'm-l-1 body-2',
+      className: "m-l-1",
       children: note
     })]
   });
-  const secondaryElementClassNames = () => {
-    let classes = undefined;
-    if (selected) {
-      classes = 'text-ellipsis';
-    }
-    if (isModern) {
-      return classes;
-    }
-    return `${classes ? classes + ' ' : ''}body-2`;
-  };
   const secondaryElement = secondary && /*#__PURE__*/jsx(Body, {
-    className: secondaryElementClassNames(),
+    className: classNames(selected && 'text-ellipsis'),
     children: secondary
   });
   return iconElement ? /*#__PURE__*/jsxs("div", {
@@ -10922,9 +10903,7 @@ const stopPropagation = event => {
   if (event) {
     event.stopPropagation();
     event.preventDefault();
-    if (event.nativeEvent && event.nativeEvent.stopImmediatePropagation) {
-      event.nativeEvent.stopImmediatePropagation();
-    }
+    event.nativeEvent?.stopImmediatePropagation?.();
   }
 };
 const SwitchOption = ({
@@ -11126,7 +11105,7 @@ const SpacerWidth = {
   lg: 32
 };
 class Tabs extends Component {
-  /** @type {RefObject<HTMLDivElement>} */
+  /** @type {React.RefObject<HTMLDivElement | null>} */
   containerReference = /*#__PURE__*/createRef();
   constructor(props) {
     super(props);
@@ -11613,14 +11592,14 @@ Tabs.propTypes = {
     disabled: PropTypes.bool.isRequired
   })).isRequired,
   selected: PropTypes.number.isRequired,
-  onTabSelect: PropTypes.func.isRequired,
   name: PropTypes.string.isRequired,
   animatePanelsOnClick: PropTypes.bool,
   changeTabOnSwipe: PropTypes.bool,
   className: PropTypes.string,
   transitionSpacing: PropTypes.oneOf(['default', 'xs', 'sm', 'md', 'lg']),
   headerWidth: PropTypes.oneOf(['auto', 'block']),
-  id: PropTypes.string
+  id: PropTypes.string,
+  onTabSelect: PropTypes.func.isRequired
 };
 Tabs.defaultProps = {
   animatePanelsOnClick: false,