@transferwise/components 0.0.0-experimental-c3557fc → 0.0.0-experimental-aaa8df9

package/build/es/no-polyfill/common/DOMOperations/DOMOperations.js

@@ -1,9 +1,9 @@
 /**
  * Defined in `Dimmer.less`
- */var NO_SCROLL_CLASS="no-scroll";/**
- * Apply {@link NO_SCROLL_CLASS} that disables scroll on page (e.g use in Dimmer to disable scroll behind the component)
+ */var NO_SCROLL_BODY_CLASS="no-scroll";/**
+ * Apply {@link NO_SCROLL_BODY_CLASS} that disables scroll on page (e.g use in Dimmer to disable scroll behind the component)
  *
- * CSS class needs to be applied for `html` and not `body`, as this doing both will break any position sticky in the document.
- */export var addNoScrollClass=function(){document.documentElement.classList.add(NO_SCROLL_CLASS)};/**
- * Clean up after {@link addNoScrollClass} function
- */export var removeNoScrollClass=function(){document.documentElement.classList.remove(NO_SCROLL_CLASS)};
+ * For a proper disabling, the CSS class needs to be applied for `html` and `body` elements.
+ */export var addNoScrollBodyClass=function(){document.documentElement.classList.add(NO_SCROLL_BODY_CLASS),document.body.classList.add(NO_SCROLL_BODY_CLASS)};/**
+ * Clean up after {@link addNoScrollBodyClass} function
+ */export var removeNoScrollBodyClass=function(){document.documentElement.classList.remove(NO_SCROLL_BODY_CLASS),document.body.classList.remove(NO_SCROLL_BODY_CLASS)};

package/build/es/no-polyfill/common/DOMOperations/index.js

@@ -1 +1 @@
-import{addNoScrollClass,removeNoScrollClass}from"./DOMOperations";export{addNoScrollClass,removeNoScrollClass};
+import{addNoScrollBodyClass,removeNoScrollBodyClass}from"./DOMOperations";export{addNoScrollBodyClass,removeNoScrollBodyClass};

package/build/es/no-polyfill/common/index.js

@@ -1,2 +1,2 @@
-export{default as HistoryNavigator}from"./historyNavigator";export*from"./domHelpers";export{addNoScrollClass,removeNoScrollClass}from"./DOMOperations";export*from"./theme";export*from"./direction";// Props
+export{default as HistoryNavigator}from"./historyNavigator";export*from"./domHelpers";export{addNoScrollBodyClass,removeNoScrollBodyClass}from"./DOMOperations";export*from"./theme";export*from"./direction";// Props
 export*from"./propsValues/control";export{Breakpoint}from"./propsValues/breakpoint";export*from"./propsValues/size";export*from"./propsValues/typography";export*from"./propsValues/width";export{Type}from"./propsValues/type";export{DateMode}from"./propsValues/dateMode";export{MonthFormat}from"./propsValues/monthFormat";export*from"./propsValues/position";export{Layout}from"./propsValues/layouts";export{Status}from"./propsValues/status";export{Sentiment}from"./propsValues/sentiment";export{ProfileType}from"./propsValues/profileType";export{Variant}from"./propsValues/variant";export*from"./propsValues/scroll";export{MarkdownNodeType}from"./propsValues/markdownNodeType";export{FileType}from"./fileType";export{Key}from"./key";export*from"./locale";export*from"./commonProps";

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

