@transferwise/components 0.0.0-experimental-5b64b75 → 0.0.0-experimental-702e2d3

package/build/es/no-polyfill/uploadInput/UploadInput.spec.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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{within}from"@testing-library/react";import userEvent from"@testing-library/user-event";import{Status}from"../common";import{render,screen,waitFor,waitForElementToBeRemoved}from"../test-utils";import UploadInput from"./UploadInput";import{TEST_IDS as UPLOAD_BUTTON_TEST_IDS}from"./uploadButton/UploadButton";import{TEST_IDS as UPLOAD_ITEM_TEST_IDS}from"./uploadItem/UploadItem";import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";const spiedDateObject=jest.spyOn(global,"Date");describe("UploadInput",()=>{const a=new File(["foo"],"foo.png",{type:"image/png"}),b=new File(["foo"],"foo.jpg",{type:"image/jpeg"}),c=[{id:1,filename:"purchase-receipt.pdf",status:Status.SUCCEEDED},{id:2,filename:"CoWork-0317-invoice.pdf",status:Status.PROCESSING}],d={onUploadFile:jest.fn().mockResolvedValue({id:1}).mockResolvedValueOnce({id:2}).mockResolvedValueOnce({id:3}),onDeleteFile:jest.fn().mockResolvedValue({})},e=function(){let a=0<arguments.length&&arguments[0]!==void 0?arguments[0]:d;return render(/*#__PURE__*/_jsx(UploadInput,_objectSpread({},a)))};beforeEach(()=>{spiedDateObject.mockImplementation(()=>({getTime:jest.fn().mockReturnValue(Math.random())}))}),afterAll(()=>{spiedDateObject.mockRestore()}),describe("single file upload",()=>{it("should trigger onUploadFiles & onFilesChange with a single FormData entry containing `file` field",async()=>{spiedDateObject.mockImplementation(()=>({getTime:jest.fn().mockReturnValueOnce("11111111").mockReturnValueOnce("22222222")}));const c=jest.fn();e(_objectSpread(_objectSpread({},d),{},{onFilesChange:c}));const f=screen.getByTestId(UPLOAD_BUTTON_TEST_IDS.uploadInput);userEvent.upload(f,[a,b]),await waitFor(()=>{expect(d.onUploadFile).toHaveBeenCalledTimes(1)}),expect(c).toHaveBeenCalledTimes(2),expect(c).toHaveBeenNthCalledWith(1,[{filename:"foo.png",id:"foo.png_3_".concat("11111111"),status:"pending",url:void 0}]),expect(c).toHaveBeenNthCalledWith(2,[{filename:"foo.png",id:2,status:"succeeded",url:void 0}])}),it("should render only one file even if multiple ones were supplied",()=>{e(_objectSpread(_objectSpread({},d),{},{files:c})),expect(screen.getByText(c[0].filename)).toBeInTheDocument(),c.slice(1,c.length).forEach(a=>{expect(screen.queryByText(a.filename)).not.toBeInTheDocument()})})}),describe("multiple file upload",()=>{it("should render all files",()=>{e(_objectSpread(_objectSpread({},d),{},{files:c,multiple:!0})),c.forEach(a=>{expect(screen.getByText(a.filename)).toBeInTheDocument()})}),it("should render the UploadButton also",()=>{e(_objectSpread(_objectSpread({},d),{},{files:c,multiple:!0})),expect(screen.getByText("Upload files")).toBeInTheDocument()}),it("should trigger onUploadFile with multiple FormData entries containing `file` fields",async()=>{e(_objectSpread(_objectSpread({},d),{},{multiple:!0})),d.onUploadFile.mockClear(),expect(screen.getByTestId(UPLOAD_BUTTON_TEST_IDS.uploadInput)).toHaveAttribute("multiple");const c=screen.getByTestId(UPLOAD_BUTTON_TEST_IDS.uploadInput);userEvent.upload(c,[a,b]),await waitFor(()=>{expect(d.onUploadFile).toHaveBeenCalledTimes(2)})})}),describe("file deletion",()=>{const a=jest.fn();beforeEach(()=>{a.mockClear()}),it("should delete file with modal confirmation",async()=>{e(_objectSpread(_objectSpread({},d),{},{files:c,multiple:!0,onFilesChange:a}));const b=screen.getAllByTestId(UPLOAD_ITEM_TEST_IDS.uploadItem)[0];within(b).getByLabelText("Remove file",{exact:!1}).click(),screen.getByText("Remove").click(),await waitForElementToBeRemoved(b),expect(d.onDeleteFile).toHaveBeenCalledWith(c[0].id),expect(a).toHaveBeenCalledTimes(2),expect(a).toHaveBeenNthCalledWith(1,[{error:void 0,filename:"purchase-receipt.pdf",id:1,status:"processing"},{filename:"CoWork-0317-invoice.pdf",id:2,status:"processing"}]),expect(a).toHaveBeenLastCalledWith([{filename:"CoWork-0317-invoice.pdf",id:2,status:"processing"}])}),it("should delete file with failed state without modal confirmation",()=>{const b=[{id:1,filename:"purchase-receipt.pdf",status:Status.FAILED}];e(_objectSpread(_objectSpread({},d),{},{files:b,multiple:!0,onFilesChange:a}));const c=screen.getAllByTestId(UPLOAD_ITEM_TEST_IDS.uploadItem)[0];within(c).getByLabelText("Remove file",{exact:!1}).click(),expect(c).not.toBeInTheDocument(),expect(a).toHaveBeenCalledTimes(1),expect(a).toHaveBeenCalledWith([])}),it("should not render delete button when no delete callback is provided",()=>{e(_objectSpread(_objectSpread({},d),{},{files:c,multiple:!0,onDeleteFile:void 0})),expect(screen.queryByLabelText("Remove file ",{exact:!1})).not.toBeInTheDocument()})}),describe("Max File Upload limit",()=>{it("should show max file number in the description next to the upload button",async()=>{e(_objectSpread(_objectSpread({},d),{},{multiple:!0,maxFiles:2})),await waitFor(()=>{expect(screen.getByText(/Maximum 2 files\./)).toBeInTheDocument()})}),it("should show given error when maxFiles limit is applied and more files are uploaded",async()=>{const c=jest.fn();e(_objectSpread(_objectSpread({},d),{},{multiple:!0,maxFiles:3,maxFilesErrorMessage:"Maximum files message from prop",onUploadFile:c})),c.mockImplementation(a=>{const b=a.get("file");return Promise.resolve({file:b,id:Math.random()})});const f=screen.getByTestId(UPLOAD_BUTTON_TEST_IDS.uploadInput);userEvent.upload(f,[a,b]);const g=new File(["foo2"],"foo2.png",{type:"image/png"}),h=new File(["foo2"],"foo2.jpg",{type:"image/jpeg"});userEvent.upload(f,[g,h]),await waitFor(()=>{expect(screen.getByText("Maximum files message from prop")).toBeInTheDocument()})}),it("should show default error when maxFiles limit exceeds and no error message provided",async()=>{const c=jest.fn();e(_objectSpread(_objectSpread({},d),{},{multiple:!0,maxFiles:2,onUploadFile:c})),c.mockImplementation(a=>{const b=a.get("file");return Promise.resolve({file:b,id:Math.random()})});const f=screen.getByTestId(UPLOAD_BUTTON_TEST_IDS.uploadInput),g=new File(["foo2"],"foo2.png",{type:"image/png"});userEvent.upload(f,[a,b,g]),await waitFor(()=>{expect(screen.getByText("Sorry, this upload failed because we can only accept 2 files at once.")).toBeInTheDocument()})})}),describe("Misc",()=>{it("should attach the input id accepted from props to the input components",()=>{const a="LabelText";render(/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx("label",{htmlFor:"testInputId",children:a}),/*#__PURE__*/_jsx(UploadInput,_objectSpread(_objectSpread({},d),{},{id:"testInputId"}))]})),expect(screen.getByLabelText(a)).toHaveAttribute("id","testInputId")}),it("should show the file size error when provided in props",async()=>{const a="file oversized";e(_objectSpread(_objectSpread({},d),{},{sizeLimit:1,sizeLimitErrorMessage:a}));const b=screen.getByTestId(UPLOAD_BUTTON_TEST_IDS.uploadInput),c=new File([""],"testFile.png",{type:"image/png"});Object.defineProperty(c,"size",{value:2048}),userEvent.upload(b,[c]),await waitFor(()=>{expect(screen.getByText(a)).toBeInTheDocument()})})})});
+import _asyncToGenerator from"@babel/runtime/helpers/asyncToGenerator";import _defineProperty from"@babel/runtime/helpers/defineProperty";import _regeneratorRuntime from"@babel/runtime/regenerator";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{within}from"@testing-library/react";import userEvent from"@testing-library/user-event";import{Status}from"../common";import{render,screen,waitFor,waitForElementToBeRemoved}from"../test-utils";import UploadInput from"./UploadInput";import{TEST_IDS as UPLOAD_BUTTON_TEST_IDS}from"./uploadButton/UploadButton";import{TEST_IDS as UPLOAD_ITEM_TEST_IDS}from"./uploadItem/UploadItem";import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var spiedDateObject=jest.spyOn(global,"Date");describe("UploadInput",function(){var a=new File(["foo"],"foo.png",{type:"image/png"}),b=new File(["foo"],"foo.jpg",{type:"image/jpeg"}),c=[{id:1,filename:"purchase-receipt.pdf",status:Status.SUCCEEDED},{id:2,filename:"CoWork-0317-invoice.pdf",status:Status.PROCESSING}],d={onUploadFile:jest.fn().mockResolvedValue({id:1}).mockResolvedValueOnce({id:2}).mockResolvedValueOnce({id:3}),onDeleteFile:jest.fn().mockResolvedValue({})},e=function(){var a=0<arguments.length&&arguments[0]!==void 0?arguments[0]:d;return render(/*#__PURE__*/_jsx(UploadInput,_objectSpread({},a)))};beforeEach(function(){spiedDateObject.mockImplementation(function(){return{getTime:jest.fn().mockReturnValue(Math.random())}})}),afterAll(function(){spiedDateObject.mockRestore()}),describe("single file upload",function(){it("should trigger onUploadFiles & onFilesChange with a single FormData entry containing `file` field",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function c(){var f,g,h,i;return _regeneratorRuntime.wrap(function(c){for(;;)switch(c.prev=c.next){case 0:return f="11111111",g="22222222",spiedDateObject.mockImplementation(function(){return{getTime:jest.fn().mockReturnValueOnce(f).mockReturnValueOnce(g)}}),h=jest.fn(),e(_objectSpread(_objectSpread({},d),{},{onFilesChange:h})),i=screen.getByTestId(UPLOAD_BUTTON_TEST_IDS.uploadInput),userEvent.upload(i,[a,b]),c.next=9,waitFor(function(){expect(d.onUploadFile).toHaveBeenCalledTimes(1)});case 9:expect(h).toHaveBeenCalledTimes(2),expect(h).toHaveBeenNthCalledWith(1,[{filename:"foo.png",id:"foo.png_3_".concat(f),status:"pending",url:void 0}]),expect(h).toHaveBeenNthCalledWith(2,[{filename:"foo.png",id:2,status:"succeeded",url:void 0}]);case 12:case"end":return c.stop();}},c)}))),it("should render only one file even if multiple ones were supplied",function(){e(_objectSpread(_objectSpread({},d),{},{files:c})),expect(screen.getByText(c[0].filename)).toBeInTheDocument(),c.slice(1,c.length).forEach(function(a){expect(screen.queryByText(a.filename)).not.toBeInTheDocument()})})}),describe("multiple file upload",function(){it("should render all files",function(){e(_objectSpread(_objectSpread({},d),{},{files:c,multiple:!0})),c.forEach(function(a){expect(screen.getByText(a.filename)).toBeInTheDocument()})}),it("should render the UploadButton also",function(){e(_objectSpread(_objectSpread({},d),{},{files:c,multiple:!0})),expect(screen.getByText("Upload files")).toBeInTheDocument()}),it("should trigger onUploadFile with multiple FormData entries containing `file` fields",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function c(){var f;return _regeneratorRuntime.wrap(function(c){for(;;)switch(c.prev=c.next){case 0:return e(_objectSpread(_objectSpread({},d),{},{multiple:!0})),d.onUploadFile.mockClear(),expect(screen.getByTestId(UPLOAD_BUTTON_TEST_IDS.uploadInput)).toHaveAttribute("multiple"),f=screen.getByTestId(UPLOAD_BUTTON_TEST_IDS.uploadInput),userEvent.upload(f,[a,b]),c.next=7,waitFor(function(){expect(d.onUploadFile).toHaveBeenCalledTimes(2)});case 7:case"end":return c.stop();}},c)})))}),describe("file deletion",function(){var a=jest.fn();beforeEach(function(){a.mockClear()}),it("should delete file with modal confirmation",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function b(){var f;return _regeneratorRuntime.wrap(function(b){for(;;)switch(b.prev=b.next){case 0:return e(_objectSpread(_objectSpread({},d),{},{files:c,multiple:!0,onFilesChange:a})),f=screen.getAllByTestId(UPLOAD_ITEM_TEST_IDS.uploadItem)[0],within(f).getByLabelText("Remove file",{exact:!1}).click(),screen.getByText("Remove").click(),b.next=6,waitForElementToBeRemoved(f);case 6:expect(d.onDeleteFile).toHaveBeenCalledWith(c[0].id),expect(a).toHaveBeenCalledTimes(2),expect(a).toHaveBeenNthCalledWith(1,[{error:void 0,filename:"purchase-receipt.pdf",id:1,status:"processing"},{filename:"CoWork-0317-invoice.pdf",id:2,status:"processing"}]),expect(a).toHaveBeenLastCalledWith([{filename:"CoWork-0317-invoice.pdf",id:2,status:"processing"}]);case 10:case"end":return b.stop();}},b)}))),it("should delete file with failed state without modal confirmation",function(){var b=[{id:1,filename:"purchase-receipt.pdf",status:Status.FAILED}];e(_objectSpread(_objectSpread({},d),{},{files:b,multiple:!0,onFilesChange:a}));var c=screen.getAllByTestId(UPLOAD_ITEM_TEST_IDS.uploadItem)[0];within(c).getByLabelText("Remove file",{exact:!1}).click(),expect(c).not.toBeInTheDocument(),expect(a).toHaveBeenCalledTimes(1),expect(a).toHaveBeenCalledWith([])}),it("should not render delete button when no delete callback is provided",function(){e(_objectSpread(_objectSpread({},d),{},{files:c,multiple:!0,onDeleteFile:void 0})),expect(screen.queryByLabelText("Remove file ",{exact:!1})).not.toBeInTheDocument()})}),describe("Max File Upload limit",function(){it("should show max file number in the description next to the upload button",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function a(){return _regeneratorRuntime.wrap(function(a){for(;;)switch(a.prev=a.next){case 0:return e(_objectSpread(_objectSpread({},d),{},{multiple:!0,maxFiles:2})),a.next=3,waitFor(function(){expect(screen.getByText(/Maximum 2 files\./)).toBeInTheDocument()});case 3:case"end":return a.stop();}},a)}))),it("should show given error when maxFiles limit is applied and more files are uploaded",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function c(){var f,g,h,i,j;return _regeneratorRuntime.wrap(function(c){for(;;)switch(c.prev=c.next){case 0:return f="Maximum files message from prop",g=jest.fn(),e(_objectSpread(_objectSpread({},d),{},{multiple:!0,maxFiles:3,maxFilesErrorMessage:f,onUploadFile:g})),g.mockImplementation(function(a){var b=a.get("file");return Promise.resolve({file:b,id:Math.random()})}),h=screen.getByTestId(UPLOAD_BUTTON_TEST_IDS.uploadInput),userEvent.upload(h,[a,b]),i=new File(["foo2"],"foo2.png",{type:"image/png"}),j=new File(["foo2"],"foo2.jpg",{type:"image/jpeg"}),userEvent.upload(h,[i,j]),c.next=11,waitFor(function(){expect(screen.getByText(f)).toBeInTheDocument()});case 11:case"end":return c.stop();}},c)}))),it("should show default error when maxFiles limit exceeds and no error message provided",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function c(){var f,g,h,i;return _regeneratorRuntime.wrap(function(c){for(;;)switch(c.prev=c.next){case 0:return f="Sorry, this upload failed because we can only accept 2 files at once.",g=jest.fn(),e(_objectSpread(_objectSpread({},d),{},{multiple:!0,maxFiles:2,onUploadFile:g})),g.mockImplementation(function(a){var b=a.get("file");return Promise.resolve({file:b,id:Math.random()})}),h=screen.getByTestId(UPLOAD_BUTTON_TEST_IDS.uploadInput),i=new File(["foo2"],"foo2.png",{type:"image/png"}),userEvent.upload(h,[a,b,i]),c.next=9,waitFor(function(){expect(screen.getByText(f)).toBeInTheDocument()});case 9:case"end":return c.stop();}},c)})))}),describe("Misc",function(){it("should attach the input id accepted from props to the input components",function(){var a="LabelText";render(/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx("label",{htmlFor:"testInputId",children:a}),/*#__PURE__*/_jsx(UploadInput,_objectSpread(_objectSpread({},d),{},{id:"testInputId"}))]})),expect(screen.getByLabelText(a)).toHaveAttribute("id","testInputId")}),it("should show the file size error when provided in props",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function a(){var b,c,f,g,h;return _regeneratorRuntime.wrap(function(a){for(;;)switch(a.prev=a.next){case 0:return b=1024,c=2*b,f="file oversized",e(_objectSpread(_objectSpread({},d),{},{sizeLimit:1,sizeLimitErrorMessage:f})),g=screen.getByTestId(UPLOAD_BUTTON_TEST_IDS.uploadInput),h=new File([""],"testFile.png",{type:"image/png"}),Object.defineProperty(h,"size",{value:c}),userEvent.upload(g,[h]),a.next=10,waitFor(function(){expect(screen.getByText(f)).toBeInTheDocument()});case 10:case"end":return a.stop();}},a)})))})});

