@coveord/plasma-mantine 49.2.2 → 49.2.3

package/dist/cjs/__tests__/Utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/__tests__/Utils.tsx"],"sourcesContent":["import {render, RenderOptions, RenderResult} from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport {FunctionComponent, PropsWithChildren, ReactElement} from 'react';\n\nimport {Plasmantine} from '../theme';\n\nconst customRender = (ui: ReactElement, options?: Omit<RenderOptions, 'queries'>): RenderResult => {\n    const TestWrapper: FunctionComponent<PropsWithChildren> = ({children}) => <Plasmantine>{children}</Plasmantine>;\n\n    return render(ui, {wrapper: TestWrapper, ...options});\n};\n\nexport {userEvent};\nexport * from '@testing-library/react';\nexport {customRender as render};\n"],"names":["userEvent","render","customRender","ui","options","TestWrapper","children","Plasmantine","wrapper"],"mappings":";;;;;;;;;;;IAYQA,SAAS;eAATA,kBAAS;;IAEOC,MAAM;eAAtBC;;;;;;;iCAd0C;8DAC5B;qBAGI;AAE1B,IAAMA,eAAe,SAACC,IAAkBC,SAA2D;IAC/F,IAAMC,cAAoD;YAAEC,iBAAAA;6BAAc,qBAACC,kBAAW;sBAAED;;;IAExF,OAAOL,IAAAA,aAAM,EAACE,IAAI;QAACK,SAASH;OAAgBD;AAChD"}
+{"version":3,"sources":["../../../src/__tests__/Utils.tsx"],"sourcesContent":["import {render, RenderOptions, RenderResult} from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport {FunctionComponent, PropsWithChildren, ReactElement} from 'react';\n\nimport {Plasmantine} from '../theme';\n\nconst customRender = (ui: ReactElement, options?: Omit<RenderOptions, 'queries'>): RenderResult => {\n    const TestWrapper: FunctionComponent<PropsWithChildren> = ({children}) => <Plasmantine>{children}</Plasmantine>;\n\n    return render(ui, {wrapper: TestWrapper, ...options});\n};\n\nexport * from '@testing-library/react';\nexport {userEvent};\nexport {customRender as render};\n"],"names":["userEvent","render","customRender","ui","options","TestWrapper","children","Plasmantine","wrapper"],"mappings":";;;;;;;;;;;IAaQA,SAAS;eAATA,kBAAS;;IACOC,MAAM;eAAtBC;;;;;;;iCAd0C;8DAC5B;qBAGI;AAE1B,IAAMA,eAAe,SAACC,IAAkBC,SAA2D;IAC/F,IAAMC,cAAoD;YAAEC,iBAAAA;6BAAc,qBAACC,kBAAW;sBAAED;;;IAExF,OAAOL,IAAAA,aAAM,EAACE,IAAI;QAACK,SAASH;OAAgBD;AAChD"}

package/dist/cjs/__tests__/VitestSetup.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+var _interopRequireDefault = require("@swc/helpers/lib/_interop_require_default.js").default;
+var _matchers = /*#__PURE__*/ _interopRequireDefault(require("@testing-library/jest-dom/matchers"));
+var _react = require("@testing-library/react");
+expect.extend(_matchers.default);
+Object.defineProperty(window, "matchMedia", {
+    writable: true,
+    value: vi.fn().mockImplementation(function(query) {
+        return {
+            matches: false,
+            media: query,
+            onchange: null,
+            addListener: vi.fn(),
+            removeListener: vi.fn(),
+            addEventListener: vi.fn(),
+            removeEventListener: vi.fn(),
+            dispatchEvent: vi.fn()
+        };
+    })
+});
+window.ResizeObserver = window.ResizeObserver || vi.fn().mockImplementation(function() {
+    return {
+        disconnect: vi.fn(),
+        observe: vi.fn(),
+        unobserve: vi.fn()
+    };
+});
+afterEach(function() {
+    (0, _react.cleanup)();
+});
+
+//# sourceMappingURL=VitestSetup.js.map