@@ -1,6 +1,6 @@
-import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import{ThemeProvider,useTheme}from"@wise/components-theming";import classNames from"classnames";import{useCallback,useEffect,useRef,useState}from"react";import CSSTransition from"react-transition-group/CSSTransition";import{addNoScrollClass,removeNoScrollClass}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";import{Fragment as _Fragment}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
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import{ThemeProvider,useTheme}from"@wise/components-theming";import classNames from"classnames";import{useCallback,useEffect,useRef,useState}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";import{Fragment as _Fragment}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.contentPosition,f=a.fadeContentOnEnter,g=void 0!==f&&f,h=a.fadeContentOnExit,i=a.open,j=void 0!==i&&i,k=a.scrollable,l=a.transparent,m=void 0!==l&&l,n=a.onClose,o=useState(!1),p=_slicedToArray(o,2),q=p[0],r=p[1],s=useRef(null),t=function(a){a.target===s.current&&(null===n||void 0===n?void 0:n(a))},u=useCallback(function(a){"Escape"!==a.key||(a.stopPropagation(),n&&s.current&&dimmerManager.isTop(s.current)&&n(a))},[n]);return useEffect(function(){var a=s.current;return j&&(document.addEventListener("keydown",u),null===a||void 0===a?void 0:a.addEventListener("touchmove",handleTouchMove,{passive:!0})),function(){document.removeEventListener("keydown",u),null===a||void 0===a?void 0:a.removeEventListener("touchmove",handleTouchMove)}},[u,j]),/*#__PURE__*/_jsx(DimmerWrapper,{open:j,hasNotExited:q,children:/*#__PURE__*/_jsx(CSSTransition,{nodeRef:s,in:j,appear:!0// Wait for animation to finish before unmount.
-,timeout:{enter:0,exit:EXIT_ANIMATION},classNames:{enter:classNames({"dimmer--enter-fade":g}),enterDone:classNames("dimmer--enter-done",{"dimmer--enter-fade":g}),exit:classNames("dimmer--exit",{"dimmer--exit-fade":void 0!==h&&h})},unmountOnExit:!0,onEnter:function onEnter(){r(!0),s.current&&dimmerManager.add(s.current)},onExited:function onExited(){r(!1),s.current&&dimmerManager.remove(s.current)},children:/*#__PURE__*/_jsx(DimmerContentWrapper,{scrollBody:!m,children:/*#__PURE__*/_jsx(FocusBoundary,{children:/*#__PURE__*/_jsx("div",{ref:s,className:classNames("dimmer",{"dimmer--scrollable":void 0!==k&&k,"dimmer--transparent":m},c),role:"presentation",onClick:function handleClick(a){void 0!==d&&d||!n||t(a)},children:/*#__PURE__*/_jsx("div",{className:classNames("dimmer-content-positioner",null!=e&&["d-flex justify-content-center",{"align-items-start":"top"===e,"align-items-center":"center"===e,"align-items-end":"bottom"===e}]),children:b})})})})})})},DimmerWrapper=function(a){var b=a.open,c=a.hasNotExited,d=a.children,e=useTheme(),f=e.screenMode,g=e.theme;return b||c?/*#__PURE__*/_jsx(ThemeProvider,{theme:g,screenMode:f,isNotRootProvider:!0,children:d}):/*#__PURE__*/_jsx(_Fragment,{children:d})};export var DimmerContentWrapper=function(a){var b=a.children,c=a.scrollBody;return useEffect(function(){return c&&addNoScrollClass(),function(){c&&removeNoScrollClass()}},[c]),b};// Export without the Portal for tests only
+,timeout:{enter:0,exit:EXIT_ANIMATION},classNames:{enter:classNames({"dimmer--enter-fade":g}),enterDone:classNames("dimmer--enter-done",{"dimmer--enter-fade":g}),exit:classNames("dimmer--exit",{"dimmer--exit-fade":void 0!==h&&h})},unmountOnExit:!0,onEnter:function onEnter(){r(!0),s.current&&dimmerManager.add(s.current)},onExited:function onExited(){r(!1),s.current&&dimmerManager.remove(s.current)},children:/*#__PURE__*/_jsx(DimmerContentWrapper,{scrollBody:!m,children:/*#__PURE__*/_jsx(FocusBoundary,{children:/*#__PURE__*/_jsx("div",{ref:s,className:classNames("dimmer",{"dimmer--scrollable":void 0!==k&&k,"dimmer--transparent":m},c),role:"presentation",onClick:function handleClick(a){void 0!==d&&d||!n||t(a)},children:/*#__PURE__*/_jsx("div",{className:classNames("dimmer-content-positioner",null!=e&&["d-flex justify-content-center",{"align-items-start":"top"===e,"align-items-center":"center"===e,"align-items-end":"bottom"===e}]),children:b})})})})})})},DimmerWrapper=function(a){var b=a.open,c=a.hasNotExited,d=a.children,e=useTheme(),f=e.screenMode,g=e.theme;return b||c?/*#__PURE__*/_jsx(ThemeProvider,{theme:g,screenMode:f,isNotRootProvider:!0,children:d}):/*#__PURE__*/_jsx(_Fragment,{children:d})};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/index.js

