@transferwise/comparison-components 17.1.14 → 17.1.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transferwise/comparison-components",
-  "version": "17.1.14",
+  "version": "17.1.15",
   "description": "Display a comparison table of providers given a route and amount.",
   "homepage": "https://wise.com/gb/compare/",
   "main": "dist/umd/comparison-components.js",

package/src/transfer-fee-comparison/TransferFeeComparison.module.less

@@ -0,0 +1,29 @@
+@component-spacing: 24px;
+
+.transfer-fee-comparison__container {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+
+.horizontally-centered() {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+}
+
+.transfer-fee-comparison__provider-filter-toggle {
+  .horizontally-centered();
+
+  margin-bottom: @component-spacing;
+}
+
+.transfer-fee-comparison__table {
+  .horizontally-centered();
+
+  margin-bottom: @component-spacing;
+}
+
+.transfer-fee-comparison__footer {
+  .horizontally-centered();
+}

package/src/transfer-fee-comparison/TransferFeeComparison.tsx

@@ -1,9 +1,10 @@
 import React from 'react';
 
+import styles from './TransferFeeComparison.module.less';
 import ProviderFilteringOption from './domain/ProviderFilteringOption';
 import Quote from './domain/Quote';
 import ProviderFilterToggle from './provider-filter-toggle';
-import TransferFeeComparisonFooter from './transfer-fee-comparison-footer/TransferFeeComparisonFooter';
+import TransferFeeComparisonFooter from './transfer-fee-comparison-footer';
 import TransferFeeComparisonTable from './transfer-fee-comparison-table';
 
 export type TransferFeeComparisonProps = {
@@ -26,21 +27,27 @@ const TransferFeeComparison = ({
   urlLocale,
 }: TransferFeeComparisonProps): JSX.Element => {
   return (
-    <div>
+    <div className={styles.transferFeeComparison__container}>
       {providerFiltering.showToggle ? (
-        <ProviderFilterToggle
-          activeToggle={providerFiltering.selectedOption}
-          onToggle={providerFiltering.onProviderFilteringOptionChange}
+        <div className={styles.transferFeeComparison__providerFilterToggle}>
+          <ProviderFilterToggle
+            activeToggle={providerFiltering.selectedOption}
+            onToggle={providerFiltering.onProviderFilteringOptionChange}
+            locale={locale}
+          />
+        </div>
+      ) : null}
+      <div className={styles.transferFeeComparison__table}>
+        <TransferFeeComparisonTable
+          quotes={quotes}
+          midmarketRate={midmarketRate}
+          urlLocale={urlLocale}
           locale={locale}
         />
-      ) : null}
-      <TransferFeeComparisonTable
-        quotes={quotes}
-        midmarketRate={midmarketRate}
-        urlLocale={urlLocale}
-        locale={locale}
-      />
-      <TransferFeeComparisonFooter urlLocale={urlLocale} />
+      </div>
+      <div className={styles.transferFeeComparison__footer}>
+        <TransferFeeComparisonFooter locale={locale} urlLocale={urlLocale} />
+      </div>
     </div>
   );
 };

package/src/transfer-fee-comparison/TransferFeeComparisonContainer.tsx