package/build/es/no-polyfill/uploadInput/UploadInput.story.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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{action}from"@storybook/addon-actions";import{Status}from"../common";import UploadInput from"./UploadInput";import{jsx as _jsx}from"react/jsx-runtime";const meta={title:"Forms/UploadInput",component:UploadInput,tags:["autodocs"]};export default meta;const files=[{id:1,filename:"purchase-receipt.pdf",url:"https://wise.com/public-resources/assets/logos/wise/brand_logo_inverse.svg"},{id:2,filename:"receipt failed.png",status:Status.FAILED},{id:3,filename:"receipt failed with error string.png",status:Status.SUCCEEDED},{id:4,filename:"receipt failed with error object.png",status:Status.SUCCEEDED}],createDelayedPromise=function(){let{successful:a=!0,delaySeconds:b=3,response:c={id:Math.round(1e4*Math.random()),url:"#"}}=0<arguments.length&&arguments[0]!==void 0?arguments[0]:{};return new Promise((d,e)=>{setTimeout(()=>a?d(c):e(new Error("Unexpected error")),1e3*b)})},props={onUploadFile:()=>createDelayedPromise(),onDeleteFile:()=>createDelayedPromise()},Template=a=>/*#__PURE__*/_jsx(UploadInput,_objectSpread({},a));export const SingleFile=Template.bind({});SingleFile.args=_objectSpread({},props);export const MultipleFiles=Template.bind({});MultipleFiles.args=_objectSpread(_objectSpread({},props),{},{multiple:!0});export const UploadInputWithDescriptionFromProps=Template.bind({});UploadInputWithDescriptionFromProps.args=_objectSpread(_objectSpread({},props),{},{multiple:!0,description:"Custom file description from prop"});export const Disabled=Template.bind({});Disabled.args=_objectSpread(_objectSpread({},props),{},{disabled:!0});export const WithAnyFileType=Template.bind({});WithAnyFileType.args=_objectSpread(_objectSpread({},props),{},{fileTypes:"*"});export const WithSingleFileType=Template.bind({});WithSingleFileType.args=_objectSpread(_objectSpread({},props),{},{fileTypes:".zip,application/zip"});export const WithMultipleExistingFiles=Template.bind({});WithMultipleExistingFiles.args=_objectSpread(_objectSpread({},props),{},{files,multiple:!0});export const WithoutDelete=Template.bind({});WithoutDelete.args=_objectSpread(_objectSpread({},props),{},{files,onDeleteFile:void 0,multiple:!0});export const WithUploadFailed=Template.bind({});WithUploadFailed.args=_objectSpread(_objectSpread({},props),{},{files:files.slice(0),onUploadFile:()=>createDelayedPromise({successful:!1}),multiple:!0});export const WithDeleteFailed=Template.bind({});WithDeleteFailed.args=_objectSpread(_objectSpread({},props),{},{files:files.slice(0),onDeleteFile:()=>createDelayedPromise({successful:!1}),multiple:!0});export const CustomConfirmMessage=Template.bind({});CustomConfirmMessage.args=_objectSpread(_objectSpread({},props),{},{files:files.slice(0),deleteConfirm:{title:"Sure you want to remove this invoice?",body:/*#__PURE__*/_jsx("img",{alt:"brand logo",src:"https://wise.com/public-resources/assets/logos/wise/brand_logo.svg"})}});export const withManualDownloadHandler=Template.bind({});withManualDownloadHandler.args=_objectSpread(_objectSpread({},props),{},{files,onDownload:action("Manual download handler")});export const withFilesChangeHandler=Template.bind({});withFilesChangeHandler.args=_objectSpread(_objectSpread({},props),{},{files,onFilesChange:action("Files change handler")});export const withMaxFilesToUploadLimit=Template.bind({});withMaxFilesToUploadLimit.args=_objectSpread(_objectSpread({},props),{},{multiple:!0,maxFiles:5,maxFilesErrorMessage:"Can't upload as maximum number of files allowed are already uploaded"});export const withFileSizeErrorMessage=Template.bind({});withFileSizeErrorMessage.args=_objectSpread(_objectSpread({},props),{},{sizeLimit:1,sizeLimitErrorMessage:"The file is oversized"});export const withCustomUploadButtonTitle=Template.bind({});withCustomUploadButtonTitle.args=_objectSpread(_objectSpread({},props),{},{uploadButtonTitle:"Upload the VAT receipts for FY 2022-23"});
+import _defineProperty from"@babel/runtime/helpers/defineProperty";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{action}from"@storybook/addon-actions";import{Status}from"../common";import UploadInput from"./UploadInput";import{jsx as _jsx}from"react/jsx-runtime";var meta={title:"Forms/UploadInput",component:UploadInput,tags:["autodocs"]};export default meta;var files=[{id:1,filename:"purchase-receipt.pdf",url:"https://wise.com/public-resources/assets/logos/wise/brand_logo_inverse.svg"},{id:2,filename:"receipt failed.png",status:Status.FAILED},{id:3,filename:"receipt failed with error string.png",status:Status.SUCCEEDED},{id:4,filename:"receipt failed with error object.png",status:Status.SUCCEEDED}],createDelayedPromise=function(){var a=0<arguments.length&&arguments[0]!==void 0?arguments[0]:{},b=a.successful,c=a.delaySeconds,d=void 0===c?3:c,e=a.response,f=void 0===e?{id:Math.round(1e4*Math.random()),url:"#"}:e;return new Promise(function(a,c){setTimeout(function(){return!(void 0!==b)||b?a(f):c(new Error("Unexpected error"))},1e3*d)})},props={onUploadFile:function onUploadFile(){return createDelayedPromise()},onDeleteFile:function onDeleteFile(){return createDelayedPromise()}},Template=function(a){return/*#__PURE__*/_jsx(UploadInput,_objectSpread({},a))};export var SingleFile=Template.bind({});SingleFile.args=_objectSpread({},props);export var MultipleFiles=Template.bind({});MultipleFiles.args=_objectSpread(_objectSpread({},props),{},{multiple:!0});export var UploadInputWithDescriptionFromProps=Template.bind({});UploadInputWithDescriptionFromProps.args=_objectSpread(_objectSpread({},props),{},{multiple:!0,description:"Custom file description from prop"});export var Disabled=Template.bind({});Disabled.args=_objectSpread(_objectSpread({},props),{},{disabled:!0});export var WithAnyFileType=Template.bind({});WithAnyFileType.args=_objectSpread(_objectSpread({},props),{},{fileTypes:"*"});export var WithSingleFileType=Template.bind({});WithSingleFileType.args=_objectSpread(_objectSpread({},props),{},{fileTypes:".zip,application/zip"});export var WithMultipleExistingFiles=Template.bind({});WithMultipleExistingFiles.args=_objectSpread(_objectSpread({},props),{},{files:files,multiple:!0});export var WithoutDelete=Template.bind({});WithoutDelete.args=_objectSpread(_objectSpread({},props),{},{files:files,onDeleteFile:void 0,multiple:!0});export var WithUploadFailed=Template.bind({});WithUploadFailed.args=_objectSpread(_objectSpread({},props),{},{files:files.slice(0),onUploadFile:function onUploadFile(){return createDelayedPromise({successful:!1})},multiple:!0});export var WithDeleteFailed=Template.bind({});WithDeleteFailed.args=_objectSpread(_objectSpread({},props),{},{files:files.slice(0),onDeleteFile:function onDeleteFile(){return createDelayedPromise({successful:!1})},multiple:!0});export var CustomConfirmMessage=Template.bind({});CustomConfirmMessage.args=_objectSpread(_objectSpread({},props),{},{files:files.slice(0),deleteConfirm:{title:"Sure you want to remove this invoice?",body:/*#__PURE__*/_jsx("img",{alt:"brand logo",src:"https://wise.com/public-resources/assets/logos/wise/brand_logo.svg"})}});export var withManualDownloadHandler=Template.bind({});withManualDownloadHandler.args=_objectSpread(_objectSpread({},props),{},{files:files,onDownload:action("Manual download handler")});export var withFilesChangeHandler=Template.bind({});withFilesChangeHandler.args=_objectSpread(_objectSpread({},props),{},{files:files,onFilesChange:action("Files change handler")});export var withMaxFilesToUploadLimit=Template.bind({});withMaxFilesToUploadLimit.args=_objectSpread(_objectSpread({},props),{},{multiple:!0,maxFiles:5,maxFilesErrorMessage:"Can't upload as maximum number of files allowed are already uploaded"});export var withFileSizeErrorMessage=Template.bind({});withFileSizeErrorMessage.args=_objectSpread(_objectSpread({},props),{},{sizeLimit:1,sizeLimitErrorMessage:"The file is oversized"});export var withCustomUploadButtonTitle=Template.bind({});withCustomUploadButtonTitle.args=_objectSpread(_objectSpread({},props),{},{uploadButtonTitle:"Upload the VAT receipts for FY 2022-23"});

package/build/es/no-polyfill/uploadInput/uploadButton/UploadButton.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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{PlusCircle as PlusIcon,Upload as UploadIcon}from"@transferwise/icons";import{useTheme}from"@wise/components-theming";import classNames from"classnames";import{useRef,useState}from"react";import{useIntl}from"react-intl";import Body from"../../body";import{Typography}from"../../common";import{useDirection}from"../../common/hooks";import MESSAGES from"./UploadButton.messages";import{DEFAULT_SIZE_LIMIT,imageFileTypes}from"./defaults";import getAllowedFileTypes from"./getAllowedFileTypes";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 let TEST_IDS=/*#__PURE__*/function(a){return a.uploadInput="uploadInput",a.mediaBody="mediaBody",a}({});const onDragOver=a=>{a.preventDefault()},DEFAULT_FILE_INPUT_ID="np-upload-button",UploadButton=a=>{function b(){if(e)return e;const a=u(),b="*"===a?o(MESSAGES.allFileTypes):a;return o(MESSAGES.instructions,{fileTypes:b,size:Math.round(k/1e3)})}let{disabled:c,multiple:d,description:e,fileTypes:j=imageFileTypes,sizeLimit:k=DEFAULT_SIZE_LIMIT,maxFiles:f,onChange:g,id:l=DEFAULT_FILE_INPUT_ID,uploadButtonTitle:h,multipleFileInputWithFilesAdded:i}=a;const{isModern:m}=useTheme(),{isRTL:n}=useDirection(),{formatMessage:o}=useIntl(),p=useRef(null),[q,r]=useState(!1),s=useRef(0),t=()=>{s.current=0,r(!1)},u=()=>"*"===j?j:Array.isArray(j)?getAllowedFileTypes(j).join(", "):getAllowedFileTypes([j]).join(", ");return/*#__PURE__*/_jsxs("div",_objectSpread(_objectSpread({className:classNames("np-upload-button-container","droppable",{"droppable-dropping":q})},!c&&{onDragEnter:a=>{a.preventDefault(),s.current+=1,1===s.current&&r(!0)},onDragLeave:a=>{a.preventDefault(),s.current-=1,0===s.current&&r(!1)},onDrop:a=>{a.preventDefault(),t(),a.dataTransfer&&a.dataTransfer.files&&a.dataTransfer.files[0]&&g(a.dataTransfer.files)},onDragOver}),{},{children:[/*#__PURE__*/_jsx("input",_objectSpread(_objectSpread(_objectSpread({ref:p,id:l,type:"file"},function(){const a="*"===u();return a?null:Array.isArray(j)?{accept:j.join(",")}:{accept:j}}()),d&&{multiple:!0}),{},{className:"tw-droppable-input",disabled:c,name:"file-upload","data-testid":TEST_IDS.uploadInput,onChange:a=>{const{files:b}=a.target;b&&(g(b),p.current&&(p.current.value=""))}})),/*#__PURE__*/_jsx("label",{htmlFor:l,className:classNames("btn","np-upload-accent","np-upload-button",{disabled:c,"np-upload-input--square-top":i}),children:/*#__PURE__*/_jsxs("div",{className:"media",children:[/*#__PURE__*/_jsx("div",{className:"np-upload-icon media-left",children:/*#__PURE__*/_jsx(UploadIcon,{size:24,className:"text-link"})}),/*#__PURE__*/_jsxs("div",{className:"media-body text-xs-left","data-testid":TEST_IDS.mediaBody,children:[/*#__PURE__*/_jsx(Body,{type:Typography.BODY_LARGE_BOLD,className:"d-block",children:function(){return h?h:o(d?MESSAGES.uploadFiles:MESSAGES.uploadFile)}()}),function(){return/*#__PURE__*/_jsx(_Fragment,{children:/*#__PURE__*/_jsxs(Body,{className:classNames({"text-primary":!c,small:!m,"font-weight-normal":!m}),children:[b(),f&&/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx("br",{}),"Maximum ".concat(f," files.")]})]})})}()]})]})}),q&&/*#__PURE__*/_jsxs("div",{className:classNames("droppable-card","droppable-dropping-card","droppable-card-content",{"np-upload-input--square-top":i}),children:[/*#__PURE__*/_jsx(PlusIcon,{className:"m-x-1",size:24}),/*#__PURE__*/_jsx("div",{children:o(MESSAGES.dropFile)})]})]}))};export default UploadButton;
+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{PlusCircle as PlusIcon,Upload as UploadIcon}from"@transferwise/icons";import{useTheme}from"@wise/components-theming";import classNames from"classnames";import{useRef,useState}from"react";import{useIntl}from"react-intl";import Body from"../../body";import{Typography}from"../../common";import{useDirection}from"../../common/hooks";import MESSAGES from"./UploadButton.messages";import{DEFAULT_SIZE_LIMIT,imageFileTypes}from"./defaults";import getAllowedFileTypes from"./getAllowedFileTypes";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 var TEST_IDS=/*#__PURE__*/function(a){return a.uploadInput="uploadInput",a.mediaBody="mediaBody",a}({});var onDragOver=function(a){a.preventDefault()},DEFAULT_FILE_INPUT_ID="np-upload-button",UploadButton=function(a){function b(){if(e)return e;var a=C(),b="*"===a?u(MESSAGES.allFileTypes):a;return u(MESSAGES.instructions,{fileTypes:b,size:Math.round(i/1e3)})}var c=a.disabled,d=a.multiple,e=a.description,f=a.fileTypes,g=void 0===f?imageFileTypes:f,h=a.sizeLimit,i=void 0===h?DEFAULT_SIZE_LIMIT:h,j=a.maxFiles,k=a.onChange,l=a.id,m=void 0===l?DEFAULT_FILE_INPUT_ID:l,n=a.uploadButtonTitle,o=a.multipleFileInputWithFilesAdded,p=useTheme(),q=p.isModern,r=useDirection(),s=r.isRTL,t=useIntl(),u=t.formatMessage,v=useRef(null),w=useState(!1),x=_slicedToArray(w,2),y=x[0],z=x[1],A=useRef(0),B=function(){A.current=0,z(!1)},C=function(){return"*"===g?g:Array.isArray(g)?getAllowedFileTypes(g).join(", "):getAllowedFileTypes([g]).join(", ")};return/*#__PURE__*/_jsxs("div",_objectSpread(_objectSpread({className:classNames("np-upload-button-container","droppable",{"droppable-dropping":y})},!c&&{onDragEnter:function onDragEnter(a){a.preventDefault(),A.current+=1,1===A.current&&z(!0)},onDragLeave:function onDragLeave(a){a.preventDefault(),A.current-=1,0===A.current&&z(!1)},onDrop:function onDrop(a){a.preventDefault(),B(),a.dataTransfer&&a.dataTransfer.files&&a.dataTransfer.files[0]&&k(a.dataTransfer.files)},onDragOver:onDragOver}),{},{children:[/*#__PURE__*/_jsx("input",_objectSpread(_objectSpread(_objectSpread({ref:v,id:m,type:"file"},function(){var a="*"===C();return a?null:Array.isArray(g)?{accept:g.join(",")}:{accept:g}}()),d&&{multiple:!0}),{},{className:"tw-droppable-input",disabled:c,name:"file-upload","data-testid":TEST_IDS.uploadInput,onChange:function filesSelected(a){var b=a.target.files;b&&(k(b),v.current&&(v.current.value=""))}})),/*#__PURE__*/_jsx("label",{htmlFor:m,className:classNames("btn","np-upload-accent","np-upload-button",{disabled:c,"np-upload-input--square-top":o}),children:/*#__PURE__*/_jsxs("div",{className:"media",children:[/*#__PURE__*/_jsx("div",{className:"np-upload-icon media-left",children:/*#__PURE__*/_jsx(UploadIcon,{size:24,className:"text-link"})}),/*#__PURE__*/_jsxs("div",{className:"media-body text-xs-left","data-testid":TEST_IDS.mediaBody,children:[/*#__PURE__*/_jsx(Body,{type:Typography.BODY_LARGE_BOLD,className:"d-block",children:function(){return n?n:u(d?MESSAGES.uploadFiles:MESSAGES.uploadFile)}()}),function(){return/*#__PURE__*/_jsx(_Fragment,{children:/*#__PURE__*/_jsxs(Body,{className:classNames({"text-primary":!c,small:!q,"font-weight-normal":!q}),children:[b(),j&&/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx("br",{}),"Maximum ".concat(j," files.")]})]})})}()]})]})}),y&&/*#__PURE__*/_jsxs("div",{className:classNames("droppable-card","droppable-dropping-card","droppable-card-content",{"np-upload-input--square-top":o}),children:[/*#__PURE__*/_jsx(PlusIcon,{className:"m-x-1",size:24}),/*#__PURE__*/_jsx("div",{children:u(MESSAGES.dropFile)})]})]}))};export default UploadButton;