@@ -2,7 +2,7 @@
  * Types
  */ /**
  * Components
- */export{default as Title}from"./title";export{default as Body}from"./body";export{default as Accordion}from"./accordion";export{default as ActionButton}from"./actionButton";export{default as ActionOption}from"./actionOption";export{default as Alert}from"./alert";export{default as Avatar}from"./avatar";export{default as AvatarWrapper}from"./avatarWrapper";export{default as Badge}from"./badge";export{default as BottomSheet}from"./common/bottomSheet";export{default as Button}from"./button";export{default as Card}from"./card";export{default as Checkbox}from"./checkbox";export{default as CheckboxButton}from"./checkboxButton";export{default as CheckboxOption}from"./checkboxOption";export{default as Chevron}from"./chevron";export{default as Chips,Chip}from"./chips";export{default as CircularButton}from"./circularButton";export{default as DateInput}from"./dateInput";export{default as DateLookup}from"./dateLookup";export{default as Decision}from"./decision";export{default as DefinitionList}from"./definitionList";export{default as Dimmer}from"./dimmer";export{default as Display}from"./display";export{default as Drawer}from"./drawer";export{default as DropFade}from"./dropFade";export{default as DynamicFieldDefinitionList}from"./dynamicFieldDefinitionList";export{default as Emphasis}from"./emphasis";export{default as FlowNavigation}from"./flowNavigation";export{default as Header}from"./header";export{default as Image}from"./image";export{default as Info}from"./info";export{default as InlineAlert}from"./inlineAlert";export{Input}from"./inputs/Input";export{TextArea}from"./inputs/TextArea";export{default as InputWithDisplayFormat}from"./inputWithDisplayFormat";export{default as InstructionsList}from"./instructionsList";export{default as Link}from"./link";export{default as Loader}from"./loader";export{default as Logo}from"./logo";export{default as Markdown}from"./markdown";export{default as Modal}from"./modal";export{default as Money}from"./money";export{default as MoneyInput}from"./moneyInput";export{default as NavigationOption}from"./navigationOption";export{default as NavigationOptionsList}from"./navigationOptionsList";export{default as Nudge}from"./nudge";export{default as Option}from"./common/Option";export{default as OverlayHeader}from"./overlayHeader";export{default as PhoneNumberInput}from"./phoneNumberInput";export{default as Popover}from"./popover";export{default as ProcessIndicator}from"./processIndicator";export{default as ProgressBar}from"./progressBar";export{default as Progress}from"./progress";export{default as Provider,DirectionProvider,LanguageProvider}from"./provider";export{default as Radio}from"./radio";export{default as RadioGroup}from"./radioGroup";export{default as RadioOption}from"./radioOption";export{default as Section}from"./section";export{default as Select}from"./select";export{default as SlidingPanel}from"./slidingPanel";export{default as SnackbarPortal}from"./snackbar/Snackbar";export{default as SnackbarProvider}from"./snackbar/SnackbarProvider";export{default as StatusIcon}from"./statusIcon/StatusIcon";export{default as Stepper}from"./stepper";export{default as Sticky}from"./sticky";export{default as Summary}from"./summary";export{default as Switch}from"./switch";export{default as SwitchOption}from"./switchOption";export{default as Tabs}from"./tabs";export{default as TextareaWithDisplayFormat}from"./textareaWithDisplayFormat";export{default as Tooltip}from"./tooltip";export{default as Typeahead}from"./typeahead";export{default as Upload}from"./upload";export{default as UploadInput}from"./uploadInput";export{SnackbarConsumer,SnackbarContext}from"./snackbar/SnackbarContext";export{default as CriticalCommsBanner}from"./criticalBanner";/**
+ */export{default as Title}from"./title";export{default as Body}from"./body";export{default as Accordion}from"./accordion";export{default as ActionButton}from"./actionButton";export{default as ActionOption}from"./actionOption";export{default as Alert}from"./alert";export{default as Avatar}from"./avatar";export{default as AvatarWrapper}from"./avatarWrapper";export{default as Badge}from"./badge";export{default as BottomSheet}from"./common/bottomSheet";export{default as Button}from"./button";export{default as Card}from"./card";export{default as Checkbox}from"./checkbox";export{default as CheckboxButton}from"./checkboxButton";export{default as CheckboxOption}from"./checkboxOption";export{default as Chevron}from"./chevron";export{default as Chips,Chip}from"./chips";export{default as CircularButton}from"./circularButton";export{default as DateInput}from"./dateInput";export{default as DateLookup}from"./dateLookup";export{default as Decision}from"./decision";export{default as DefinitionList}from"./definitionList";export{default as Dimmer}from"./dimmer";export{default as Display}from"./display";export{default as Drawer}from"./drawer";export{default as DropFade}from"./dropFade";export{default as DynamicFieldDefinitionList}from"./dynamicFieldDefinitionList";export{default as Emphasis}from"./emphasis";export{default as FlowNavigation}from"./flowNavigation";export{default as Header}from"./header";export{default as Image}from"./image";export{default as Info}from"./info";export{default as InlineAlert}from"./inlineAlert";export{Input}from"./inputs/Input";export{TextArea}from"./inputs/TextArea";export{default as InputWithDisplayFormat}from"./inputWithDisplayFormat";export{default as InstructionsList}from"./instructionsList";export{default as Link}from"./link";export{default as Loader}from"./loader";export{default as Logo}from"./logo";export{default as Markdown}from"./markdown";export{default as Modal}from"./modal";export{default as Money}from"./money";export{default as MoneyInput}from"./moneyInput";export{default as NavigationOption}from"./navigationOption";export{default as NavigationOptionsList}from"./navigationOptionsList";export{default as Nudge}from"./nudge";export{default as Option}from"./common/Option";export{default as OverlayHeader}from"./overlayHeader";export{default as PhoneNumberInput}from"./phoneNumberInput";export{default as Popover}from"./popover";export{default as ProcessIndicator}from"./processIndicator";export{default as ProgressBar}from"./progressBar";export{default as Progress}from"./progress";export{default as Provider,DirectionProvider,LanguageProvider}from"./provider";export{default as Radio}from"./radio";export{default as RadioGroup}from"./radioGroup";export{default as RadioOption}from"./radioOption";export{default as Section}from"./section";export{default as Select}from"./select";export{default as SlidingPanel}from"./slidingPanel";export{default as SnackbarPortal}from"./snackbar/Snackbar";export{default as SnackbarProvider}from"./snackbar/SnackbarProvider";export{default as StatusIcon}from"./statusIcon/StatusIcon";export{default as Stepper}from"./stepper";export{default as Sticky}from"./sticky";export{default as Summary}from"./summary";export{default as Switch}from"./switch";export{default as SwitchOption}from"./switchOption";export{default as Tabs}from"./tabs";export{default as TextareaWithDisplayFormat}from"./textareaWithDisplayFormat";export{default as Tooltip}from"./tooltip";export{default as Typeahead}from"./typeahead";export{default as Upload}from"./upload";export{default as UploadInput}from"./uploadInput";export{SnackbarConsumer,SnackbarContext}from"./snackbar/SnackbarContext";export{default as CriticalCommsBanner}from"./criticalBanner";export{default as ListItem}from"./listItem";/**
  * Hooks
  */export{default as useSnackbar}from"./snackbar/useSnackbar";export{useDirection,useLayout}from"./common/hooks";/**
  * Enums

package/build/es/no-polyfill/listItem/ListItem.js

@@ -0,0 +1 @@
+import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["media","action","className","title","value","isContainerAligned","as"];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 Body from"../body/Body";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var ListItem=function(a){var b=a.media,c=a.action,d=a.className,e=a.title,f=a.value,g=a.isContainerAligned,h=a.as,i=void 0===h?"li":h,j=_objectWithoutProperties(a,_excluded);return/*#__PURE__*/_jsxs(i,_objectSpread(_objectSpread({className:classNames("list-item d-flex align-items-center p-y-2",d,{"p-x-2":!g})},j),{},{children:[b?b:null,/*#__PURE__*/_jsxs("div",{className:classNames("d-flex flex-column",{"p-l-2":!!b,"p-r-2":!!c}),children:[/*#__PURE__*/_jsx(Body,{type:"body-default",className:"text-secondary m-b-0",children:e}),f&&/*#__PURE__*/_jsx(Body,{type:"body-large",className:"text-primary m-b-0",children:f})]}),c?/*#__PURE__*/_jsx("div",{className:"list-item__action m-l-auto",children:c}):null]}))};export default ListItem;

package/build/es/no-polyfill/listItem/ListItem.spec.js

