@transferwise/components 46.0.8 → 46.1.1

package/build/index.js

@@ -4458,7 +4458,7 @@ class DateLookup extends React.PureComponent {
   }
 }
 DateLookup.propTypes = {
-  value: PropTypes__default.default.instanceOf(Date).isRequired,
+  value: PropTypes__default.default.instanceOf(Date),
   min: PropTypes__default.default.instanceOf(Date),
   max: PropTypes__default.default.instanceOf(Date),
   size: PropTypes__default.default.oneOf(['sm', 'md', 'lg']),
@@ -4472,6 +4472,7 @@ DateLookup.propTypes = {
   clearable: PropTypes__default.default.bool
 };
 DateLookup.defaultProps = {
+  value: null,
   min: null,
   max: null,
   size: exports.Size.MEDIUM,
@@ -10612,7 +10613,6 @@ var messages$2 = reactIntl.defineMessages({
   }
 });
 
-// Option.tsx NEW
 function Option$1({
   label,
   currency = '',
@@ -10625,13 +10625,12 @@ function Option$1({
   const {
     isModern
   } = componentsTheming.useTheme();
-  const style = classes => classes.map(className => classNames[className] || className).join(' ');
-  const currencyClassNames = currency ? style(['currency-flag', `currency-flag-${currency.toLowerCase()}`]) : undefined;
   const iconElement = icon ? /*#__PURE__*/React.cloneElement(icon, {
     size: 24,
     className: 'tw-icon'
-  }) : currency && /*#__PURE__*/jsxRuntime.jsx("i", {
-    className: currencyClassNames
+  }) : currency && /*#__PURE__*/jsxRuntime.jsx(art.Flag, {
+    code: currency.toLowerCase(),
+    intrinsicSize: 24
   });
   const titleAndNoteElement = /*#__PURE__*/jsxRuntime.jsxs(Body, {
     as: "span",
@@ -12504,7 +12503,7 @@ TypeaheadInput.defaultProps = {
   selected: []
 };
 
-function hightlight(value, query) {
+function highlight(value, query) {
   if (value && query) {
     const highlightStart = value.toUpperCase().indexOf(query.trim().toUpperCase());
     const highlightEnd = highlightStart + query.trim().length;
@@ -12544,13 +12543,13 @@ const Option = props => {
       tabIndex: -1,
       onClick: onClick,
       children: [/*#__PURE__*/jsxRuntime.jsx("span", {
-        children: hightlight(label, query)
+        children: highlight(label, query)
       }), note && /*#__PURE__*/jsxRuntime.jsx("span", {
         className: "np-text-body-default m-l-1",
         children: note
       }), secondary && /*#__PURE__*/jsxRuntime.jsx("span", {
         className: "np-text-body-default text-ellipsis",
-        children: secondary
+        children: highlight(secondary, query)
       })]
     })
   });