package/build/es/no-polyfill/uploadInput/uploadButton/UploadButton.spec.js

@@ -1,3 +1,3 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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{render,screen,userEvent}from"../../test-utils";import UploadButton,{TEST_IDS}from"./UploadButton";import{imageFileTypes}from"./defaults";import{jsx as _jsx}from"react/jsx-runtime";describe("UploadButton",()=>{const a=new File(["foo"],"foo.png",{type:"image/png"}),b=new File(["foo"],"foo.jpg",{type:"image/jpg"}),c={onChange:jest.fn(),multipleFileInputWithFilesAdded:!0},d=function(){let a=0<arguments.length&&arguments[0]!==void 0?arguments[0]:c;return render(/*#__PURE__*/_jsx(UploadButton,_objectSpread({},a)))};describe("single file upload",()=>{beforeEach(()=>{d()}),it("should render the file input form",()=>{expect(screen.getByText("Upload file")).toBeInTheDocument()}),it("should render the file input button with title, if provided",()=>{d(_objectSpread(_objectSpread({},c),{},{uploadButtonTitle:"Upload your id"})),expect(screen.getByText("Upload your id")).toBeInTheDocument()}),it("should set accept to imageTypes",()=>{expect(screen.getByTestId(TEST_IDS.uploadInput)).toHaveAttribute("accept",imageFileTypes.join(","))}),it("trigger onChange callback with a FileList",()=>{const d=screen.getByTestId(TEST_IDS.uploadInput);// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
-userEvent.upload(d,[a,b]),expect(c.onChange).toHaveBeenCalledTimes(1),expect(c.onChange.mock.calls[0][0]).toHaveLength(1)})}),describe("multiple file upload",()=>{beforeEach(()=>{c.onChange.mockClear(),d(_objectSpread(_objectSpread({},c),{},{multiple:!0}))}),it("should disable the file input",()=>{expect(screen.getByTestId(TEST_IDS.uploadInput)).toHaveAttribute("multiple")}),it("trigger onChange callback with a FileList",()=>{const d=screen.getByTestId(TEST_IDS.uploadInput);// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
-userEvent.upload(d,[a,b]),expect(c.onChange).toHaveBeenCalledTimes(1),expect(c.onChange.mock.calls[0][0]).toHaveLength(2)})}),describe("disabled state",()=>{beforeEach(()=>{d(_objectSpread(_objectSpread({},c),{},{disabled:!0}))}),it("should disable the file input",()=>{expect(screen.getByTestId(TEST_IDS.uploadInput)).toBeDisabled()})}),describe("accept all file types",()=>{beforeEach(()=>{d(_objectSpread(_objectSpread({},c),{},{fileTypes:["*"]}))}),it("should not add accept attribute to file input",()=>{expect(screen.getByTestId(TEST_IDS.uploadInput)).not.toHaveAttribute("accept")})}),describe("description for the button",()=>{it("should show default description based on the default file types provided",()=>{d(_objectSpread({},c)),expect(screen.getByText("PDF, JPG, JPEG, PNG, less than 5MB")).toBeInTheDocument()}),it("should show default all files allowed description if all files are accepted",()=>{d(_objectSpread(_objectSpread({},c),{},{fileTypes:["*"]})),expect(screen.getByText("All file types, less than 5MB")).toBeInTheDocument()}),it("should show custom description if provided",()=>{d(_objectSpread(_objectSpread({},c),{},{fileTypes:["*"],description:"Test description"})),expect(screen.getByText("Test description")).toBeInTheDocument()}),it("should show maxFiles next to the description, if provided",()=>{d(_objectSpread(_objectSpread({},c),{},{fileTypes:["*"],maxFiles:5})),expect(screen.getByText(/Maximum 5 files\./)).toBeInTheDocument()})})});
+import _defineProperty from"@babel/runtime/helpers/defineProperty";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{render,screen,userEvent}from"../../test-utils";import UploadButton,{TEST_IDS}from"./UploadButton";import{imageFileTypes}from"./defaults";import{jsx as _jsx}from"react/jsx-runtime";describe("UploadButton",function(){var a=new File(["foo"],"foo.png",{type:"image/png"}),b=new File(["foo"],"foo.jpg",{type:"image/jpg"}),c={onChange:jest.fn(),multipleFileInputWithFilesAdded:!0},d=function(){var a=0<arguments.length&&arguments[0]!==void 0?arguments[0]:c;return render(/*#__PURE__*/_jsx(UploadButton,_objectSpread({},a)))};describe("single file upload",function(){beforeEach(function(){d()}),it("should render the file input form",function(){expect(screen.getByText("Upload file")).toBeInTheDocument()}),it("should render the file input button with title, if provided",function(){d(_objectSpread(_objectSpread({},c),{},{uploadButtonTitle:"Upload your id"})),expect(screen.getByText("Upload your id")).toBeInTheDocument()}),it("should set accept to imageTypes",function(){expect(screen.getByTestId(TEST_IDS.uploadInput)).toHaveAttribute("accept",imageFileTypes.join(","))}),it("trigger onChange callback with a FileList",function(){var d=screen.getByTestId(TEST_IDS.uploadInput);// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+userEvent.upload(d,[a,b]),expect(c.onChange).toHaveBeenCalledTimes(1),expect(c.onChange.mock.calls[0][0]).toHaveLength(1)})}),describe("multiple file upload",function(){beforeEach(function(){c.onChange.mockClear(),d(_objectSpread(_objectSpread({},c),{},{multiple:!0}))}),it("should disable the file input",function(){expect(screen.getByTestId(TEST_IDS.uploadInput)).toHaveAttribute("multiple")}),it("trigger onChange callback with a FileList",function(){var d=screen.getByTestId(TEST_IDS.uploadInput);// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+userEvent.upload(d,[a,b]),expect(c.onChange).toHaveBeenCalledTimes(1),expect(c.onChange.mock.calls[0][0]).toHaveLength(2)})}),describe("disabled state",function(){beforeEach(function(){d(_objectSpread(_objectSpread({},c),{},{disabled:!0}))}),it("should disable the file input",function(){expect(screen.getByTestId(TEST_IDS.uploadInput)).toBeDisabled()})}),describe("accept all file types",function(){beforeEach(function(){d(_objectSpread(_objectSpread({},c),{},{fileTypes:["*"]}))}),it("should not add accept attribute to file input",function(){expect(screen.getByTestId(TEST_IDS.uploadInput)).not.toHaveAttribute("accept")})}),describe("description for the button",function(){it("should show default description based on the default file types provided",function(){d(_objectSpread({},c)),expect(screen.getByText("PDF, JPG, JPEG, PNG, less than 5MB")).toBeInTheDocument()}),it("should show default all files allowed description if all files are accepted",function(){d(_objectSpread(_objectSpread({},c),{},{fileTypes:["*"]})),expect(screen.getByText("All file types, less than 5MB")).toBeInTheDocument()}),it("should show custom description if provided",function(){d(_objectSpread(_objectSpread({},c),{},{fileTypes:["*"],description:"Test description"})),expect(screen.getByText("Test description")).toBeInTheDocument()}),it("should show maxFiles next to the description, if provided",function(){d(_objectSpread(_objectSpread({},c),{},{fileTypes:["*"],maxFiles:5})),expect(screen.getByText(/Maximum 5 files\./)).toBeInTheDocument()})})});

package/build/es/no-polyfill/uploadInput/uploadButton/defaults.js

@@ -1 +1 @@
-import{FileType}from"../../common";export const DEFAULT_SIZE_LIMIT=5e3;export const imageFileTypes=[FileType.PDF,FileType.JPG,FileType.PNG];
+import{FileType}from"../../common";export var DEFAULT_SIZE_LIMIT=5e3;export var imageFileTypes=[FileType.PDF,FileType.JPG,FileType.PNG];

package/build/es/no-polyfill/uploadInput/uploadButton/getAllowedFileTypes.js

@@ -1,3 +1,3 @@
-const getAllowedFileTypes=a=>a.map(a=>a.split(",").filter(a=>!a.includes("/"))// Filter out mime types
-.map(a=>a.replace(".","").toUpperCase())// Remove dot and convert extensions to uppercase to be displayed in the instructions
-.join(", "));export default getAllowedFileTypes;
+var getAllowedFileTypes=function(a){return a.map(function(a){return a.split(",").filter(function(a){return!a.includes("/")})// Filter out mime types
+.map(function(a){return a.replace(".","").toUpperCase()})// Remove dot and convert extensions to uppercase to be displayed in the instructions
+.join(", ")})};export default getAllowedFileTypes;

package/build/es/no-polyfill/uploadInput/uploadButton/getAllowedFileTypes.spec.js

@@ -1 +1 @@
-import{FileType}from"../../common";import getAllowedFileTypes from"./getAllowedFileTypes";describe("getAllowedFileTypes",()=>{let a;describe("using predefined FileTypes",()=>{beforeAll(()=>{a=getAllowedFileTypes([FileType.PNG,FileType.JPG])}),it("parses allowed file extensions from FileType[] array",()=>{expect(a).toStrictEqual(["PNG","JPG, JPEG"])})}),describe("using custom file extensions and mime types",()=>{beforeAll(()=>{a=getAllowedFileTypes([".xls,.xlm,application/vnd.ms-excel",".docx,application/vnd.openxmlformats-officedocument.wordprocessingml.document",".doc,application/msword"])}),it("parses allowed file extensions from FileType[] array",()=>{expect(a).toStrictEqual(["XLS, XLM","DOCX","DOC"])})}),describe("when all file types are allowed",()=>{beforeAll(()=>{a=getAllowedFileTypes(["*"])}),it("should return the wildcard character",()=>{expect(a).toStrictEqual(["*"])})})});
+import{FileType}from"../../common";import getAllowedFileTypes from"./getAllowedFileTypes";describe("getAllowedFileTypes",function(){var a;describe("using predefined FileTypes",function(){beforeAll(function(){a=getAllowedFileTypes([FileType.PNG,FileType.JPG])}),it("parses allowed file extensions from FileType[] array",function(){expect(a).toStrictEqual(["PNG","JPG, JPEG"])})}),describe("using custom file extensions and mime types",function(){beforeAll(function(){a=getAllowedFileTypes([".xls,.xlm,application/vnd.ms-excel",".docx,application/vnd.openxmlformats-officedocument.wordprocessingml.document",".doc,application/msword"])}),it("parses allowed file extensions from FileType[] array",function(){expect(a).toStrictEqual(["XLS, XLM","DOCX","DOC"])})}),describe("when all file types are allowed",function(){beforeAll(function(){a=getAllowedFileTypes(["*"])}),it("should return the wildcard character",function(){expect(a).toStrictEqual(["*"])})})});

package/build/es/no-polyfill/uploadInput/uploadItem/UploadItem.js

@@ -1,2 +1,2 @@
-import{AlertCircle,CrossCircleFill}from"@transferwise/icons";import{useTheme}from"@wise/components-theming";import classNames from"classnames";import{useIntl}from"react-intl";import Body from"../../body";import{Size,Status,Typography,Sentiment}from"../../common";import ProcessIndicator from"../../processIndicator/ProcessIndicator";import StatusIcon from"../../statusIcon/StatusIcon";import MESSAGES from"./UploadItem.messages";import{UploadItemBody}from"./UploadItemBody";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export let TEST_IDS=/*#__PURE__*/function(a){return a.uploadItem="uploadItem",a.mediaBody="mediaBody",a}({});const UploadItem=a=>{let{file:b,canDelete:c,onDelete:d,onDownload:e,singleFileUpload:f}=a;const{formatMessage:g}=useIntl(),{status:h,filename:i,error:j,url:k}=b,{isModern:l}=useTheme(),m=[Status.SUCCEEDED,void 0].includes(h)&&!!k,n=()=>"object"==typeof j&&j.message||j||g(MESSAGES.uploadingFailed);return/*#__PURE__*/_jsx("div",{className:classNames("np-upload-item",{"np-upload-item__link":m}),"data-testid":TEST_IDS.uploadItem,children:/*#__PURE__*/_jsxs("div",{className:"np-upload-item__body",children:[/*#__PURE__*/_jsx(UploadItemBody,{url:m?k:void 0,singleFileUpload:f,onDownload:a=>{e&&(a.preventDefault(),e(b))},children:/*#__PURE__*/_jsx("div",{className:"np-upload-button",children:/*#__PURE__*/_jsxs("div",{className:"media",children:[/*#__PURE__*/_jsx("div",{className:"np-upload-icon media-left",children:(()=>{if(j||h===Status.FAILED)return l?/*#__PURE__*/_jsx(StatusIcon,{size:Size.SMALL,sentiment:Sentiment.NEGATIVE}):/*#__PURE__*/_jsx(AlertCircle,{size:24,className:"text-negative"});let a;switch(h){case Status.PROCESSING:case Status.PENDING:a=/*#__PURE__*/_jsx(ProcessIndicator,{size:Size.EXTRA_SMALL,status:Status.PROCESSING});break;case Status.SUCCEEDED:case Status.DONE:default:a=l?/*#__PURE__*/_jsx(StatusIcon,{size:Size.SMALL,sentiment:Sentiment.POSITIVE}):/*#__PURE__*/_jsx(ProcessIndicator,{size:Size.EXTRA_SMALL,status:Status.SUCCEEDED});}return l?a:/*#__PURE__*/_jsx("span",{style:{transform:"scale(0.8335)"},children:a});// Scale down ProcessIndicator to be 20px*20px to match `icons`
-})()}),/*#__PURE__*/_jsxs("div",{className:"media-body text-xs-left","data-testid":TEST_IDS.mediaBody,children:[/*#__PURE__*/_jsx(Body,{className:"text-word-break d-block text-primary",children:(()=>i||g(MESSAGES.uploadedFile))()}),(()=>{if(j||h===Status.FAILED)return/*#__PURE__*/_jsx(Body,{type:Typography.BODY_DEFAULT_BOLD,className:"text-negative",children:n()});switch(h){case Status.PENDING:return/*#__PURE__*/_jsx(Body,{type:Typography.BODY_DEFAULT_BOLD,children:g(MESSAGES.uploading)});case Status.PROCESSING:return/*#__PURE__*/_jsx(Body,{children:g(MESSAGES.deleting)});case Status.SUCCEEDED:case Status.DONE:default:return/*#__PURE__*/_jsx(Body,{type:Typography.BODY_DEFAULT_BOLD,className:"text-positive",children:g(MESSAGES.uploaded)});}})()]})]})})}),c&&/*#__PURE__*/_jsx("button",{"aria-label":g(MESSAGES.removeFile,{filename:i}),className:classNames("btn","np-upload-item__remove-button","media-left",{"np-upload-item--single-file":f}),type:"button",onClick:()=>d(),children:/*#__PURE__*/_jsx(CrossCircleFill,{size:16})})]})})};export default UploadItem;
+import _typeof from"@babel/runtime/helpers/typeof";import{AlertCircle,CrossCircleFill}from"@transferwise/icons";import{useTheme}from"@wise/components-theming";import classNames from"classnames";import{useIntl}from"react-intl";import Body from"../../body";import{Size,Status,Typography,Sentiment}from"../../common";import ProcessIndicator from"../../processIndicator/ProcessIndicator";import StatusIcon from"../../statusIcon/StatusIcon";import MESSAGES from"./UploadItem.messages";import{UploadItemBody}from"./UploadItemBody";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export var TEST_IDS=/*#__PURE__*/function(a){return a.uploadItem="uploadItem",a.mediaBody="mediaBody",a}({});var UploadItem=function(a){var b=a.file,c=a.canDelete,d=a.onDelete,e=a.onDownload,f=a.singleFileUpload,g=useIntl(),h=g.formatMessage,i=b.status,j=b.filename,k=b.error,l=b.url,m=useTheme(),n=m.isModern,o=[Status.SUCCEEDED,void 0].includes(i)&&!!l,p=function(){return"object"===_typeof(k)&&k.message||k||h(MESSAGES.uploadingFailed)};return/*#__PURE__*/_jsx("div",{className:classNames("np-upload-item",{"np-upload-item__link":o}),"data-testid":TEST_IDS.uploadItem,children:/*#__PURE__*/_jsxs("div",{className:"np-upload-item__body",children:[/*#__PURE__*/_jsx(UploadItemBody,{url:o?l:void 0,singleFileUpload:f,onDownload:function onDownloadFile(a){e&&(a.preventDefault(),e(b))},children:/*#__PURE__*/_jsx("div",{className:"np-upload-button",children:/*#__PURE__*/_jsxs("div",{className:"media",children:[/*#__PURE__*/_jsx("div",{className:"np-upload-icon media-left",children:function getIcon(){if(k||i===Status.FAILED)return n?/*#__PURE__*/_jsx(StatusIcon,{size:Size.SMALL,sentiment:Sentiment.NEGATIVE}):/*#__PURE__*/_jsx(AlertCircle,{size:24,className:"text-negative"});var a;switch(i){case Status.PROCESSING:case Status.PENDING:a=/*#__PURE__*/_jsx(ProcessIndicator,{size:Size.EXTRA_SMALL,status:Status.PROCESSING});break;case Status.SUCCEEDED:case Status.DONE:default:a=n?/*#__PURE__*/_jsx(StatusIcon,{size:Size.SMALL,sentiment:Sentiment.POSITIVE}):/*#__PURE__*/_jsx(ProcessIndicator,{size:Size.EXTRA_SMALL,status:Status.SUCCEEDED});}return n?a:/*#__PURE__*/_jsx("span",{style:{transform:"scale(0.8335)"},children:a});// Scale down ProcessIndicator to be 20px*20px to match `icons`
+}()}),/*#__PURE__*/_jsxs("div",{className:"media-body text-xs-left","data-testid":TEST_IDS.mediaBody,children:[/*#__PURE__*/_jsx(Body,{className:"text-word-break d-block text-primary",children:function getTitle(){return j||h(MESSAGES.uploadedFile)}()}),function getDescription(){if(k||i===Status.FAILED)return/*#__PURE__*/_jsx(Body,{type:Typography.BODY_DEFAULT_BOLD,className:"text-negative",children:p()});switch(i){case Status.PENDING:return/*#__PURE__*/_jsx(Body,{type:Typography.BODY_DEFAULT_BOLD,children:h(MESSAGES.uploading)});case Status.PROCESSING:return/*#__PURE__*/_jsx(Body,{children:h(MESSAGES.deleting)});case Status.SUCCEEDED:case Status.DONE:default:return/*#__PURE__*/_jsx(Body,{type:Typography.BODY_DEFAULT_BOLD,className:"text-positive",children:h(MESSAGES.uploaded)});}}()]})]})})}),c&&/*#__PURE__*/_jsx("button",{"aria-label":h(MESSAGES.removeFile,{filename:j}),className:classNames("btn","np-upload-item__remove-button","media-left",{"np-upload-item--single-file":f}),type:"button",onClick:function onClick(){return d()},children:/*#__PURE__*/_jsx(CrossCircleFill,{size:16})})]})})};export default UploadItem;

package/build/es/no-polyfill/uploadInput/uploadItem/UploadItem.spec.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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 userEvent from"@testing-library/user-event";import{Status}from"../../common";import{render,screen}from"../../test-utils";import UploadItem from"./UploadItem";import{jsx as _jsx}from"react/jsx-runtime";describe("UploadItem",()=>{const a={file:{id:1,filename:"purchase-receipt.pdf",status:Status.SUCCEEDED,url:"https://wise.com"},canDelete:!0,onDelete:jest.fn(),singleFileUpload:!0},b=function(){let b=0<arguments.length&&arguments[0]!==void 0?arguments[0]:a;return render(/*#__PURE__*/_jsx(UploadItem,_objectSpread({},b)))};describe("filename",()=>{it("should display the filename",()=>{b(),expect(screen.getByText(a.file.filename)).toBeInTheDocument()}),it("should display the default filename when it is missing",()=>{b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{filename:void 0})})),expect(screen.getByText("Uploaded file")).toBeInTheDocument()})}),describe("description",()=>{it("should display the default uploading copy while file upload is in progress",()=>{b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{status:Status.PENDING})})),expect(screen.getByText("Uploading...")).toBeInTheDocument()}),it("should display the default deleting copy while file deletion is in progress",()=>{b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{status:Status.PROCESSING})})),expect(screen.getByText("Deleting...")).toBeInTheDocument()}),it("should display the default success copy when file upload is complete",()=>{b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{status:Status.SUCCEEDED})})),expect(screen.getByText("Uploaded")).toBeInTheDocument()})}),describe("failed uploads",()=>{it("should display the error.message from an API response",()=>{b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{status:Status.FAILED,error:{message:"An API error object with message field"}})})),expect(screen.getByText("An API error object with message field")).toBeInTheDocument()}),it("should display the error if it is supplied as a string",()=>{b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{status:Status.FAILED,error:"An API error string"})})),expect(screen.getByText("An API error string")).toBeInTheDocument()}),it("should display default error message when error is missing but status is FAILED",()=>{b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{status:Status.FAILED})})),expect(screen.getByText("Uploading failed")).toBeInTheDocument()}),it("should display the error even if status is missing",()=>{b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{error:"An API error string without status"})})),expect(screen.getByText("An API error string without status")).toBeInTheDocument()})}),describe("file deletion",()=>{it("should render the remove file button when deleteFile prop is supplied",()=>{b(),expect(screen.getByLabelText("Remove file ",{exact:!1})).toBeInTheDocument()}),it("should not render the remove file button when canDelete prop is false",()=>{b(_objectSpread(_objectSpread({},a),{},{canDelete:!1})),expect(screen.queryByLabelText("Remove file ",{exact:!1})).not.toBeInTheDocument()})}),describe("manual file download handler",()=>{it("calls onDownload handler provided through props",()=>{const c=jest.fn();b(_objectSpread(_objectSpread({},a),{},{onDownload:c})),userEvent.click(screen.getAllByRole("link")[0]),expect(c).toHaveBeenCalledTimes(1),expect(c).toHaveBeenCalledWith(a.file)})})});
+import _defineProperty from"@babel/runtime/helpers/defineProperty";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 userEvent from"@testing-library/user-event";import{Status}from"../../common";import{render,screen}from"../../test-utils";import UploadItem from"./UploadItem";import{jsx as _jsx}from"react/jsx-runtime";describe("UploadItem",function(){var a={file:{id:1,filename:"purchase-receipt.pdf",status:Status.SUCCEEDED,url:"https://wise.com"},canDelete:!0,onDelete:jest.fn(),singleFileUpload:!0},b=function(){var b=0<arguments.length&&arguments[0]!==void 0?arguments[0]:a;return render(/*#__PURE__*/_jsx(UploadItem,_objectSpread({},b)))};describe("filename",function(){it("should display the filename",function(){b(),expect(screen.getByText(a.file.filename)).toBeInTheDocument()}),it("should display the default filename when it is missing",function(){b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{filename:void 0})})),expect(screen.getByText("Uploaded file")).toBeInTheDocument()})}),describe("description",function(){it("should display the default uploading copy while file upload is in progress",function(){b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{status:Status.PENDING})})),expect(screen.getByText("Uploading...")).toBeInTheDocument()}),it("should display the default deleting copy while file deletion is in progress",function(){b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{status:Status.PROCESSING})})),expect(screen.getByText("Deleting...")).toBeInTheDocument()}),it("should display the default success copy when file upload is complete",function(){b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{status:Status.SUCCEEDED})})),expect(screen.getByText("Uploaded")).toBeInTheDocument()})}),describe("failed uploads",function(){it("should display the error.message from an API response",function(){b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{status:Status.FAILED,error:{message:"An API error object with message field"}})})),expect(screen.getByText("An API error object with message field")).toBeInTheDocument()}),it("should display the error if it is supplied as a string",function(){b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{status:Status.FAILED,error:"An API error string"})})),expect(screen.getByText("An API error string")).toBeInTheDocument()}),it("should display default error message when error is missing but status is FAILED",function(){b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{status:Status.FAILED})})),expect(screen.getByText("Uploading failed")).toBeInTheDocument()}),it("should display the error even if status is missing",function(){b(_objectSpread(_objectSpread({},a),{},{file:_objectSpread(_objectSpread({},a.file),{},{error:"An API error string without status"})})),expect(screen.getByText("An API error string without status")).toBeInTheDocument()})}),describe("file deletion",function(){it("should render the remove file button when deleteFile prop is supplied",function(){b(),expect(screen.getByLabelText("Remove file ",{exact:!1})).toBeInTheDocument()}),it("should not render the remove file button when canDelete prop is false",function(){b(_objectSpread(_objectSpread({},a),{},{canDelete:!1})),expect(screen.queryByLabelText("Remove file ",{exact:!1})).not.toBeInTheDocument()})}),describe("manual file download handler",function(){it("calls onDownload handler provided through props",function(){var c=jest.fn();b(_objectSpread(_objectSpread({},a),{},{onDownload:c})),userEvent.click(screen.getAllByRole("link")[0]),expect(c).toHaveBeenCalledTimes(1),expect(c).toHaveBeenCalledWith(a.file)})})});