@@ -0,0 +1 @@
+import _asyncToGenerator from"@babel/runtime/helpers/asyncToGenerator";import _regeneratorRuntime from"@babel/runtime/regenerator";import"@testing-library/jest-dom";import ActionButton from"../actionButton/ActionButton";import{render,screen,within}from"../test-utils";import ListItem from".";import{jsx as _jsx}from"react/jsx-runtime";describe("ListItem",function(){it("shows the title and description",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function b(){var c;return _regeneratorRuntime.wrap(function(b){for(;;)switch(b.prev=b.next){case 0:return render(/*#__PURE__*/_jsx(ListItem,{title:"Some title",value:"Some description",as:"li"})),b.next=3,a();case 3:c=b.sent,expect(c).toHaveClass("list-item"),expect(within(c).getByText("Some title")).toBeInTheDocument(),expect(within(c).getByText("Some description")).toBeInTheDocument();case 7:case"end":return b.stop();}},b)}))),it("shows an action",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function b(){var c,d;return _regeneratorRuntime.wrap(function(b){for(;;)switch(b.prev=b.next){case 0:return render(/*#__PURE__*/_jsx(ListItem,{title:"Account number",value:"123",action:/*#__PURE__*/_jsx(ActionButton,{children:"Copy"})})),b.next=3,a();case 3:return c=b.sent,b.next=6,within(c).findByRole("button",{name:"Copy"});case 6:d=b.sent,expect(d).toBeInTheDocument();case 8:case"end":return b.stop();}},b)}))),it("shows media icon",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function b(){var c;return _regeneratorRuntime.wrap(function(b){for(;;)switch(b.prev=b.next){case 0:return render(/*#__PURE__*/_jsx(ListItem,{title:"Some title",value:"Some desctiption",media:/*#__PURE__*/_jsx("img",{style:{width:32,height:32},src:"https://wise.com/public-resources/assets/balances/savings-emoji/google/\u2708\uFE0F.png",alt:"icon"})})),b.next=3,a();case 3:c=b.sent,expect(within(c).getByAltText("icon")).toBeInTheDocument();case 5:case"end":return b.stop();}},b)})));var a=/*#__PURE__*/function(){var a=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function a(){return _regeneratorRuntime.wrap(function(a){for(;;)switch(a.prev=a.next){case 0:return a.abrupt("return",screen.findByRole("listitem"));case 1:case"end":return a.stop();}},a)}));return function(){return a.apply(this,arguments)}}()});

package/build/es/no-polyfill/listItem/ListItem.story.js

@@ -0,0 +1 @@
+import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["title","value"];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}/* eslint-disable react/jsx-child-element-spacing */import{action}from"@storybook/addon-actions";import{Documents}from"@transferwise/icons";import ActionButton from"../actionButton/ActionButton";import Avatar from"../avatar";import Badge from"../badge";import Info from"../info";import Title from"../title/Title";import ListItem from".";import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{component:ListItem,title:"Other/ListItem",tags:["autodocs"]};var Template=function(a){var b=a.title,c=void 0===b?"Wise":b,d=a.value,e=void 0===d?"We\u2019re building the world\u2019s most international account":d,f=_objectWithoutProperties(a,_excluded);return/*#__PURE__*/_jsx(ListItem,_objectSpread({title:c,value:e},f))};export var Basic=function(){return/*#__PURE__*/_jsx(_Fragment,{children:/*#__PURE__*/_jsx(ListItem,{title:"Wise",value:"We\u2019re building the world's most international account"})})};export var Variants=function(){return/*#__PURE__*/_jsxs("div",{children:[/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"With Icon Avatar"}),/*#__PURE__*/_jsx(Template,{media:/*#__PURE__*/_jsx(Avatar,{children:/*#__PURE__*/_jsx("img",{style:{width:32,height:32},src:"https://wise.com/public-resources/assets/balances/savings-emoji/google/\u2708\uFE0F.png",alt:""})})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"With Contact Avatar"}),/*#__PURE__*/_jsx(Template,{title:"Sandra Pepper",value:"Personal account",media:/*#__PURE__*/_jsx(Badge,{badge:/*#__PURE__*/_jsx("img",{src:"https://wise.com/public-resources/assets/brand/fast_flag_badge_personal.svg",alt:"",height:"24px",width:"24px"}),children:/*#__PURE__*/_jsx(Avatar,{type:"initials",size:"md",children:/*#__PURE__*/_jsx("span",{"aria-hidden":!0,children:"SP"})})})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"With Avatar and Action"}),/*#__PURE__*/_jsx(Template,{title:"Account holder",value:"Sandra Pepper",media:/*#__PURE__*/_jsx(Badge,{badge:/*#__PURE__*/_jsx("img",{src:"https://wise.com/public-resources/assets/brand/fast_flag_badge_personal.svg",alt:"",height:"24px",width:"24px"}),children:/*#__PURE__*/_jsx(Avatar,{type:"initials",size:"md",children:/*#__PURE__*/_jsx("span",{"aria-hidden":!0,children:"SP"})})}),action:/*#__PURE__*/_jsx(ActionButton,{children:"Share details"})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text Only List"}),/*#__PURE__*/_jsxs("ul",{style:{paddingLeft:0},children:[/*#__PURE__*/_jsx(Template,{title:"Sort code",value:"23-14-71"}),/*#__PURE__*/_jsx(Template,{title:"Account number",value:"12345678"})]})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text With Action Button"}),/*#__PURE__*/_jsx(Template,{title:"SWIFT/BIC",value:"\u2022\u2022\u2022 \u2022\u2022\u2022",action:/*#__PURE__*/_jsx(ActionButton,{onClick:function onClick(){return action("clicked")},children:"Reveal"})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text With Other Action"}),/*#__PURE__*/_jsx(Template,{title:"Account number",value:"123456789",action:/*#__PURE__*/_jsx("button",{type:"button",style:{background:"none",border:0},onClick:function onClick(){return action("clicked")},children:/*#__PURE__*/_jsx(Documents,{size:"24"})})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text With Info Action"}),/*#__PURE__*/_jsx(Template,{title:"Routing number",value:"987654",action:/*#__PURE__*/_jsx(Info,{size:"lg","aria-label":"More information",content:"Use this routing number to receive ACH and Wire transfers."})})]})]})};

package/build/es/no-polyfill/listItem/index.js

@@ -0,0 +1 @@
+export{default}from"./ListItem";

package/build/es/polyfill/common/DOMOperations/DOMOperations.js

