@transferwise/components 40.12.3 → 40.12.4

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [40.12.4](https://github.com/transferwise/neptune-web/compare/@transferwise/components@40.12.3...@transferwise/components@40.12.4) (2022-06-17)
+
+
+### Bug Fixes
+
+* **Select:** usage inside Field (dynamic-flows) ([#1486](https://github.com/transferwise/neptune-web/issues/1486)) ([5c5b895](https://github.com/transferwise/neptune-web/commit/5c5b895126219a2db58907af6299f3fa3891400a))
+
+
+
+
+
 ## [40.12.3](https://github.com/transferwise/neptune-web/compare/@transferwise/components@40.12.2...@transferwise/components@40.12.3) (2022-06-15)
 
 

package/build/es/no-polyfill/dimmer/Dimmer.js

@@ -1,6 +1,6 @@
 import classNames from"classnames";import{useCallback,useEffect,useRef}from"react";import CSSTransition from"react-transition-group/CSSTransition";import{addNoScrollBodyClass,removeNoScrollBodyClass}from"../common";import{isIosDevice}from"../common/deviceDetection";import FocusBoundary from"../common/focusBoundary";import withNextPortal from"../withNextPortal/withNextPortal";import DimmerManager from"./dimmerManager";import{jsx as _jsx}from"react/jsx-runtime";export var EXIT_ANIMATION=350;var dimmerManager=new DimmerManager;export var handleTouchMove=function(a){var b=a.target.classList.contains("dimmer");// disable scroll on iOS devices for Dimmer area
 // this is because of bug in WebKit https://bugs.webkit.org/show_bug.cgi?id=220908
 // note: scrolling still works for children(s) as expected
-isIosDevice()&&b&&(a.stopPropagation(),a.preventDefault())};var Dimmer=function(a){var b=a.children,c=a.className,d=a.disableClickToClose,e=a.fadeContentOnEnter,f=void 0!==e&&e,g=a.fadeContentOnExit,h=a.open,i=void 0!==h&&h,j=a.scrollable,k=a.transparent,l=void 0!==k&&k,m=a.onClose,n=useRef(null),o=function(a){a.target===n.current&&(null===m||void 0===m?void 0:m(a))},p=useCallback(function(a){"Escape"!==a.key||(a.stopPropagation(),m&&n.current&&dimmerManager.isTop(n.current)&&m(a))},[m]);return useEffect(function(){var a=n.current;return i&&(document.addEventListener("keydown",p),null===a||void 0===a?void 0:a.addEventListener("touchmove",handleTouchMove)),function(){document.removeEventListener("keydown",p),null===a||void 0===a?void 0:a.removeEventListener("touchmove",handleTouchMove)}},[p,i]),/*#__PURE__*/_jsx(CSSTransition,{in:i,appear:!0// Wait for animation to finish before unmount.
+isIosDevice()&&b&&(a.stopPropagation(),a.preventDefault())};var Dimmer=function(a){var b=a.children,c=a.className,d=a.disableClickToClose,e=a.fadeContentOnEnter,f=void 0!==e&&e,g=a.fadeContentOnExit,h=a.open,i=void 0!==h&&h,j=a.scrollable,k=a.transparent,l=void 0!==k&&k,m=a.onClose,n=useRef(null),o=function(a){a.target===n.current&&(null===m||void 0===m?void 0:m(a))},p=useCallback(function(a){"Escape"!==a.key||(a.stopPropagation(),m&&n.current&&dimmerManager.isTop(n.current)&&m(a))},[m]);return useEffect(function(){var a=n.current;return i&&(document.addEventListener("keydown",p),null===a||void 0===a?void 0:a.addEventListener("touchmove",handleTouchMove,{passive:!0})),function(){document.removeEventListener("keydown",p),null===a||void 0===a?void 0:a.removeEventListener("touchmove",handleTouchMove)}},[p,i]),/*#__PURE__*/_jsx(CSSTransition,{in:i,appear:!0// Wait for animation to finish before unmount.
 ,timeout:{enter:0,exit:EXIT_ANIMATION},classNames:{enter:classNames({"dimmer--enter-fade":f}),enterDone:classNames("dimmer--enter-done",{"dimmer--enter-fade":f}),exit:classNames("dimmer--exit",{"dimmer--exit-fade":void 0!==g&&g})},unmountOnExit:!0,onEnter:function onEnter(){n.current&&dimmerManager.add(n.current)},onExited:function onExited(){n.current&&dimmerManager.remove(n.current)},children:/*#__PURE__*/_jsx(DimmerContentWrapper,{scrollBody:!l,children:/*#__PURE__*/_jsx("div",{ref:n,className:classNames("dimmer",{"dimmer--scrollable":void 0!==j&&j,"dimmer--transparent":l},c),role:"presentation",onClick:function handleClick(a){void 0!==d&&d||!m||o(a)},children:/*#__PURE__*/_jsx(FocusBoundary,{children:b})})})})};export var DimmerContentWrapper=function(a){var b=a.children,c=a.scrollBody;return useEffect(function(){return c&&addNoScrollBodyClass(),function(){c&&removeNoScrollBodyClass()}},[c]),b};// Export without the Portal for tests only
 export{Dimmer};export default withNextPortal(Dimmer);

package/build/es/no-polyfill/select/Select.js

@@ -1,12 +1,11 @@
 import _defineProperty from"@babel/runtime/helpers/defineProperty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import classNames from"classnames";import PropTypes from"prop-types";import{useState,useEffect,useRef}from"react";import{useIntl}from"react-intl";import Button from"../button";import Chevron from"../chevron";import{Position}from"../common";import BottomSheet from"../common/bottomSheet";import{stopPropagation}from"../common/domHelpers";import{useLayout}from"../common/hooks";import KeyCodes from"../common/keyCodes";import Panel from"../common/panel";import Drawer from"../drawer";import messages from"./Select.messages";import Option from"./option";import SearchBox from"./searchBox";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var DEFAULT_SEARCH_VALUE="",DEFAULT_OPTIONS_PAGE_SIZE=100,includesString=function(a,b){return a.toLowerCase().includes(b.toLowerCase())};function defaultFilterFunction(a,b){if(isPlaceholderOption(a))return!0;var c=a.label,d=a.note,e=a.secondary,f=a.currency,g=a.searchStrings;return!!c&&includesString(c,b)||!!d&&includesString(d,b)||!!e&&includesString(e,b)||!!f&&includesString(f,b)||!!g&&g.some(function(a){return includesString(a,b)})}function isActionableOption(a){return!a.header&&!a.separator&&!a.disabled}function isHeaderOption(a){return null!==a&&"header"in a}function isSparatorOption(a){return null!==a&&"separator"in a}/**
  * No option or placeholder option is selected
- */var DEFAULT_SELECTED_OPTION=null;function isPlaceholderOption(a){return a===DEFAULT_SELECTED_OPTION||"placeholder"in a}export default function Select(a){function b(){if(null!==U){var a=ha().filter(isActionableOption);e(a[U])}}function c(a){var b=ha().filter(isActionableOption),c=b.reduce(function(a,b,c){return null===a?k(v,b)?c:null:a},null),d=null===W.current||void 0===W.current?-1:W.current,e=d;null===d&&null===c&&V(0),null===d&&null!==c&&(e=c);var f=e+a,g=Math.max(Math.min(0,b.length-1),f);V(g)}function d(a){return function(b){stopPropagation(b),e(a)}}function e(a){x(isPlaceholderOption(a)?DEFAULT_SELECTED_OPTION:a),ja()}// eslint-disable-next-line react/prop-types
-function f(a){var b,c=a.className,d=classNames(K("np-dropdown-menu"),(b={},_defineProperty(b,K("np-dropdown-menu-desktop"),!ga),_defineProperty(b,K("np-dropdown-menu-".concat(r)),!ga&&!ea),b),K(c));return/*#__PURE__*/_jsxs("ul",_objectSpread(_objectSpread({ref:ca,id:"".concat(n,"-listbox"),role:"listbox",tabIndex:"-1",className:d},G),{},{children:[!o&&!da&&null!==m&&/*#__PURE__*/_jsx(h,{}),da&&/*#__PURE__*/_jsx(SearchBox,{ref:_,classNames:E,value:C||Q,placeholder:D||J(messages.searchPlaceholder),onChange:ia,onClick:stopPropagation}),ha().slice(0,Z).map(ka),Z<ha().length&&/*#__PURE__*/_jsx(g,{})]}))}function g(){function a(a){stopPropagation(a),$(Z+DEFAULT_OPTIONS_PAGE_SIZE)}return/*#__PURE__*/ (/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */_jsx("li",{className:classNames(K("clickable"),K("border-bottom"),K("show-more")),onClick:a,onKeyPress:a,children:/*#__PURE__*/_jsx("a",{children:"..."})}))}function h(){var a={placeholder:m};return/*#__PURE__*/ (/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */_jsx("li",{className:classNames(K("clickable"),K("border-bottom")),onClick:d(a),onKeyPress:d(a),children:/*#__PURE__*/_jsx("a",{children:m})}))}// eslint-disable-next-line react/prop-types
+ */var DEFAULT_SELECTED_OPTION=null;function isPlaceholderOption(a){return a===DEFAULT_SELECTED_OPTION||"placeholder"in a}export default function Select(a){function b(){if(null!==U){var a=ha().filter(isActionableOption);e(a[U])}}function c(a){var b=ha().filter(isActionableOption),c=b.reduce(function(a,b,c){return null===a?k(v,b)?c:null:a},null),d=null===W.current||void 0===W.current?-1:W.current,e=d;null===d&&null===c&&V(0),null===d&&null!==c&&(e=c);var f=e+a,g=Math.max(Math.min(0,b.length-1),f);V(g)}function d(a){return function(b){stopPropagation(b),e(a)}}function e(a){x(isPlaceholderOption(a)?DEFAULT_SELECTED_OPTION:a),ja()}function f(){var a,b=0<arguments.length&&void 0!==arguments[0]?arguments[0]:{},c=b.className,d=classNames(K("np-dropdown-menu"),(a={},_defineProperty(a,K("np-dropdown-menu-desktop"),!ga),_defineProperty(a,K("np-dropdown-menu-".concat(r)),!ga&&!ea),a),K(c)),e=ha();return/*#__PURE__*/_jsxs("ul",_objectSpread(_objectSpread({ref:ca,id:"".concat(n,"-listbox"),role:"listbox",tabIndex:"-1",className:d},G),{},{children:[!o&&!da&&null!==m&&/*#__PURE__*/_jsx(h,{}),da&&/*#__PURE__*/_jsx(SearchBox,{ref:_,classNames:E,value:C||Q,placeholder:D||J(messages.searchPlaceholder),onChange:ia,onClick:stopPropagation}),e.slice(0,Z).map(ka),Z<e.length&&/*#__PURE__*/_jsx(g,{})]}))}function g(){function a(a){stopPropagation(a),$(Z+DEFAULT_OPTIONS_PAGE_SIZE)}return/*#__PURE__*/ (/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */_jsx("li",{className:classNames(K("clickable"),K("border-bottom"),K("show-more")),onClick:a,onKeyPress:a,children:/*#__PURE__*/_jsx("a",{children:"..."})}))}function h(){var a={placeholder:m};return/*#__PURE__*/ (/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */_jsx("li",{className:classNames(K("clickable"),K("border-bottom")),onClick:d(a),onKeyPress:d(a),children:/*#__PURE__*/_jsx("a",{children:m})}))}// eslint-disable-next-line react/prop-types
 function i(a){var b=a.index;return/*#__PURE__*/_jsx("li",{className:K("np-separator"),"aria-hidden":!0},b)}// eslint-disable-next-line react/prop-types
 function j(a){var b=a.index,c=a.children;return/*#__PURE__*/_jsx("li",{className:K("np-dropdown-header"),onClick:stopPropagation,onKeyPress:stopPropagation,children:c},b)}function k(a,b){return(null===a||void 0===a?void 0:a.value)===(null===b||void 0===b?void 0:b.value)}function l(a){return ha().reduce(function(b,c,d){return d<a&&isActionableOption(c)?b+1:b},0)}var m=a.placeholder,n=a.id,o=a.required,p=a.disabled,q=a.inverse,r=a.dropdownWidth,t=a.size,u=a.block,v=a.selected,w=a.search,x=a.onChange,y=a.onFocus,z=a.onBlur,A=a.options,B=a.onSearchChange,C=a.searchValue,D=a.searchPlaceholder,E=a.classNames,F=a.dropdownUp,G=a.dropdownProps,H=a.buttonProps,I=useIntl(),J=I.formatMessage,K=function(a){return E[a]||a},s=useState(!1),L=_slicedToArray(s,2),M=L[0],N=L[1],O=useState(DEFAULT_SEARCH_VALUE),P=_slicedToArray(O,2),Q=P[0],R=P[1],S=useState(null),T=_slicedToArray(S,2),U=T[0],V=T[1],W=useRef(),X=useState(DEFAULT_OPTIONS_PAGE_SIZE),Y=_slicedToArray(X,2),Z=Y[0],$=Y[1],_=useRef(null),aa=useRef(null),ba=useRef(null),ca=useRef(null),da=!!B||!!w,ea=null===r,fa=useLayout(),ga=fa.isMobile,ha=function(){return w&&Q?A.filter(function(a){return isActionableOption(a)&&!isPlaceholderOption(a)}).filter(function(a){return"function"==typeof w?w(a,Q):defaultFilterFunction(a,Q)}):A},ia=function(a){$(DEFAULT_OPTIONS_PAGE_SIZE),R(a.target.value),B&&B(a.target.value)};useEffect(function(){W.current=U,M&&(!ga||""!==Q)&&(da&&!!_.current&&_.current.focus(),!da&&ca.current&&ca.current.focus())},[M,Q,da,ga,U]);var ja=function(){N(!1),V(null),ba.current&&ba.current.focus()},ka=function(a,b){var c,e=a;if(isSparatorOption(e)&&null!==e&&void 0!==e&&e.separator)return/*#__PURE__*/_jsx(i,{index:b});var f=a;if(isHeaderOption(f)&&f.header)return/*#__PURE__*/_jsx(j,{index:b,children:f.header});var g=k(v,a),h=a,m=!h.disabled&&U===l(b),n=classNames(K("np-dropdown-item"),h.disabled?[K("disabled")]:K("clickable"),(c={},_defineProperty(c,K("active"),g),_defineProperty(c,K("np-dropdown-item--focused"),m),c)),o=h.disabled?stopPropagation:d(h);return/*#__PURE__*/ (/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */_jsx("li",{"aria-selected":g,"aria-disabled":a.disabled,role:"option",tabIndex:"-1",className:n,onClick:o,onKeyPress:o,children:/*#__PURE__*/_jsx("a",{disabled:h.disabled,children:/*#__PURE__*/_jsx(Option,_objectSpread(_objectSpread({},h),{},{classNames:E}))})},b))},la=!!A.length;return M&&(""!==C||""!==Q)&&(la&&null===U&&V(0),!la&&null!==U&&V(null)),/*#__PURE__*/_jsxs("div",{// eslint-disable-line jsx-a11y/no-static-element-interactions
 ref:aa,className:classNames(K("np-select"),u?K("btn-block"):null,K("btn-group")),onKeyDown:function handleKeyDown(a){switch(a.keyCode){case KeyCodes.UP:case KeyCodes.DOWN:M?c(a.keyCode===KeyCodes.UP?-1:1):N(!0),stopPropagation(a);break;case KeyCodes.SPACE:a.target!==_.current&&(M?b():N(!0),stopPropagation(a));break;case KeyCodes.ENTER:M?b():N(!0),stopPropagation(a);break;case KeyCodes.ESCAPE:ja(),stopPropagation(a);break;case KeyCodes.TAB:M&&b();break;default:}},onTouchMove:function handleTouchStart(a){a.currentTarget===a.target&&M&&ja()},onFocus:function handleOnFocus(a){y&&y(a)},onBlur:function handleOnBlur(a){var b=a.nativeEvent;if(b){var c=b.relatedTarget,d=a.currentTarget;if(d&&c&&d.contains(c))return}z&&z(a)},children:[/*#__PURE__*/_jsxs(Button,_objectSpread(_objectSpread({ref:ba,id:n,block:u,size:t,htmlType:"button",className:classNames(K("np-dropdown-toggle"),q?K("np-dropdown-toggle-navy"):null)// reset Button's styles
 ,type:null,priority:null,disabled:p,role:"combobox","aria-controls":"".concat(n,"-listbox"),"aria-expanded":M,"aria-autocomplete":"none",onClick:function handleOnClick(){N(!0)}},H),{},{children:[v?/*#__PURE__*/_jsx(Option,_objectSpread(_objectSpread({},v),{},{classNames:E,selected:!0})):/*#__PURE__*/_jsx("span",{className:K("form-control-placeholder"),children:m}),/*#__PURE__*/_jsx(Chevron// disabled={disabled}
-,{className:classNames(K("tw-icon"),K("tw-chevron-up-icon"),K("tw-chevron"),K("bottom"),K("np-select-chevron"))})]})),ga?da?/*#__PURE__*/_jsx(Drawer,{open:M,headerTitle:D||J(messages.searchPlaceholder),onClose:ja,children:/*#__PURE__*/_jsx(f,{})}):/*#__PURE__*/_jsx(BottomSheet,{open:M,onClose:ja,children:/*#__PURE__*/_jsx(f,{className:"p-a-1"})}):/*#__PURE__*/_jsx(Panel,{open:M,flip:!1,altAxis:!0,anchorRef:aa,anchorWidth:ea,position:F?Position.TOP:Position.BOTTOM,onClose:ja,children:/*#__PURE__*/_jsx(f,{className:"p-a-1"})})]})}Select.propTypes={placeholder:PropTypes.string,id:PropTypes.string,required:PropTypes.bool,disabled:PropTypes.bool,inverse:PropTypes.bool,dropdownRight:PropTypes.oneOf(["xs","sm","md","lg","xl"]),dropdownWidth:PropTypes.oneOf(["sm","md","lg"]),size:PropTypes.oneOf(["sm","md","lg"]),block:PropTypes.bool,selected:PropTypes.shape({value:PropTypes.any.isRequired,label:PropTypes.node,icon:PropTypes.node,currency:PropTypes.string,note:PropTypes.node,secondary:PropTypes.node}),/**
+,{className:classNames(K("tw-icon"),K("tw-chevron-up-icon"),K("tw-chevron"),K("bottom"),K("np-select-chevron"))})]})),ga?da?/*#__PURE__*/_jsx(Drawer,{open:M,headerTitle:D||J(messages.searchPlaceholder),onClose:ja,children:f()}):/*#__PURE__*/_jsx(BottomSheet,{open:M,onClose:ja,children:f({className:"p-a-1"})}):/*#__PURE__*/_jsx(Panel,{open:M,flip:!1,altAxis:!0,anchorRef:aa,anchorWidth:ea,position:F?Position.TOP:Position.BOTTOM,onClose:ja,children:f({className:"p-a-1"})})]})}Select.propTypes={placeholder:PropTypes.string,id:PropTypes.string,required:PropTypes.bool,disabled:PropTypes.bool,inverse:PropTypes.bool,dropdownRight:PropTypes.oneOf(["xs","sm","md","lg","xl"]),dropdownWidth:PropTypes.oneOf(["sm","md","lg"]),size:PropTypes.oneOf(["sm","md","lg"]),block:PropTypes.bool,selected:PropTypes.shape({value:PropTypes.any.isRequired,label:PropTypes.node,icon:PropTypes.node,currency:PropTypes.string,note:PropTypes.node,secondary:PropTypes.node}),/**
    * Search toggle
    * if `true` default search functionality being enabled (not case sensitive search in option labels & currency props)
    * if `function` you can define your own search function to implement custom search experience. This search function used while filtering the options array. The custom search function takes two parameters. First is the option the second is the keyword.

package/build/es/polyfill/dimmer/Dimmer.js

@@ -1,6 +1,6 @@
 import classNames from"classnames";import{useCallback,useEffect,useRef}from"react";import CSSTransition from"react-transition-group/CSSTransition";import{addNoScrollBodyClass,removeNoScrollBodyClass}from"../common";import{isIosDevice}from"../common/deviceDetection";import FocusBoundary from"../common/focusBoundary";import withNextPortal from"../withNextPortal/withNextPortal";import DimmerManager from"./dimmerManager";import{jsx as _jsx}from"react/jsx-runtime";export var EXIT_ANIMATION=350;var dimmerManager=new DimmerManager;export var handleTouchMove=function(a){var b=a.target.classList.contains("dimmer");// disable scroll on iOS devices for Dimmer area
 // this is because of bug in WebKit https://bugs.webkit.org/show_bug.cgi?id=220908
 // note: scrolling still works for children(s) as expected
-isIosDevice()&&b&&(a.stopPropagation(),a.preventDefault())};var Dimmer=function(a){var b=a.children,c=a.className,d=a.disableClickToClose,e=a.fadeContentOnEnter,f=void 0!==e&&e,g=a.fadeContentOnExit,h=a.open,i=void 0!==h&&h,j=a.scrollable,k=a.transparent,l=void 0!==k&&k,m=a.onClose,n=useRef(null),o=function(a){a.target===n.current&&(null===m||void 0===m?void 0:m(a))},p=useCallback(function(a){"Escape"!==a.key||(a.stopPropagation(),m&&n.current&&dimmerManager.isTop(n.current)&&m(a))},[m]);return useEffect(function(){var a=n.current;return i&&(document.addEventListener("keydown",p),null===a||void 0===a?void 0:a.addEventListener("touchmove",handleTouchMove)),function(){document.removeEventListener("keydown",p),null===a||void 0===a?void 0:a.removeEventListener("touchmove",handleTouchMove)}},[p,i]),/*#__PURE__*/_jsx(CSSTransition,{in:i,appear:!0// Wait for animation to finish before unmount.
+isIosDevice()&&b&&(a.stopPropagation(),a.preventDefault())};var Dimmer=function(a){var b=a.children,c=a.className,d=a.disableClickToClose,e=a.fadeContentOnEnter,f=void 0!==e&&e,g=a.fadeContentOnExit,h=a.open,i=void 0!==h&&h,j=a.scrollable,k=a.transparent,l=void 0!==k&&k,m=a.onClose,n=useRef(null),o=function(a){a.target===n.current&&(null===m||void 0===m?void 0:m(a))},p=useCallback(function(a){"Escape"!==a.key||(a.stopPropagation(),m&&n.current&&dimmerManager.isTop(n.current)&&m(a))},[m]);return useEffect(function(){var a=n.current;return i&&(document.addEventListener("keydown",p),null===a||void 0===a?void 0:a.addEventListener("touchmove",handleTouchMove,{passive:!0})),function(){document.removeEventListener("keydown",p),null===a||void 0===a?void 0:a.removeEventListener("touchmove",handleTouchMove)}},[p,i]),/*#__PURE__*/_jsx(CSSTransition,{in:i,appear:!0// Wait for animation to finish before unmount.
 ,timeout:{enter:0,exit:EXIT_ANIMATION},classNames:{enter:classNames({"dimmer--enter-fade":f}),enterDone:classNames("dimmer--enter-done",{"dimmer--enter-fade":f}),exit:classNames("dimmer--exit",{"dimmer--exit-fade":void 0!==g&&g})},unmountOnExit:!0,onEnter:function onEnter(){n.current&&dimmerManager.add(n.current)},onExited:function onExited(){n.current&&dimmerManager.remove(n.current)},children:/*#__PURE__*/_jsx(DimmerContentWrapper,{scrollBody:!l,children:/*#__PURE__*/_jsx("div",{ref:n,className:classNames("dimmer",{"dimmer--scrollable":void 0!==j&&j,"dimmer--transparent":l},c),role:"presentation",onClick:function handleClick(a){void 0!==d&&d||!m||o(a)},children:/*#__PURE__*/_jsx(FocusBoundary,{children:b})})})})};export var DimmerContentWrapper=function(a){var b=a.children,c=a.scrollBody;return useEffect(function(){return c&&addNoScrollBodyClass(),function(){c&&removeNoScrollBodyClass()}},[c]),b};// Export without the Portal for tests only
 export{Dimmer};export default withNextPortal(Dimmer);

package/build/es/polyfill/select/Select.js

@@ -1,12 +1,11 @@
 import _defineProperty from"@babel/runtime/helpers/defineProperty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import"core-js/modules/es.array.includes.js";import"core-js/modules/es.string.includes.js";import"core-js/modules/es.object.to-string.js";import"core-js/modules/es.regexp.exec.js";import"core-js/modules/es.string.search.js";import"core-js/modules/es.array.filter.js";import"core-js/modules/es.array.reduce.js";import"core-js/modules/es.array.map.js";import"core-js/modules/es.array.slice.js";import"core-js/modules/es.object.keys.js";import"core-js/modules/es.symbol.js";import"core-js/modules/es.object.get-own-property-descriptor.js";import"core-js/modules/web.dom-collections.for-each.js";import"core-js/modules/es.object.get-own-property-descriptors.js";import classNames from"classnames";import PropTypes from"prop-types";import{useState,useEffect,useRef}from"react";import{useIntl}from"react-intl";import Button from"../button";import Chevron from"../chevron";import{Position}from"../common";import BottomSheet from"../common/bottomSheet";import{stopPropagation}from"../common/domHelpers";import{useLayout}from"../common/hooks";import KeyCodes from"../common/keyCodes";import Panel from"../common/panel";import Drawer from"../drawer";import messages from"./Select.messages";import Option from"./option";import SearchBox from"./searchBox";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var DEFAULT_SEARCH_VALUE="",DEFAULT_OPTIONS_PAGE_SIZE=100,includesString=function(a,b){return a.toLowerCase().includes(b.toLowerCase())};function defaultFilterFunction(a,b){if(isPlaceholderOption(a))return!0;var c=a.label,d=a.note,e=a.secondary,f=a.currency,g=a.searchStrings;return!!c&&includesString(c,b)||!!d&&includesString(d,b)||!!e&&includesString(e,b)||!!f&&includesString(f,b)||!!g&&g.some(function(a){return includesString(a,b)})}function isActionableOption(a){return!a.header&&!a.separator&&!a.disabled}function isHeaderOption(a){return null!==a&&"header"in a}function isSparatorOption(a){return null!==a&&"separator"in a}/**
  * No option or placeholder option is selected
- */var DEFAULT_SELECTED_OPTION=null;function isPlaceholderOption(a){return a===DEFAULT_SELECTED_OPTION||"placeholder"in a}export default function Select(a){function b(){if(null!==U){var a=ha().filter(isActionableOption);e(a[U])}}function c(a){var b=ha().filter(isActionableOption),c=b.reduce(function(a,b,c){return null===a?k(v,b)?c:null:a},null),d=null===W.current||void 0===W.current?-1:W.current,e=d;null===d&&null===c&&V(0),null===d&&null!==c&&(e=c);var f=e+a,g=Math.max(Math.min(0,b.length-1),f);V(g)}function d(a){return function(b){stopPropagation(b),e(a)}}function e(a){x(isPlaceholderOption(a)?DEFAULT_SELECTED_OPTION:a),ja()}// eslint-disable-next-line react/prop-types
-function f(a){var b,c=a.className,d=classNames(K("np-dropdown-menu"),(b={},_defineProperty(b,K("np-dropdown-menu-desktop"),!ga),_defineProperty(b,K("np-dropdown-menu-".concat(r)),!ga&&!ea),b),K(c));return/*#__PURE__*/_jsxs("ul",_objectSpread(_objectSpread({ref:ca,id:"".concat(n,"-listbox"),role:"listbox",tabIndex:"-1",className:d},G),{},{children:[!o&&!da&&null!==m&&/*#__PURE__*/_jsx(h,{}),da&&/*#__PURE__*/_jsx(SearchBox,{ref:_,classNames:E,value:C||Q,placeholder:D||J(messages.searchPlaceholder),onChange:ia,onClick:stopPropagation}),ha().slice(0,Z).map(ka),Z<ha().length&&/*#__PURE__*/_jsx(g,{})]}))}function g(){function a(a){stopPropagation(a),$(Z+DEFAULT_OPTIONS_PAGE_SIZE)}return/*#__PURE__*/ (/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */_jsx("li",{className:classNames(K("clickable"),K("border-bottom"),K("show-more")),onClick:a,onKeyPress:a,children:/*#__PURE__*/_jsx("a",{children:"..."})}))}function h(){var a={placeholder:m};return/*#__PURE__*/ (/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */_jsx("li",{className:classNames(K("clickable"),K("border-bottom")),onClick:d(a),onKeyPress:d(a),children:/*#__PURE__*/_jsx("a",{children:m})}))}// eslint-disable-next-line react/prop-types
+ */var DEFAULT_SELECTED_OPTION=null;function isPlaceholderOption(a){return a===DEFAULT_SELECTED_OPTION||"placeholder"in a}export default function Select(a){function b(){if(null!==U){var a=ha().filter(isActionableOption);e(a[U])}}function c(a){var b=ha().filter(isActionableOption),c=b.reduce(function(a,b,c){return null===a?k(v,b)?c:null:a},null),d=null===W.current||void 0===W.current?-1:W.current,e=d;null===d&&null===c&&V(0),null===d&&null!==c&&(e=c);var f=e+a,g=Math.max(Math.min(0,b.length-1),f);V(g)}function d(a){return function(b){stopPropagation(b),e(a)}}function e(a){x(isPlaceholderOption(a)?DEFAULT_SELECTED_OPTION:a),ja()}function f(){var a,b=0<arguments.length&&void 0!==arguments[0]?arguments[0]:{},c=b.className,d=classNames(K("np-dropdown-menu"),(a={},_defineProperty(a,K("np-dropdown-menu-desktop"),!ga),_defineProperty(a,K("np-dropdown-menu-".concat(r)),!ga&&!ea),a),K(c)),e=ha();return/*#__PURE__*/_jsxs("ul",_objectSpread(_objectSpread({ref:ca,id:"".concat(n,"-listbox"),role:"listbox",tabIndex:"-1",className:d},G),{},{children:[!o&&!da&&null!==m&&/*#__PURE__*/_jsx(h,{}),da&&/*#__PURE__*/_jsx(SearchBox,{ref:_,classNames:E,value:C||Q,placeholder:D||J(messages.searchPlaceholder),onChange:ia,onClick:stopPropagation}),e.slice(0,Z).map(ka),Z<e.length&&/*#__PURE__*/_jsx(g,{})]}))}function g(){function a(a){stopPropagation(a),$(Z+DEFAULT_OPTIONS_PAGE_SIZE)}return/*#__PURE__*/ (/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */_jsx("li",{className:classNames(K("clickable"),K("border-bottom"),K("show-more")),onClick:a,onKeyPress:a,children:/*#__PURE__*/_jsx("a",{children:"..."})}))}function h(){var a={placeholder:m};return/*#__PURE__*/ (/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */_jsx("li",{className:classNames(K("clickable"),K("border-bottom")),onClick:d(a),onKeyPress:d(a),children:/*#__PURE__*/_jsx("a",{children:m})}))}// eslint-disable-next-line react/prop-types
 function i(a){var b=a.index;return/*#__PURE__*/_jsx("li",{className:K("np-separator"),"aria-hidden":!0},b)}// eslint-disable-next-line react/prop-types
 function j(a){var b=a.index,c=a.children;return/*#__PURE__*/_jsx("li",{className:K("np-dropdown-header"),onClick:stopPropagation,onKeyPress:stopPropagation,children:c},b)}function k(a,b){return(null===a||void 0===a?void 0:a.value)===(null===b||void 0===b?void 0:b.value)}function l(a){return ha().reduce(function(b,c,d){return d<a&&isActionableOption(c)?b+1:b},0)}var m=a.placeholder,n=a.id,o=a.required,p=a.disabled,q=a.inverse,r=a.dropdownWidth,t=a.size,u=a.block,v=a.selected,w=a.search,x=a.onChange,y=a.onFocus,z=a.onBlur,A=a.options,B=a.onSearchChange,C=a.searchValue,D=a.searchPlaceholder,E=a.classNames,F=a.dropdownUp,G=a.dropdownProps,H=a.buttonProps,I=useIntl(),J=I.formatMessage,K=function(a){return E[a]||a},s=useState(!1),L=_slicedToArray(s,2),M=L[0],N=L[1],O=useState(DEFAULT_SEARCH_VALUE),P=_slicedToArray(O,2),Q=P[0],R=P[1],S=useState(null),T=_slicedToArray(S,2),U=T[0],V=T[1],W=useRef(),X=useState(DEFAULT_OPTIONS_PAGE_SIZE),Y=_slicedToArray(X,2),Z=Y[0],$=Y[1],_=useRef(null),aa=useRef(null),ba=useRef(null),ca=useRef(null),da=!!B||!!w,ea=null===r,fa=useLayout(),ga=fa.isMobile,ha=function(){return w&&Q?A.filter(function(a){return isActionableOption(a)&&!isPlaceholderOption(a)}).filter(function(a){return"function"==typeof w?w(a,Q):defaultFilterFunction(a,Q)}):A},ia=function(a){$(DEFAULT_OPTIONS_PAGE_SIZE),R(a.target.value),B&&B(a.target.value)};useEffect(function(){W.current=U,M&&(!ga||""!==Q)&&(da&&!!_.current&&_.current.focus(),!da&&ca.current&&ca.current.focus())},[M,Q,da,ga,U]);var ja=function(){N(!1),V(null),ba.current&&ba.current.focus()},ka=function(a,b){var c,e=a;if(isSparatorOption(e)&&null!==e&&void 0!==e&&e.separator)return/*#__PURE__*/_jsx(i,{index:b});var f=a;if(isHeaderOption(f)&&f.header)return/*#__PURE__*/_jsx(j,{index:b,children:f.header});var g=k(v,a),h=a,m=!h.disabled&&U===l(b),n=classNames(K("np-dropdown-item"),h.disabled?[K("disabled")]:K("clickable"),(c={},_defineProperty(c,K("active"),g),_defineProperty(c,K("np-dropdown-item--focused"),m),c)),o=h.disabled?stopPropagation:d(h);return/*#__PURE__*/ (/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */_jsx("li",{"aria-selected":g,"aria-disabled":a.disabled,role:"option",tabIndex:"-1",className:n,onClick:o,onKeyPress:o,children:/*#__PURE__*/_jsx("a",{disabled:h.disabled,children:/*#__PURE__*/_jsx(Option,_objectSpread(_objectSpread({},h),{},{classNames:E}))})},b))},la=!!A.length;return M&&(""!==C||""!==Q)&&(la&&null===U&&V(0),!la&&null!==U&&V(null)),/*#__PURE__*/_jsxs("div",{// eslint-disable-line jsx-a11y/no-static-element-interactions
 ref:aa,className:classNames(K("np-select"),u?K("btn-block"):null,K("btn-group")),onKeyDown:function handleKeyDown(a){switch(a.keyCode){case KeyCodes.UP:case KeyCodes.DOWN:M?c(a.keyCode===KeyCodes.UP?-1:1):N(!0),stopPropagation(a);break;case KeyCodes.SPACE:a.target!==_.current&&(M?b():N(!0),stopPropagation(a));break;case KeyCodes.ENTER:M?b():N(!0),stopPropagation(a);break;case KeyCodes.ESCAPE:ja(),stopPropagation(a);break;case KeyCodes.TAB:M&&b();break;default:}},onTouchMove:function handleTouchStart(a){a.currentTarget===a.target&&M&&ja()},onFocus:function handleOnFocus(a){y&&y(a)},onBlur:function handleOnBlur(a){var b=a.nativeEvent;if(b){var c=b.relatedTarget,d=a.currentTarget;if(d&&c&&d.contains(c))return}z&&z(a)},children:[/*#__PURE__*/_jsxs(Button,_objectSpread(_objectSpread({ref:ba,id:n,block:u,size:t,htmlType:"button",className:classNames(K("np-dropdown-toggle"),q?K("np-dropdown-toggle-navy"):null)// reset Button's styles
 ,type:null,priority:null,disabled:p,role:"combobox","aria-controls":"".concat(n,"-listbox"),"aria-expanded":M,"aria-autocomplete":"none",onClick:function handleOnClick(){N(!0)}},H),{},{children:[v?/*#__PURE__*/_jsx(Option,_objectSpread(_objectSpread({},v),{},{classNames:E,selected:!0})):/*#__PURE__*/_jsx("span",{className:K("form-control-placeholder"),children:m}),/*#__PURE__*/_jsx(Chevron// disabled={disabled}
-,{className:classNames(K("tw-icon"),K("tw-chevron-up-icon"),K("tw-chevron"),K("bottom"),K("np-select-chevron"))})]})),ga?da?/*#__PURE__*/_jsx(Drawer,{open:M,headerTitle:D||J(messages.searchPlaceholder),onClose:ja,children:/*#__PURE__*/_jsx(f,{})}):/*#__PURE__*/_jsx(BottomSheet,{open:M,onClose:ja,children:/*#__PURE__*/_jsx(f,{className:"p-a-1"})}):/*#__PURE__*/_jsx(Panel,{open:M,flip:!1,altAxis:!0,anchorRef:aa,anchorWidth:ea,position:F?Position.TOP:Position.BOTTOM,onClose:ja,children:/*#__PURE__*/_jsx(f,{className:"p-a-1"})})]})}Select.propTypes={placeholder:PropTypes.string,id:PropTypes.string,required:PropTypes.bool,disabled:PropTypes.bool,inverse:PropTypes.bool,dropdownRight:PropTypes.oneOf(["xs","sm","md","lg","xl"]),dropdownWidth:PropTypes.oneOf(["sm","md","lg"]),size:PropTypes.oneOf(["sm","md","lg"]),block:PropTypes.bool,selected:PropTypes.shape({value:PropTypes.any.isRequired,label:PropTypes.node,icon:PropTypes.node,currency:PropTypes.string,note:PropTypes.node,secondary:PropTypes.node}),/**
+,{className:classNames(K("tw-icon"),K("tw-chevron-up-icon"),K("tw-chevron"),K("bottom"),K("np-select-chevron"))})]})),ga?da?/*#__PURE__*/_jsx(Drawer,{open:M,headerTitle:D||J(messages.searchPlaceholder),onClose:ja,children:f()}):/*#__PURE__*/_jsx(BottomSheet,{open:M,onClose:ja,children:f({className:"p-a-1"})}):/*#__PURE__*/_jsx(Panel,{open:M,flip:!1,altAxis:!0,anchorRef:aa,anchorWidth:ea,position:F?Position.TOP:Position.BOTTOM,onClose:ja,children:f({className:"p-a-1"})})]})}Select.propTypes={placeholder:PropTypes.string,id:PropTypes.string,required:PropTypes.bool,disabled:PropTypes.bool,inverse:PropTypes.bool,dropdownRight:PropTypes.oneOf(["xs","sm","md","lg","xl"]),dropdownWidth:PropTypes.oneOf(["sm","md","lg"]),size:PropTypes.oneOf(["sm","md","lg"]),block:PropTypes.bool,selected:PropTypes.shape({value:PropTypes.any.isRequired,label:PropTypes.node,icon:PropTypes.node,currency:PropTypes.string,note:PropTypes.node,secondary:PropTypes.node}),/**
    * Search toggle
    * if `true` default search functionality being enabled (not case sensitive search in option labels & currency props)
    * if `function` you can define your own search function to implement custom search experience. This search function used while filtering the options array. The custom search function takes two parameters. First is the option the second is the keyword.

package/build/types/select/Select.d.ts

@@ -68,9 +68,9 @@ declare const Select: React.FC<SelectProps>;
 
 export default Select;
 
-declare const Options: React.FC;
+declare const renderOptionsList: React.FC;
 
-export default Options;
+export default renderOptionsList;
 
 declare const ShowMoreOption: React.FC;