npm - @transferwise/components - Versions diffs - 43.11.42 → 43.11.44 - Mend

@transferwise/components 43.11.42 → 43.11.44

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.

Files changed (9) hide show

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

@@ -6,4 +6,4 @@
  * 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)};
+ */export var removeNoScrollBodyClass=function(){var a=document.querySelectorAll("div.dimmer");0===a.length&&(document.documentElement.classList.remove(NO_SCROLL_BODY_CLASS),document.body.classList.remove(NO_SCROLL_BODY_CLASS))};

package/build/es/no-polyfill/display/Display.story.js CHANGED Viewed

	@@ -1 +1 @@
1	- /* eslint-disable jsx-a11y/accessible-emoji /import{Typography}from"../common";import Money from"../money/Money";import Title from"../title/Title";import Display from"./Display";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";export default{title:"Typography/Display"};export var Basic=function(){var a=/#__PURE__/_jsx("div",{children:"ABCDEFGHIJKLMNOPQRSTUVWXYZ"}),b=/#__PURE__/_jsx("div",{children:"\xC4\xD6\xDC\u1E9EABCDEFGHIJKLMNOPQRSTUVWXYZ"}),c=/#__PURE__/_jsx("div",{children:"\u0410\u0411\u0412\u0413\u0490\u0414\u0415\u0404\u0416\u0417\u0418\u0406\u0407\u0419\u041A\u041B\u041C\u041D\u041E\u041F\u0420\u0421\u0422\u0423\u0424\u0425\u0426\u0427\u0428\u0429\u042C\u042E\u042F"}),d=/#__PURE__/_jsx("div",{children:"\u3041\u3042\u3043\u3044\u3045\u3046\u3047\u3048\u3049\u304A\u304B\u304C\u304D\u304E\u304F\u3050\u3051\u3052\u3053\u3054\u3055\u3056\u3057\u3058\u3059\u305A\u305B\u305C\u305D\u305E\u305F\u3060\u3061\u3062\u3063\u3064\u3065\u3066\u3067"});return/#__PURE__/_jsxs(_Fragment,{children:[/#__PURE__/_jsxs("html",{lang:"ja",children:[/#__PURE__/_jsx("h1",{children:"Default case, example being \uD83C\uDDEF\uD83C\uDDF5"}),/#__PURE__/_jsx("h4",{children:"This is close to the right formatting but to get it perfect, change locale on the right to ja-JP"}),"Extra Large",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:d}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_LARGE,children:d}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_MEDIUM,children:d}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_SMALL,children:d})]}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsxs("html",{lang:"en",children:[/#__PURE__/_jsx("h1",{children:"First fallback is \uD83C\uDDEC\uD83C\uDDE7"}),"Extra Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:[a,a]}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_LARGE,children:[a,a]}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_MEDIUM,children:[a,a]}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_SMALL,children:[a,a]})]}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsxs("html",{lang:"de",children:[/#__PURE__/_jsx("h1",{children:"Next fallback is many languages including \uD83C\uDDE9\uD83C\uDDEA (only change is line-height being ~~120%~~)"}),"Extra Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:[b,b]}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_LARGE,children:[b,b]}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_MEDIUM,children:[b,b]}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_SMALL,children:[b,b]})]}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsxs("html",{lang:"uk",children:[/#__PURE__/_jsx("h1",{children:"Final fallback are Greek and Cyrillic lanugages like \uD83C\uDDFA\uD83C\uDDE6"}),"Extra Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:[c,c]}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_LARGE,children:[c,c]}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_MEDIUM,children:[c,c]}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_SMALL,children:[c,c]})]})]})};export var Numbers=function(){return/#__PURE__/_jsxs(_Fragment,{children:[/#__PURE__/_jsx(Title,{type:Typography.TITLE_SCREEN,children:"Display Number"}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:1050.6,currency:"UAH"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:10.17,currency:"JPY"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:.01,currency:"EUR"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:1e6,currency:"EUR"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__*/_jsx(Money,{amount:1e6,currency:"GBP"})})]})};
1	+ /* eslint-disable jsx-a11y/accessible-emoji /import{Typography}from"../common";import Money from"../money/Money";import Title from"../title/Title";import Display from"./Display";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";export default{title:"Typography/Display"};export var Basic=function(){var a=/#__PURE__/_jsx("div",{children:"ABCDEFGHIJKLMNOPQRSTUVWXYZ"}),b=/#__PURE__/_jsx("div",{children:"\xC4\xD6\xDC\u1E9EABCDEFGHIJKLMNOPQRSTUVWXYZ"}),c=/#__PURE__/_jsx("div",{children:"\u0410\u0411\u0412\u0413\u0490\u0414\u0415\u0404\u0416\u0417\u0418\u0406\u0407\u0419\u041A\u041B\u041C\u041D\u041E\u041F\u0420\u0421\u0422\u0423\u0424\u0425\u0426\u0427\u0428\u0429\u042C\u042E\u042F"}),d=/#__PURE__/_jsx("div",{children:"\u3041\u3042\u3043\u3044\u3045\u3046\u3047\u3048\u3049\u304A\u304B\u304C\u304D\u304E\u304F\u3050\u3051\u3052\u3053\u3054\u3055\u3056\u3057\u3058\u3059\u305A\u305B\u305C\u305D\u305E\u305F\u3060\u3061\u3062\u3063\u3064\u3065\u3066\u3067"});return/#__PURE__/_jsxs(_Fragment,{children:[/#__PURE__/_jsxs("html",{lang:"ja",children:[/#__PURE__/_jsx("h1",{children:"Default case, example being \uD83C\uDDEF\uD83C\uDDF5"}),/#__PURE__/_jsx("h4",{children:"This is close to the right formatting but to get it perfect, change locale on the right to ja-JP"}),"Extra Large",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:d}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_LARGE,children:d}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_MEDIUM,children:d}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_SMALL,children:d})]}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsxs("html",{lang:"en",children:[/#__PURE__/_jsx("h1",{children:"First fallback is \uD83C\uDDEC\uD83C\uDDE7"}),"Extra Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:[a,a]}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_LARGE,children:[a,a]}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_MEDIUM,children:[a,a]}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_SMALL,children:[a,a]})]}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsxs("html",{lang:"de",children:[/#__PURE__/_jsx("h1",{children:"Next fallback is many languages including \uD83C\uDDE9\uD83C\uDDEA (only change is line-height being increased)"}),"Extra Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:[b,b]}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_LARGE,children:[b,b]}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_MEDIUM,children:[b,b]}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_SMALL,children:[b,b]})]}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsxs("html",{lang:"uk",children:[/#__PURE__/_jsx("h1",{children:"Final fallback are Greek and Cyrillic lanugages like \uD83C\uDDFA\uD83C\uDDE6"}),"Extra Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:[c,c]}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_LARGE,children:[c,c]}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_MEDIUM,children:[c,c]}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_SMALL,children:[c,c]})]})]})};export var Numbers=function(){return/#__PURE__/_jsxs(_Fragment,{children:[/#__PURE__/_jsx(Title,{type:Typography.TITLE_SCREEN,children:"Display Number"}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:1050.6,currency:"UAH"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:10.17,currency:"JPY"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:.01,currency:"EUR"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:1e6,currency:"EUR"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__*/_jsx(Money,{amount:1e6,currency:"GBP"})})]})};