@@ -1,9 +1,9 @@
 /**
  * Defined in `Dimmer.less`
- */var NO_SCROLL_CLASS="no-scroll";/**
- * Apply {@link NO_SCROLL_CLASS} that disables scroll on page (e.g use in Dimmer to disable scroll behind the component)
+ */var NO_SCROLL_BODY_CLASS="no-scroll";/**
+ * Apply {@link NO_SCROLL_BODY_CLASS} that disables scroll on page (e.g use in Dimmer to disable scroll behind the component)
  *
- * CSS class needs to be applied for `html` and not `body`, as this doing both will break any position sticky in the document.
- */export var addNoScrollClass=function(){document.documentElement.classList.add(NO_SCROLL_CLASS)};/**
- * Clean up after {@link addNoScrollClass} function
- */export var removeNoScrollClass=function(){document.documentElement.classList.remove(NO_SCROLL_CLASS)};
+ * For a proper disabling, the CSS class needs to be applied for `html` and `body` elements.
+ */export var addNoScrollBodyClass=function(){document.documentElement.classList.add(NO_SCROLL_BODY_CLASS),document.body.classList.add(NO_SCROLL_BODY_CLASS)};/**
+ * Clean up after {@link addNoScrollBodyClass} function
+ */export var removeNoScrollBodyClass=function(){document.documentElement.classList.remove(NO_SCROLL_BODY_CLASS),document.body.classList.remove(NO_SCROLL_BODY_CLASS)};

package/build/es/polyfill/common/DOMOperations/index.js

@@ -1 +1 @@
-import{addNoScrollClass,removeNoScrollClass}from"./DOMOperations";export{addNoScrollClass,removeNoScrollClass};
+import{addNoScrollBodyClass,removeNoScrollBodyClass}from"./DOMOperations";export{addNoScrollBodyClass,removeNoScrollBodyClass};

package/build/es/polyfill/common/index.js

@@ -1,2 +1,2 @@
-export{default as HistoryNavigator}from"./historyNavigator";export*from"./domHelpers";export{addNoScrollClass,removeNoScrollClass}from"./DOMOperations";export*from"./theme";export*from"./direction";// Props
+export{default as HistoryNavigator}from"./historyNavigator";export*from"./domHelpers";export{addNoScrollBodyClass,removeNoScrollBodyClass}from"./DOMOperations";export*from"./theme";export*from"./direction";// Props
 export*from"./propsValues/control";export{Breakpoint}from"./propsValues/breakpoint";export*from"./propsValues/size";export*from"./propsValues/typography";export*from"./propsValues/width";export{Type}from"./propsValues/type";export{DateMode}from"./propsValues/dateMode";export{MonthFormat}from"./propsValues/monthFormat";export*from"./propsValues/position";export{Layout}from"./propsValues/layouts";export{Status}from"./propsValues/status";export{Sentiment}from"./propsValues/sentiment";export{ProfileType}from"./propsValues/profileType";export{Variant}from"./propsValues/variant";export*from"./propsValues/scroll";export{MarkdownNodeType}from"./propsValues/markdownNodeType";export{FileType}from"./fileType";export{Key}from"./key";export*from"./locale";export*from"./commonProps";

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

@@ -1,6 +1,6 @@
-import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import{ThemeProvider,useTheme}from"@wise/components-theming";import classNames from"classnames";import{useCallback,useEffect,useRef,useState}from"react";import CSSTransition from"react-transition-group/CSSTransition";import{addNoScrollClass,removeNoScrollClass}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";import{Fragment as _Fragment}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
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import{ThemeProvider,useTheme}from"@wise/components-theming";import classNames from"classnames";import{useCallback,useEffect,useRef,useState}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";import{Fragment as _Fragment}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.contentPosition,f=a.fadeContentOnEnter,g=void 0!==f&&f,h=a.fadeContentOnExit,i=a.open,j=void 0!==i&&i,k=a.scrollable,l=a.transparent,m=void 0!==l&&l,n=a.onClose,o=useState(!1),p=_slicedToArray(o,2),q=p[0],r=p[1],s=useRef(null),t=function(a){a.target===s.current&&(null===n||void 0===n?void 0:n(a))},u=useCallback(function(a){"Escape"!==a.key||(a.stopPropagation(),n&&s.current&&dimmerManager.isTop(s.current)&&n(a))},[n]);return useEffect(function(){var a=s.current;return j&&(document.addEventListener("keydown",u),null===a||void 0===a?void 0:a.addEventListener("touchmove",handleTouchMove,{passive:!0})),function(){document.removeEventListener("keydown",u),null===a||void 0===a?void 0:a.removeEventListener("touchmove",handleTouchMove)}},[u,j]),/*#__PURE__*/_jsx(DimmerWrapper,{open:j,hasNotExited:q,children:/*#__PURE__*/_jsx(CSSTransition,{nodeRef:s,in:j,appear:!0// Wait for animation to finish before unmount.
-,timeout:{enter:0,exit:EXIT_ANIMATION},classNames:{enter:classNames({"dimmer--enter-fade":g}),enterDone:classNames("dimmer--enter-done",{"dimmer--enter-fade":g}),exit:classNames("dimmer--exit",{"dimmer--exit-fade":void 0!==h&&h})},unmountOnExit:!0,onEnter:function onEnter(){r(!0),s.current&&dimmerManager.add(s.current)},onExited:function onExited(){r(!1),s.current&&dimmerManager.remove(s.current)},children:/*#__PURE__*/_jsx(DimmerContentWrapper,{scrollBody:!m,children:/*#__PURE__*/_jsx(FocusBoundary,{children:/*#__PURE__*/_jsx("div",{ref:s,className:classNames("dimmer",{"dimmer--scrollable":void 0!==k&&k,"dimmer--transparent":m},c),role:"presentation",onClick:function handleClick(a){void 0!==d&&d||!n||t(a)},children:/*#__PURE__*/_jsx("div",{className:classNames("dimmer-content-positioner",null!=e&&["d-flex justify-content-center",{"align-items-start":"top"===e,"align-items-center":"center"===e,"align-items-end":"bottom"===e}]),children:b})})})})})})},DimmerWrapper=function(a){var b=a.open,c=a.hasNotExited,d=a.children,e=useTheme(),f=e.screenMode,g=e.theme;return b||c?/*#__PURE__*/_jsx(ThemeProvider,{theme:g,screenMode:f,isNotRootProvider:!0,children:d}):/*#__PURE__*/_jsx(_Fragment,{children:d})};export var DimmerContentWrapper=function(a){var b=a.children,c=a.scrollBody;return useEffect(function(){return c&&addNoScrollClass(),function(){c&&removeNoScrollClass()}},[c]),b};// Export without the Portal for tests only
+,timeout:{enter:0,exit:EXIT_ANIMATION},classNames:{enter:classNames({"dimmer--enter-fade":g}),enterDone:classNames("dimmer--enter-done",{"dimmer--enter-fade":g}),exit:classNames("dimmer--exit",{"dimmer--exit-fade":void 0!==h&&h})},unmountOnExit:!0,onEnter:function onEnter(){r(!0),s.current&&dimmerManager.add(s.current)},onExited:function onExited(){r(!1),s.current&&dimmerManager.remove(s.current)},children:/*#__PURE__*/_jsx(DimmerContentWrapper,{scrollBody:!m,children:/*#__PURE__*/_jsx(FocusBoundary,{children:/*#__PURE__*/_jsx("div",{ref:s,className:classNames("dimmer",{"dimmer--scrollable":void 0!==k&&k,"dimmer--transparent":m},c),role:"presentation",onClick:function handleClick(a){void 0!==d&&d||!n||t(a)},children:/*#__PURE__*/_jsx("div",{className:classNames("dimmer-content-positioner",null!=e&&["d-flex justify-content-center",{"align-items-start":"top"===e,"align-items-center":"center"===e,"align-items-end":"bottom"===e}]),children:b})})})})})})},DimmerWrapper=function(a){var b=a.open,c=a.hasNotExited,d=a.children,e=useTheme(),f=e.screenMode,g=e.theme;return b||c?/*#__PURE__*/_jsx(ThemeProvider,{theme:g,screenMode:f,isNotRootProvider:!0,children:d}):/*#__PURE__*/_jsx(_Fragment,{children:d})};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/index.js