package/build/es/no-polyfill/uploadInput/uploadItem/UploadItemBody.js

@@ -1 +1 @@
-import{jsx as _jsx}from"react/jsx-runtime";export const UploadItemBody=a=>{let{children:b,url:c,onDownload:d,singleFileUpload:e}=a;return c?/*#__PURE__*/_jsx("a",{href:c,target:"_blank",rel:"noopener noreferrer",className:e?"np-upload-item--single-file":"",onClick:d,children:b}):/*#__PURE__*/_jsx("div",{children:b})};
+import{jsx as _jsx}from"react/jsx-runtime";export var UploadItemBody=function(a){var b=a.children,c=a.url,d=a.onDownload,e=a.singleFileUpload;return c?/*#__PURE__*/_jsx("a",{href:c,target:"_blank",rel:"noopener noreferrer",className:e?"np-upload-item--single-file":"",onClick:d,children:b}):/*#__PURE__*/_jsx("div",{children:b})};

package/build/es/no-polyfill/utilities/deprecatedProperty/deprecatedProperty.js

@@ -1 +1 @@
-import{logActionRequired}from"../logActionRequired";const deprecatedMessage=a=>{let{component:b,propName:c,message:d,expiryDate:e}=a;const f=["".concat(b," has deprecated the use of ").concat(c,".")];return d&&f.push(d),e&&f.push("".concat(c," will be removed on or after ").concat(e.toLocaleString("en-GB",{year:"numeric",month:"numeric",day:"numeric"}))),f.join(" ")},deprecated=(a,b)=>{let{component:c,message:d="",newProp:e=null,expiryDate:f=null}=b;return function(b,g){const h=e?"Please use ".concat(e," instead."):d;null!=b[g]&&"undefined"!=typeof b[g]&&logActionRequired(deprecatedMessage({component:c,propName:g,message:h,expiryDate:f}));for(var i=arguments.length,j=Array(2<i?i-2:0),k=2;k<i;k++)j[k-2]=arguments[k];return a(b,g,...j)}};export default deprecated;
+import{logActionRequired}from"../logActionRequired";var deprecatedMessage=function(a){var b=a.component,c=a.propName,d=a.message,e=a.expiryDate,f=["".concat(b," has deprecated the use of ").concat(c,".")];return d&&f.push(d),e&&f.push("".concat(c," will be removed on or after ").concat(e.toLocaleString("en-GB",{year:"numeric",month:"numeric",day:"numeric"}))),f.join(" ")},deprecated=function(a,b){var c=b.component,d=b.message,e=void 0===d?"":d,f=b.newProp,g=void 0===f?null:f,h=b.expiryDate,i=void 0===h?null:h;return function(b,d){var f=g?"Please use ".concat(g," instead."):e;null!=b[d]&&"undefined"!=typeof b[d]&&logActionRequired(deprecatedMessage({component:c,propName:d,message:f,expiryDate:i}));for(var h=arguments.length,j=Array(2<h?h-2:0),k=2;k<h;k++)j[k-2]=arguments[k];return a.apply(void 0,[b,d].concat(j))}};export default deprecated;

package/build/es/no-polyfill/withDisplayFormat/WithDisplayFormat.js