package/build/es/no-polyfill/drawer/Drawer.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{useTheme}from"@wise/components-theming";import classNames from"classnames";import PropTypes from"prop-types";import{Position,Typography}from"../common";import CloseButton from"../common/closeButton";import{useLayout}from"../common/hooks";import Dimmer from"../dimmer";import SlidingPanel from"../slidingPanel";import Title from"../title";import{logActionRequiredIf}from"../utilities";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var Drawer=function(a){var b=a.children,c=a.className,d=a.footerContent,e=a.headerTitle,f=a.onClose,g=a.open,h=a.position;logActionRequiredIf("Drawer now expects `onClose`, and will soon make this prop required. Please update your usage to provide it.",!f);var i=useLayout(),j=i.isMobile,k=useTheme(),l=k.theme,m=k.isModern;return~~/#~~__PURE__/_jsx(Dimmer,{open:g,onClose:f,children:/#__PURE__/_jsx(SlidingPanel,{open:g,position:j?Position.BOTTOM:h,children:/#__PURE__/_jsxs("div",{className:classNames("np-drawer","np-theme-".concat(l),c),children:[/#__PURE__/_jsxs("div",{className:classNames("np-drawer-header",{"np-drawer-header--withborder":e}),children:[e&&/#__PURE__/_jsx(Title,{type:Typography.TITLE_BODY,children:e}),/#__PURE__/_jsx(CloseButton,{onClick:f})]}),b&&/#__PURE__/_jsx("div",{className:classNames("np-drawer-content"),children:b}),d&&/#__PURE__/_jsx("div",{className:classNames("np-drawer-footer"),children:d})]})})})};Drawer.propTypes={/** The content to appear in the drawer body. /children:PropTypes.node,className:PropTypes.string,/* The content to appear in the drawer footer. /footerContent:PropTypes.node,/* The content to appear in the drawer header. /headerTitle:PropTypes.node,/* The action to perform on close click. /onClose:PropTypes.func,/* The status of Drawer either open or not. /open:PropTypes.bool,/* The placement of Drawer on the screen either left or right. On mobile it will default to bottom. */position:PropTypes.oneOf(["left","right","bottom"])},Drawer.defaultProps={children:null,className:void 0,footerContent:null,headerTitle:null,onClose:null,open:!1,position:Position.RIGHT};export default Drawer;
1	+ 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{useTheme}from"@wise/components-theming";import classNames from"classnames";import PropTypes from"prop-types";import{useState,useEffect}from"react";import{Position,Typography}from"../common";import CloseButton from"../common/closeButton";import{useLayout}from"../common/hooks";import Dimmer from"../dimmer";import SlidingPanel from"../slidingPanel";import Title from"../title";import{logActionRequiredIf}from"../utilities";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var Drawer=function(a){var b=a.children,c=a.className,d=a.footerContent,e=a.headerTitle,f=a.onClose,g=a.open,h=a.position;logActionRequiredIf("Drawer now expects `onClose`, and will soon make this prop required. Please update your usage to provide it.",!f);var i=useLayout(),j=i.isMobile,k=useTheme(),l=k.theme,m=k.isModern,n=useState(null),o=_slicedToArray(n,2),p=o[0],q=o[1];return useEffect(function(){function a(){q(window.innerHeight)}return j&&window.addEventListener("resize",a),function(){window.removeEventListener("resize",a)}},[p,j]),/#__PURE__/_jsx(Dimmer,{open:g,onClose:f,children:/#__PURE__/_jsx(SlidingPanel,{open:g,position:j?Position.BOTTOM:h,children:/#__PURE__/_jsxs("div",_objectSpread(_objectSpread({},null!==p&&{style:{height:"".concat(p,"px")}}),{},{className:classNames("np-drawer","np-theme-".concat(l),c),children:[/#__PURE__/_jsxs("div",{className:classNames("np-drawer-header",{"np-drawer-header--withborder":e}),children:[e&&/#__PURE__/_jsx(Title,{type:Typography.TITLE_BODY,children:e}),/#__PURE__/_jsx(CloseButton,{onClick:f})]}),b&&/#__PURE__/_jsx("div",{className:classNames("np-drawer-content"),children:b}),d&&/#__PURE__/_jsx("div",{className:classNames("np-drawer-footer"),children:d})]}))})})};Drawer.propTypes={/** The content to appear in the drawer body. /children:PropTypes.node,className:PropTypes.string,/* The content to appear in the drawer footer. /footerContent:PropTypes.node,/* The content to appear in the drawer header. /headerTitle:PropTypes.node,/* The action to perform on close click. /onClose:PropTypes.func,/* The status of Drawer either open or not. /open:PropTypes.bool,/* The placement of Drawer on the screen either left or right. On mobile it will default to bottom. */position:PropTypes.oneOf(["left","right","bottom"])},Drawer.defaultProps={children:null,className:void 0,footerContent:null,headerTitle:null,onClose:null,open:!1,position:Position.RIGHT};export default Drawer;

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

@@ -6,4 +6,4 @@
  * 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)};