@@ -2,7 +2,7 @@
  * Types
  */ /**
  * Components
- */export{default as Title}from"./title";export{default as Body}from"./body";export{default as Accordion}from"./accordion";export{default as ActionButton}from"./actionButton";export{default as ActionOption}from"./actionOption";export{default as Alert}from"./alert";export{default as Avatar}from"./avatar";export{default as AvatarWrapper}from"./avatarWrapper";export{default as Badge}from"./badge";export{default as BottomSheet}from"./common/bottomSheet";export{default as Button}from"./button";export{default as Card}from"./card";export{default as Checkbox}from"./checkbox";export{default as CheckboxButton}from"./checkboxButton";export{default as CheckboxOption}from"./checkboxOption";export{default as Chevron}from"./chevron";export{default as Chips,Chip}from"./chips";export{default as CircularButton}from"./circularButton";export{default as DateInput}from"./dateInput";export{default as DateLookup}from"./dateLookup";export{default as Decision}from"./decision";export{default as DefinitionList}from"./definitionList";export{default as Dimmer}from"./dimmer";export{default as Display}from"./display";export{default as Drawer}from"./drawer";export{default as DropFade}from"./dropFade";export{default as DynamicFieldDefinitionList}from"./dynamicFieldDefinitionList";export{default as Emphasis}from"./emphasis";export{default as FlowNavigation}from"./flowNavigation";export{default as Header}from"./header";export{default as Image}from"./image";export{default as Info}from"./info";export{default as InlineAlert}from"./inlineAlert";export{Input}from"./inputs/Input";export{TextArea}from"./inputs/TextArea";export{default as InputWithDisplayFormat}from"./inputWithDisplayFormat";export{default as InstructionsList}from"./instructionsList";export{default as Link}from"./link";export{default as Loader}from"./loader";export{default as Logo}from"./logo";export{default as Markdown}from"./markdown";export{default as Modal}from"./modal";export{default as Money}from"./money";export{default as MoneyInput}from"./moneyInput";export{default as NavigationOption}from"./navigationOption";export{default as NavigationOptionsList}from"./navigationOptionsList";export{default as Nudge}from"./nudge";export{default as Option}from"./common/Option";export{default as OverlayHeader}from"./overlayHeader";export{default as PhoneNumberInput}from"./phoneNumberInput";export{default as Popover}from"./popover";export{default as ProcessIndicator}from"./processIndicator";export{default as ProgressBar}from"./progressBar";export{default as Progress}from"./progress";export{default as Provider,DirectionProvider,LanguageProvider}from"./provider";export{default as Radio}from"./radio";export{default as RadioGroup}from"./radioGroup";export{default as RadioOption}from"./radioOption";export{default as Section}from"./section";export{default as Select}from"./select";export{default as SlidingPanel}from"./slidingPanel";export{default as SnackbarPortal}from"./snackbar/Snackbar";export{default as SnackbarProvider}from"./snackbar/SnackbarProvider";export{default as StatusIcon}from"./statusIcon/StatusIcon";export{default as Stepper}from"./stepper";export{default as Sticky}from"./sticky";export{default as Summary}from"./summary";export{default as Switch}from"./switch";export{default as SwitchOption}from"./switchOption";export{default as Tabs}from"./tabs";export{default as TextareaWithDisplayFormat}from"./textareaWithDisplayFormat";export{default as Tooltip}from"./tooltip";export{default as Typeahead}from"./typeahead";export{default as Upload}from"./upload";export{default as UploadInput}from"./uploadInput";export{SnackbarConsumer,SnackbarContext}from"./snackbar/SnackbarContext";export{default as CriticalCommsBanner}from"./criticalBanner";/**
+ */export{default as Title}from"./title";export{default as Body}from"./body";export{default as Accordion}from"./accordion";export{default as ActionButton}from"./actionButton";export{default as ActionOption}from"./actionOption";export{default as Alert}from"./alert";export{default as Avatar}from"./avatar";export{default as AvatarWrapper}from"./avatarWrapper";export{default as Badge}from"./badge";export{default as BottomSheet}from"./common/bottomSheet";export{default as Button}from"./button";export{default as Card}from"./card";export{default as Checkbox}from"./checkbox";export{default as CheckboxButton}from"./checkboxButton";export{default as CheckboxOption}from"./checkboxOption";export{default as Chevron}from"./chevron";export{default as Chips,Chip}from"./chips";export{default as CircularButton}from"./circularButton";export{default as DateInput}from"./dateInput";export{default as DateLookup}from"./dateLookup";export{default as Decision}from"./decision";export{default as DefinitionList}from"./definitionList";export{default as Dimmer}from"./dimmer";export{default as Display}from"./display";export{default as Drawer}from"./drawer";export{default as DropFade}from"./dropFade";export{default as DynamicFieldDefinitionList}from"./dynamicFieldDefinitionList";export{default as Emphasis}from"./emphasis";export{default as FlowNavigation}from"./flowNavigation";export{default as Header}from"./header";export{default as Image}from"./image";export{default as Info}from"./info";export{default as InlineAlert}from"./inlineAlert";export{Input}from"./inputs/Input";export{TextArea}from"./inputs/TextArea";export{default as InputWithDisplayFormat}from"./inputWithDisplayFormat";export{default as InstructionsList}from"./instructionsList";export{default as Link}from"./link";export{default as Loader}from"./loader";export{default as Logo}from"./logo";export{default as Markdown}from"./markdown";export{default as Modal}from"./modal";export{default as Money}from"./money";export{default as MoneyInput}from"./moneyInput";export{default as NavigationOption}from"./navigationOption";export{default as NavigationOptionsList}from"./navigationOptionsList";export{default as Nudge}from"./nudge";export{default as Option}from"./common/Option";export{default as OverlayHeader}from"./overlayHeader";export{default as PhoneNumberInput}from"./phoneNumberInput";export{default as Popover}from"./popover";export{default as ProcessIndicator}from"./processIndicator";export{default as ProgressBar}from"./progressBar";export{default as Progress}from"./progress";export{default as Provider,DirectionProvider,LanguageProvider}from"./provider";export{default as Radio}from"./radio";export{default as RadioGroup}from"./radioGroup";export{default as RadioOption}from"./radioOption";export{default as Section}from"./section";export{default as Select}from"./select";export{default as SlidingPanel}from"./slidingPanel";export{default as SnackbarPortal}from"./snackbar/Snackbar";export{default as SnackbarProvider}from"./snackbar/SnackbarProvider";export{default as StatusIcon}from"./statusIcon/StatusIcon";export{default as Stepper}from"./stepper";export{default as Sticky}from"./sticky";export{default as Summary}from"./summary";export{default as Switch}from"./switch";export{default as SwitchOption}from"./switchOption";export{default as Tabs}from"./tabs";export{default as TextareaWithDisplayFormat}from"./textareaWithDisplayFormat";export{default as Tooltip}from"./tooltip";export{default as Typeahead}from"./typeahead";export{default as Upload}from"./upload";export{default as UploadInput}from"./uploadInput";export{SnackbarConsumer,SnackbarContext}from"./snackbar/SnackbarContext";export{default as CriticalCommsBanner}from"./criticalBanner";export{default as ListItem}from"./listItem";/**
  * Hooks
  */export{default as useSnackbar}from"./snackbar/useSnackbar";export{useDirection,useLayout}from"./common/hooks";/**
  * Enums

package/build/es/polyfill/listItem/ListItem.js

@@ -0,0 +1 @@
+import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["media","action","className","title","value","isContainerAligned","as"];import"core-js/modules/es.object.keys.js";import"core-js/modules/es.symbol.js";import"core-js/modules/es.array.filter.js";import"core-js/modules/es.object.to-string.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";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 Body from"../body/Body";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var ListItem=function(a){var b=a.media,c=a.action,d=a.className,e=a.title,f=a.value,g=a.isContainerAligned,h=a.as,i=void 0===h?"li":h,j=_objectWithoutProperties(a,_excluded);return/*#__PURE__*/_jsxs(i,_objectSpread(_objectSpread({className:classNames("list-item d-flex align-items-center p-y-2",d,{"p-x-2":!g})},j),{},{children:[b?b:null,/*#__PURE__*/_jsxs("div",{className:classNames("d-flex flex-column",{"p-l-2":!!b,"p-r-2":!!c}),children:[/*#__PURE__*/_jsx(Body,{type:"body-default",className:"text-secondary m-b-0",children:e}),f&&/*#__PURE__*/_jsx(Body,{type:"body-large",className:"text-primary m-b-0",children:f})]}),c?/*#__PURE__*/_jsx("div",{className:"list-item__action m-l-auto",children:c}):null]}))};export default ListItem;