@@ -1,8 +1,7 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";import PropTypes from"prop-types";import{Component}from"react";import{HistoryNavigator}from"../common";import{formatWithPattern,getCountOfSymbolsInSelection,getCursorPositionAfterKeystroke,unformatWithPattern,getDistanceToPreviousSymbol,getDistanceToNextSymbol}from"../common/textFormat";class WithDisplayFormat extends Component{constructor(a){super(a),_defineProperty(this,"getUserAction",a=>{const{triggerEvent:b,triggerType:c,value:d}=this.state,{displayPattern:e}=this.props,f=String.fromCharCode(b.which).toLowerCase();return"Paste"===c||"Cut"===c?c:(b.ctrlKey||b.metaKey)&&"z"===f?b.shiftKey?"Redo":"Undo":b.ctrlKey&&"d"===f?"Delete":"undefined"==typeof b.key&&a.length<=unformatWithPattern(d,e).length?"Backspace":b.key;// Detect mouse event redo
+import _toConsumableArray from"@babel/runtime/helpers/toConsumableArray";import _classCallCheck from"@babel/runtime/helpers/classCallCheck";import _createClass from"@babel/runtime/helpers/createClass";import _assertThisInitialized from"@babel/runtime/helpers/assertThisInitialized";import _inherits from"@babel/runtime/helpers/inherits";import _possibleConstructorReturn from"@babel/runtime/helpers/possibleConstructorReturn";import _getPrototypeOf from"@babel/runtime/helpers/getPrototypeOf";import _defineProperty from"@babel/runtime/helpers/defineProperty";function _createSuper(a){var b=_isNativeReflectConstruct();return function(){var c,d=_getPrototypeOf(a);if(b){var e=_getPrototypeOf(this).constructor;c=Reflect.construct(d,arguments,e)}else c=d.apply(this,arguments);return _possibleConstructorReturn(this,c)}}function _isNativeReflectConstruct(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){})),!0}catch(a){return!1}}import PropTypes from"prop-types";import{Component}from"react";import{HistoryNavigator}from"../common";import{formatWithPattern,getCountOfSymbolsInSelection,getCursorPositionAfterKeystroke,unformatWithPattern,getDistanceToPreviousSymbol,getDistanceToNextSymbol}from"../common/textFormat";var WithDisplayFormat=/*#__PURE__*/function(a){function b(a){var d;_classCallCheck(this,b),d=c.call(this,a),_defineProperty(_assertThisInitialized(d),"getUserAction",function(a){var b=d.state,c=b.triggerEvent,e=b.triggerType,f=b.value,g=d.props.displayPattern,h=String.fromCharCode(c.which).toLowerCase();return"Paste"===e||"Cut"===e?e:(c.ctrlKey||c.metaKey)&&"z"===h?c.shiftKey?"Redo":"Undo":c.ctrlKey&&"d"===h?"Delete":"undefined"==typeof c.key&&a.length<=unformatWithPattern(f,g).length?"Backspace":c.key;// Detect mouse event redo
 // Android Fix.
-}),_defineProperty(this,"resetEvent",()=>{this.setState({triggerType:null,triggerEvent:null,pastedLength:0})}),_defineProperty(this,"detectUndoRedo",a=>{const b=String.fromCharCode(a.which).toLowerCase();return(a.ctrlKey||a.metaKey)&&"z"===b?a.shiftKey?"Redo":"Undo":null}),_defineProperty(this,"handleOnKeyDown",a=>{a.persist();const{selectionStart:b,selectionEnd:c}=a.target,{historyNavigator:d}=this.state,{displayPattern:e}=this.props;// Unfortunately Undo and Redo don't trigger OnChange event so we need to handle some value logic here.
-let f="";"Undo"===this.detectUndoRedo(a)?(f=formatWithPattern(d.undo(),e),this.setState({value:f,triggerType:"Undo"})):"Redo"===this.detectUndoRedo(a)?(f=formatWithPattern(d.redo(),e),this.setState({value:f,triggerType:"Redo"})):this.setState({triggerEvent:a,triggerType:"KeyDown",selectionStart:b,selectionEnd:c})}),_defineProperty(this,"handleOnPaste",a=>{const{displayPattern:b}=this.props,c=unformatWithPattern(a.clipboardData.getData("Text"),b).length;this.setState({triggerType:"Paste",pastedLength:c})}),_defineProperty(this,"handleOnCut",()=>{this.setState({triggerType:"Cut"})}),_defineProperty(this,"isKeyAllowed",a=>{const{displayPattern:b}=this.props,c=b.split("").filter(a=>"*"!==a);return!c.includes(a)}),_defineProperty(this,"handleOnChange",a=>{const{historyNavigator:b,triggerEvent:c,triggerType:d}=this.state,{displayPattern:e,onChange:f}=this.props,{value:g}=a.target;let h=unformatWithPattern(g,e);const i=null===c?// triggerEvent can be null only in case of "autofilling" (via password manager extension or browser build-in one) events
-"Paste":this.getUserAction(h);if(this.isKeyAllowed(i)&&"Undo"!==d&&"Redo"!==d){("Backspace"===i||"Delete"===i)&&(h=this.handleDelete(h,i));const a=formatWithPattern(h,e);b.add(h),this.handleCursorPositioning(i);const c=unformatWithPattern(a,e);this.setState({value:a},this.resetEvent(),f(c))}}),_defineProperty(this,"handleOnBlur",a=>{const{displayPattern:b,onBlur:c}=this.props;c&&c(unformatWithPattern(a.target.value,b))}),_defineProperty(this,"handleOnFocus",a=>{const{displayPattern:b,onFocus:c}=this.props;c&&(this.handleOnChange(a),c(unformatWithPattern(a.target.value,b)))}),_defineProperty(this,"handleDelete",(a,b)=>{const{displayPattern:c}=this.props,{selectionStart:d,selectionEnd:e}=this.state,f=[...a];if(d===e){let a=d-getCountOfSymbolsInSelection(0,d,c),e=0,g=getDistanceToNextSymbol(d,c);"Backspace"===b&&(a-=1,g=getDistanceToPreviousSymbol(d,c)),0<=a&&g&&(e=1),f.splice(a,e)}return f.join("")}),_defineProperty(this,"handleCursorPositioning",a=>{const{displayPattern:b}=this.props,{triggerEvent:c,selectionStart:d,selectionEnd:e,pastedLength:f}=this.state,g=getCursorPositionAfterKeystroke(a,d,e,b,f);setTimeout(()=>{c&&c.target.setSelectionRange(g,g),this.setState({selectionStart:g,selectionEnd:g})},0)});const{value:b,displayPattern:c}=a,d=unformatWithPattern(b,c);this.state={value:formatWithPattern(d,c),historyNavigator:new HistoryNavigator,prevDisplayPattern:a.displayPattern,triggerType:null,triggerEvent:null}}static getDerivedStateFromProps(a,b){const{displayPattern:c}=a,{prevDisplayPattern:d}=b;if(b.prevDisplayPattern!==c){const{value:a,historyNavigator:e}=b,f=unformatWithPattern(a,d);return e.reset(),{prevDisplayPattern:c,value:formatWithPattern(f,c),triggerType:null,triggerEvent:null,pastedLength:0}}return null}render(){const{type:a,inputMode:b,className:c,id:d,name:e,placeholder:f,readOnly:g,required:h,minLength:i,maxLength:j,disabled:k,autoComplete:l}=this.props,{value:m}=this.state,n={type:a,inputMode:b,className:c,id:d,name:e,placeholder:f,readOnly:g,required:h,minLength:i,maxLength:j,disabled:k,autoComplete:l,value:m,onFocus:this.handleOnFocus,onBlur:this.handleOnBlur,onPaste:this.handleOnPaste,onKeyDown:this.handleOnKeyDown,onChange:this.handleOnChange,onCut:this.handleOnCut};return this.props.render(n)}}WithDisplayFormat.propTypes={/**
+}),_defineProperty(_assertThisInitialized(d),"resetEvent",function(){d.setState({triggerType:null,triggerEvent:null,pastedLength:0})}),_defineProperty(_assertThisInitialized(d),"detectUndoRedo",function(a){var b=String.fromCharCode(a.which).toLowerCase();return(a.ctrlKey||a.metaKey)&&"z"===b?a.shiftKey?"Redo":"Undo":null}),_defineProperty(_assertThisInitialized(d),"handleOnKeyDown",function(a){a.persist();var b=a.target,c=b.selectionStart,e=b.selectionEnd,f=d.state.historyNavigator,g=d.props.displayPattern,h="";"Undo"===d.detectUndoRedo(a)?(h=formatWithPattern(f.undo(),g),d.setState({value:h,triggerType:"Undo"})):"Redo"===d.detectUndoRedo(a)?(h=formatWithPattern(f.redo(),g),d.setState({value:h,triggerType:"Redo"})):d.setState({triggerEvent:a,triggerType:"KeyDown",selectionStart:c,selectionEnd:e})}),_defineProperty(_assertThisInitialized(d),"handleOnPaste",function(a){var b=d.props.displayPattern,c=unformatWithPattern(a.clipboardData.getData("Text"),b).length;d.setState({triggerType:"Paste",pastedLength:c})}),_defineProperty(_assertThisInitialized(d),"handleOnCut",function(){d.setState({triggerType:"Cut"})}),_defineProperty(_assertThisInitialized(d),"isKeyAllowed",function(a){var b=d.props.displayPattern,c=b.split("").filter(function(a){return"*"!==a});return!c.includes(a)}),_defineProperty(_assertThisInitialized(d),"handleOnChange",function(a){var b=d.state,c=b.historyNavigator,e=b.triggerEvent,f=b.triggerType,g=d.props,h=g.displayPattern,i=g.onChange,j=a.target.value,k=unformatWithPattern(j,h),l=null===e?// triggerEvent can be null only in case of "autofilling" (via password manager extension or browser build-in one) events
+"Paste":d.getUserAction(k);if(d.isKeyAllowed(l)&&"Undo"!==f&&"Redo"!==f){("Backspace"===l||"Delete"===l)&&(k=d.handleDelete(k,l));var m=formatWithPattern(k,h);c.add(k),d.handleCursorPositioning(l);var n=unformatWithPattern(m,h);d.setState({value:m},d.resetEvent(),i(n))}}),_defineProperty(_assertThisInitialized(d),"handleOnBlur",function(a){var b=d.props,c=b.displayPattern,e=b.onBlur;e&&e(unformatWithPattern(a.target.value,c))}),_defineProperty(_assertThisInitialized(d),"handleOnFocus",function(a){var b=d.props,c=b.displayPattern,e=b.onFocus;e&&(d.handleOnChange(a),e(unformatWithPattern(a.target.value,c)))}),_defineProperty(_assertThisInitialized(d),"handleDelete",function(a,b){var c=d.props.displayPattern,e=d.state,f=e.selectionStart,g=e.selectionEnd,h=_toConsumableArray(a);if(f===g){var i=f-getCountOfSymbolsInSelection(0,f,c),j=0,k=getDistanceToNextSymbol(f,c);"Backspace"===b&&(i-=1,k=getDistanceToPreviousSymbol(f,c)),0<=i&&k&&(j=1),h.splice(i,j)}return h.join("")}),_defineProperty(_assertThisInitialized(d),"handleCursorPositioning",function(a){var b=d.props.displayPattern,c=d.state,e=c.triggerEvent,f=c.selectionStart,g=c.selectionEnd,h=c.pastedLength,i=getCursorPositionAfterKeystroke(a,f,g,b,h);setTimeout(function(){e&&e.target.setSelectionRange(i,i),d.setState({selectionStart:i,selectionEnd:i})},0)});var e=a.value,f=a.displayPattern,g=unformatWithPattern(e,f);return d.state={value:formatWithPattern(g,f),historyNavigator:new HistoryNavigator,prevDisplayPattern:a.displayPattern,triggerType:null,triggerEvent:null},d}_inherits(b,a);var c=_createSuper(b);return _createClass(b,[{key:"render",value:function render(){var a=this.props,b=a.type,c=a.inputMode,d=a.className,e=a.id,f=a.name,g=a.placeholder,h=a.readOnly,i=a.required,j=a.minLength,k=a.maxLength,l=a.disabled,m=a.autoComplete,n=this.state.value,o={type:b,inputMode:c,className:d,id:e,name:f,placeholder:g,readOnly:h,required:i,minLength:j,maxLength:k,disabled:l,autoComplete:m,value:n,onFocus:this.handleOnFocus,onBlur:this.handleOnBlur,onPaste:this.handleOnPaste,onKeyDown:this.handleOnKeyDown,onChange:this.handleOnChange,onCut:this.handleOnCut};return this.props.render(o)}}],[{key:"getDerivedStateFromProps",value:function getDerivedStateFromProps(a,b){var c=a.displayPattern,d=b.prevDisplayPattern;if(b.prevDisplayPattern!==c){var e=b.value,f=b.historyNavigator,g=unformatWithPattern(e,d);return f.reset(),{prevDisplayPattern:c,value:formatWithPattern(g,c),triggerType:null,triggerEvent:null,pastedLength:0}}return null}}]),b}(Component);WithDisplayFormat.propTypes={/**
    * autocomplete hides our form help so we need to disable it when help text
    * is present. Chrome ignores autocomplete=off, the only way to disable it is
    * to provide an 'invalid' value, for which 'disabled' serves.

package/build/es/no-polyfill/withNextPortal/withNextPortal.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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{useState,useEffect}from"react";import{createPortal}from"react-dom";import{jsx as _jsx}from"react/jsx-runtime";export default function withNextPortalWrapper(a){return function(b){const[c,d]=useState(!1);return useEffect(()=>{d(!0)},[d]),c?/*#__PURE__*/createPortal(/*#__PURE__*/_jsx(a,_objectSpread({},b)),document.body):null}}
+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{useState,useEffect}from"react";import{createPortal}from"react-dom";import{jsx as _jsx}from"react/jsx-runtime";export default function withNextPortalWrapper(a){return function(b){var c=useState(!1),d=_slicedToArray(c,2),e=d[0],f=d[1];return useEffect(function(){f(!0)},[f]),e?/*#__PURE__*/createPortal(/*#__PURE__*/_jsx(a,_objectSpread({},b)),document.body):null}}

package/build/es/polyfill/accordion/Accordion.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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/web.dom-collections.iterator.js";import PropTypes from"prop-types";import{useState}from"react";import{Theme}from"../common";import AccordionItem from"./AccordionItem";import{jsx as _jsx}from"react/jsx-runtime";const Accordion=a=>{let{items:b,onClick:c,indexOpen:d,theme:e}=a;const[f,g]=useState(()=>b.map((a,b)=>b===d)),h=a=>{c&&c(a);const b=[...f];b[a]=!f[a],g(b)};return b.map((a,b)=>/*#__PURE__*/_jsx(AccordionItem,_objectSpread(_objectSpread({open:f[b],onClick:()=>h(b)},a),{},{theme:e}),a.id||b))};Accordion.propTypes={indexOpen:PropTypes.number,items:PropTypes.arrayOf(PropTypes.shape({id:PropTypes.string,title:PropTypes.node.isRequired,content:PropTypes.node.isRequired,icon:PropTypes.node})).isRequired,onClick:PropTypes.func,theme:PropTypes.oneOf(["light","dark"])},Accordion.defaultProps={indexOpen:-1,onClick:null,theme:Theme.LIGHT};export default Accordion;
+import _defineProperty from"@babel/runtime/helpers/defineProperty";import _toConsumableArray from"@babel/runtime/helpers/toConsumableArray";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.map.js";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";import PropTypes from"prop-types";import{useState}from"react";import{Theme}from"../common";import AccordionItem from"./AccordionItem";import{jsx as _jsx}from"react/jsx-runtime";var Accordion=function(a){var b=a.items,c=a.onClick,d=a.indexOpen,e=a.theme,f=useState(function(){return b.map(function(a,b){return b===d})}),g=_slicedToArray(f,2),h=g[0],i=g[1],j=function(a){c&&c(a);var b=_toConsumableArray(h);b[a]=!h[a],i(b)};return b.map(function(a,b){return/*#__PURE__*/_jsx(AccordionItem,_objectSpread(_objectSpread({open:h[b],onClick:function(){return j(b)}},a),{},{theme:e}),a.id||b)})};Accordion.propTypes={indexOpen:PropTypes.number,items:PropTypes.arrayOf(PropTypes.shape({id:PropTypes.string,title:PropTypes.node.isRequired,content:PropTypes.node.isRequired,icon:PropTypes.node})).isRequired,onClick:PropTypes.func,theme:PropTypes.oneOf(["light","dark"])},Accordion.defaultProps={indexOpen:-1,onClick:null,theme:Theme.LIGHT};export default Accordion;

package/build/es/polyfill/accordion/Accordion.story.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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{FastFlag as FastFlagIcon}from"@transferwise/icons";import{Scroll,Size}from"../common";import Modal from"../modal";import{lorem10,lorem40,storyConfig}from"../test-utils";import Accordion from"./Accordion";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:Accordion,title:"Content/Accordion",args:{items:[{title:"Item 1",content:lorem10,id:"Item 1"},{title:"Item 2",content:lorem40,id:"Item 2"},{title:"Item 3",content:lorem10,id:"Item 3"},{title:"Item 4",content:lorem10,id:"Item 4",icon:/*#__PURE__*/_jsx(FastFlagIcon,{size:24})}]}};export const Basic={args:{indexOpen:0}};export const BasicMobile=storyConfig(Basic,{variants:["mobile"]});export const Variants=storyConfig({args:{indexOpen:0}},{variants:["default","dark","rtl"]});export const Multiple={render:a=>{const b=a.items;return/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(Accordion,_objectSpread(_objectSpread({},a),{},{items:[b[0]]})),/*#__PURE__*/_jsx(Accordion,_objectSpread(_objectSpread({},a),{},{items:[b[0]],indexOpen:0})),/*#__PURE__*/_jsx(Accordion,_objectSpread(_objectSpread({},a),{},{items:b}))]})}};export const InModal={parameters:{chromatic:{delay:1e3}},render:a=>{const b=a.items;return/*#__PURE__*/_jsx(Modal,{body:/*#__PURE__*/_jsxs("div",{className:"p-a-1",children:[/*#__PURE__*/_jsx("h3",{className:"m-t-2 m-b-4 text-xs-center",children:"Large transfer tips"}),/*#__PURE__*/_jsx(Accordion,_objectSpread(_objectSpread({},a),{},{items:[b[0]]})),/*#__PURE__*/_jsx(Accordion,_objectSpread(_objectSpread({},a),{},{items:[b[0]],indexOpen:0})),/*#__PURE__*/_jsx(Accordion,_objectSpread(_objectSpread({},a),{},{items:b}))]}),scroll:Scroll.CONTENT,size:Size.LARGE,open:!0,footer:/*#__PURE__*/_jsx("div",{className:"p-a-3 text-xs-center",children:/*#__PURE__*/_jsx("a",{href:"/large-amounts",children:"Learn more"})}),onClose:()=>void 0})}};export const InModalMobile=storyConfig(InModal,{variants:["mobile"]});
+import _defineProperty from"@babel/runtime/helpers/defineProperty";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{FastFlag as FastFlagIcon}from"@transferwise/icons";import{Scroll,Size}from"../common";import Modal from"../modal";import{lorem10,lorem40,storyConfig}from"../test-utils";import Accordion from"./Accordion";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:Accordion,title:"Content/Accordion",args:{items:[{title:"Item 1",content:lorem10,id:"Item 1"},{title:"Item 2",content:lorem40,id:"Item 2"},{title:"Item 3",content:lorem10,id:"Item 3"},{title:"Item 4",content:lorem10,id:"Item 4",icon:/*#__PURE__*/_jsx(FastFlagIcon,{size:24})}]}};export var Basic={args:{indexOpen:0}};export var BasicMobile=storyConfig(Basic,{variants:["mobile"]});export var Variants=storyConfig({args:{indexOpen:0}},{variants:["default","dark","rtl"]});export var Multiple={render:function render(a){var b=a.items;return/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(Accordion,_objectSpread(_objectSpread({},a),{},{items:[b[0]]})),/*#__PURE__*/_jsx(Accordion,_objectSpread(_objectSpread({},a),{},{items:[b[0]],indexOpen:0})),/*#__PURE__*/_jsx(Accordion,_objectSpread(_objectSpread({},a),{},{items:b}))]})}};export var InModal={parameters:{chromatic:{delay:1e3}},render:function render(a){var b=a.items;return/*#__PURE__*/_jsx(Modal,{body:/*#__PURE__*/_jsxs("div",{className:"p-a-1",children:[/*#__PURE__*/_jsx("h3",{className:"m-t-2 m-b-4 text-xs-center",children:"Large transfer tips"}),/*#__PURE__*/_jsx(Accordion,_objectSpread(_objectSpread({},a),{},{items:[b[0]]})),/*#__PURE__*/_jsx(Accordion,_objectSpread(_objectSpread({},a),{},{items:[b[0]],indexOpen:0})),/*#__PURE__*/_jsx(Accordion,_objectSpread(_objectSpread({},a),{},{items:b}))]}),scroll:Scroll.CONTENT,size:Size.LARGE,open:!0,footer:/*#__PURE__*/_jsx("div",{className:"p-a-3 text-xs-center",children:/*#__PURE__*/_jsx("a",{href:"/large-amounts",children:"Learn more"})}),onClose:function onClose(){}})}};export var InModalMobile=storyConfig(InModal,{variants:["mobile"]});