+ */export var removeNoScrollBodyClass=function(){var a=document.querySelectorAll("div.dimmer");0===a.length&&(document.documentElement.classList.remove(NO_SCROLL_BODY_CLASS),document.body.classList.remove(NO_SCROLL_BODY_CLASS))};

package/build/es/polyfill/display/Display.story.js CHANGED Viewed

	@@ -1 +1 @@
1	- /* eslint-disable jsx-a11y/accessible-emoji /import{Typography}from"../common";import Money from"../money/Money";import Title from"../title/Title";import Display from"./Display";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";export default{title:"Typography/Display"};export var Basic=function(){var a=/#__PURE__/_jsx("div",{children:"ABCDEFGHIJKLMNOPQRSTUVWXYZ"}),b=/#__PURE__/_jsx("div",{children:"\xC4\xD6\xDC\u1E9EABCDEFGHIJKLMNOPQRSTUVWXYZ"}),c=/#__PURE__/_jsx("div",{children:"\u0410\u0411\u0412\u0413\u0490\u0414\u0415\u0404\u0416\u0417\u0418\u0406\u0407\u0419\u041A\u041B\u041C\u041D\u041E\u041F\u0420\u0421\u0422\u0423\u0424\u0425\u0426\u0427\u0428\u0429\u042C\u042E\u042F"}),d=/#__PURE__/_jsx("div",{children:"\u3041\u3042\u3043\u3044\u3045\u3046\u3047\u3048\u3049\u304A\u304B\u304C\u304D\u304E\u304F\u3050\u3051\u3052\u3053\u3054\u3055\u3056\u3057\u3058\u3059\u305A\u305B\u305C\u305D\u305E\u305F\u3060\u3061\u3062\u3063\u3064\u3065\u3066\u3067"});return/#__PURE__/_jsxs(_Fragment,{children:[/#__PURE__/_jsxs("html",{lang:"ja",children:[/#__PURE__/_jsx("h1",{children:"Default case, example being \uD83C\uDDEF\uD83C\uDDF5"}),/#__PURE__/_jsx("h4",{children:"This is close to the right formatting but to get it perfect, change locale on the right to ja-JP"}),"Extra Large",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:d}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_LARGE,children:d}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_MEDIUM,children:d}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_SMALL,children:d})]}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsxs("html",{lang:"en",children:[/#__PURE__/_jsx("h1",{children:"First fallback is \uD83C\uDDEC\uD83C\uDDE7"}),"Extra Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:[a,a]}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_LARGE,children:[a,a]}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_MEDIUM,children:[a,a]}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_SMALL,children:[a,a]})]}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsxs("html",{lang:"de",children:[/#__PURE__/_jsx("h1",{children:"Next fallback is many languages including \uD83C\uDDE9\uD83C\uDDEA (only change is line-height being ~~120%~~)"}),"Extra Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:[b,b]}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_LARGE,children:[b,b]}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_MEDIUM,children:[b,b]}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_SMALL,children:[b,b]})]}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsxs("html",{lang:"uk",children:[/#__PURE__/_jsx("h1",{children:"Final fallback are Greek and Cyrillic lanugages like \uD83C\uDDFA\uD83C\uDDE6"}),"Extra Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:[c,c]}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_LARGE,children:[c,c]}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_MEDIUM,children:[c,c]}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_SMALL,children:[c,c]})]})]})};export var Numbers=function(){return/#__PURE__/_jsxs(_Fragment,{children:[/#__PURE__/_jsx(Title,{type:Typography.TITLE_SCREEN,children:"Display Number"}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:1050.6,currency:"UAH"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:10.17,currency:"JPY"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:.01,currency:"EUR"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:1e6,currency:"EUR"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__*/_jsx(Money,{amount:1e6,currency:"GBP"})})]})};
1	+ /* eslint-disable jsx-a11y/accessible-emoji /import{Typography}from"../common";import Money from"../money/Money";import Title from"../title/Title";import Display from"./Display";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";export default{title:"Typography/Display"};export var Basic=function(){var a=/#__PURE__/_jsx("div",{children:"ABCDEFGHIJKLMNOPQRSTUVWXYZ"}),b=/#__PURE__/_jsx("div",{children:"\xC4\xD6\xDC\u1E9EABCDEFGHIJKLMNOPQRSTUVWXYZ"}),c=/#__PURE__/_jsx("div",{children:"\u0410\u0411\u0412\u0413\u0490\u0414\u0415\u0404\u0416\u0417\u0418\u0406\u0407\u0419\u041A\u041B\u041C\u041D\u041E\u041F\u0420\u0421\u0422\u0423\u0424\u0425\u0426\u0427\u0428\u0429\u042C\u042E\u042F"}),d=/#__PURE__/_jsx("div",{children:"\u3041\u3042\u3043\u3044\u3045\u3046\u3047\u3048\u3049\u304A\u304B\u304C\u304D\u304E\u304F\u3050\u3051\u3052\u3053\u3054\u3055\u3056\u3057\u3058\u3059\u305A\u305B\u305C\u305D\u305E\u305F\u3060\u3061\u3062\u3063\u3064\u3065\u3066\u3067"});return/#__PURE__/_jsxs(_Fragment,{children:[/#__PURE__/_jsxs("html",{lang:"ja",children:[/#__PURE__/_jsx("h1",{children:"Default case, example being \uD83C\uDDEF\uD83C\uDDF5"}),/#__PURE__/_jsx("h4",{children:"This is close to the right formatting but to get it perfect, change locale on the right to ja-JP"}),"Extra Large",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:d}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_LARGE,children:d}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_MEDIUM,children:d}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsx(Display,{type:Typography.DISPLAY_SMALL,children:d})]}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsxs("html",{lang:"en",children:[/#__PURE__/_jsx("h1",{children:"First fallback is \uD83C\uDDEC\uD83C\uDDE7"}),"Extra Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:[a,a]}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_LARGE,children:[a,a]}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_MEDIUM,children:[a,a]}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_SMALL,children:[a,a]})]}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsxs("html",{lang:"de",children:[/#__PURE__/_jsx("h1",{children:"Next fallback is many languages including \uD83C\uDDE9\uD83C\uDDEA (only change is line-height being increased)"}),"Extra Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:[b,b]}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_LARGE,children:[b,b]}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_MEDIUM,children:[b,b]}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_SMALL,children:[b,b]})]}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsxs("html",{lang:"uk",children:[/#__PURE__/_jsx("h1",{children:"Final fallback are Greek and Cyrillic lanugages like \uD83C\uDDFA\uD83C\uDDE6"}),"Extra Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_EXTRA_LARGE,children:[c,c]}),/#__PURE__/_jsx("hr",{}),"Large",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_LARGE,children:[c,c]}),/#__PURE__/_jsx("hr",{}),"Medium",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_MEDIUM,children:[c,c]}),/#__PURE__/_jsx("hr",{}),"Small",/#__PURE__/_jsxs(Display,{type:Typography.DISPLAY_SMALL,children:[c,c]})]})]})};export var Numbers=function(){return/#__PURE__/_jsxs(_Fragment,{children:[/#__PURE__/_jsx(Title,{type:Typography.TITLE_SCREEN,children:"Display Number"}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:1050.6,currency:"UAH"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:10.17,currency:"JPY"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:.01,currency:"EUR"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__/_jsx(Money,{amount:1e6,currency:"EUR"})}),/#__PURE__/_jsx("hr",{}),/#__PURE__/_jsx("div",{className:"np-text-display-number",children:/#__PURE__*/_jsx(Money,{amount:1e6,currency:"GBP"})})]})};