package/build/es/polyfill/listItem/ListItem.spec.js

@@ -0,0 +1 @@
+import _asyncToGenerator from"@babel/runtime/helpers/asyncToGenerator";import _regeneratorRuntime from"@babel/runtime/regenerator";import"@testing-library/jest-dom";import ActionButton from"../actionButton/ActionButton";import{render,screen,within}from"../test-utils";import ListItem from".";import{jsx as _jsx}from"react/jsx-runtime";describe("ListItem",function(){it("shows the title and description",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function b(){var c;return _regeneratorRuntime.wrap(function(b){for(;;)switch(b.prev=b.next){case 0:return render(/*#__PURE__*/_jsx(ListItem,{title:"Some title",value:"Some description",as:"li"})),b.next=3,a();case 3:c=b.sent,expect(c).toHaveClass("list-item"),expect(within(c).getByText("Some title")).toBeInTheDocument(),expect(within(c).getByText("Some description")).toBeInTheDocument();case 7:case"end":return b.stop();}},b)}))),it("shows an action",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function b(){var c,d;return _regeneratorRuntime.wrap(function(b){for(;;)switch(b.prev=b.next){case 0:return render(/*#__PURE__*/_jsx(ListItem,{title:"Account number",value:"123",action:/*#__PURE__*/_jsx(ActionButton,{children:"Copy"})})),b.next=3,a();case 3:return c=b.sent,b.next=6,within(c).findByRole("button",{name:"Copy"});case 6:d=b.sent,expect(d).toBeInTheDocument();case 8:case"end":return b.stop();}},b)}))),it("shows media icon",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function b(){var c;return _regeneratorRuntime.wrap(function(b){for(;;)switch(b.prev=b.next){case 0:return render(/*#__PURE__*/_jsx(ListItem,{title:"Some title",value:"Some desctiption",media:/*#__PURE__*/_jsx("img",{style:{width:32,height:32},src:"https://wise.com/public-resources/assets/balances/savings-emoji/google/\u2708\uFE0F.png",alt:"icon"})})),b.next=3,a();case 3:c=b.sent,expect(within(c).getByAltText("icon")).toBeInTheDocument();case 5:case"end":return b.stop();}},b)})));var a=/*#__PURE__*/function(){var a=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function a(){return _regeneratorRuntime.wrap(function(a){for(;;)switch(a.prev=a.next){case 0:return a.abrupt("return",screen.findByRole("listitem"));case 1:case"end":return a.stop();}},a)}));return function(){return a.apply(this,arguments)}}()});