package/build/es/polyfill/accordion/AccordionItem/AccordionItem.js

@@ -1 +1 @@
-import{useTheme}from"@wise/components-theming";import classNames from"classnames";import PropTypes from"prop-types";import{cloneElement}from"react";import Body from"../../body";import Chevron from"../../chevron";import{Position,Size,Typography,Theme}from"../../common";import Option from"../../common/Option";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";const AccordionItem=a=>{let{"aria-label":b,id:c,title:d,content:e,onClick:f,open:g,icon:h,theme:i}=a;const{isModern:j}=useTheme(),k=h?/*#__PURE__*/cloneElement(h,{size:24}):null;return/*#__PURE__*/_jsxs("div",{id:c,className:classNames("np-accordion-item","np-accordion-item--".concat(i),k?"np-accordion-item--with-icon":null,{"np-accordion-item--open":g}),children:[/*#__PURE__*/_jsx(Option,{"aria-label":b,as:"button",type:"button",media:k,title:d,button:/*#__PURE__*/_jsx(Chevron,{orientation:g?Position.TOP:Position.DOWN,size:j?Size.MEDIUM:Size.SMALL}),inverseMediaCircle:!1,onClick:f}),g&&/*#__PURE__*/_jsx(Body,{as:"span",type:Typography.BODY_LARGE,className:classNames("np-accordion-item__content","d-block",{"has-icon":h}),children:e})]})};AccordionItem.propTypes={"aria-label":PropTypes.string,content:PropTypes.node.isRequired,icon:PropTypes.node,id:PropTypes.string,open:PropTypes.bool.isRequired,onClick:PropTypes.func.isRequired,title:PropTypes.node.isRequired,theme:PropTypes.oneOf(["light","dark"])},AccordionItem.defaultProps={"aria-label":void 0,icon:null,id:null,theme:Theme.LIGHT};export default AccordionItem;
+import{useTheme}from"@wise/components-theming";import classNames from"classnames";import PropTypes from"prop-types";import{cloneElement}from"react";import Body from"../../body";import Chevron from"../../chevron";import{Position,Size,Typography,Theme}from"../../common";import Option from"../../common/Option";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var AccordionItem=function(a){var b=a["aria-label"],c=a.id,d=a.title,e=a.content,f=a.onClick,g=a.open,h=a.icon,i=a.theme,j=useTheme(),k=j.isModern,l=h?/*#__PURE__*/cloneElement(h,{size:24}):null;return/*#__PURE__*/_jsxs("div",{id:c,className:classNames("np-accordion-item","np-accordion-item--".concat(i),l?"np-accordion-item--with-icon":null,{"np-accordion-item--open":g}),children:[/*#__PURE__*/_jsx(Option,{"aria-label":b,as:"button",type:"button",media:l,title:d,button:/*#__PURE__*/_jsx(Chevron,{orientation:g?Position.TOP:Position.DOWN,size:k?Size.MEDIUM:Size.SMALL}),inverseMediaCircle:!1,onClick:f}),g&&/*#__PURE__*/_jsx(Body,{as:"span",type:Typography.BODY_LARGE,className:classNames("np-accordion-item__content","d-block",{"has-icon":h}),children:e})]})};AccordionItem.propTypes={"aria-label":PropTypes.string,content:PropTypes.node.isRequired,icon:PropTypes.node,id:PropTypes.string,open:PropTypes.bool.isRequired,onClick:PropTypes.func.isRequired,title:PropTypes.node.isRequired,theme:PropTypes.oneOf(["light","dark"])},AccordionItem.defaultProps={"aria-label":void 0,icon:null,id:null,theme:Theme.LIGHT};export default AccordionItem;

package/build/es/polyfill/actionButton/ActionButton.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";const _excluded=["disabled","className","onClick","priority","text","children"];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{forwardRef}from"react";import{Priority}from"../common";import{jsx as _jsx}from"react/jsx-runtime";const ActionButton=/*#__PURE__*/forwardRef((a,b)=>{let{disabled:f=!1,className:g=void 0,onClick:c,priority:h=Priority.PRIMARY,text:d,children:e}=a,i=_objectWithoutProperties(a,_excluded);return/*#__PURE__*/_jsx("button",_objectSpread(_objectSpread({ref:b,type:"button",className:classNames("np-action-btn","np-text-body-default-bold",h===Priority.SECONDARY?"btn-priority-2":"btn-priority-1",g),disabled:f,onClick:c},i),{},{children:e||d}))});export default ActionButton;
+import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["disabled","className","onClick","priority","text","children"];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{npTextBodyDefaultBold}from"@transferwise/neptune-css";import classNames from"classnames";import{forwardRef}from"react";import{Priority}from"../common";import{jsx as _jsx}from"react/jsx-runtime";var ActionButton=/*#__PURE__*/forwardRef(function(a,b){var c=a.disabled,d=a.className,e=void 0===d?void 0:d,f=a.onClick,g=a.priority,h=void 0===g?Priority.PRIMARY:g,i=a.text,j=a.children,k=_objectWithoutProperties(a,_excluded);return/*#__PURE__*/_jsx("button",_objectSpread(_objectSpread({ref:b,type:"button",className:classNames("np-action-btn",npTextBodyDefaultBold,h===Priority.SECONDARY?"btn-priority-2":"btn-priority-1",e),disabled:void 0!==c&&c,onClick:f},k),{},{children:j||i}))});export default ActionButton;

package/build/es/polyfill/actionButton/ActionButton.spec.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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"@testing-library/jest-dom";import{render,screen,userEvent}from"../test-utils";import ActionButton from".";import{jsx as _jsx}from"react/jsx-runtime";describe("ActionButton",()=>{const a={children:"Personal profile",onClick:jest.fn()};describe("by default",()=>{beforeEach(()=>{render(/*#__PURE__*/_jsx(ActionButton,_objectSpread({},a)))}),it("renders the text",()=>{expect(screen.getByText("Personal profile")).toBeInTheDocument()}),it("is not disabled",()=>{expect(screen.getByRole("button")).toBeEnabled()}),it("renders the button",()=>{expect(render(/*#__PURE__*/_jsx(ActionButton,_objectSpread({},a))).container).toMatchSnapshot()})}),describe("button attributes",()=>{it("disables the button if disabled",()=>{render(/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({},a),{},{disabled:!0}))),expect(screen.getByRole("button")).toBeDisabled()}),it("passes through custom classes if set",()=>{render(/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({},a),{},{className:"catsarethebest"}))),expect(screen.getByRole("button")).toHaveClass("catsarethebest")})}),describe("onClick",()=>{it("calls onClick when clicked",()=>{const b=jest.fn();render(/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({},a),{},{onClick:b}))),userEvent.click(screen.getByRole("button")),expect(b).toHaveBeenCalledTimes(1)}),it("does not call onClick when clicked if disabled",()=>{const b=jest.fn();render(/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({},a),{},{disabled:!0,onClick:b}))),userEvent.click(screen.getByRole("button")),expect(b).toHaveBeenCalledTimes(0)})}),describe("deprecated",()=>{it("text prop",()=>{const a=jest.fn();render(/*#__PURE__*/_jsx(ActionButton,{disabled:!0,text:"Text prop",onClick:a})),expect(screen.getByText("Text prop")).toBeInTheDocument()})}),describe("priority",()=>{it("is rendered for primary",()=>{render(/*#__PURE__*/_jsx(ActionButton,{priority:"primary"})),expect(screen.getByRole("button")).toHaveClass("btn-priority-1")}),it("is rendered for secondary",()=>{render(/*#__PURE__*/_jsx(ActionButton,{priority:"secondary"})),expect(screen.getByRole("button")).toHaveClass("btn-priority-2")}),it("is backwards compatible if nothing is passed in",()=>{render(/*#__PURE__*/_jsx(ActionButton,{})),expect(screen.getByRole("button")).toHaveClass("btn-priority-1")})})});
+import _defineProperty from"@babel/runtime/helpers/defineProperty";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"@testing-library/jest-dom";import{render,screen,userEvent}from"../test-utils";import ActionButton from".";import{jsx as _jsx}from"react/jsx-runtime";describe("ActionButton",function(){var a={children:"Personal profile",onClick:jest.fn()};describe("by default",function(){beforeEach(function(){render(/*#__PURE__*/_jsx(ActionButton,_objectSpread({},a)))}),it("renders the text",function(){expect(screen.getByText("Personal profile")).toBeInTheDocument()}),it("is not disabled",function(){expect(screen.getByRole("button")).toBeEnabled()}),it("renders the button",function(){expect(render(/*#__PURE__*/_jsx(ActionButton,_objectSpread({},a))).container).toMatchSnapshot()})}),describe("button attributes",function(){it("disables the button if disabled",function(){render(/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({},a),{},{disabled:!0}))),expect(screen.getByRole("button")).toBeDisabled()}),it("passes through custom classes if set",function(){render(/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({},a),{},{className:"catsarethebest"}))),expect(screen.getByRole("button")).toHaveClass("catsarethebest")})}),describe("onClick",function(){it("calls onClick when clicked",function(){var b=jest.fn();render(/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({},a),{},{onClick:b}))),userEvent.click(screen.getByRole("button")),expect(b).toHaveBeenCalledTimes(1)}),it("does not call onClick when clicked if disabled",function(){var b=jest.fn();render(/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({},a),{},{disabled:!0,onClick:b}))),userEvent.click(screen.getByRole("button")),expect(b).toHaveBeenCalledTimes(0)})}),describe("deprecated",function(){it("text prop",function(){var a=jest.fn();render(/*#__PURE__*/_jsx(ActionButton,{disabled:!0,text:"Text prop",onClick:a})),expect(screen.getByText("Text prop")).toBeInTheDocument()})}),describe("priority",function(){it("is rendered for primary",function(){render(/*#__PURE__*/_jsx(ActionButton,{priority:"primary"})),expect(screen.getByRole("button")).toHaveClass("btn-priority-1")}),it("is rendered for secondary",function(){render(/*#__PURE__*/_jsx(ActionButton,{priority:"secondary"})),expect(screen.getByRole("button")).toHaveClass("btn-priority-2")}),it("is backwards compatible if nothing is passed in",function(){render(/*#__PURE__*/_jsx(ActionButton,{})),expect(screen.getByRole("button")).toHaveClass("btn-priority-1")})})});

package/build/es/polyfill/actionButton/ActionButton.story.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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{Settings}from"@transferwise/icons";import{storyConfig}from"../test-utils/story-config";import ActionButton from"./ActionButton";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{component:ActionButton,title:"Actions/ActionButton",tags:["autodocs"]};export const Basic=storyConfig({render:a=>/*#__PURE__*/_jsxs("div",{style:{display:"flex",gap:"0.4rem",flexWrap:"wrap"},children:[/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({priority:"primary"},a),{},{children:"Primary label"})),/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({priority:"secondary"},a),{},{children:"Secondary label"})),/*#__PURE__*/_jsxs(ActionButton,_objectSpread(_objectSpread({priority:"primary"},a),{},{style:{display:"flex",gap:"0.4rem"},children:[/*#__PURE__*/_jsx(Settings,{}),"Primary label"]})),/*#__PURE__*/_jsxs(ActionButton,_objectSpread(_objectSpread({priority:"secondary"},a),{},{style:{display:"flex",gap:"0.4rem"},children:[/*#__PURE__*/_jsx(Settings,{}),"Secondary label"]}))]})},{variants:["default","dark","rtl","mobile"]});export const Disabled=storyConfig({render:Basic.render,args:{disabled:!0}},{variants:["default","dark","rtl","mobile"]});
+import _defineProperty from"@babel/runtime/helpers/defineProperty";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{Settings}from"@transferwise/icons";import{storyConfig}from"../test-utils/story-config";import ActionButton from"./ActionButton";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{component:ActionButton,title:"Actions/ActionButton",tags:["autodocs"]};export var Basic=storyConfig({render:function render(a){return/*#__PURE__*/_jsxs("div",{style:{display:"flex",gap:"0.4rem",flexWrap:"wrap"},children:[/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({priority:"primary"},a),{},{children:"Primary label"})),/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({priority:"secondary"},a),{},{children:"Secondary label"})),/*#__PURE__*/_jsxs(ActionButton,_objectSpread(_objectSpread({priority:"primary"},a),{},{style:{display:"flex",gap:"0.4rem"},children:[/*#__PURE__*/_jsx(Settings,{}),"Primary label"]})),/*#__PURE__*/_jsxs(ActionButton,_objectSpread(_objectSpread({priority:"secondary"},a),{},{style:{display:"flex",gap:"0.4rem"},children:[/*#__PURE__*/_jsx(Settings,{}),"Secondary label"]}))]})}},{variants:["default","dark","rtl","mobile"]});export var Disabled=storyConfig({render:Basic.render,args:{disabled:!0}},{variants:["default","dark","rtl","mobile"]});

package/build/es/polyfill/actionOption/ActionOption.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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 ActionButton from"../actionButton";import Option from"../common/Option";import{jsx as _jsx}from"react/jsx-runtime";const ActionOption=a=>{let{action:b,disabled:c,onClick:d,media:e,title:f,content:g,complex:h,className:i,showMediaAtAllSizes:j,showMediaCircle:k,isContainerAligned:l}=a;const m={media:e,title:f,content:g,complex:h,disabled:c,showMediaAtAllSizes:j,showMediaCircle:k,className:classNames("tw-action-option",i),isContainerAligned:l};return/*#__PURE__*/_jsx(Option,_objectSpread(_objectSpread({},m),{},{button:/*#__PURE__*/_jsx(ActionButton,{disabled:c,"aria-label":(()=>{const a=[];return"string"==typeof f&&a.push(f),"string"==typeof b&&a.push(b),a.join(", ")||void 0})(),onClick:d,children:b})}))};export default ActionOption;
+import _defineProperty from"@babel/runtime/helpers/defineProperty";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"core-js/modules/es.array.join.js";import classNames from"classnames";import ActionButton from"../actionButton";import Option from"../common/Option";import{jsx as _jsx}from"react/jsx-runtime";var ActionOption=function(a){var b=a.action,c=a.disabled,d=a.onClick,e=a.media,f=a.title,g=a.content,h=a.complex,i=a.className,j=a.showMediaAtAllSizes,k=a.showMediaCircle,l=a.isContainerAligned,m={media:e,title:f,content:g,complex:h,disabled:c,showMediaAtAllSizes:j,showMediaCircle:k,className:classNames("tw-action-option",i),isContainerAligned:l};return/*#__PURE__*/_jsx(Option,_objectSpread(_objectSpread({},m),{},{button:/*#__PURE__*/_jsx(ActionButton,{disabled:c,"aria-label":function getAriaLabel(){var a=[];return"string"==typeof f&&a.push(f),"string"==typeof b&&a.push(b),a.join(", ")||void 0}(),onClick:d,children:b})}))};export default ActionOption;

package/build/es/polyfill/actionOption/ActionOption.story.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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{action}from"@storybook/addon-actions";import{FastFlag as FastFlagIcon}from"@transferwise/icons";import{Nudge}from"..";import ActionOption from"./ActionOption";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:ActionOption,title:"Option/ActionOption",args:{title:"Action option",content:"Normally, the button and icon are vertically centered.",action:"Action",media:/*#__PURE__*/_jsx(FastFlagIcon,{}),showMediaCircle:!1},tags:["autodocs"]};export const Basic={render:a=>/*#__PURE__*/_jsx(ActionOption,_objectSpread({},a))};export const WithContainerContent={render:a=>/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx("h2",{className:"m-b-2",children:"Choose how to pay"}),/*#__PURE__*/_jsx(ActionOption,_objectSpread({},a)),/*#__PURE__*/_jsx(ActionOption,_objectSpread({},a)),/*#__PURE__*/_jsx(ActionOption,_objectSpread({},a)),/*#__PURE__*/_jsx(Nudge,{className:"m-t-2",mediaName:"globe",title:"Text that is no longer than two lines.",link:"Link",href:"#",onClick:action("action clicked"),onDismiss:action("dismissed")})]})};
+import _defineProperty from"@babel/runtime/helpers/defineProperty";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{action}from"@storybook/addon-actions";import{FastFlag as FastFlagIcon}from"@transferwise/icons";import{Nudge}from"..";import ActionOption from"./ActionOption";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:ActionOption,title:"Option/ActionOption",args:{title:"Action option",content:"Normally, the button and icon are vertically centered.",action:"Action",media:/*#__PURE__*/_jsx(FastFlagIcon,{}),showMediaCircle:!1},tags:["autodocs"]};export var Basic={render:function render(a){return/*#__PURE__*/_jsx(ActionOption,_objectSpread({},a))}};export var WithContainerContent={render:function render(a){return/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx("h2",{className:"m-b-2",children:"Choose how to pay"}),/*#__PURE__*/_jsx(ActionOption,_objectSpread({},a)),/*#__PURE__*/_jsx(ActionOption,_objectSpread({},a)),/*#__PURE__*/_jsx(ActionOption,_objectSpread({},a)),/*#__PURE__*/_jsx(Nudge,{className:"m-t-2",mediaName:"globe",title:"Text that is no longer than two lines.",link:"Link",href:"#",onClick:action("action clicked"),onDismiss:action("dismissed")})]})}};

