@transferwise/components 0.0.0-experimental-823d686 → 0.0.0-experimental-97410ac

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.
package/README.md CHANGED
@@ -10,17 +10,17 @@ This is the Neptune Web React component library. It uses [Neptune CSS](https://g
10
10
 
11
11
  Neptune Components are published to npm as [@transferwise/components](https://www.npmjs.com/package/@transferwise/components).
12
12
 
13
- Install `@transferwise/components` and its peer dependencies.
13
+ Install `@transferwise/components` and its peer dependencies. **Note:** currency-flags is only required if you're using the [Money Input](https://transferwise.github.io/neptune-web/components/MoneyInput) or if you're using flags on the [Select](https://transferwise.github.io/neptune-web/components/Select).
14
14
 
15
15
  ```
16
16
  # pnpm
17
- pnpm install @transferwise/components react react-dom prop-types @wise/art
17
+ pnpm install @transferwise/components react react-dom prop-types currency-flags
18
18
 
19
19
  # yarn
20
- yarn add @transferwise/components react react-dom prop-types @wise/art
20
+ yarn add @transferwise/components react react-dom prop-types currency-flags
21
21
 
22
22
  # npm
23
- npm install @transferwise/components react react-dom prop-types @wise/art
23
+ npm install @transferwise/components react react-dom prop-types currency-flags
24
24
  ```
25
25
 
26
26
  ```js
@@ -10578,6 +10578,7 @@ var messages$2 = defineMessages({
10578
10578
  }
10579
10579
  });
10580
10580
 
10581
+ // Option.tsx NEW
10581
10582
  function Option$1({
10582
10583
  label,
10583
10584
  currency = '',
@@ -10590,12 +10591,13 @@ function Option$1({
10590
10591
  const {
10591
10592
  isModern
10592
10593
  } = useTheme();
10594
+ const style = classes => classes.map(className => classNames[className] || className).join(' ');
10595
+ const currencyClassNames = currency ? style(['currency-flag', `currency-flag-${currency.toLowerCase()}`]) : undefined;
10593
10596
  const iconElement = icon ? /*#__PURE__*/cloneElement(icon, {
10594
10597
  size: 24,
10595
10598
  className: 'tw-icon'
10596
- }) : currency && /*#__PURE__*/jsx(Flag, {
10597
- code: currency.toLowerCase(),
10598
- intrinsicSize: 24
10599
+ }) : currency && /*#__PURE__*/jsx("i", {
10600
+ className: currencyClassNames
10599
10601
  });
10600
10602
  const titleAndNoteElement = /*#__PURE__*/jsxs(Body, {
10601
10603
  as: "span",