package/build/es/polyfill/listItem/ListItem.story.js

@@ -0,0 +1 @@
+import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["title","value"];import"core-js/modules/es.object.keys.js";import"core-js/modules/es.symbol.js";import"core-js/modules/es.array.filter.js";import"core-js/modules/es.object.to-string.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";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}/* eslint-disable react/jsx-child-element-spacing */import{action}from"@storybook/addon-actions";import{Documents}from"@transferwise/icons";import ActionButton from"../actionButton/ActionButton";import Avatar from"../avatar";import Badge from"../badge";import Info from"../info";import Title from"../title/Title";import ListItem from".";import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{component:ListItem,title:"Other/ListItem",tags:["autodocs"]};var Template=function(a){var b=a.title,c=void 0===b?"Wise":b,d=a.value,e=void 0===d?"We\u2019re building the world\u2019s most international account":d,f=_objectWithoutProperties(a,_excluded);return/*#__PURE__*/_jsx(ListItem,_objectSpread({title:c,value:e},f))};export var Basic=function(){return/*#__PURE__*/_jsx(_Fragment,{children:/*#__PURE__*/_jsx(ListItem,{title:"Wise",value:"We\u2019re building the world's most international account"})})};export var Variants=function(){return/*#__PURE__*/_jsxs("div",{children:[/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"With Icon Avatar"}),/*#__PURE__*/_jsx(Template,{media:/*#__PURE__*/_jsx(Avatar,{children:/*#__PURE__*/_jsx("img",{style:{width:32,height:32},src:"https://wise.com/public-resources/assets/balances/savings-emoji/google/\u2708\uFE0F.png",alt:""})})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"With Contact Avatar"}),/*#__PURE__*/_jsx(Template,{title:"Sandra Pepper",value:"Personal account",media:/*#__PURE__*/_jsx(Badge,{badge:/*#__PURE__*/_jsx("img",{src:"https://wise.com/public-resources/assets/brand/fast_flag_badge_personal.svg",alt:"",height:"24px",width:"24px"}),children:/*#__PURE__*/_jsx(Avatar,{type:"initials",size:"md",children:/*#__PURE__*/_jsx("span",{"aria-hidden":!0,children:"SP"})})})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"With Avatar and Action"}),/*#__PURE__*/_jsx(Template,{title:"Account holder",value:"Sandra Pepper",media:/*#__PURE__*/_jsx(Badge,{badge:/*#__PURE__*/_jsx("img",{src:"https://wise.com/public-resources/assets/brand/fast_flag_badge_personal.svg",alt:"",height:"24px",width:"24px"}),children:/*#__PURE__*/_jsx(Avatar,{type:"initials",size:"md",children:/*#__PURE__*/_jsx("span",{"aria-hidden":!0,children:"SP"})})}),action:/*#__PURE__*/_jsx(ActionButton,{children:"Share details"})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text Only List"}),/*#__PURE__*/_jsxs("ul",{style:{paddingLeft:0},children:[/*#__PURE__*/_jsx(Template,{title:"Sort code",value:"23-14-71"}),/*#__PURE__*/_jsx(Template,{title:"Account number",value:"12345678"})]})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text With Action Button"}),/*#__PURE__*/_jsx(Template,{title:"SWIFT/BIC",value:"\u2022\u2022\u2022 \u2022\u2022\u2022",action:/*#__PURE__*/_jsx(ActionButton,{onClick:function onClick(){return action("clicked")},children:"Reveal"})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text With Other Action"}),/*#__PURE__*/_jsx(Template,{title:"Account number",value:"123456789",action:/*#__PURE__*/_jsx("button",{type:"button",style:{background:"none",border:0},onClick:function onClick(){return action("clicked")},children:/*#__PURE__*/_jsx(Documents,{size:"24"})})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text With Info Action"}),/*#__PURE__*/_jsx(Template,{title:"Routing number",value:"987654",action:/*#__PURE__*/_jsx(Info,{size:"lg","aria-label":"More information",content:"Use this routing number to receive ACH and Wire transfers."})})]})]})};

package/build/es/polyfill/listItem/index.js

@@ -0,0 +1 @@
+export{default}from"./ListItem";