package/build/es/polyfill/alert/Alert.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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/web.dom-collections.iterator.js";import"core-js/modules/es.array.includes.js";import"core-js/modules/es.string.includes.js";import{InfoCircle,Warning as AlertTriangle,CrossCircle,CheckCircle,Clock}from"@transferwise/icons";import{useTheme}from"@wise/components-theming";import classNames from"classnames";import PropTypes from"prop-types";import{useState,useRef}from"react";import requiredIf from"react-required-if";import Body from"../body/Body";import{Sentiment,Size,Typography,Variant}from"../common";import{CloseButton}from"../common/closeButton";import Link from"../link";import StatusIcon from"../statusIcon";import Title from"../title/Title";import{logActionRequiredIf,deprecated}from"../utilities";import InlineMarkdown from"./inlineMarkdown";import withArrow from"./withArrow";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";const deprecatedTypeMap={[Sentiment.SUCCESS]:Sentiment.POSITIVE,[Sentiment.INFO]:Sentiment.NEUTRAL,[Sentiment.ERROR]:Sentiment.NEGATIVE},Alert=a=>{const{isModern:b}=useTheme(),c={[Sentiment.POSITIVE]:CheckCircle,[Sentiment.NEUTRAL]:InfoCircle,[Sentiment.WARNING]:AlertTriangle,[Sentiment.NEGATIVE]:CrossCircle,[Sentiment.PENDING]:Clock},[d,e]=useState(!1),{arrow:f,action:g,children:h,className:i,icon:j,onDismiss:k,message:l,title:m,type:n,variant:o}=a,p=useRef(null);if(f){const b=withArrow(Alert,f);return/*#__PURE__*/_jsx(b,_objectSpread({},a))}logActionRequired(a);const q=deprecatedTypeMap[n]||n,r=c[q];return/*#__PURE__*/_jsxs("div",{role:"alert",className:classNames("alert d-flex","alert-".concat(q),i),onTouchStart:()=>e(!0),onTouchEnd:a=>{d&&g&&null!==p&&void 0!==p&&p.current&&!p.current.contains(a.target)&&("_blank"===(null===g||void 0===g?void 0:g.target)?window.top.open(g.href):window.top.location.assign(g.href)),e(!1)},onTouchMove:()=>e(!1),children:[/*#__PURE__*/_jsxs("div",{className:classNames("alert__content","d-flex","flex-grow-1",o),"data-testid":o,children:[function(){return j?/*#__PURE__*/_jsx("div",{className:"alert__icon",children:j}):b?/*#__PURE__*/_jsx(StatusIcon,{size:Size.LARGE,sentiment:q}):/*#__PURE__*/_jsx(r,{size:24})}(),/*#__PURE__*/_jsxs("div",{className:"alert__message",children:[m&&/*#__PURE__*/_jsx(Title,{className:"m-b-1",type:Typography.TITLE_BODY,children:m}),/*#__PURE__*/_jsx(Body,{as:"span",className:"d-block",type:Typography.BODY_LARGE,children:h||/*#__PURE__*/_jsx(InlineMarkdown,{children:l})}),g&&/*#__PURE__*/_jsx(Link,{href:g.href,className:"m-t-1","aria-label":g["aria-label"],target:g.target,type:Typography.LINK_LARGE,children:g.text})]})]}),k&&/*#__PURE__*/_jsx(CloseButton,{ref:p,className:"m-l-2",onClick:k})]})},deprecatedTypeMapMessage={[Sentiment.SUCCESS]:"Sentiment.POSITIVE",[Sentiment.INFO]:"Sentiment.NEUTRAL",[Sentiment.ERROR]:"Sentiment.NEGATIVE"},deprecatedTypes=Object.keys(deprecatedTypeMap);function logActionRequired(a){let{size:b,type:c}=a;logActionRequiredIf("Alert no longer supports any possible variations in size. Please remove the `size` prop.",!!b),logActionRequiredIf("Alert has deprecated the ".concat(c," value for the `type` prop. Please update to ").concat(deprecatedTypeMapMessage[c],"."),deprecatedTypes.includes(c))}Alert.propTypes={/** An optional call to action to sit under the main body of the alert. If your label is short, use aria-label to provide more context */action:PropTypes.shape({"aria-label":PropTypes.string,href:PropTypes.string.isRequired,target:PropTypes.string,text:PropTypes.node.isRequired}),className:PropTypes.string,/** An optional icon. If not provided, we will default the icon to something appropriate for the type */icon:PropTypes.element,/** Title for the alert component */title:PropTypes.string,/** The main body of the alert. Accepts plain text and bold words specified with **double stars*/message:requiredIf(PropTypes.node,a=>{let{children:b}=a;return!b}),/** The presence of the onDismiss handler will trigger the visibility of the close button */onDismiss:PropTypes.func,/** The type dictates which icon and colour will be used */type:PropTypes.oneOf(["negative","neutral","positive","warning","info","error","success"]),variant:PropTypes.oneOf(["desktop","mobile"]),/** @deprecated no arrow for `Alert` component anymore, consider to use [`InlineAlert`](https://transferwise.github.io/neptune-web/components/alerts/InlineAlert) component */arrow:deprecated(PropTypes.oneOf(["up-left","up-center","up-right","down-left","down-center","down-right"]),{component:"Alert",expiryDate:new Date("03-01-2021")}),/** @deprecated use `message` property instead */children:deprecated(requiredIf(PropTypes.node,a=>{let{message:b}=a;return!b}),{component:"Alert",message:"You should now use the `message` prop. Be aware `message` only accepts plain text or text with **bold** markdown.",expiryDate:new Date("03-01-2021")}),/** @deprecated use `onDismiss` instead */dismissible:deprecated(PropTypes.bool,{component:"Alert",message:"The Alert will now be considered dismissible if an `onDismiss` hander is present.",expiryDate:new Date("03-01-2021")})},Alert.defaultProps={action:void 0,arrow:void 0,className:void 0,dismissible:void 0,icon:void 0,type:Sentiment.NEUTRAL,variant:Variant.DESKTOP};export default Alert;
+import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _defineProperty from"@babel/runtime/helpers/defineProperty";var _deprecatedTypeMap,_deprecatedTypeMapMes;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";import"core-js/modules/es.object.keys.js";import"core-js/modules/es.array.concat.js";import"core-js/modules/es.array.includes.js";import"core-js/modules/es.string.includes.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{InfoCircle,Warning as AlertTriangle,CrossCircle,CheckCircle,Clock}from"@transferwise/icons";import{useTheme}from"@wise/components-theming";import classNames from"classnames";import PropTypes from"prop-types";import{useState,useRef}from"react";import requiredIf from"react-required-if";import Body from"../body/Body";import{Sentiment,Size,Typography,Variant}from"../common";import{CloseButton}from"../common/closeButton";import Link from"../link";import StatusIcon from"../statusIcon";import Title from"../title/Title";import{logActionRequiredIf,deprecated}from"../utilities";import InlineMarkdown from"./inlineMarkdown";import withArrow from"./withArrow";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var deprecatedTypeMap=(_deprecatedTypeMap={},_defineProperty(_deprecatedTypeMap,Sentiment.SUCCESS,Sentiment.POSITIVE),_defineProperty(_deprecatedTypeMap,Sentiment.INFO,Sentiment.NEUTRAL),_defineProperty(_deprecatedTypeMap,Sentiment.ERROR,Sentiment.NEGATIVE),_deprecatedTypeMap),Alert=function(a){var b,c=useTheme(),d=c.isModern,e=(b={},_defineProperty(b,Sentiment.POSITIVE,CheckCircle),_defineProperty(b,Sentiment.NEUTRAL,InfoCircle),_defineProperty(b,Sentiment.WARNING,AlertTriangle),_defineProperty(b,Sentiment.NEGATIVE,CrossCircle),_defineProperty(b,Sentiment.PENDING,Clock),b),f=useState(!1),g=_slicedToArray(f,2),h=g[0],i=g[1],j=a.arrow,k=a.action,l=a.children,m=a.className,n=a.icon,o=a.onDismiss,p=a.message,q=a.title,r=a.type,s=a.variant,t=useRef(null);if(j){var u=withArrow(Alert,j);return/*#__PURE__*/_jsx(u,_objectSpread({},a))}logActionRequired(a);var v=deprecatedTypeMap[r]||r,w=e[v];return/*#__PURE__*/_jsxs("div",{role:"alert",className:classNames("alert d-flex","alert-".concat(v),m),onTouchStart:function handleTouchStart(){return i(!0)},onTouchEnd:function handleTouchEnd(a){h&&k&&null!==t&&void 0!==t&&t.current&&!t.current.contains(a.target)&&("_blank"===(null===k||void 0===k?void 0:k.target)?window.top.open(k.href):window.top.location.assign(k.href)),i(!1)},onTouchMove:function handleTouchMove(){return i(!1)},children:[/*#__PURE__*/_jsxs("div",{className:classNames("alert__content","d-flex","flex-grow-1",s),"data-testid":s,children:[function(){return n?/*#__PURE__*/_jsx("div",{className:"alert__icon",children:n}):d?/*#__PURE__*/_jsx(StatusIcon,{size:Size.LARGE,sentiment:v}):/*#__PURE__*/_jsx(w,{size:24})}(),/*#__PURE__*/_jsxs("div",{className:"alert__message",children:[q&&/*#__PURE__*/_jsx(Title,{className:"m-b-1",type:Typography.TITLE_BODY,children:q}),/*#__PURE__*/_jsx(Body,{as:"span",className:"d-block",type:Typography.BODY_LARGE,children:l||/*#__PURE__*/_jsx(InlineMarkdown,{children:p})}),k&&/*#__PURE__*/_jsx(Link,{href:k.href,className:"m-t-1","aria-label":k["aria-label"],target:k.target,type:Typography.LINK_LARGE,children:k.text})]})]}),o&&/*#__PURE__*/_jsx(CloseButton,{ref:t,className:"m-l-2",onClick:o})]})},deprecatedTypeMapMessage=(_deprecatedTypeMapMes={},_defineProperty(_deprecatedTypeMapMes,Sentiment.SUCCESS,"Sentiment.POSITIVE"),_defineProperty(_deprecatedTypeMapMes,Sentiment.INFO,"Sentiment.NEUTRAL"),_defineProperty(_deprecatedTypeMapMes,Sentiment.ERROR,"Sentiment.NEGATIVE"),_deprecatedTypeMapMes),deprecatedTypes=Object.keys(deprecatedTypeMap);function logActionRequired(a){var b=a.size,c=a.type;logActionRequiredIf("Alert no longer supports any possible variations in size. Please remove the `size` prop.",!!b),logActionRequiredIf("Alert has deprecated the ".concat(c," value for the `type` prop. Please update to ").concat(deprecatedTypeMapMessage[c],"."),deprecatedTypes.includes(c))}Alert.propTypes={/** An optional call to action to sit under the main body of the alert. If your label is short, use aria-label to provide more context */action:PropTypes.shape({"aria-label":PropTypes.string,href:PropTypes.string.isRequired,target:PropTypes.string,text:PropTypes.node.isRequired}),className:PropTypes.string,/** An optional icon. If not provided, we will default the icon to something appropriate for the type */icon:PropTypes.element,/** Title for the alert component */title:PropTypes.string,/** The main body of the alert. Accepts plain text and bold words specified with **double stars*/message:requiredIf(PropTypes.node,function(a){var b=a.children;return!b}),/** The presence of the onDismiss handler will trigger the visibility of the close button */onDismiss:PropTypes.func,/** The type dictates which icon and colour will be used */type:PropTypes.oneOf(["negative","neutral","positive","warning","info","error","success"]),variant:PropTypes.oneOf(["desktop","mobile"]),/** @deprecated no arrow for `Alert` component anymore, consider to use [`InlineAlert`](https://transferwise.github.io/neptune-web/components/alerts/InlineAlert) component */arrow:deprecated(PropTypes.oneOf(["up-left","up-center","up-right","down-left","down-center","down-right"]),{component:"Alert",expiryDate:new Date("03-01-2021")}),/** @deprecated use `message` property instead */children:deprecated(requiredIf(PropTypes.node,function(a){var b=a.message;return!b}),{component:"Alert",message:"You should now use the `message` prop. Be aware `message` only accepts plain text or text with **bold** markdown.",expiryDate:new Date("03-01-2021")}),/** @deprecated use `onDismiss` instead */dismissible:deprecated(PropTypes.bool,{component:"Alert",message:"The Alert will now be considered dismissible if an `onDismiss` hander is present.",expiryDate:new Date("03-01-2021")})},Alert.defaultProps={action:void 0,arrow:void 0,className:void 0,dismissible:void 0,icon:void 0,type:Sentiment.NEUTRAL,variant:Variant.DESKTOP};export default Alert;

package/build/es/polyfill/alert/Alert.story.js

@@ -1 +1 @@
-/* eslint-disable no-alert */import{ClockBorderless}from"@transferwise/icons";import{Sentiment}from"../common";import Alert from"./Alert";import{AlertArrowPosition}from"./withArrow";import{jsx as _jsx}from"react/jsx-runtime";export default{component:Alert,title:"Feedback/Alert",args:{type:Sentiment.POSITIVE,message:"Payments sent to your bank details **today** might not arrive in time for the holidays."},argTypes:{arrow:{name:"arrow (deprecated)",type:{name:"enum",value:Object.keys(AlertArrowPosition)}},type:{type:{name:"enum",value:[Sentiment.POSITIVE,Sentiment.NEGATIVE,Sentiment.NEUTRAL,Sentiment.WARNING,Sentiment.PENDING]}}},tags:["autodocs"]};export const Basic={args:{onDismiss:void 0}};export const WithAction={args:{action:{href:"/",text:"Read more"}}};export const WithArrow={args:{arrow:AlertArrowPosition.TOP_LEFT}};const CustomIcon=()=>/*#__PURE__*/_jsx("div",{style:{width:"100%",height:"100%",color:"#ffffff",backgroundColor:"#454745",display:"flex",alignItems:"center",borderRadius:"50%",justifyContent:"center"},children:/*#__PURE__*/_jsx(ClockBorderless,{size:"32"})});export const WithCustomIcon={args:{icon:/*#__PURE__*/_jsx(CustomIcon,{})}};export const WithTitle={args:{type:Sentiment.NEUTRAL,title:"We\u2019re reviewing your information."}};
+import"core-js/modules/es.object.keys.js";/* eslint-disable no-alert */import{ClockBorderless}from"@transferwise/icons";import{Sentiment}from"../common";import Alert from"./Alert";import{AlertArrowPosition}from"./withArrow";import{jsx as _jsx}from"react/jsx-runtime";export default{component:Alert,title:"Feedback/Alert",args:{type:Sentiment.POSITIVE,message:"Payments sent to your bank details **today** might not arrive in time for the holidays."},argTypes:{arrow:{name:"arrow (deprecated)",type:{name:"enum",value:Object.keys(AlertArrowPosition)}},type:{type:{name:"enum",value:[Sentiment.POSITIVE,Sentiment.NEGATIVE,Sentiment.NEUTRAL,Sentiment.WARNING,Sentiment.PENDING]}}},tags:["autodocs"]};export var Basic={args:{onDismiss:void 0}};export var WithAction={args:{action:{href:"/",text:"Read more"}}};export var WithArrow={args:{arrow:AlertArrowPosition.TOP_LEFT}};var CustomIcon=function(){return/*#__PURE__*/_jsx("div",{style:{width:"100%",height:"100%",color:"#ffffff",backgroundColor:"#454745",display:"flex",alignItems:"center",borderRadius:"50%",justifyContent:"center"},children:/*#__PURE__*/_jsx(ClockBorderless,{size:"32"})})};export var WithCustomIcon={args:{icon:/*#__PURE__*/_jsx(CustomIcon,{})}};export var WithTitle={args:{type:Sentiment.NEUTRAL,title:"We\u2019re reviewing your information."}};

package/build/es/polyfill/alert/inlineMarkdown/InlineMarkdown.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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 PropTypes from"prop-types";import{MarkdownNodeType}from"../../common";import Markdown from"../../markdown";import{jsx as _jsx}from"react/jsx-runtime";const allowList=[MarkdownNodeType.STRONG],InlineMarkdown=a=>/*#__PURE__*/_jsx(Markdown,_objectSpread(_objectSpread({},a),{},{as:"span",allowList:allowList,blockList:void 0}));InlineMarkdown.propTypes={children:PropTypes.string.isRequired,className:PropTypes.string},InlineMarkdown.defaultProps={className:void 0};export default InlineMarkdown;
+import _defineProperty from"@babel/runtime/helpers/defineProperty";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 PropTypes from"prop-types";import{MarkdownNodeType}from"../../common";import Markdown from"../../markdown";import{jsx as _jsx}from"react/jsx-runtime";var allowList=[MarkdownNodeType.STRONG],InlineMarkdown=function(a){return/*#__PURE__*/_jsx(Markdown,_objectSpread(_objectSpread({},a),{},{as:"span",allowList:allowList,blockList:void 0}))};InlineMarkdown.propTypes={children:PropTypes.string.isRequired,className:PropTypes.string},InlineMarkdown.defaultProps={className:void 0};export default InlineMarkdown;

