@transferwise/components 0.0.0-experimental-3b84ee4 → 0.0.0-experimental-8a06fb3

package/build/index.mjs

@@ -2,7 +2,7 @@ import * as React from 'react';
 import React__default, { forwardRef, useId, cloneElement, useState, Component, Children, createContext, useContext, useRef, useEffect, useCallback, useSyncExternalStore, useImperativeHandle, createElement, useMemo, PureComponent, createRef, isValidElement, Fragment as Fragment$1 } from 'react';
 import classNames from 'classnames';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { ChevronUp, NavigateAway, CrossCircleFill, Cross, Plus, Check, Info as Info$1, Alert as Alert$1, ClockBorderless, Briefcase, Person, ArrowRight, Download, ChevronLeft, ChevronRight, AlertCircleFill, ArrowLeft, QuestionMarkCircle, Search, CrossCircle, ChevronDown, CheckCircleFill, ClockFill, Upload as Upload$2, Document, PlusCircle, Bin } from '@transferwise/icons';
+import { ChevronUp, NavigateAway, CrossCircleFill, Cross, Plus, ChevronDown, Check, Info as Info$1, Alert as Alert$1, ClockBorderless, Briefcase, Person, ArrowRight, Download, ChevronLeft, ChevronRight, AlertCircleFill, ArrowLeft, QuestionMarkCircle, Search, CrossCircle, CheckCircleFill, ClockFill, Upload as Upload$2, Document, PlusCircle, Bin } from '@transferwise/icons';
 import { useTheme, ThemeProvider } from '@wise/components-theming';
 import { defineMessages, useIntl, injectIntl, IntlProvider } from 'react-intl';
 import { CSSTransition } from 'react-transition-group';
@@ -1994,9 +1994,6 @@ function SelectOption({
   return /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/jsx(Option$2, {
       ref: rootRef,
-      "aria-haspopup": "dialog",
-      "aria-expanded": showOptions,
-      "aria-labelledby": ariaLabelledBy,
       showMediaAtAllSizes: true,
       disabled: disabled,
       decision: false,
@@ -2007,14 +2004,18 @@ function SelectOption({
       content: (hasSelected ? selected : placeholder).content,
       className: classNames('np-select-option', 'clickable', hasSelected ? 'np-select-option-selected' : 'np-select-option-placeholder', props.className),
       button: /*#__PURE__*/jsx("button", {
+        ...inputAttributes,
         type: "button",
         disabled: disabled,
-        className: "btn-unstyled",
+        "aria-labelledby": ariaLabelledBy,
+        "aria-haspopup": "dialog",
+        "aria-expanded": showOptions,
+        className: hasSelected ? 'btn-unstyled' : 'np-action-btn',
         "aria-label": hasSelected ? undefined : props['aria-label'],
         onClick: handleOnClick(true),
-        children: hasSelected ? /*#__PURE__*/jsx(Chevron, {}) : /*#__PURE__*/jsx(ActionButton, {
-          children: placeholder.actionLabel || intl.formatMessage(messages$c.actionLabel)
-        })
+        children: hasSelected ? /*#__PURE__*/jsx(ChevronDown, {
+          title: intl.formatMessage(messages$c.actionLabel)
+        }) : placeholder.actionLabel || intl.formatMessage(messages$c.actionLabel)
       })
     }), /*#__PURE__*/jsx(ResponsivePanel, {
       anchorWidth: true,