@@ -34,9 +34,12 @@ const TransferFeeComparisonContainer = ({
     setProviderFilteringOption(newValue);
   };
 
+  const filterToggleEnabled =
+    enableLargestProviderFiltering &&
+    hasEnoughProviders(quotes, urlLocale, requiredNumberOfLargestProviders);
+
   const filteredQuotes: Quote[] =
-    providerFilteringOption === ProviderFilteringOption.LARGEST_PROVIDERS &&
-    hasEnoughProviders(quotes, urlLocale, requiredNumberOfLargestProviders)
+    providerFilteringOption === ProviderFilteringOption.LARGEST_PROVIDERS && filterToggleEnabled
       ? filter(quotes, urlLocale)
       : quotes;
 
@@ -45,7 +48,7 @@ const TransferFeeComparisonContainer = ({
       quotes={filteredQuotes}
       midmarketRate={midmarketRate}
       providerFiltering={{
-        showToggle: enableLargestProviderFiltering,
+        showToggle: filterToggleEnabled,
         selectedOption: providerFilteringOption,
         onProviderFilteringOptionChange: onProviderFilteringOptionChange,
       }}

package/src/transfer-fee-comparison/provider-filter-toggle/ProviderFilterToggle.spec.tsx

@@ -34,10 +34,8 @@ describe('<ProviderFilterToggle />', () => {
       render(<ProviderFilterToggle activeToggle={activeToggle} onToggle={onToggle} locale="en" />);
 
       // expect:
-      expect(screen.getByText(activeToggleText)).toHaveClass('providerFilterToggle__activeButton');
-      expect(screen.getByText(inactiveToggleText)).not.toHaveClass(
-        'providerFilterToggle__activeButton',
-      );
+      expect(screen.getByText(activeToggleText)).toBeDisabled();
+      expect(screen.getByText(inactiveToggleText)).toBeEnabled();
     },
   );
 
@@ -61,8 +59,8 @@ describe('<ProviderFilterToggle />', () => {
     );
 
     // then::
-    expect(screen.getByText('Largest providers')).toHaveClass('providerFilterToggle__activeButton');
-    expect(screen.getByText('All providers')).not.toHaveClass('providerFilterToggle__activeButton');
+    expect(screen.getByText('Largest providers')).toBeDisabled();
+    expect(screen.getByText('All providers')).toBeEnabled();
   });
 
   it.each(TEST_CASES)(

package/src/transfer-fee-comparison/provider-filter-toggle/ProviderFilterToggle.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import { FormattedMessage, IntlProvider } from 'react-intl';
 
 import ProviderFilteringOption from '../domain/ProviderFilteringOption';
-import translationsFile from '../translations.json';
+import translations from '../translations.json';
 
 import styles from './provider-filter-toggle.module.less';
 
@@ -18,43 +18,52 @@ export const ProviderFilterToggle = ({
   onToggle,
   locale,
 }: ProviderFilterToggleProps): JSX.Element => {
-  const typedTranslationFile: { [language: string]: typeof messages } = translationsFile;
-  const messages: Record<string, string> = typedTranslationFile[locale];
+  const typedTranslations: { [language: string]: typeof messages } = translations;
+  const messages: Record<string, string> = typedTranslations[locale];
 
   return (
     <IntlProvider messages={messages} locale={locale} defaultLocale="en">
       <div className={styles.providerFilterToggle__toggleContainer}>
-        <Button
-          className={[
-            styles.providerFilterToggle__leftButton,
-            activeToggle === ProviderFilteringOption.LARGEST_PROVIDERS
-              ? styles.providerFilterToggle__activeButton
-              : '',
-          ]}
-          onClick={() => {
-            activeToggle === ProviderFilteringOption.ALL_PROVIDERS &&
-              onToggle(ProviderFilteringOption.LARGEST_PROVIDERS);
-          }}
-        >
-          <FormattedMessage id="largest-providers" />
-        </Button>
-        <Button
-          className={[
-            styles.providerFilterToggle__rightButton,
-            activeToggle === ProviderFilteringOption.ALL_PROVIDERS
-              ? styles.providerFilterToggle__activeButton
-              : '',
-          ]}
-          onClick={() => {
-            activeToggle === ProviderFilteringOption.LARGEST_PROVIDERS &&
-              onToggle(ProviderFilteringOption.ALL_PROVIDERS);
-          }}
-        >
-          <FormattedMessage id="all-providers" />
-        </Button>
+        <Toggle
+          label={<FormattedMessage id="largest-providers" />}
+          value={ProviderFilteringOption.LARGEST_PROVIDERS}
+          isActive={activeToggle === ProviderFilteringOption.LARGEST_PROVIDERS}
+          onToggle={onToggle}
+        />
+        <Toggle
+          label={<FormattedMessage id="all-providers" />}
+          value={ProviderFilteringOption.ALL_PROVIDERS}
+          isActive={activeToggle === ProviderFilteringOption.ALL_PROVIDERS}
+          onToggle={onToggle}
+        />
       </div>
     </IntlProvider>
   );
 };
 
+type ToggleProps = {
+  label: JSX.Element;
+  value: ProviderFilteringOption;
+  isActive: boolean;
+  onToggle: (newValue: ProviderFilteringOption) => void;
+};
+
+const Toggle = ({ label, value, isActive, onToggle }: ToggleProps): JSX.Element => {
+  return (
+    <Button
+      className={`${styles.providerFilterToggle__button} ${
+        isActive
+          ? styles.providerFilterToggle__buttonActive
+          : styles.providerFilterToggle__buttonInactive
+      }`}
+      onClick={() => {
+        !isActive && onToggle(value);
+      }}
+      disabled={isActive}
+    >
+      {label}
+    </Button>
+  );
+};
+
 export default ProviderFilterToggle;

package/src/transfer-fee-comparison/provider-filter-toggle/provider-filter-toggle.module.less

@@ -1,35 +1,49 @@
-@import (reference) '@transferwise/neptune-css/dist/less/legacy-variables.less';
+@import (reference) '@transferwise/neptune-css/dist/less/neptune-tokens.less';
 
 .provider-filter-toggle__toggle-container {
   display: flex;
-  position: relative;
-  align-items: center;
-  justify-content: center;
-  width: 105%;
-  min-height: 70px;
+  flex-direction: row;
+  padding: 4px 5.5px;
   border-radius: 3px;
-  background-color: @navbar-inverse-color;
-  box-shadow: -10px 0 40px rgba(0, 0, 0, 0.05);
+  border-color: @color-base-white;
+  background-color: @color-base-white;
 }
 
-.provider-filter-toggle__left-button {
-  width: 200px;
-  border-right: none;
-  border-radius: 1px;
-  background-color: @navbar-inverse-color;
-  color: @brand-light-blue-minus-20;
+.provider-filter-toggle__button + .provider-filter-toggle__button {
+  margin-left: 9px;
 }
 
-.provider-filter-toggle__right-button {
-  width: 200px;
-  border-left: none;
-  border-radius: 1px;
-  background-color: @navbar-inverse-color;
-  color: @brand-light-blue-minus-20;
+.provider-filter-toggle__button {
+  width: 180px;
+  border: none;
 }
 
-.provider-filter-toggle__active-button {
-  width: 200px;
-  background-color: @brand-light-blue-minus-20;
-  color: @navbar-inverse-color;
+.provider-filter-toggle__button--inactive {
+  width: 180px;
+  border: none;
+  background-color: @color-base-white;
+  color: @color-accent;
+
+  &:active:hover,
+  &:hover,
+  &:active,
+  &:focus {
+    background-color: @color-base-white;
+    color: @color-accent;
+  }
+}
+
+button.provider-filter-toggle__button[disabled] {
+  background-color: @color-accent;
+  color: @color-base-white;
+
+  &:active:hover,
+  &:hover,
+  &:active,
+  &:focus {
+    background-color: @color-accent;
+    color: @color-base-white;
+  }
+
+  cursor: initial;
 }

package/src/transfer-fee-comparison/transfer-fee-comparison-footer/TransferFeeComparisonFooter.stories.tsx

@@ -17,5 +17,6 @@ const Template: Story<TransferFeeComparisonFooterProps> = (args) => {
 export const Footer = Template.bind({});
 
 Footer.args = {
+  locale: 'en',
   urlLocale: 'gb',
 };

package/src/transfer-fee-comparison/transfer-fee-comparison-footer/TransferFeeComparisonFooter.tsx

@@ -1,31 +1,35 @@
 import React from 'react';
-// eslint-disable-next-line no-restricted-imports
-import { Message, TranslationProvider } from 'retranslate';
+import { FormattedMessage, IntlProvider } from 'react-intl';
 
 import createUrl from '../../resources/createUrl';
-import translationsFile from '../translations.json';
+import translations from '../translations.json';
 
 import componentStyles from './transfer-fee-comparison-footer.module.less';
 
 export type TransferFeeComparisonFooterProps = {
+  locale: string;
   urlLocale: string;
 };
 
 const TransferFeeComparisonFooter = ({
+  locale,
   urlLocale,
 }: TransferFeeComparisonFooterProps): JSX.Element => {
+  const typedTranslations: { [language: string]: typeof messages } = translations;
+  const messages: Record<string, string> = typedTranslations[locale];
+
   const LINK = createUrl(`/${urlLocale}/compare/disclaimer`);
 
   return (
-    <TranslationProvider messages={translationsFile} language={urlLocale} fallbackLanguage="en">
+    <IntlProvider messages={messages} locale={locale} defaultLocale="en">
       <div className={componentStyles.transferFeeComparisonFooter__disclaimer}>
-        <Message>disclaimer</Message>
+        <FormattedMessage id="disclaimer" />
         {'. '}
         <a className={componentStyles.transferFeeComparisonFooter__link} href={LINK}>
-          <Message>how-we-collect-data</Message>
+          <FormattedMessage id="how-we-collect-data" />
         </a>
       </div>
-    </TranslationProvider>
+    </IntlProvider>
   );
 };
 

package/src/transfer-fee-comparison/transfer-fee-comparison-footer/index.ts

@@ -0,0 +1 @@
+export { default } from './TransferFeeComparisonFooter';

package/src/transfer-fee-comparison/transfer-fee-comparison-footer/transfer-fee-comparison-footer.module.less

@@ -1,7 +1,7 @@
-@import (reference) '@transferwise/neptune-css/dist/less/legacy-variables.less';
+@import (reference) '@transferwise/neptune-tokens/tokens.less';
 
 .transfer-fee-comparison-footer__disclaimer {
-  background-color: transparent;
+  text-align: center;
 }
 
 .transfer-fee-comparison-footer__link {

package/dist/es/TransferFeeComparisonContainer-9dd47854.js

@@ -1,2 +0,0 @@
-import{c as e}from"./_commonjsHelpers-97e6d7b1.js";import a,{useState as r}from"react";import{T as n,c as t}from"./provider-constants-6f33da72.js";import{Button as o}from"@transferwise/components";import{IntlProvider as i,FormattedMessage as s}from"react-intl";import{s as d}from"./style-inject.es-1f59c1d0.js";import{TranslationProvider as c,Message as l}from"retranslate";var u=new Map([["gb",["paypal","western-union","hsbc","barclays","lloyds","moneygram",n]],["us",["paypal","western-union","chase","moneygram","wells-fargo","xoom",n]],["au",["paypal","western-union","commonwealth-bank-of-australia","anz","westpac","national-australia-bank",n]],["hk",["paypal","western-union","hang-seng","hsbc-hk","ocbc","ccb-hk",n]],["nl",["paypal","western-union","lacaixa","bbva","sabadell",n]],["es",["paypal","western-union","ing-nl","abn-amro-bank","rabobank",n]]]),m=function(e){return u.has(e)},f=function(e,a,r){return void 0===r&&(r=5),!!m(a)&&p(e,a).length>=r},p=function(e,a){if(!m(a))return e;var r=u.get(a)||[];return e.filter(function(e){return r.includes(e.provider.alias)})},h=e(function(e,r){var n=60103;if(r.Fragment=60107,"function"==typeof Symbol&&Symbol.for){var t=Symbol.for;n=t("react.element"),r.Fragment=t("react.fragment")}var o=a.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,i=Object.prototype.hasOwnProperty,s={key:!0,ref:!0,__self:!0,__source:!0};function d(e,a,r){var t,d={},c=null,l=null;for(t in void 0!==r&&(c=""+r),void 0!==a.key&&(c=""+a.key),void 0!==a.ref&&(l=a.ref),a)i.call(a,t)&&!s.hasOwnProperty(t)&&(d[t]=a[t]);if(e&&e.defaultProps)for(t in a=e.defaultProps)void 0===d[t]&&(d[t]=a[t]);return{$$typeof:n,type:e,key:c,ref:l,props:d,_owner:o.current}}r.jsx=d,r.jsxs=d});h.Fragment,h.jsx,h.jsxs;var v=e(function(e,r){"production"!==process.env.NODE_ENV&&function(){var e=a,n=60103,t=60106;r.Fragment=60107;var o=60108,i=60114,s=60109,d=60110,c=60112,l=60113,u=60120,m=60115,f=60116,p=60121,h=60122,v=60117,g=60129,y=60131;if("function"==typeof Symbol&&Symbol.for){var k=Symbol.for;n=k("react.element"),t=k("react.portal"),r.Fragment=k("react.fragment"),o=k("react.strict_mode"),i=k("react.profiler"),s=k("react.provider"),d=k("react.context"),c=k("react.forward_ref"),l=k("react.suspense"),u=k("react.suspense_list"),m=k("react.memo"),f=k("react.lazy"),p=k("react.block"),h=k("react.server.block"),v=k("react.fundamental"),k("react.scope"),k("react.opaque.id"),g=k("react.debug_trace_mode"),k("react.offscreen"),y=k("react.legacy_hidden")}var b="function"==typeof Symbol&&Symbol.iterator,R="@@iterator";var w=e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function F(e){for(var a=arguments.length,r=new Array(a>1?a-1:0),n=1;n<a;n++)r[n-1]=arguments[n];!function(e,a,r){var n=w.ReactDebugCurrentFrame,t="";if(L){var o=_(L.type),i=L._owner;t+=function(e,a,r){var n="";if(a){var t=a.fileName,o=t.replace(C,"");if(/^index\./.test(o)){var i=t.match(C);if(i){var s=i[1];if(s){var d=s.replace(C,"");o=d+"/"+o}}}n=" (at "+o+":"+a.lineNumber+")"}else r&&(n=" (created by "+r+")");return"\n    in "+(e||"Unknown")+n}(o,L._source,i&&_(i.type))}""!==(t+=n.getStackAddendum())&&(a+="%s",r=r.concat([t]));var s=r.map(function(e){return""+e});s.unshift("Warning: "+a),Function.prototype.apply.call(console[e],console,s)}("error",e,r)}var A=!1;var C=/^(.*)[\\\/]/;var N=1;function _(e){if(null==e)return null;if("number"==typeof e.tag&&F("Received an unexpected object in getComponentName(). This is likely a bug in React. Please file an issue."),"function"==typeof e)return e.displayName||e.name||null;if("string"==typeof e)return e;switch(e){case r.Fragment:return"Fragment";case t:return"Portal";case i:return"Profiler";case o:return"StrictMode";case l:return"Suspense";case u:return"SuspenseList"}if("object"==typeof e)switch(e.$$typeof){case d:return"Context.Consumer";case s:return"Context.Provider";case c:return h=e,v=e.render,g="ForwardRef",y=v.displayName||v.name||"",h.displayName||(""!==y?g+"("+y+")":g);case m:return _(e.type);case p:return _(e.render);case f:var a=(n=e)._status===N?n._result:null;if(a)return _(a)}var n,h,v,g,y;return null}var z={};w.ReactDebugCurrentFrame;var L=null;function j(e){L=e}var x,E,V,S=w.ReactCurrentOwner,I=Object.prototype.hasOwnProperty,T={key:!0,ref:!0,__self:!0,__source:!0};V={};var O=function(e,a,r,t,o,i,s){var d={$$typeof:n,type:e,key:a,ref:r,props:s,_owner:i,_store:{}};return Object.defineProperty(d._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(d,"_self",{configurable:!1,enumerable:!1,writable:!1,value:t}),Object.defineProperty(d,"_source",{configurable:!1,enumerable:!1,writable:!1,value:o}),Object.freeze&&(Object.freeze(d.props),Object.freeze(d)),d};function Q(e,a,r,n,t){var o,i={},s=null,d=null;for(o in void 0!==r&&(s=""+r),function(e){if(I.call(e,"key")){var a=Object.getOwnPropertyDescriptor(e,"key").get;if(a&&a.isReactWarning)return!1}return void 0!==e.key}(a)&&(s=""+a.key),function(e){if(I.call(e,"ref")){var a=Object.getOwnPropertyDescriptor(e,"ref").get;if(a&&a.isReactWarning)return!1}return void 0!==e.ref}(a)&&(d=a.ref,function(e,a){if("string"==typeof e.ref&&S.current&&a&&S.current.stateNode!==a){var r=_(S.current.type);V[r]||(F('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref',_(S.current.type),e.ref),V[r]=!0)}}(a,t)),a)I.call(a,o)&&!T.hasOwnProperty(o)&&(i[o]=a[o]);if(e&&e.defaultProps){var c=e.defaultProps;for(o in c)void 0===i[o]&&(i[o]=c[o])}if(s||d){var l="function"==typeof e?e.displayName||e.name||"Unknown":e;s&&function(e,a){var r=function(){x||(x=!0,F("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",a))};r.isReactWarning=!0,Object.defineProperty(e,"key",{get:r,configurable:!0})}(i,l),d&&function(e,a){var r=function(){E||(E=!0,F("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",a))};r.isReactWarning=!0,Object.defineProperty(e,"ref",{get:r,configurable:!0})}(i,l)}return O(e,s,d,t,n,S.current,i)}var B,D=w.ReactCurrentOwner;function U(e){L=e}function W(e){return"object"==typeof e&&null!==e&&e.$$typeof===n}function P(){if(D.current){var e=_(D.current.type);if(e)return"\n\nCheck the render method of `"+e+"`."}return""}w.ReactDebugCurrentFrame,B=!1;var Z={};function H(e,a){if(e._store&&!e._store.validated&&null==e.key){e._store.validated=!0;var r=function(e){var a=P();if(!a){var r="string"==typeof e?e:e.displayName||e.name;r&&(a="\n\nCheck the top-level render call using <"+r+">.")}return a}(a);if(!Z[r]){Z[r]=!0;var n="";e&&e._owner&&e._owner!==D.current&&(n=" It was passed a child from "+_(e._owner.type)+"."),U(e),F('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',r,n),U(null)}}}function q(e,a){if("object"==typeof e)if(Array.isArray(e))for(var r=0;r<e.length;r++){var n=e[r];W(n)&&H(n,a)}else if(W(e))e._store&&(e._store.validated=!0);else if(e){var t=function(e){if(null===e||"object"!=typeof e)return null;var a=b&&e[b]||e[R];return"function"==typeof a?a:null}(e);if("function"==typeof t&&t!==e.entries)for(var o,i=t.call(e);!(o=i.next()).done;)W(o.value)&&H(o.value,a)}}function G(e){var a,r=e.type;if(null!=r&&"string"!=typeof r){if("function"==typeof r)a=r.propTypes;else{if("object"!=typeof r||r.$$typeof!==c&&r.$$typeof!==m)return;a=r.propTypes}if(a){var n=_(r);!function(e,a,r,n,t){var o=Function.call.bind(Object.prototype.hasOwnProperty);for(var i in e)if(o(e,i)){var s=void 0;try{if("function"!=typeof e[i]){var d=Error((n||"React class")+": "+r+" type `"+i+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof e[i]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw d.name="Invariant Violation",d}s=e[i](a,i,n,r,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(e){s=e}!s||s instanceof Error||(j(t),F("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",n||"React class",r,i,typeof s),j(null)),s instanceof Error&&!(s.message in z)&&(z[s.message]=!0,j(t),F("Failed %s type: %s",r,s.message),j(null))}}(a,e.props,"prop",n,e)}else if(void 0!==r.PropTypes&&!B){B=!0,F("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",_(r)||"Unknown")}"function"!=typeof r.getDefaultProps||r.getDefaultProps.isReactClassApproved||F("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function $(e,a,t,k,b,R){var w=function(e){return"string"==typeof e||"function"==typeof e||!(e!==r.Fragment&&e!==i&&e!==g&&e!==o&&e!==l&&e!==u&&e!==y&&!A)||"object"==typeof e&&null!==e&&(e.$$typeof===f||e.$$typeof===m||e.$$typeof===s||e.$$typeof===d||e.$$typeof===c||e.$$typeof===v||e.$$typeof===p||e[0]===h)}(e);if(!w){var C="";(void 0===e||"object"==typeof e&&null!==e&&0===Object.keys(e).length)&&(C+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var N,z=function(e){return void 0!==e?"\n\nCheck your code at "+e.fileName.replace(/^.*[\\\/]/,"")+":"+e.lineNumber+".":""}(b);C+=z||P(),null===e?N="null":Array.isArray(e)?N="array":void 0!==e&&e.$$typeof===n?(N="<"+(_(e.type)||"Unknown")+" />",C=" Did you accidentally export a JSX literal instead of a component?"):N=typeof e,F("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",N,C)}var L=Q(e,a,t,b,R);if(null==L)return L;if(w){var j=a.children;if(void 0!==j)if(k)if(Array.isArray(j)){for(var x=0;x<j.length;x++)q(j[x],e);Object.freeze&&Object.freeze(j)}else F("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else q(j,e)}return e===r.Fragment?function(e){for(var a=Object.keys(e.props),r=0;r<a.length;r++){var n=a[r];if("children"!==n&&"key"!==n){U(e),F("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",n),U(null);break}}null!==e.ref&&(U(e),F("Invalid attribute `ref` supplied to `React.Fragment`."),U(null))}(L):G(L),L}var J=function(e,a,r){return $(e,a,r,!1)},X=function(e,a,r){return $(e,a,r,!0)};r.jsx=J,r.jsxs=X}()});v.Fragment,v.jsx,v.jsxs;var g,y=e(function(e){"production"===process.env.NODE_ENV?e.exports=h:e.exports=v}),k=y.jsx,b=y.jsxs,R=y.Fragment,w=function(){return(w=Object.assign||function(e){for(var a,r=1,n=arguments.length;r<n;r++)for(var t in a=arguments[r])Object.prototype.hasOwnProperty.call(a,t)&&(e[t]=a[t]);return e}).apply(this,arguments)};!function(e){e.LARGEST_PROVIDERS="LARGEST_PROVIDERS",e.ALL_PROVIDERS="ALL_PROVIDERS"}(g||(g={}));var F=g,A={bg:{"largest-providers":"Largest providers","all-providers":"All providers",disclaimer:"The information above applies when you pay via bank transfer or ACH payments","how-we-collect-data":"Как събираме тези данни?","no-hidden-fees":"няма скрити такси","hidden-fees":"{{hiddenFee}} hiding in the rate",close:"Затваряне","what-makes-up-this-fee":"What makes up this fee","conversion-fees-details":"If you send {receiveAmountValue} {receiveAmountCurrency} using {providerName}, you'll pay {marketedFeesAmount} {totalCurrency} in transfer fees.","using-bad-conversion-rate":"{providerName} is using a conversion rate of <span>{conversionRate}</span> which is worse than the mid-market rate of <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is the same as the mid-market rate of <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is better than the mid-market rate of <a>{midmarketRate}</a>","this-adds-fees":"This adds {hiddenFeesAmount} {hiddenFeesCurrency} on top of your transfer fees.","only-charged-transfer-fees":"This means you're only charged for your transfer fees.","bringing-the-total":"Bringing the total fee for your transfer to <span>{totalFeeValue} {totalFeeCurrency}</span>."},cs:{"largest-providers":"Largest providers","all-providers":"All providers",disclaimer:"The information above applies when you pay via bank transfer or ACH payments","how-we-collect-data":"Jak shromažďujeme tato data?","no-hidden-fees":"žádné skryté poplatky","hidden-fees":"{{hiddenFee}} hiding in the rate",close:"Zavřít","what-makes-up-this-fee":"What makes up this fee","conversion-fees-details":"If you send {receiveAmountValue} {receiveAmountCurrency} using {providerName}, you'll pay {marketedFeesAmount} {totalCurrency} in transfer fees.","using-bad-conversion-rate":"{providerName} is using a conversion rate of <span>{conversionRate}</span> which is worse than the mid-market rate of <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is the same as the mid-market rate of <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is better than the mid-market rate of <a>{midmarketRate}</a>","this-adds-fees":"This adds {hiddenFeesAmount} {hiddenFeesCurrency} on top of your transfer fees.","only-charged-transfer-fees":"This means you're only charged for your transfer fees.","bringing-the-total":"Bringing the total fee for your transfer to <span>{totalFeeValue} {totalFeeCurrency}</span>."},de:{"largest-providers":"Größte Anbieter","all-providers":"Alle Anbieter",disclaimer:"Die oben genannten Informationen gelten, wenn du per Banküberweisung oder ACH-Zahlung einzahlst","how-we-collect-data":"Wie ermitteln wir diese Daten?","no-hidden-fees":"keine versteckten Gebühren","hidden-fees":"Im Wechselkurs versteckte Gebühren: {hiddenFee}",close:"Schließen","what-makes-up-this-fee":"Wie sich diese Gebühr zusammensetzt","conversion-fees-details":"Wenn du {receiveAmountValue} {receiveAmountCurrency} mit {providerName} überweist, zahlst du dafür {marketedFeesAmount} {totalCurrency} an Überweisungsgebühren.","using-bad-conversion-rate":"{providerName} verwendet einen Wechselkurs von <span>{conversionRate}</span> – dieser Kurs ist schlechter als der Devisenmittelkurs, der bei <a>{midmarketRate}</a> liegt.","using-good-conversion-rate":"{providerName} verwendet einen Wechselkurs von <a>{conversionRate}</a> – dieser Kurs entspricht dem Devisenmittelkurs, der bei <a>{midmarketRate}</a> liegt","using-great-conversion-rate":"{providerName} verwendet einen Wechselkurs von <a>{conversionRate}</a> – dieser Kurs ist besser als der Devisenmittelkurs, der bei <a>{midmarketRate}</a> liegt","this-adds-fees":"Dadurch kommen zu deinen Überweisungsgebühren zusätzliche Kosten von {hiddenFeesAmount} {hiddenFeesCurrency} hinzu.","only-charged-transfer-fees":"Das bedeutet, dass du ausschließlich die angegebenen Überweisungsgebühren zahlst.","bringing-the-total":"Damit ändern sich die Gesamtkosten für deine Überweisung auf <span>{totalFeeValue} {totalFeeCurrency}</span>."},el:{"largest-providers":"Largest providers","all-providers":"All providers",disclaimer:"The information above applies when you pay via bank transfer or ACH payments","how-we-collect-data":"How do we collect this data?","no-hidden-fees":"χωρίς κρυφές χρεώσεις","hidden-fees":"{{hiddenFee}} hiding in the rate",close:"Κλείσιμο","what-makes-up-this-fee":"What makes up this fee","conversion-fees-details":"If you send {receiveAmountValue} {receiveAmountCurrency} using {providerName}, you'll pay {marketedFeesAmount} {totalCurrency} in transfer fees.","using-bad-conversion-rate":"{providerName} is using a conversion rate of <span>{conversionRate}</span> which is worse than the mid-market rate of <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is the same as the mid-market rate of <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is better than the mid-market rate of <a>{midmarketRate}</a>","this-adds-fees":"This adds {hiddenFeesAmount} {hiddenFeesCurrency} on top of your transfer fees.","only-charged-transfer-fees":"This means you're only charged for your transfer fees.","bringing-the-total":"Bringing the total fee for your transfer to <span>{totalFeeValue} {totalFeeCurrency}</span>."},en:{"largest-providers":"Largest providers","all-providers":"All providers",disclaimer:"The information above applies when you pay via bank transfer or ACH payments","how-we-collect-data":"How do we collect this data?","no-hidden-fees":"no hidden fees","hidden-fees":"{{hiddenFee}} hiding in the rate",close:"Close","what-makes-up-this-fee":"What makes up this fee","conversion-fees-details":"If you send {receiveAmountValue} {receiveAmountCurrency} using {providerName}, you'll pay {marketedFeesAmount} {totalCurrency} in transfer fees.","using-bad-conversion-rate":"{providerName} is using a conversion rate of <span>{conversionRate}</span> which is worse than the mid-market rate of <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is the same as the mid-market rate of <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is better than the mid-market rate of <a>{midmarketRate}</a>","this-adds-fees":"This adds {hiddenFeesAmount} {hiddenFeesCurrency} on top of your transfer fees.","only-charged-transfer-fees":"This means you're only charged for your transfer fees.","bringing-the-total":"Bringing the total fee for your transfer to <span>{totalFeeValue} {totalFeeCurrency}</span>."},es:{"largest-providers":"Los proveedores más grandes","all-providers":"Todos los proveedores",disclaimer:"La información anterior se aplica cuando se paga mediante transferencia bancaria o pagos ACH","how-we-collect-data":"¿Cómo recogemos esta información?","no-hidden-fees":"sin comisiones ocultas","hidden-fees":"{{hiddenFee}} ocultos en el tipo de cambio",close:"Cerrar","what-makes-up-this-fee":"En qué consiste esta comisión","conversion-fees-details":"Si tú envías {receiveAmountValue} {receiveAmountCurrency} usando {providerName}, pagarás {marketedFeesAmount} {totalCurrency} en comisiones por transferencia.","using-bad-conversion-rate":"{providerName} está usando un tipo de conversión de <span>{conversionRate}</span> , que es peor que el tipo de cambio real del mercado de <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} está usando un tipo de conversión de <a>{conversionRate}</a> , que es el mismo que el tipo de cambio real del mercado de <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} está usando un tipo de conversión de <a>{conversionRate}</a> , que es mejor que el tipo de cambio real del mercado de <a>{midmarketRate}</a>","this-adds-fees":"Esto añade {hiddenFeesAmount} {hiddenFeesCurrency} además de las comisiones de tu transferencia.","only-charged-transfer-fees":"Esto significa que solo se te cobra la comisión de tu transferencia.","bringing-the-total":"Siendo el total de la comisión de tu transferencia <span>{totalFeeValue} {totalFeeCurrency}</span>."},fr:{"largest-providers":"Les plus grands prestataires","all-providers":"Tous les prestataires",disclaimer:"Les informations ci-dessus s'appliquent lorsque vous payez par virement bancaire ou paiements ACH","how-we-collect-data":"Comment collectons-nous ces données ?","no-hidden-fees":"pas de frais cachés","hidden-fees":"{{hiddenFee}} caché dans le taux de change",close:"Fermer","what-makes-up-this-fee":"De quoi se compose ces frais","conversion-fees-details":"Si vous envoyez {receiveAmountValue} {receiveAmountCurrency} avec {providerName}, vous payerez des frais de transferts s'élevant à {marketedFeesAmount} {totalCurrency}.","using-bad-conversion-rate":"{providerName} utilise un taux de conversion de <span>{conversionRate}</span>, ce qui est moins avantageux que le taux moyen du marché de <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} utilise un taux de conversion de <a>{conversionRate}</a>, ce qui est identique au taux moyen du marché de <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} utilise un taux de conversion de <a>{conversionRate}</a>, ce qui est plus avantageux que le taux moyen du marché de <a>{midmarketRate}</a>","this-adds-fees":"Cela ajoute {hiddenFeesAmount} {hiddenFeesCurrency} supplémentaires, en plus de vos frais de transfert.","only-charged-transfer-fees":"Cela signifie que vous ne payez que vos frais de transfert.","bringing-the-total":"Les frais totaux de votre transfert seront donc de <span>{totalFeeValue}</span>."},hu:{"largest-providers":"A legnagyobb szolgáltatók","all-providers":"Minden szolgáltató",disclaimer:"A fenti információ akkor érvényes, ha banki átutalással vagy ACH elektronikus utalással fizetsz","how-we-collect-data":"Hogyan gyűjtjük össze ezeket az adatokat?","no-hidden-fees":"nincsenek rejtett költségek","hidden-fees":"{{hiddenFee}} rejtőzik az árfolyamban",close:"Bezárás","what-makes-up-this-fee":"Miből tevődik össze ez a díj","conversion-fees-details":"Ha {receiveAmountValue} {receiveAmountCurrency} összeget küldesz a(z) {providerName} szolgáltatóval, az utalás díja {marketedFeesAmount} {totalCurrency} lesz.","using-bad-conversion-rate":"A(z) {providerName} szolgáltató átváltási árfolyama <span>{conversionRate}</span>, mely rosszabb, mint a piaci középárfolyam (<a>{midmarketRate}</a>).","using-good-conversion-rate":"A(z) {providerName} szolgáltató átváltási árfolyama <a>{conversionRate}</a>, mely megegyezik a piaci középárfolyammal (<a>{midmarketRate}</a>).","using-great-conversion-rate":"A(z) {providerName} szolgáltató átváltási árfolyama <a>{conversionRate}</a>, mely jobb, mint a piaci középárfolyam (<a>{midmarketRate}</a>).","this-adds-fees":"Ezzel további {hiddenFeesAmount} {hiddenFeesCurrency} díjat fizetsz az utalás díján felül.","only-charged-transfer-fees":"Ez azt jelenti, hogy csak az utalás díját kell kifizetned.","bringing-the-total":"Az utalásod díja így összesen <span>{totalFeeValue} {totalFeeCurrency}</span>."},id:{"largest-providers":"Penyedia terbesar","all-providers":"Semua penyedia",disclaimer:"Informasi di atas berlaku saat Anda membayar melalui transfer bank atau pembayaran ACH","how-we-collect-data":"Bagaimana kami mengumpulkan data ini?","no-hidden-fees":"tanpa biaya tersembunyi","hidden-fees":"{{hiddenFee}} bersembunyi dalam nilai tukar",close:"Tutup","what-makes-up-this-fee":"Biaya ini terdiri dari apa saja","conversion-fees-details":"Jika Anda mengirim {receiveAmountValue} {receiveAmountCurrency} menggunakan {providerName}, Anda akan membayar {marketedFeesAmount} {totalCurrency} untuk biaya transfer. ","using-bad-conversion-rate":"{providerName} menggunakan nilai tukar konversi <span>{conversionRate}</span> yang lebih buruk dari nilai tukar nyata dari <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} menggunakan nilai tukar konversi <a>{conversionRate}</a> yang sama dengan nilai tukar nyata dari <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} menggunakan nilai tukar konversi <a>{conversionRate}</a> yang lebih baik dari nilai tukar nyata dari <a>{midmarketRate}</a>","this-adds-fees":"Ini menambahkan {hiddenFeesAmount} {hiddenFeesCurrency} di atas biaya transfer Anda.","only-charged-transfer-fees":"Ini berarti Anda hanya dikenakan biaya transfer.","bringing-the-total":"Menjadikan total biaya untuk transfer Anda <span>{totalFeeValue} {totalFeeCurrency}</span>."},it:{"largest-providers":"Maggiori operatori","all-providers":"Tutti i fornitori",disclaimer:"L'informazione riportata sopra è applicabile quando paghi tramite bonifico bancario o ACH","how-we-collect-data":"Come raccogliamo questi dati?","no-hidden-fees":"nessun costo nascosto","hidden-fees":"{{hiddenFee}} nascosti nel tasso di cambio",close:"Chiudi","what-makes-up-this-fee":"Come si compone questa commissione","conversion-fees-details":"Se invii {receiveAmountValue} {receiveAmountCurrency} usando {providerName}, pagherai {marketedFeesAmount} {totalCurrency} di commissioni di trasferimento.","using-bad-conversion-rate":"{providerName} sta usando un tasso di conversione di <span>{conversionRate}</span>, che è peggiore del tasso medio di mercato di <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} sta usando un tasso di conversione di <span>{conversionRate}</span>, che è pari al tasso medio di mercato di <a>{midmarketRate}</a>.","using-great-conversion-rate":"{providerName} sta usando un tasso di conversione di <span>{conversionRate}</span>, che è migliore del tasso medio di mercato di <a>{midmarketRate}</a>.","this-adds-fees":"Questo aggiunge {hiddenFeesAmount} {hiddenFeesCurrency} alle tue commissioni di trasferimento.","only-charged-transfer-fees":"Questo vuol dire che ti vengono addebitate solo le commissioni di trasferimento.","bringing-the-total":"Portando il totale delle commissioni per il tuo trasferimento a <span>{totalFeeValue}{totalFeeCurrency}</span>."},ja:{"largest-providers":"最大のプロバイダ","all-providers":"全てのプロバイダ",disclaimer:"※上記情報は、銀行振り込みまたは、ACHでの支払いの場合となります。","how-we-collect-data":"データの収集方法について","no-hidden-fees":"隠れコストはありません","hidden-fees":"レートに{{hiddenFee}} が隠れています",close:"閉じる","what-makes-up-this-fee":"この料金には何が含まれますか？","conversion-fees-details":"{{providerName}} を使用して{receiveAmountValue} {receiveAmountCurrency} を送金する場合、{{marketedFeesAmount} {totalCurrency} の手数料を支払うことになります。","using-bad-conversion-rate":"{providerName} は、<span>{conversionRate}</span> の両替レートを使用していますが、これは<a>{midmarketRate}</a> のミッドマーケットレートよりも悪いです。","using-good-conversion-rate":"{providerName} は<a>{conversionRate}</a> の両替レートを使用しており、<a>{midmarketRate}</a> のミッドマーケットレートと同じです。","using-great-conversion-rate":"{providerName} は、<a>{conversionRate}</a> の両替レートを使用していますが、これは<a>{midmarketRate}</a> のミッドマーケットレートよりも良いです","this-adds-fees":"これにより、{hiddenFeesAmount} {hiddenFeesCurrency} が送金手数料に加算されます。","only-charged-transfer-fees":"つまり、送金手数料のみが請求されます。","bringing-the-total":"送金にかかる手数料の合計は<span>{totalFeeValue} {totalFeeCurrency}</span> になります。"},nl:{"largest-providers":"Largest providers","all-providers":"All providers",disclaimer:"The information above applies when you pay via bank transfer or ACH payments","how-we-collect-data":"Hoe verzamelen wij deze gegevens?","no-hidden-fees":"geen verborgen kosten","hidden-fees":"{{hiddenFee}} hiding in the rate",close:"Sluiten","what-makes-up-this-fee":"What makes up this fee","conversion-fees-details":"If you send {receiveAmountValue} {receiveAmountCurrency} using {providerName}, you'll pay {marketedFeesAmount} {totalCurrency} in transfer fees.","using-bad-conversion-rate":"{providerName} is using a conversion rate of <span>{conversionRate}</span> which is worse than the mid-market rate of <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is the same as the mid-market rate of <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is better than the mid-market rate of <a>{midmarketRate}</a>","this-adds-fees":"This adds {hiddenFeesAmount} {hiddenFeesCurrency} on top of your transfer fees.","only-charged-transfer-fees":"This means you're only charged for your transfer fees.","bringing-the-total":"Bringing the total fee for your transfer to <span>{totalFeeValue} {totalFeeCurrency}</span>."},no:{"largest-providers":"Largest providers","all-providers":"All providers",disclaimer:"The information above applies when you pay via bank transfer or ACH payments","how-we-collect-data":"How do we collect this data?","no-hidden-fees":"ingen skjulte gebyrer","hidden-fees":"{{hiddenFee}} hiding in the rate",close:"Lukk","what-makes-up-this-fee":"What makes up this fee","conversion-fees-details":"If you send {receiveAmountValue} {receiveAmountCurrency} using {providerName}, you'll pay {marketedFeesAmount} {totalCurrency} in transfer fees.","using-bad-conversion-rate":"{providerName} is using a conversion rate of <span>{conversionRate}</span> which is worse than the mid-market rate of <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is the same as the mid-market rate of <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is better than the mid-market rate of <a>{midmarketRate}</a>","this-adds-fees":"This adds {hiddenFeesAmount} {hiddenFeesCurrency} on top of your transfer fees.","only-charged-transfer-fees":"This means you're only charged for your transfer fees.","bringing-the-total":"Bringing the total fee for your transfer to <span>{totalFeeValue} {totalFeeCurrency}</span>."},pl:{"largest-providers":"Largest providers","all-providers":"All providers",disclaimer:"Powyższe informacje nie obowiązują, jeżeli płacisz za pomocą przelewu bankowego lub polecenia zapłaty ACH","how-we-collect-data":"Jak zbieramy dane?","no-hidden-fees":"zero ukrytych opłat","hidden-fees":"{{hiddenFee}} hiding in the rate",close:"Zamknij","what-makes-up-this-fee":"What makes up this fee","conversion-fees-details":"If you send {receiveAmountValue} {receiveAmountCurrency} using {providerName}, you'll pay {marketedFeesAmount} {totalCurrency} in transfer fees.","using-bad-conversion-rate":"{providerName} is using a conversion rate of <span>{conversionRate}</span> which is worse than the mid-market rate of <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is the same as the mid-market rate of <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is better than the mid-market rate of <a>{midmarketRate}</a>","this-adds-fees":"This adds {hiddenFeesAmount} {hiddenFeesCurrency} on top of your transfer fees.","only-charged-transfer-fees":"This means you're only charged for your transfer fees.","bringing-the-total":"Bringing the total fee for your transfer to <span>{totalFeeValue} {totalFeeCurrency}</span>."},pt:{"largest-providers":"Maiores prestadores de serviço","all-providers":"Todas os prestadores de serviço",disclaimer:"A informação acima se aplica quando você paga por transferência bancária ou por débito bancário (ACH)","how-we-collect-data":"Como coletamos esses dados?","no-hidden-fees":"sem tarifas ocultas","hidden-fees":"{{hiddenFee}} ocultos na tarifa",close:"Fechar","what-makes-up-this-fee":"O que constitui esta tarifa","conversion-fees-details":"Se você enviar {receiveAmountValue} {receiveAmountCurrency} usando {providerName}, pagará {marketedFeesAmount} {totalCurrency} em tarifas de transferência.","using-bad-conversion-rate":"{providerName} está usando uma taxa de conversão de <span>{conversionRate}</span> que é pior que a taxa de câmbio comercial de <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} está usando uma taxa de conversão de <span>{conversionRate}</span> que é igual à taxa de câmbio comercial de <a>{midmarketRate}</a>.","using-great-conversion-rate":"{providerName} está usando uma taxa de conversão de <span>{conversionRate}</span> que é melhor que a taxa de câmbio comercial de <a>{midmarketRate}</a>.","this-adds-fees":"Isso adicional {hiddenFeesAmount} {hiddenFeesCurrency} às tarifas da sua transferência.","only-charged-transfer-fees":"Isso significa que você só paga pelas tarifas da transferência.","bringing-the-total":"Fazendo com que as tarifas da sua transferência totalizem <span>{totalFeeValue} {totalFeeCurrency}</span>."},ro:{"largest-providers":"Cei mai mari furnizori","all-providers":"Toți furnizorii",disclaimer:"Informațiile de mai sus se aplică atunci când plătești prin transfer bancar sau prin plăți ACH","how-we-collect-data":"Cum colectăm aceste date?","no-hidden-fees":"fără taxe ascunse","hidden-fees":"{{hiddenFee}} ascunzându-se în rată",close:"Închide","what-makes-up-this-fee":"Din ce se compune această taxă","conversion-fees-details":"Dacă trimiți {receiveAmountValue} {receiveAmountCurrency} folosind {providerName}, vei plăti {marketedFeesAmount} {totalCurrency} ca taxe de transfer.","using-bad-conversion-rate":"{providerName} folosește o rată de schimb de <span>{conversionRate}</span> care este mai rea decât rata medie a pieței de <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} folosește o rată de schimb de <a>{conversionRate}</a> care este aceeași ca rata medie a pieței de <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} folosește o rată de schimb de <a>{conversionRate}</a> care este mai bună decât rata medie a pieței de <a>{midmarketRate}</a>","this-adds-fees":"Asta adaugă {hiddenFeesAmount} {hiddenFeesCurrency} peste taxele transferului tău.","only-charged-transfer-fees":"Asta înseamnă că ți se încasează numai taxele transferului tău.","bringing-the-total":"Aducând taxa totală a transferului tău la <span>{totalFeeValue} {totalFeeCurrency}</span>."},ru:{"largest-providers":"Крупнейшие провайдеры","all-providers":"Все провайдеры",disclaimer:"Приведенная выше информация применима при оплате банковским переводом или прямым дебетованием ACH","how-we-collect-data":"Откуда мы получаем данные?","no-hidden-fees":"без скрытых комиссий","hidden-fees":"{{hiddenFee}} прячется в обменном курсе",close:"Закрыть","what-makes-up-this-fee":"Что именно входит в этот комиссионный сбор","conversion-fees-details":"Если Вы отправите {receiveAmountValue} {receiveAmountCurrency} с помощью {providerName}, Вы заплатите {marketedFeesAmount} {totalCurrency} в качестве комиссии за перевод.","using-bad-conversion-rate":"{providerName} использует коэффициент конверсии <span>{conversionRate}</span>, что хуже, чем средний рыночный коэффициент <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} использует коэффициент конверсии <a>{conversionRate}</a>, что совпадает со среднерыночным коэффициентом <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} использует коэффициент конверсии <a>{conversionRate}</a>, что лучше, чем средний рыночный коэффициент <a>{midmarketRate}</a>","this-adds-fees":"Это добавляет {hiddenFeesAmount} {hiddenFeesCurrency} к Вашей комиссии за перевод.","only-charged-transfer-fees":"Это означает, что с Вас взимается только комиссия за перевод.","bringing-the-total":"Доведение общей комиссии за перевод до <span>{totalFeeValue} {totalFeeCurrency}</span>."},sk:{"largest-providers":"Largest providers","all-providers":"All providers",disclaimer:"The information above applies when you pay via bank transfer or ACH payments","how-we-collect-data":"How do we collect this data?","no-hidden-fees":"no hidden fees","hidden-fees":"{{hiddenFee}} hiding in the rate",close:"Close","what-makes-up-this-fee":"What makes up this fee","conversion-fees-details":"If you send {receiveAmountValue} {receiveAmountCurrency} using {providerName}, you'll pay {marketedFeesAmount} {totalCurrency} in transfer fees.","using-bad-conversion-rate":"{providerName} is using a conversion rate of <span>{conversionRate}</span> which is worse than the mid-market rate of <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is the same as the mid-market rate of <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is better than the mid-market rate of <a>{midmarketRate}</a>","this-adds-fees":"This adds {hiddenFeesAmount} {hiddenFeesCurrency} on top of your transfer fees.","only-charged-transfer-fees":"This means you're only charged for your transfer fees.","bringing-the-total":"Bringing the total fee for your transfer to <span>{totalFeeValue} {totalFeeCurrency}</span>."},sv:{"largest-providers":"Largest providers","all-providers":"All providers",disclaimer:"The information above applies when you pay via bank transfer or ACH payments","how-we-collect-data":"Hur samlar vi in dessa data?","no-hidden-fees":"inga dolda avgifter","hidden-fees":"{{hiddenFee}} hiding in the rate",close:"Stäng","what-makes-up-this-fee":"What makes up this fee","conversion-fees-details":"If you send {receiveAmountValue} {receiveAmountCurrency} using {providerName}, you'll pay {marketedFeesAmount} {totalCurrency} in transfer fees.","using-bad-conversion-rate":"{providerName} is using a conversion rate of <span>{conversionRate}</span> which is worse than the mid-market rate of <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is the same as the mid-market rate of <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is better than the mid-market rate of <a>{midmarketRate}</a>","this-adds-fees":"This adds {hiddenFeesAmount} {hiddenFeesCurrency} on top of your transfer fees.","only-charged-transfer-fees":"This means you're only charged for your transfer fees.","bringing-the-total":"Bringing the total fee for your transfer to <span>{totalFeeValue} {totalFeeCurrency}</span>."},tr:{"largest-providers":"Largest providers","all-providers":"All providers",disclaimer:"Yukarıdaki bilgiler banka transferi ya da ACH ödemelerinde geçerlidir","how-we-collect-data":"Bu verileri nasıl toplarız?","no-hidden-fees":"gizli ücretler yok","hidden-fees":"{{hiddenFee}} hiding in the rate",close:"Kapat","what-makes-up-this-fee":"What makes up this fee","conversion-fees-details":"If you send {receiveAmountValue} {receiveAmountCurrency} using {providerName}, you'll pay {marketedFeesAmount} {totalCurrency} in transfer fees.","using-bad-conversion-rate":"{providerName} is using a conversion rate of <span>{conversionRate}</span> which is worse than the mid-market rate of <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is the same as the mid-market rate of <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is better than the mid-market rate of <a>{midmarketRate}</a>","this-adds-fees":"This adds {hiddenFeesAmount} {hiddenFeesCurrency} on top of your transfer fees.","only-charged-transfer-fees":"This means you're only charged for your transfer fees.","bringing-the-total":"Bringing the total fee for your transfer to <span>{totalFeeValue} {totalFeeCurrency}</span>."},uk:{"largest-providers":"Largest providers","all-providers":"All providers",disclaimer:"The information above applies when you pay via bank transfer or ACH payments","how-we-collect-data":"Як ми збираємо ці дані?","no-hidden-fees":"жодних прихованих комісій","hidden-fees":"{{hiddenFee}} hiding in the rate",close:"Закрити","what-makes-up-this-fee":"What makes up this fee","conversion-fees-details":"If you send {receiveAmountValue} {receiveAmountCurrency} using {providerName}, you'll pay {marketedFeesAmount} {totalCurrency} in transfer fees.","using-bad-conversion-rate":"{providerName} is using a conversion rate of <span>{conversionRate}</span> which is worse than the mid-market rate of <a>{midmarketRate}</a>.","using-good-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is the same as the mid-market rate of <a>{midmarketRate}</a>","using-great-conversion-rate":"{providerName} is using a conversion rate of <a>{conversionRate}</a> which is better than the mid-market rate of <a>{midmarketRate}</a>","this-adds-fees":"This adds {hiddenFeesAmount} {hiddenFeesCurrency} on top of your transfer fees.","only-charged-transfer-fees":"This means you're only charged for your transfer fees.","bringing-the-total":"Bringing the total fee for your transfer to <span>{totalFeeValue} {totalFeeCurrency}</span>."},zh:{"largest-providers":"最大的匯款代理","all-providers":"所有匯款代理",disclaimer:"以上資訊適用於銀行轉帳或ACH付款","how-we-collect-data":"我們如何收集這些數據？","no-hidden-fees":"絕無隱藏收費","hidden-fees":"{{hiddenFee}}隱藏在匯率中",close:"關閉","what-makes-up-this-fee":"這筆費用包含什麽","conversion-fees-details":"如果你使用{providerName}匯送{receiveAmountValue} {receiveAmountCurrency}，你將支付{marketedFeesAmount} {totalCurrency}的手續費。","using-bad-conversion-rate":"{providerName}使用的匯率為<span>{conversionRate}</span>，比市場匯率中間價<a>{midmarketRate}</a>較差。","using-good-conversion-rate":"{providerName}使用的匯率為<a>{conversionRate}</a>，跟市場匯率中間價<a>{midmarketRate}</a>一樣。","using-great-conversion-rate":"{providerName}使用的匯率為<a>{conversionRate}</a>，比市場匯率中間價<a>{midmarketRate}</a>較好。","this-adds-fees":"這會在你的匯款手續費上額外添加{hiddenFeesAmount} {hiddenFeesCurrency}。","only-charged-transfer-fees":"這代表你只需支付匯款的手續費。","bringing-the-total":"你的匯款總費用為<span>{totalFeeValue} {totalFeeCurrency}</span>。"}},C="provider-filter-toggle__toggle-container_uUKR3iyKYl",N="provider-filter-toggle__left-button_2MbLCfFOjh",_="provider-filter-toggle__right-button_9I_KjBagye",z="provider-filter-toggle__active-button_11HQ1jCweO";d(".provider-filter-toggle__toggle-container_uUKR3iyKYl{display:flex;position:relative;align-items:center;justify-content:center;width:105%;min-height:70px;border-radius:3px;background-color:#fff;box-shadow:-10px 0 40px rgba(0,0,0,.05)}.provider-filter-toggle__left-button_2MbLCfFOjh{width:200px;border-right:none;border-radius:1px;background-color:#fff;color:#008ec0}.provider-filter-toggle__right-button_9I_KjBagye{width:200px;border-left:none;border-radius:1px;background-color:#fff;color:#008ec0}.provider-filter-toggle__active-button_11HQ1jCweO{width:200px;background-color:#008ec0;color:#fff}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNyYy90cmFuc2Zlci1mZWUtY29tcGFyaXNvbi9wcm92aWRlci1maWx0ZXItdG9nZ2xlL3Byb3ZpZGVyLWZpbHRlci10b2dnbGUubW9kdWxlLmxlc3MiLCJwcm92aWRlci1maWx0ZXItdG9nZ2xlLm1vZHVsZS5sZXNzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUVBLHFEQUNFLFlBQUEsQ0FDQSxpQkFBQSxDQUNBLGtCQUFBLENBQ0Esc0JBQUEsQ0FDQSxVQUFBLENBQ0EsZUFBQSxDQUNBLGlCQUFBLENBQ0EscUJBQUEsQ0FDQSx1Q0NERixDRElBLGdEQUNFLFdBQUEsQ0FDQSxpQkFBQSxDQUNBLGlCQUFBLENBQ0EscUJBQUEsQ0FDQSxhQ0ZGLENES0EsaURBQ0UsV0FBQSxDQUNBLGdCQUFBLENBQ0EsaUJBQUEsQ0FDQSxxQkFBQSxDQUNBLGFDSEYsQ0RNQSxrREFDRSxXQUFBLENBQ0Esd0JBQUEsQ0FDQSxVQ0pGIiwiZmlsZSI6InByb3ZpZGVyLWZpbHRlci10b2dnbGUubW9kdWxlLmxlc3MifQ== */");var L=function(e){var a=e.activeToggle,r=e.onToggle,n=e.locale;return k(i,w({messages:A[n],locale:n,defaultLocale:"en"},{children:b("div",w({className:C},{children:[k(o,w({className:[N,a===F.LARGEST_PROVIDERS?z:""],onClick:function(){a===F.ALL_PROVIDERS&&r(F.LARGEST_PROVIDERS)}},{children:k(s,{id:"largest-providers"},void 0)}),void 0),k(o,w({className:[_,a===F.ALL_PROVIDERS?z:""],onClick:function(){a===F.LARGEST_PROVIDERS&&r(F.ALL_PROVIDERS)}},{children:k(s,{id:"all-providers"},void 0)}),void 0)]}),void 0)}),void 0)},j="transfer-fee-comparison-footer__disclaimer_RrhKub9ZzR",x="transfer-fee-comparison-footer__link_3tt64ICIj4";d(".transfer-fee-comparison-footer__disclaimer_RrhKub9ZzR{background-color:transparent}.transfer-fee-comparison-footer__link_3tt64ICIj4{font-weight:800}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInNyYy90cmFuc2Zlci1mZWUtY29tcGFyaXNvbi90cmFuc2Zlci1mZWUtY29tcGFyaXNvbi1mb290ZXIvdHJhbnNmZXItZmVlLWNvbXBhcmlzb24tZm9vdGVyLm1vZHVsZS5sZXNzIiwidHJhbnNmZXItZmVlLWNvbXBhcmlzb24tZm9vdGVyLm1vZHVsZS5sZXNzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUVBLHVEQUNFLDRCQ0RGLENESUEsaURBQ0UsZUNGRiIsImZpbGUiOiJ0cmFuc2Zlci1mZWUtY29tcGFyaXNvbi1mb290ZXIubW9kdWxlLmxlc3MifQ== */");var E=function(e){var a=e.urlLocale,r=t("/"+a+"/compare/disclaimer");return k(c,w({messages:A,language:a,fallbackLanguage:"en"},{children:b("div",w({className:j},{children:[k(l,{children:"disclaimer"},void 0),". ",k("a",w({className:x,href:r},{children:k(l,{children:"how-we-collect-data"},void 0)}),void 0)]}),void 0)}),void 0)},V=function(e){return e.quotes,e.midmarketRate,e.urlLocale,e.locale,k(R,{children:"TransferFeeComparisonTable"},void 0)},S=function(e){var a=e.quotes,r=e.midmarketRate,n=e.providerFiltering,t=e.locale,o=e.urlLocale;return b("div",{children:[n.showToggle?k(L,{activeToggle:n.selectedOption,onToggle:n.onProviderFilteringOptionChange,locale:t},void 0):null,k(V,{quotes:a,midmarketRate:r,urlLocale:o,locale:t},void 0),k(E,{urlLocale:o},void 0)]},void 0)},I=function(e){var a=e.quotes,n=e.midmarketRate,t=e.locale,o=e.urlLocale,i=e.enableLargestProviderFiltering,s=e.requiredNumberOfLargestProviders,d=void 0===s?5:s,c=r(i?F.LARGEST_PROVIDERS:F.ALL_PROVIDERS),l=c[0],u=c[1],m=l===F.LARGEST_PROVIDERS&&f(a,o,d)?p(a,o):a;return k(S,{quotes:m,midmarketRate:n,providerFiltering:{showToggle:i,selectedOption:l,onProviderFilteringOptionChange:function(e){u(e)}},locale:t,urlLocale:o},void 0)};export{I as T,f as h};
-//# sourceMappingURL=TransferFeeComparisonContainer-9dd47854.js.map