package/build/es/polyfill/drawer/Drawer.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{useTheme}from"@wise/components-theming";import classNames from"classnames";import PropTypes from"prop-types";import{Position,Typography}from"../common";import CloseButton from"../common/closeButton";import{useLayout}from"../common/hooks";import Dimmer from"../dimmer";import SlidingPanel from"../slidingPanel";import Title from"../title";import{logActionRequiredIf}from"../utilities";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var Drawer=function(a){var b=a.children,c=a.className,d=a.footerContent,e=a.headerTitle,f=a.onClose,g=a.open,h=a.position;logActionRequiredIf("Drawer now expects `onClose`, and will soon make this prop required. Please update your usage to provide it.",!f);var i=useLayout(),j=i.isMobile,k=useTheme(),l=k.theme,m=k.isModern;return~~/#~~__PURE__/_jsx(Dimmer,{open:g,onClose:f,children:/#__PURE__/_jsx(SlidingPanel,{open:g,position:j?Position.BOTTOM:h,children:/#__PURE__/_jsxs("div",{className:classNames("np-drawer","np-theme-".concat(l),c),children:[/#__PURE__/_jsxs("div",{className:classNames("np-drawer-header",{"np-drawer-header--withborder":e}),children:[e&&/#__PURE__/_jsx(Title,{type:Typography.TITLE_BODY,children:e}),/#__PURE__/_jsx(CloseButton,{onClick:f})]}),b&&/#__PURE__/_jsx("div",{className:classNames("np-drawer-content"),children:b}),d&&/#__PURE__/_jsx("div",{className:classNames("np-drawer-footer"),children:d})]})})})};Drawer.propTypes={/** The content to appear in the drawer body. /children:PropTypes.node,className:PropTypes.string,/* The content to appear in the drawer footer. /footerContent:PropTypes.node,/* The content to appear in the drawer header. /headerTitle:PropTypes.node,/* The action to perform on close click. /onClose:PropTypes.func,/* The status of Drawer either open or not. /open:PropTypes.bool,/* The placement of Drawer on the screen either left or right. On mobile it will default to bottom. */position:PropTypes.oneOf(["left","right","bottom"])},Drawer.defaultProps={children:null,className:void 0,footerContent:null,headerTitle:null,onClose:null,open:!1,position:Position.RIGHT};export default Drawer;
1	+ import _defineProperty from"@babel/runtime/helpers/defineProperty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";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{useTheme}from"@wise/components-theming";import classNames from"classnames";import PropTypes from"prop-types";import{useState,useEffect}from"react";import{Position,Typography}from"../common";import CloseButton from"../common/closeButton";import{useLayout}from"../common/hooks";import Dimmer from"../dimmer";import SlidingPanel from"../slidingPanel";import Title from"../title";import{logActionRequiredIf}from"../utilities";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var Drawer=function(a){var b=a.children,c=a.className,d=a.footerContent,e=a.headerTitle,f=a.onClose,g=a.open,h=a.position;logActionRequiredIf("Drawer now expects `onClose`, and will soon make this prop required. Please update your usage to provide it.",!f);var i=useLayout(),j=i.isMobile,k=useTheme(),l=k.theme,m=k.isModern,n=useState(null),o=_slicedToArray(n,2),p=o[0],q=o[1];return useEffect(function(){function a(){q(window.innerHeight)}return j&&window.addEventListener("resize",a),function(){window.removeEventListener("resize",a)}},[p,j]),/#__PURE__/_jsx(Dimmer,{open:g,onClose:f,children:/#__PURE__/_jsx(SlidingPanel,{open:g,position:j?Position.BOTTOM:h,children:/#__PURE__/_jsxs("div",_objectSpread(_objectSpread({},null!==p&&{style:{height:"".concat(p,"px")}}),{},{className:classNames("np-drawer","np-theme-".concat(l),c),children:[/#__PURE__/_jsxs("div",{className:classNames("np-drawer-header",{"np-drawer-header--withborder":e}),children:[e&&/#__PURE__/_jsx(Title,{type:Typography.TITLE_BODY,children:e}),/#__PURE__/_jsx(CloseButton,{onClick:f})]}),b&&/#__PURE__/_jsx("div",{className:classNames("np-drawer-content"),children:b}),d&&/#__PURE__/_jsx("div",{className:classNames("np-drawer-footer"),children:d})]}))})})};Drawer.propTypes={/** The content to appear in the drawer body. /children:PropTypes.node,className:PropTypes.string,/* The content to appear in the drawer footer. /footerContent:PropTypes.node,/* The content to appear in the drawer header. /headerTitle:PropTypes.node,/* The action to perform on close click. /onClose:PropTypes.func,/* The status of Drawer either open or not. /open:PropTypes.bool,/* The placement of Drawer on the screen either left or right. On mobile it will default to bottom. */position:PropTypes.oneOf(["left","right","bottom"])},Drawer.defaultProps={children:null,className:void 0,footerContent:null,headerTitle:null,onClose:null,open:!1,position:Position.RIGHT};export default Drawer;