package/dist/cjs/__tests__/VitestSetup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/__tests__/VitestSetup.ts"],"sourcesContent":["import matchers from '@testing-library/jest-dom/matchers';\nimport {cleanup} from '@testing-library/react';\nexpect.extend(matchers);\nObject.defineProperty(window, 'matchMedia', {\n    writable: true,\n    value: vi.fn().mockImplementation((query) => ({\n        matches: false,\n        media: query,\n        onchange: null,\n        addListener: vi.fn(), // deprecated\n        removeListener: vi.fn(), // deprecated\n        addEventListener: vi.fn(),\n        removeEventListener: vi.fn(),\n        dispatchEvent: vi.fn(),\n    })),\n});\nwindow.ResizeObserver =\n    window.ResizeObserver ||\n    vi.fn().mockImplementation(() => ({\n        disconnect: vi.fn(),\n        observe: vi.fn(),\n        unobserve: vi.fn(),\n    }));\n\nafterEach(() => {\n    cleanup();\n});\n"],"names":["expect","extend","matchers","Object","defineProperty","window","writable","value","vi","fn","mockImplementation","query","matches","media","onchange","addListener","removeListener","addEventListener","removeEventListener","dispatchEvent","ResizeObserver","disconnect","observe","unobserve","afterEach","cleanup"],"mappings":";;;;;6DAAqB;qBACC;AACtBA,OAAOC,MAAM,CAACC,iBAAQ;AACtBC,OAAOC,cAAc,CAACC,QAAQ,cAAc;IACxCC,UAAU,IAAI;IACdC,OAAOC,GAAGC,EAAE,GAAGC,kBAAkB,CAAC,SAACC;eAAW;YAC1CC,SAAS,KAAK;YACdC,OAAOF;YACPG,UAAU,IAAI;YACdC,aAAaP,GAAGC,EAAE;YAClBO,gBAAgBR,GAAGC,EAAE;YACrBQ,kBAAkBT,GAAGC,EAAE;YACvBS,qBAAqBV,GAAGC,EAAE;YAC1BU,eAAeX,GAAGC,EAAE;QACxB;;AACJ;AACAJ,OAAOe,cAAc,GACjBf,OAAOe,cAAc,IACrBZ,GAAGC,EAAE,GAAGC,kBAAkB,CAAC;WAAO;QAC9BW,YAAYb,GAAGC,EAAE;QACjBa,SAASd,GAAGC,EAAE;QACdc,WAAWf,GAAGC,EAAE;IACpB;;AAEJe,UAAU,WAAM;IACZC,IAAAA,cAAO;AACX"}

package/dist/definitions/__tests__/Utils.d.ts

@@ -2,7 +2,7 @@ import { RenderOptions, RenderResult } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { ReactElement } from 'react';
 declare const customRender: (ui: ReactElement, options?: Omit<RenderOptions, 'queries'>) => RenderResult;
-export { userEvent };
 export * from '@testing-library/react';
+export { userEvent };
 export { customRender as render };
 //# sourceMappingURL=Utils.d.ts.map

package/dist/definitions/__tests__/Utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Utils.d.ts","sourceRoot":"","sources":["../../../src/__tests__/Utils.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAS,aAAa,EAAE,YAAY,EAAC,MAAM,wBAAwB,CAAC;AAC3E,OAAO,SAAS,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAuC,YAAY,EAAC,MAAM,OAAO,CAAC;AAIzE,QAAA,MAAM,YAAY,OAAQ,YAAY,YAAY,KAAK,aAAa,EAAE,SAAS,CAAC,KAAG,YAIlF,CAAC;AAEF,OAAO,EAAC,SAAS,EAAC,CAAC;AACnB,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAC,YAAY,IAAI,MAAM,EAAC,CAAC"}
+{"version":3,"file":"Utils.d.ts","sourceRoot":"","sources":["../../../src/__tests__/Utils.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAS,aAAa,EAAE,YAAY,EAAC,MAAM,wBAAwB,CAAC;AAC3E,OAAO,SAAS,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAuC,YAAY,EAAC,MAAM,OAAO,CAAC;AAIzE,QAAA,MAAM,YAAY,OAAQ,YAAY,YAAY,KAAK,aAAa,EAAE,SAAS,CAAC,KAAG,YAIlF,CAAC;AAEF,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAC,SAAS,EAAC,CAAC;AACnB,OAAO,EAAC,YAAY,IAAI,MAAM,EAAC,CAAC"}

package/dist/definitions/__tests__/VitestSetup.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=VitestSetup.d.ts.map

package/dist/definitions/__tests__/VitestSetup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VitestSetup.d.ts","sourceRoot":"","sources":["../../../src/__tests__/VitestSetup.ts"],"names":[],"mappings":""}

package/dist/esm/__tests__/Utils.js

@@ -14,8 +14,8 @@ var customRender = function(ui, options) {
         wrapper: TestWrapper
     }, options));
 };
-export { userEvent };
 export * from "@testing-library/react";
+export { userEvent };
 export { customRender as render };
 
 //# sourceMappingURL=Utils.js.map

package/dist/esm/__tests__/Utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/__tests__/Utils.tsx"],"sourcesContent":["import {render, RenderOptions, RenderResult} from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport {FunctionComponent, PropsWithChildren, ReactElement} from 'react';\n\nimport {Plasmantine} from '../theme';\n\nconst customRender = (ui: ReactElement, options?: Omit<RenderOptions, 'queries'>): RenderResult => {\n    const TestWrapper: FunctionComponent<PropsWithChildren> = ({children}) => <Plasmantine>{children}</Plasmantine>;\n\n    return render(ui, {wrapper: TestWrapper, ...options});\n};\n\nexport {userEvent};\nexport * from '@testing-library/react';\nexport {customRender as render};\n"],"names":["render","userEvent","Plasmantine","customRender","ui","options","TestWrapper","children","wrapper"],"mappings":";;AAAA,SAAQA,MAAM,QAAoC,yBAAyB;AAC3E,OAAOC,eAAe,8BAA8B;AAGpD,SAAQC,WAAW,QAAO,WAAW;AAErC,IAAMC,eAAe,SAACC,IAAkBC,SAA2D;IAC/F,IAAMC,cAAoD;YAAEC,iBAAAA;6BAAc,KAACL;sBAAaK;;;IAExF,OAAOP,OAAOI,IAAI;QAACI,SAASF;OAAgBD;AAChD;AAEA,SAAQJ,SAAS,GAAE;AACnB,cAAc,yBAAyB;AACvC,SAAQE,gBAAgBH,MAAM,GAAE"}
+{"version":3,"sources":["../../../src/__tests__/Utils.tsx"],"sourcesContent":["import {render, RenderOptions, RenderResult} from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport {FunctionComponent, PropsWithChildren, ReactElement} from 'react';\n\nimport {Plasmantine} from '../theme';\n\nconst customRender = (ui: ReactElement, options?: Omit<RenderOptions, 'queries'>): RenderResult => {\n    const TestWrapper: FunctionComponent<PropsWithChildren> = ({children}) => <Plasmantine>{children}</Plasmantine>;\n\n    return render(ui, {wrapper: TestWrapper, ...options});\n};\n\nexport * from '@testing-library/react';\nexport {userEvent};\nexport {customRender as render};\n"],"names":["render","userEvent","Plasmantine","customRender","ui","options","TestWrapper","children","wrapper"],"mappings":";;AAAA,SAAQA,MAAM,QAAoC,yBAAyB;AAC3E,OAAOC,eAAe,8BAA8B;AAGpD,SAAQC,WAAW,QAAO,WAAW;AAErC,IAAMC,eAAe,SAACC,IAAkBC,SAA2D;IAC/F,IAAMC,cAAoD;YAAEC,iBAAAA;6BAAc,KAACL;sBAAaK;;;IAExF,OAAOP,OAAOI,IAAI;QAACI,SAASF;OAAgBD;AAChD;AAEA,cAAc,yBAAyB;AACvC,SAAQJ,SAAS,GAAE;AACnB,SAAQE,gBAAgBH,MAAM,GAAE"}

package/dist/esm/__tests__/VitestSetup.js

@@ -0,0 +1,30 @@
+import matchers from "@testing-library/jest-dom/matchers";
+import { cleanup } from "@testing-library/react";
+expect.extend(matchers);
+Object.defineProperty(window, "matchMedia", {
+    writable: true,
+    value: vi.fn().mockImplementation(function(query) {
+        return {
+            matches: false,
+            media: query,
+            onchange: null,
+            addListener: vi.fn(),
+            removeListener: vi.fn(),
+            addEventListener: vi.fn(),
+            removeEventListener: vi.fn(),
+            dispatchEvent: vi.fn()
+        };
+    })
+});
+window.ResizeObserver = window.ResizeObserver || vi.fn().mockImplementation(function() {
+    return {
+        disconnect: vi.fn(),
+        observe: vi.fn(),
+        unobserve: vi.fn()
+    };
+});
+afterEach(function() {
+    cleanup();
+});
+
+//# sourceMappingURL=VitestSetup.js.map

package/dist/esm/__tests__/VitestSetup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/__tests__/VitestSetup.ts"],"sourcesContent":["import matchers from '@testing-library/jest-dom/matchers';\nimport {cleanup} from '@testing-library/react';\nexpect.extend(matchers);\nObject.defineProperty(window, 'matchMedia', {\n    writable: true,\n    value: vi.fn().mockImplementation((query) => ({\n        matches: false,\n        media: query,\n        onchange: null,\n        addListener: vi.fn(), // deprecated\n        removeListener: vi.fn(), // deprecated\n        addEventListener: vi.fn(),\n        removeEventListener: vi.fn(),\n        dispatchEvent: vi.fn(),\n    })),\n});\nwindow.ResizeObserver =\n    window.ResizeObserver ||\n    vi.fn().mockImplementation(() => ({\n        disconnect: vi.fn(),\n        observe: vi.fn(),\n        unobserve: vi.fn(),\n    }));\n\nafterEach(() => {\n    cleanup();\n});\n"],"names":["matchers","cleanup","expect","extend","Object","defineProperty","window","writable","value","vi","fn","mockImplementation","query","matches","media","onchange","addListener","removeListener","addEventListener","removeEventListener","dispatchEvent","ResizeObserver","disconnect","observe","unobserve","afterEach"],"mappings":"AAAA,OAAOA,cAAc,qCAAqC;AAC1D,SAAQC,OAAO,QAAO,yBAAyB;AAC/CC,OAAOC,MAAM,CAACH;AACdI,OAAOC,cAAc,CAACC,QAAQ,cAAc;IACxCC,UAAU,IAAI;IACdC,OAAOC,GAAGC,EAAE,GAAGC,kBAAkB,CAAC,SAACC;eAAW;YAC1CC,SAAS,KAAK;YACdC,OAAOF;YACPG,UAAU,IAAI;YACdC,aAAaP,GAAGC,EAAE;YAClBO,gBAAgBR,GAAGC,EAAE;YACrBQ,kBAAkBT,GAAGC,EAAE;YACvBS,qBAAqBV,GAAGC,EAAE;YAC1BU,eAAeX,GAAGC,EAAE;QACxB;;AACJ;AACAJ,OAAOe,cAAc,GACjBf,OAAOe,cAAc,IACrBZ,GAAGC,EAAE,GAAGC,kBAAkB,CAAC;WAAO;QAC9BW,YAAYb,GAAGC,EAAE;QACjBa,SAASd,GAAGC,EAAE;QACdc,WAAWf,GAAGC,EAAE;IACpB;;AAEJe,UAAU,WAAM;IACZxB;AACJ"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coveord/plasma-mantine",
-  "version": "49.2.2",
+  "version": "49.2.3",
   "description": "A Plasma flavoured Mantine theme",
   "keywords": [
     "plasma",
@@ -49,8 +49,9 @@
     "@types/testing-library__jest-dom": "5.14.5",
     "csstype": "3.1.1",
     "embla-carousel-react": "7.0.4",
-    "eslint-plugin-jest": "27.1.1",
     "eslint-plugin-testing-library": "5.7.2",
+    "eslint-plugin-vitest": "0.0.32",
+    "eslint-plugin-vitest-globals": "1.2.0",
     "identity-obj-proxy": "3.0.0",
     "jest": "29.2.1",
     "jest-environment-jsdom": "29.1.2",
@@ -60,7 +61,8 @@
     "react-dom": "18.2.0",
     "rimraf": "3.0.2",
     "tslib": "2.4.0",
-    "typescript": "4.9.3"
+    "typescript": "4.9.3",
+    "vitest": "0.28.3"
   },
   "peerDependencies": {
     "@emotion/react": "^11.10.0",
@@ -78,8 +80,7 @@
     "build": "node ../../scripts/build",
     "clean": "rimraf dist",
     "start": "node ../../scripts/start",
-    "test": "jest --maxWorkers=65%",
-    "test:watch": "jest --watchAll",
-    "test:debug": "node --inspect-brk node_modules/jest/bin/jest --runInBand --watchAll --detectOpenHandles --forceExit"
+    "test": "TZ=UTC vitest run",
+    "test:watch": "TZ=UTC vitest"
   }
 }

package/src/__tests__/Utils.tsx

@@ -10,6 +10,6 @@ const customRender = (ui: ReactElement, options?: Omit<RenderOptions, 'queries'>
     return render(ui, {wrapper: TestWrapper, ...options});
 };
 
-export {userEvent};
 export * from '@testing-library/react';
+export {userEvent};
 export {customRender as render};

package/src/__tests__/VitestSetup.ts

@@ -0,0 +1,27 @@
+import matchers from '@testing-library/jest-dom/matchers';
+import {cleanup} from '@testing-library/react';
+expect.extend(matchers);
+Object.defineProperty(window, 'matchMedia', {
+    writable: true,
+    value: vi.fn().mockImplementation((query) => ({
+        matches: false,
+        media: query,
+        onchange: null,
+        addListener: vi.fn(), // deprecated
+        removeListener: vi.fn(), // deprecated
+        addEventListener: vi.fn(),
+        removeEventListener: vi.fn(),
+        dispatchEvent: vi.fn(),
+    })),
+});
+window.ResizeObserver =
+    window.ResizeObserver ||
+    vi.fn().mockImplementation(() => ({
+        disconnect: vi.fn(),
+        observe: vi.fn(),
+        unobserve: vi.fn(),
+    }));
+
+afterEach(() => {
+    cleanup();
+});

package/src/components/code-editor/__tests__/CodeEditor.spec.tsx

@@ -1,24 +1,26 @@
-import {useForm} from '@mantine/form';
 import {loader} from '@monaco-editor/react';
 import {render, screen, waitForElementToBeRemoved, within} from '@test-utils';
+import {useForm} from '../../../form';
 
 import {CodeEditor} from '../CodeEditor';
 import {XML} from '../languages/xml';
 
+vi.mock('monaco-editor');
+vi.mock('@monaco-editor/react');
+
 describe('CodeEditor', () => {
     beforeEach(() => {
-        jest.clearAllMocks();
+        vi.clearAllMocks();
     });
 
     it('renders the monaco editor and a copy to clipboard button', async () => {
-        jest.mock('monaco-editor');
         render(<CodeEditor label="label" description="description" />);
 
         await waitForElementToBeRemoved(screen.queryByRole('presentation'));
 
         expect(screen.getByText(/label/)).toBeInTheDocument();
         expect(screen.getByText(/description/)).toBeInTheDocument();
-        expect(screen.getByTestId('monaco-editor')).toBeInTheDocument();
+        expect(await screen.findByTestId('monaco-editor')).toBeInTheDocument();
         expect(await screen.findByRole('button', {name: /copy/i})).toBeInTheDocument();
     });
 
@@ -56,7 +58,7 @@ describe('CodeEditor', () => {
     });
 
     it('loads the xml language in the monaco instance if the editor language is xml', async () => {
-        const xmlLanguageSpy = jest.spyOn(XML, 'register').mockImplementation();
+        const xmlLanguageSpy = vi.spyOn(XML, 'register').mockImplementation(vi.fn());
         render(<CodeEditor label="label" description="description" monacoLoader="cdn" language="xml" />);
         expect(xmlLanguageSpy).toHaveBeenCalledTimes(1);
     });

package/src/components/collection/__tests__/Collection.spec.tsx

@@ -54,7 +54,7 @@ describe('Collection', () => {
 
     it('calls the onRemoveItem function when clicking on a remove button', async () => {
         const user = userEvent.setup({delay: null});
-        const onRemoveItemSpy = jest.fn();
+        const onRemoveItemSpy = vi.fn();
         const Fixture = () => {
             const form = useForm({initialValues: {fruits: ['banana', 'orange']}});
             return (
@@ -128,7 +128,7 @@ describe('Collection', () => {
     });
 
     it('disables the add button whenever allowAdd callback returns false', () => {
-        const allowAdd = jest.fn().mockImplementation(() => false);
+        const allowAdd = vi.fn().mockImplementation(() => false);
         const Fixture = () => {
             const form = useForm({initialValues: {fruits: ['banana', 'orange']}});
             return (

package/src/components/date-range-picker/__tests__/DateRangePickerInlineCalendar.spec.tsx

@@ -6,8 +6,8 @@ import {DateRangePickerInlineCalendar} from '../DateRangePickerInlineCalendar';
 describe('DateRangePickerInlineCalendar', () => {
     it('calls onApply when the user clicks on the apply button', async () => {
         const user = userEvent.setup({delay: null});
-        const onApply = jest.fn();
-        render(<DateRangePickerInlineCalendar initialRange={[null, null]} onApply={onApply} onCancel={jest.fn()} />);
+        const onApply = vi.fn();
+        render(<DateRangePickerInlineCalendar initialRange={[null, null]} onApply={onApply} onCancel={vi.fn()} />);
 
         await user.click(screen.getByRole('button', {name: 'Apply'}));
 
@@ -17,8 +17,8 @@ describe('DateRangePickerInlineCalendar', () => {
 
     it('calls onCancel when the user clicks on the cancel button', async () => {
         const user = userEvent.setup({delay: null});
-        const onCancel = jest.fn();
-        render(<DateRangePickerInlineCalendar initialRange={[null, null]} onApply={jest.fn()} onCancel={onCancel} />);
+        const onCancel = vi.fn();
+        render(<DateRangePickerInlineCalendar initialRange={[null, null]} onApply={vi.fn()} onCancel={onCancel} />);
 
         await user.click(screen.getByRole('button', {name: 'Cancel'}));
 
@@ -26,14 +26,14 @@ describe('DateRangePickerInlineCalendar', () => {
     });
 
     it('does not render the preset searchbox when there is no presets', () => {
-        render(<DateRangePickerInlineCalendar initialRange={[null, null]} onApply={jest.fn()} onCancel={jest.fn()} />);
+        render(<DateRangePickerInlineCalendar initialRange={[null, null]} onApply={vi.fn()} onCancel={vi.fn()} />);
 
         expect(screen.queryByRole('searchbox')).not.toBeInTheDocument();
     });
 
     it('calls onApply with the selected dates when choosing a preset', async () => {
         const user = userEvent.setup({delay: null});
-        const onApply = jest.fn();
+        const onApply = vi.fn();
         render(
             <DateRangePickerInlineCalendar
                 presets={{
@@ -41,7 +41,7 @@ describe('DateRangePickerInlineCalendar', () => {
                 }}
                 initialRange={[null, null]}
                 onApply={onApply}
-                onCancel={jest.fn()}
+                onCancel={vi.fn()}
             />
         );
 
@@ -58,9 +58,9 @@ describe('DateRangePickerInlineCalendar', () => {
 
     it('calls onApply with the selected dates when clicking in the calendar', async () => {
         const user = userEvent.setup({delay: null});
-        jest.useFakeTimers().setSystemTime(new Date(2022, 0, 31));
-        const onApply = jest.fn();
-        render(<DateRangePickerInlineCalendar initialRange={[null, null]} onApply={onApply} onCancel={jest.fn()} />);
+        vi.useFakeTimers().setSystemTime(new Date(2022, 0, 31));
+        const onApply = vi.fn();
+        render(<DateRangePickerInlineCalendar initialRange={[null, null]} onApply={onApply} onCancel={vi.fn()} />);
 
         // click once for the start, once for the end
         await user.click(screen.getAllByRole('button', {name: '8'})[0]);
@@ -70,27 +70,27 @@ describe('DateRangePickerInlineCalendar', () => {
 
         expect(onApply).toHaveBeenCalledWith([new Date(2022, 0, 8), new Date(2022, 0, 14)]);
 
-        jest.useRealTimers();
+        vi.useRealTimers();
     });
 
     it('set end date same as start date if only one date is selected when clicking in the calendar', async () => {
         const user = userEvent.setup({delay: null});
-        jest.useFakeTimers().setSystemTime(new Date(2022, 0, 31));
-        const onApply = jest.fn();
-        render(<DateRangePickerInlineCalendar initialRange={[null, null]} onApply={onApply} onCancel={jest.fn()} />);
+        vi.useFakeTimers().setSystemTime(new Date(2022, 0, 31));
+        const onApply = vi.fn();
+        render(<DateRangePickerInlineCalendar initialRange={[null, null]} onApply={onApply} onCancel={vi.fn()} />);
 
         await user.click(screen.getAllByRole('button', {name: '8'})[0]);
         await user.click(screen.getByRole('button', {name: 'Apply'}));
 
         expect(onApply).toHaveBeenCalledWith([new Date(2022, 0, 8), new Date(2022, 0, 8)]);
 
-        jest.useRealTimers();
+        vi.useRealTimers();
     });
 
     it('calls onApply with the selected dates when typing in the inputs', async () => {
         const user = userEvent.setup({delay: null});
-        const onApply = jest.fn();
-        render(<DateRangePickerInlineCalendar initialRange={[null, null]} onApply={onApply} onCancel={jest.fn()} />);
+        const onApply = vi.fn();
+        render(<DateRangePickerInlineCalendar initialRange={[null, null]} onApply={onApply} onCancel={vi.fn()} />);
 
         const startInput = screen.getByRole('textbox', {
             name: /start/i,

package/src/components/date-range-picker/__tests__/DateRangePickerPopoverCalendar.spec.tsx

@@ -7,10 +7,13 @@ import {DateRangePickerPopoverCalendar} from '../DateRangePickerPopoverCalendar'
 // Since we're mocking the date and the animations are timer based we're mocking useReduceMotion to disable all the animations
 // I tried wrapping the components in <MantineProvider theme={{components: {Transition: {defaultProps: {duration: 0}}}}}>
 // but the animation was still happening. :(
-jest.mock('@mantine/hooks', () => ({
-    ...jest.requireActual('@mantine/hooks'),
-    useReducedMotion: () => true,
-}));
+vi.mock('@mantine/hooks', async () => {
+    const actual = await vi.importActual('@mantine/hooks');
+    return {
+        ...actual,
+        useReduceMotion: () => true,
+    };
+});
 
 describe('DateRangePickerPopoverCalendar', () => {
     it('does not render the preset searchbox when there is no presets', () => {
@@ -49,7 +52,7 @@ describe('DateRangePickerPopoverCalendar', () => {
 
     it('calls onApply with the selected dates when clicking in the calendar', async () => {
         const user = userEvent.setup({delay: null});
-        jest.useFakeTimers().setSystemTime(new Date(2022, 0, 31));
+        vi.useFakeTimers().setSystemTime(new Date(2022, 0, 31));
         const Fixture = () => {
             const form = useForm<{dates: DateRangePickerValue}>({initialValues: {dates: [null, null]}});
             return (
@@ -67,11 +70,12 @@ describe('DateRangePickerPopoverCalendar', () => {
         await user.click(screen.getAllByRole('button', {name: '14'})[0]);
 
         // hides the calendar when the second date is clicked
-        expect(screen.queryByRole('button', {name: '8'})).not.toBeInTheDocument();
+        expect(screen.queryAllByRole('button', {name: '8'})[0]).not.toBeVisible();
+        expect(screen.queryAllByRole('button', {name: '8'})[1]).not.toBeVisible();
 
         expect(screen.getByTestId('json')).toHaveTextContent('["2022-01-08T00:00:00.000Z","2022-01-14T00:00:00.000Z"]');
 
-        jest.useRealTimers();
+        vi.useRealTimers();
     });
 
     it('calls onApply with the selected dates when typing in the inputs', async () => {

package/src/components/date-range-picker/__tests__/DateRangePickerPresetSelect.spec.tsx

@@ -5,7 +5,7 @@ import {DateRangePickerPresetSelect} from '../DateRangePickerPresetSelect';
 describe('DateRangePickerPresetSelect', () => {
     it('calls onChange when selecting a preset', async () => {
         const user = userEvent.setup({delay: null});
-        const onChange = jest.fn();
+        const onChange = vi.fn();
         render(
             <DateRangePickerPresetSelect
                 value={[null, null]}

package/src/components/inline-confirm/__tests__/InlineConfirm.spec.tsx

@@ -12,7 +12,7 @@ describe('InlineConfirm', () => {
 
     it('calls the onClick prop when clicking on a button', async () => {
         const user = userEvent.setup({delay: null});
-        const onClickSpy = jest.fn();
+        const onClickSpy = vi.fn();
         render(
             <InlineConfirm>
                 <InlineConfirm.Button id="delete" onClick={onClickSpy}>
@@ -28,7 +28,7 @@ describe('InlineConfirm', () => {
 
     it('calls the onClick prop when clicking on the menu item', async () => {
         const user = userEvent.setup({delay: null});
-        const onClickSpy = jest.fn();
+        const onClickSpy = vi.fn();
         render(
             <InlineConfirm>
                 <Menu>
@@ -55,7 +55,7 @@ describe('InlineConfirm', () => {
         render(
             <InlineConfirm>
                 <InlineConfirm.Button id="my-button-id">Remove</InlineConfirm.Button>
-                <InlineConfirm.Prompt id="my-button-id" label="Are you sure?" onConfirm={jest.fn()} />
+                <InlineConfirm.Prompt id="my-button-id" label="Are you sure?" onConfirm={vi.fn()} />
             </InlineConfirm>
         );
         expect(screen.queryByText('Are you sure?')).not.toBeInTheDocument();
@@ -69,7 +69,7 @@ describe('InlineConfirm', () => {
 
     it('hides the prompt when the user cancel and call onConfirm when the user confirms', async () => {
         const user = userEvent.setup({delay: null});
-        const confirmSpy = jest.fn();
+        const confirmSpy = vi.fn();
         render(
             <InlineConfirm>
                 <InlineConfirm.Button id="my-button-id">Remove</InlineConfirm.Button>
@@ -103,10 +103,10 @@ describe('InlineConfirm', () => {
         render(
             <InlineConfirm>
                 <InlineConfirm.Button id="remove">Remove</InlineConfirm.Button>
-                <InlineConfirm.Prompt id="remove" label="Delete X?" onConfirm={jest.fn()} />
+                <InlineConfirm.Prompt id="remove" label="Delete X?" onConfirm={vi.fn()} />
 
                 <InlineConfirm.Button id="print">Print</InlineConfirm.Button>
-                <InlineConfirm.Prompt id="print" label="Print?" onConfirm={jest.fn()} />
+                <InlineConfirm.Prompt id="print" label="Print?" onConfirm={vi.fn()} />
             </InlineConfirm>
         );
 

package/src/components/modal/__tests__/Modal.spec.tsx

@@ -6,7 +6,7 @@ import {Modal} from '../Modal';
 describe('Modal', () => {
     it('renders title, desctiption, close button, and child', () => {
         render(
-            <Modal opened onClose={jest.fn()} title="title" description="modal description">
+            <Modal opened onClose={vi.fn()} title="title" description="modal description">
                 <Container>Children</Container>
             </Modal>
         );
@@ -22,7 +22,7 @@ describe('Modal', () => {
         render(
             <Modal
                 opened
-                onClose={jest.fn()}
+                onClose={vi.fn()}
                 title={
                     <div>
                         <QuestionSize32Px />
@@ -38,7 +38,7 @@ describe('Modal', () => {
     });
 
     it('trigger onClose function when click on the close button', () => {
-        const onClose = jest.fn();
+        const onClose = vi.fn();
         render(
             <Modal opened onClose={onClose} title="title">
                 <Container>Children</Container>

package/src/components/modal-wizard/__tests__/ModalWizard.spec.tsx

@@ -169,7 +169,7 @@ describe('ModalWizard', () => {
         ];
 
         const isDirty = () => false;
-        const onClose = jest.fn();
+        const onClose = vi.fn();
 
         render(
             <ModalWizard isDirty={isDirty} onClose={onClose} closeButtonLabel="closebuttonlabel" opened={true}>
@@ -205,7 +205,7 @@ describe('ModalWizard', () => {
         ];
 
         const isDirty = () => false;
-        const onClose = jest.fn();
+        const onClose = vi.fn();
 
         render(
             <ModalWizard isDirty={isDirty} onClose={onClose} opened={true}>
@@ -241,8 +241,8 @@ describe('ModalWizard', () => {
         ];
 
         const isDirty = () => false;
-        const onClose = jest.fn();
-        const onFinish = jest.fn();
+        const onClose = vi.fn();
+        const onFinish = vi.fn();
 
         render(
             <ModalWizard isDirty={isDirty} onClose={onClose} onFinish={onFinish} opened={true}>
@@ -278,8 +278,8 @@ describe('ModalWizard', () => {
         ];
 
         const isDirty = () => true;
-        const onClose = jest.fn();
-        const handleDirtyState = jest.fn();
+        const onClose = vi.fn();
+        const handleDirtyState = vi.fn();
 
         render(
             <ModalWizard
@@ -323,8 +323,8 @@ describe('ModalWizard', () => {
         ];
 
         const isDirty = () => true;
-        const onClose = jest.fn();
-        const handleDirtyState = jest.fn();
+        const onClose = vi.fn();
+        const handleDirtyState = vi.fn();
 
         render(
             <ModalWizard

package/src/components/prompt/__tests__/Prompt.spec.tsx

@@ -4,7 +4,7 @@ import {Prompt} from '../Prompt';
 describe('Prompt', () => {
     it('displays the title, body and close button', () => {
         render(
-            <Prompt variant="default" opened onClose={jest.fn()} title="title modal">
+            <Prompt variant="default" opened onClose={vi.fn()} title="title modal">
                 content modal
                 <Prompt.Footer>footer content</Prompt.Footer>
             </Prompt>
@@ -16,7 +16,7 @@ describe('Prompt', () => {
     });
 
     it('calls onClose when clicking on the close button', () => {
-        const onClose = jest.fn();
+        const onClose = vi.fn();
         render(
             <Prompt variant="default" opened onClose={onClose} title="title modal">
                 content modal

package/src/components/table/__tests__/Table.spec.tsx

@@ -169,7 +169,7 @@ describe('Table', () => {
 
     it('calls an action when user double clicks on a row', async () => {
         const user = userEvent.setup();
-        const doubleClickSpy = jest.fn();
+        const doubleClickSpy = vi.fn();
         render(
             <Table<RowData>
                 data={[{firstName: 'Mario'}, {firstName: 'Luigi'}]}

package/src/components/table/__tests__/TableActions.spec.tsx

@@ -38,7 +38,7 @@ describe('Table.Actions', () => {
     describe('when multi row selection is enabled', () => {
         it('passes down an array of selected rows', async () => {
             const user = userEvent.setup({delay: null});
-            const renderSpy = jest.fn().mockImplementation(() => <div />);
+            const renderSpy = vi.fn().mockImplementation(() => <div />);
             render(
                 <Table<RowData>
                     data={[{name: 'fruit'}, {name: 'vegetable'}, {name: 'bread'}]}

package/src/components/table/__tests__/TableDateRangePicker.spec.tsx

@@ -11,20 +11,23 @@ const columns: Array<ColumnDef<RowData>> = [columnHelper.accessor('name', {enabl
 // Since we're mocking the date and the animations are timer based we're mocking useReduceMotion to disable all the animations
 // I tried wrapping the components in <MantineProvider theme={{components: {Transition: {defaultProps: {duration: 0}}}}}>
 // but the animation was still happening. :(
-jest.mock('@mantine/hooks', () => ({
-    ...jest.requireActual('@mantine/hooks'),
-    useReducedMotion: () => true,
-}));
+vi.mock('@mantine/hooks', async () => {
+    const actual = await vi.importActual('@mantine/hooks');
+    return {
+        ...actual,
+        useReduceMotion: () => true,
+    };
+});
 
 describe('Table.DateRangePicker', () => {
-    jest.setTimeout(15000);
+    // vi.setTimeout(15000);
 
     beforeEach(() => {
-        jest.useFakeTimers().setSystemTime(new Date(2022, 0, 15));
+        vi.useFakeTimers().setSystemTime(new Date(2022, 0, 15));
     });
 
     afterEach(() => {
-        jest.useRealTimers();
+        vi.useRealTimers();
     });
 
     it('displays the intial dates', async () => {
@@ -47,7 +50,7 @@ describe('Table.DateRangePicker', () => {
 
     it('displays the selected date range in the table', async () => {
         const user = userEvent.setup({delay: null});
-        const onChange = jest.fn();
+        const onChange = vi.fn();
         render(
             <Table
                 data={[{name: 'fruit'}, {name: 'vegetable'}]}