package/build/es/polyfill/alert/withArrow/alertArrowPositions.js

@@ -1,2 +1,2 @@
 // TODO: consider to move this enum into component file once we migrate it on TypeScript or replace with some common enum
-export let ArrowPosition=/*#__PURE__*/function(a){return a.TOP_LEFT="up-left",a.TOP="up-center",a.TOP_RIGHT="up-right",a.BOTTOM_LEFT="down-left",a.BOTTOM="down-center",a.BOTTOM_RIGHT="down-right",a}({});
+export var ArrowPosition=/*#__PURE__*/function(a){return a.TOP_LEFT="up-left",a.TOP="up-center",a.TOP_RIGHT="up-right",a.BOTTOM_LEFT="down-left",a.BOTTOM="down-center",a.BOTTOM_RIGHT="down-right",a}({});

package/build/es/polyfill/alert/withArrow/withArrow.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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{ArrowPosition}from"./alertArrowPositions";import{jsx as _jsx}from"react/jsx-runtime";function withArrow(a,b){const c=c=>/*#__PURE__*/_jsx(a,_objectSpread(_objectSpread({},c),{},{className:classNames(c.className,arrowClasses(b)),arrow:void 0}));return c.propTypes={className:PropTypes.string},c.defaultProps={className:void 0},c}function arrowClasses(a){if(a){const b=["arrow"],{BOTTOM:c,BOTTOM_LEFT:d,BOTTOM_RIGHT:e,TOP:f,TOP_RIGHT:g,TOP_LEFT:h}=ArrowPosition;switch(a){case c:return b.concat("arrow-bottom","arrow-center");case d:return b.concat("arrow-bottom","arrow-left");case e:return b.concat("arrow-bottom","arrow-right");case f:return b.concat("arrow-center");case g:return b.concat("arrow-right");case h:default:return b;}}return""}export default withArrow;
+import _defineProperty from"@babel/runtime/helpers/defineProperty";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";import"core-js/modules/es.array.concat.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 PropTypes from"prop-types";import{ArrowPosition}from"./alertArrowPositions";import{jsx as _jsx}from"react/jsx-runtime";function withArrow(a,b){var c=function(c){return/*#__PURE__*/_jsx(a,_objectSpread(_objectSpread({},c),{},{className:classNames(c.className,arrowClasses(b)),arrow:void 0}))};return c.propTypes={className:PropTypes.string},c.defaultProps={className:void 0},c}function arrowClasses(a){if(a){var b=["arrow"],c=ArrowPosition.BOTTOM,d=ArrowPosition.BOTTOM_LEFT,e=ArrowPosition.BOTTOM_RIGHT,f=ArrowPosition.TOP,g=ArrowPosition.TOP_RIGHT,h=ArrowPosition.TOP_LEFT;switch(a){case c:return b.concat("arrow-bottom","arrow-center");case d:return b.concat("arrow-bottom","arrow-left");case e:return b.concat("arrow-bottom","arrow-right");case f:return b.concat("arrow-center");case g:return b.concat("arrow-right");case h:default:return b;}}return""}export default withArrow;

package/build/es/polyfill/avatar/Avatar.js

@@ -1 +1 @@
-import classnames from"classnames";import{useMemo}from"react";import{Theme}from"../common";import{getAvatarColorFromSeed}from"./colors";import{jsx as _jsx}from"react/jsx-runtime";const backwardsCompatibleSize=a=>"sm"===a?24:"md"===a?48:"lg"===a?72:a,Avatar=a=>{let{backgroundColor:b=null,backgroundColorSeed:c=null,children:d=null,className:e=null,outlined:f=!1,size:g=48,theme:h=Theme.LIGHT,type:i="thumbnail"}=a;const j=useMemo(()=>!b&&c?"var(".concat(getAvatarColorFromSeed(c),")"):void 0,[b,c]),k=backwardsCompatibleSize(g);return/*#__PURE__*/_jsx("div",{className:classnames("tw-avatar",e,"tw-avatar--".concat(k),"tw-avatar--".concat(i),{"tw-avatar--outlined":f,"tw-avatar--branded":!!j,"np-text-title-body":"initials"===i}),children:/*#__PURE__*/_jsx("div",{className:"tw-avatar__content",style:{backgroundColor:b||j},children:d})})};export default Avatar;
+import classnames from"classnames";import{useMemo}from"react";import{Theme}from"../common";import{getAvatarColorFromSeed}from"./colors";import{jsx as _jsx}from"react/jsx-runtime";var backwardsCompatibleSize=function(a){return"sm"===a?24:"md"===a?48:"lg"===a?72:a},Avatar=function(a){var b=a.backgroundColor,c=void 0===b?null:b,d=a.backgroundColorSeed,e=void 0===d?null:d,f=a.children,g=void 0===f?null:f,h=a.className,i=void 0===h?null:h,j=a.outlined,k=a.size,l=void 0===k?48:k,m=a.theme,n=void 0===m?Theme.LIGHT:m,o=a.type,p=void 0===o?"thumbnail":o,q=useMemo(function(){return!c&&e?"var(".concat(getAvatarColorFromSeed(e),")"):void 0},[c,e]),r=backwardsCompatibleSize(l);return/*#__PURE__*/_jsx("div",{className:classnames("tw-avatar",i,"tw-avatar--".concat(r),"tw-avatar--".concat(p),{"tw-avatar--outlined":void 0!==j&&j,"tw-avatar--branded":!!q,"np-text-title-body":"initials"===p}),children:/*#__PURE__*/_jsx("div",{className:"tw-avatar__content",style:{backgroundColor:c||q},children:g})})};export default Avatar;

package/build/es/polyfill/avatar/Avatar.story.js

@@ -1 +1 @@
-import _defineProperty from"@babel/runtime/helpers/defineProperty";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*as wiseIcons from"@transferwise/icons";import{Size}from"../common";import{storyConfig}from"../test-utils";import Avatar,{AvatarType}from".";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{component:Avatar,title:"Content/Avatar",tags:["autodocs"]};export const Emoji={render:a=>/*#__PURE__*/_jsx(Avatar,_objectSpread(_objectSpread({},a),{},{children:"\u2708\uFE0F"})),args:{type:AvatarType.EMOJI,size:Size.MEDIUM}};export const Flag={render:a=>/*#__PURE__*/_jsx(Avatar,_objectSpread(_objectSpread({},a),{},{children:/*#__PURE__*/_jsx("img",{src:"https://wise.com/web-art/assets/flags/gbp.svg",alt:""})})),args:{type:AvatarType.THUMBNAIL,size:Size.MEDIUM,outlined:!0}};export const Table=storyConfig({render:()=>{const a="https://wise.com/web-art/assets/flags/gbp.svg",b="#d6f5e3",c="\u2708\uFE0F",d="GN",e=wiseIcons.Check;return/*#__PURE__*/_jsx("div",{children:/*#__PURE__*/_jsxs("table",{children:["Outlined",/*#__PURE__*/_jsxs("tr",{children:[/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.LARGE,type:AvatarType.THUMBNAIL,outlined:!0,children:/*#__PURE__*/_jsx("img",{src:"https://wise.com/web-art/assets/flags/jpy.svg",alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:56,type:AvatarType.THUMBNAIL,outlined:!0,children:/*#__PURE__*/_jsx("img",{src:"https://wise.com/web-art/assets/flags/jpy.svg",alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.MEDIUM,type:AvatarType.THUMBNAIL,outlined:!0,children:/*#__PURE__*/_jsx("img",{src:"https://wise.com/web-art/assets/flags/jpy.svg",alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:40,type:AvatarType.THUMBNAIL,outlined:!0,children:/*#__PURE__*/_jsx("img",{src:"https://wise.com/web-art/assets/flags/jpy.svg",alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.SMALL,type:AvatarType.THUMBNAIL,outlined:!0,children:/*#__PURE__*/_jsx("img",{src:"https://wise.com/web-art/assets/flags/jpy.svg",alt:""})})})]}),"Image URL",/*#__PURE__*/_jsxs("tr",{children:[/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.LARGE,type:AvatarType.THUMBNAIL,children:/*#__PURE__*/_jsx("img",{src:a,alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:56,type:AvatarType.THUMBNAIL,children:/*#__PURE__*/_jsx("img",{src:a,alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.MEDIUM,type:AvatarType.THUMBNAIL,children:/*#__PURE__*/_jsx("img",{src:a,alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:40,type:AvatarType.THUMBNAIL,children:/*#__PURE__*/_jsx("img",{src:a,alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.SMALL,type:AvatarType.THUMBNAIL,children:/*#__PURE__*/_jsx("img",{src:a,alt:""})})})]}),"Emoji",/*#__PURE__*/_jsxs("tr",{children:[/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.LARGE,type:AvatarType.EMOJI,children:c})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:56,type:AvatarType.EMOJI,children:c})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.MEDIUM,type:AvatarType.EMOJI,children:c})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:40,type:AvatarType.EMOJI,children:c})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.SMALL,type:AvatarType.EMOJI,children:c})})]}),/*#__PURE__*/_jsx("div",{style:{paddingBottom:"20px"},children:/*#__PURE__*/_jsx("span",{style:{position:"absolute"},children:"Custom background and icon"})}),/*#__PURE__*/_jsxs("tr",{children:[/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.LARGE,type:AvatarType.ICON,backgroundColor:b,children:/*#__PURE__*/_jsx(e,{size:24})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:56,type:AvatarType.ICON,backgroundColor:b,children:/*#__PURE__*/_jsx(e,{size:24})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.MEDIUM,type:AvatarType.ICON,backgroundColor:b,children:/*#__PURE__*/_jsx(e,{size:24})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:40,type:AvatarType.ICON,backgroundColor:b,children:/*#__PURE__*/_jsx(e,{size:24})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.SMALL,type:AvatarType.ICON,backgroundColor:b,children:/*#__PURE__*/_jsx(e,{size:16})})})]}),"Initials",/*#__PURE__*/_jsxs("tr",{children:[/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:72,type:AvatarType.INITIALS,children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:56,type:AvatarType.INITIALS,children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:48,type:AvatarType.INITIALS,children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:40,type:AvatarType.INITIALS,children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:24,type:AvatarType.INITIALS,children:d})})]}),"Branded",/*#__PURE__*/_jsxs("tr",{children:[/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:72,type:AvatarType.INITIALS,backgroundColorSeed:"1",children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:56,type:AvatarType.INITIALS,backgroundColorSeed:"2",children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:48,type:AvatarType.INITIALS,backgroundColorSeed:"3",children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:40,type:AvatarType.INITIALS,backgroundColorSeed:"4",children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:24,type:AvatarType.INITIALS,backgroundColorSeed:"5",children:d})})]})]})})}},{variants:["default","dark","rtl"]});
+import _defineProperty from"@babel/runtime/helpers/defineProperty";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*as wiseIcons from"@transferwise/icons";import{Size}from"../common";import{storyConfig}from"../test-utils";import Avatar,{AvatarType}from".";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{component:Avatar,title:"Content/Avatar",tags:["autodocs"]};export var Emoji={render:function render(a){return/*#__PURE__*/_jsx(Avatar,_objectSpread(_objectSpread({},a),{},{children:"\u2708\uFE0F"}))},args:{type:AvatarType.EMOJI,size:Size.MEDIUM}};export var Flag={render:function render(a){return/*#__PURE__*/_jsx(Avatar,_objectSpread(_objectSpread({},a),{},{children:/*#__PURE__*/_jsx("img",{src:"https://wise.com/web-art/assets/flags/gbp.svg",alt:""})}))},args:{type:AvatarType.THUMBNAIL,size:Size.MEDIUM,outlined:!0}};export var Table=storyConfig({render:function render(){var a="https://wise.com/web-art/assets/flags/gbp.svg",b="#d6f5e3",c="\u2708\uFE0F",d="GN",e=wiseIcons.Check;return/*#__PURE__*/_jsx("div",{children:/*#__PURE__*/_jsxs("table",{children:["Outlined",/*#__PURE__*/_jsxs("tr",{children:[/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.LARGE,type:AvatarType.THUMBNAIL,outlined:!0,children:/*#__PURE__*/_jsx("img",{src:"https://wise.com/web-art/assets/flags/jpy.svg",alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:56,type:AvatarType.THUMBNAIL,outlined:!0,children:/*#__PURE__*/_jsx("img",{src:"https://wise.com/web-art/assets/flags/jpy.svg",alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.MEDIUM,type:AvatarType.THUMBNAIL,outlined:!0,children:/*#__PURE__*/_jsx("img",{src:"https://wise.com/web-art/assets/flags/jpy.svg",alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:40,type:AvatarType.THUMBNAIL,outlined:!0,children:/*#__PURE__*/_jsx("img",{src:"https://wise.com/web-art/assets/flags/jpy.svg",alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.SMALL,type:AvatarType.THUMBNAIL,outlined:!0,children:/*#__PURE__*/_jsx("img",{src:"https://wise.com/web-art/assets/flags/jpy.svg",alt:""})})})]}),"Image URL",/*#__PURE__*/_jsxs("tr",{children:[/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.LARGE,type:AvatarType.THUMBNAIL,children:/*#__PURE__*/_jsx("img",{src:a,alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:56,type:AvatarType.THUMBNAIL,children:/*#__PURE__*/_jsx("img",{src:a,alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.MEDIUM,type:AvatarType.THUMBNAIL,children:/*#__PURE__*/_jsx("img",{src:a,alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:40,type:AvatarType.THUMBNAIL,children:/*#__PURE__*/_jsx("img",{src:a,alt:""})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.SMALL,type:AvatarType.THUMBNAIL,children:/*#__PURE__*/_jsx("img",{src:a,alt:""})})})]}),"Emoji",/*#__PURE__*/_jsxs("tr",{children:[/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.LARGE,type:AvatarType.EMOJI,children:c})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:56,type:AvatarType.EMOJI,children:c})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.MEDIUM,type:AvatarType.EMOJI,children:c})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:40,type:AvatarType.EMOJI,children:c})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.SMALL,type:AvatarType.EMOJI,children:c})})]}),/*#__PURE__*/_jsx("div",{style:{paddingBottom:"20px"},children:/*#__PURE__*/_jsx("span",{style:{position:"absolute"},children:"Custom background and icon"})}),/*#__PURE__*/_jsxs("tr",{children:[/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.LARGE,type:AvatarType.ICON,backgroundColor:b,children:/*#__PURE__*/_jsx(e,{size:24})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:56,type:AvatarType.ICON,backgroundColor:b,children:/*#__PURE__*/_jsx(e,{size:24})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.MEDIUM,type:AvatarType.ICON,backgroundColor:b,children:/*#__PURE__*/_jsx(e,{size:24})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:40,type:AvatarType.ICON,backgroundColor:b,children:/*#__PURE__*/_jsx(e,{size:24})})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:Size.SMALL,type:AvatarType.ICON,backgroundColor:b,children:/*#__PURE__*/_jsx(e,{size:16})})})]}),"Initials",/*#__PURE__*/_jsxs("tr",{children:[/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:72,type:AvatarType.INITIALS,children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:56,type:AvatarType.INITIALS,children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:48,type:AvatarType.INITIALS,children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:40,type:AvatarType.INITIALS,children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:24,type:AvatarType.INITIALS,children:d})})]}),"Branded",/*#__PURE__*/_jsxs("tr",{children:[/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:72,type:AvatarType.INITIALS,backgroundColorSeed:"1",children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:56,type:AvatarType.INITIALS,backgroundColorSeed:"2",children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:48,type:AvatarType.INITIALS,backgroundColorSeed:"3",children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:40,type:AvatarType.INITIALS,backgroundColorSeed:"4",children:d})}),/*#__PURE__*/_jsx("td",{children:/*#__PURE__*/_jsx(Avatar,{size:24,type:AvatarType.INITIALS,backgroundColorSeed:"5",children:d})})]})]})})}},{variants:["default","dark","rtl"]});

package/build/es/polyfill/avatar/avatarTypes.js

@@ -1,2 +1,2 @@
 // TODO: consider to move this enum into component file once we migrate it on TypeScript or replace with some common enum
-export let AvatarType=/*#__PURE__*/function(a){return a.THUMBNAIL="thumbnail",a.ICON="icon",a.EMOJI="emoji",a.INITIALS="initials",a}({});
+export var AvatarType=/*#__PURE__*/function(a){return a.THUMBNAIL="thumbnail",a.ICON="icon",a.EMOJI="emoji",a.INITIALS="initials",a}({});