@coveord/plasma-mantine 52.3.0 → 52.4.0

package/src/components/collection/CollectionItem.tsx

@@ -1,7 +1,8 @@
-import {DragAndDropSize16Px, RemoveSize16Px} from '@coveord/plasma-react-icons';
+import {DragAndDropSize24Px, RemoveSize16Px} from '@coveord/plasma-react-icons';
+import {useSortable} from '@dnd-kit/sortable';
+import {CSS} from '@dnd-kit/utilities';
 import {ActionIcon, DefaultProps, Group, Selectors} from '@mantine/core';
 import {FunctionComponent, PropsWithChildren} from 'react';
-import {Draggable} from 'react-beautiful-dnd';
 
 import useStyles from './Collection.styles';
 
@@ -11,7 +12,7 @@ interface CollectionItemProps extends CollectionItemSharedProps {
 }
 
 interface CollectionItemSharedProps extends DefaultProps<Selectors<typeof useStyles>> {
-    index: number;
+    id: string;
     onRemove?: React.MouseEventHandler<HTMLButtonElement>;
     removable?: boolean;
 }
@@ -52,7 +53,7 @@ const DisabledCollectionItem: FunctionComponent<PropsWithChildren<CollectionItem
 };
 
 const DraggableCollectionItem: FunctionComponent<PropsWithChildren<CollectionItemSharedProps>> = ({
-    index,
+    id,
     onRemove,
     removable = true,
     styles,
@@ -60,23 +61,29 @@ const DraggableCollectionItem: FunctionComponent<PropsWithChildren<CollectionIte
 }) => {
     const {classes, cx} = useStyles(null, {name: 'Collection', styles});
     const removeButton = removable && onRemove ? <RemoveButton onClick={onRemove} /> : null;
+    const {attributes, listeners, setNodeRef, transform, transition, isDragging, setActivatorNodeRef} = useSortable({
+        id,
+    });
 
     return (
-        <Draggable key={index} index={index} draggableId={index.toString()}>
-            {(provided, {isDragging}) => (
-                <Group
-                    ref={provided.innerRef}
-                    {...provided.draggableProps}
-                    className={cx(classes.item, {[classes.itemDragging]: isDragging})}
-                >
-                    <div {...provided.dragHandleProps} style={{alignSelf: 'center'}}>
-                        <DragAndDropSize16Px height={16} />
-                    </div>
-                    {children}
-                    {removeButton}
-                </Group>
-            )}
-        </Draggable>
+        <Group
+            ref={setNodeRef}
+            className={cx(classes.item, {[classes.itemDragging]: isDragging})}
+            sx={
+                transform
+                    ? {
+                          transform: CSS.Transform.toString(transform),
+                          transition,
+                      }
+                    : undefined
+            }
+        >
+            <div ref={setActivatorNodeRef} {...listeners} {...attributes} className={classes.dragHandle}>
+                <DragAndDropSize24Px height={16} />
+            </div>
+            {children}
+            {removeButton}
+        </Group>
     );
 };
 

package/src/components/header/__tests__/__snapshots__/Header.spec.tsx.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`Header > renders the specified breadcrumbs above the title 1`] = `
 <div>

package/src/components/table/Table.tsx

@@ -200,7 +200,11 @@ export const Table: TableType = <T,>({
                             <thead className={classes.header}>
                                 {!!header ? (
                                     <tr>
-                                        <th style={{padding: 0}} colSpan={table.getAllColumns().length}>
+                                        <th
+                                            // need to use inline style because Mantine define style on `.mantine-{id} thead tr th`
+                                            style={{padding: 0, fontWeight: 'unset'}}
+                                            colSpan={table.getAllColumns().length}
+                                        >
                                             {header}
                                         </th>
                                     </tr>

package/src/components/table/TableDateRangePicker.tsx

@@ -51,7 +51,7 @@ export const TableDateRangePicker: FunctionComponent<TableDateRangePickerProps>
         <Grid.Col span="content" order={TableComponentsOrder.DateRangePicker} py="sm">
             <Group spacing="xs">
                 <Text span>{formatedRange}</Text>
-                <Popover opened={opened} onChange={setOpened}>
+                <Popover opened={opened} onChange={setOpened} withinPortal>
                     <Popover.Target>
                         <Button variant="outline" color="gray" onClick={() => setOpened(true)} px="xs">
                             <CalendarSize24Px width={24} height={24} />

package/tsconfig.build.json

@@ -1,5 +1,5 @@
 {
     "extends": "./tsconfig.json",
-    "exclude": ["**/*.spec.*"],
+    "exclude": ["**/*.spec.*", "**/__tests__"],
     "include": ["src"]
 }

package/tsconfig.json

@@ -2,7 +2,6 @@
     "extends": "../tsconfig-base.json",
     "compilerOptions": {
         "outDir": "./dist",
-        "declarationDir": "./dist/definitions",
         "rootDir": "src",
         "tsBuildInfoFile": "./dist/.tsbuildinfo",
         "baseUrl": ".",

package/vitest.config.ts

@@ -20,5 +20,8 @@ export default defineConfig({
                 replacement: 'monaco-editor/esm/vs/editor/editor.main.js',
             },
         ],
+        deps: {
+            registerNodeLoader: true,
+        },
     },
 });

package/dist/cjs/__tests__/Utils.js

@@ -1,38 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    userEvent: function() {
-        return _userevent.default;
-    },
-    render: function() {
-        return customRender;
-    }
-});
-var _export_star = require("@swc/helpers/_/_export_star");
-var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-var _object_spread = require("@swc/helpers/_/_object_spread");
-var _jsxruntime = require("react/jsx-runtime");
-var _react = _export_star._(require("@testing-library/react"), exports);
-var _userevent = /*#__PURE__*/ _interop_require_default._(require("@testing-library/user-event"));
-var _theme = require("../theme");
-var customRender = function(ui, options) {
-    var TestWrapper = function(param) {
-        var children = param.children;
-        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_theme.Plasmantine, {
-            children: children
-        });
-    };
-    return (0, _react.render)(ui, _object_spread._({
-        wrapper: TestWrapper
-    }, options));
-};
-
-//# sourceMappingURL=Utils.js.map

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

@@ -1 +0,0 @@
-{"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;;;;;;;oCAd0C;kEAC5B;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

@@ -1,35 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-var _matchers = /*#__PURE__*/ _interop_require_default._(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

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/__tests__/VitestSetup.ts"],"sourcesContent":["import matchers, {TestingLibraryMatchers} from '@testing-library/jest-dom/matchers';\nimport {cleanup} from '@testing-library/react';\ndeclare global {\n    namespace Vi {\n        interface JestAssertion<T = any> extends jest.Matchers<void, T>, TestingLibraryMatchers<T, void> {}\n    }\n}\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":";;;;;iEAA+C;qBACzB;AAMtBA,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

@@ -1,8 +0,0 @@
-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 * from '@testing-library/react';
-export { userEvent };
-export { customRender as render };
-//# sourceMappingURL=Utils.d.ts.map

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

@@ -1 +0,0 @@
-{"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

@@ -1,8 +0,0 @@
-import { TestingLibraryMatchers } from '@testing-library/jest-dom/matchers';
-declare global {
-    namespace Vi {
-        interface JestAssertion<T = any> extends jest.Matchers<void, T>, TestingLibraryMatchers<T, void> {
-        }
-    }
-}
-//# sourceMappingURL=VitestSetup.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"VitestSetup.d.ts","sourceRoot":"","sources":["../../../src/__tests__/VitestSetup.ts"],"names":[],"mappings":"AAAA,OAAiB,EAAC,sBAAsB,EAAC,MAAM,oCAAoC,CAAC;AAEpF,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,EAAE,CAAC;QACT,UAAU,aAAa,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE,sBAAsB,CAAC,CAAC,EAAE,IAAI,CAAC;SAAG;KACtG;CACJ"}

package/dist/esm/__tests__/Utils.js

@@ -1,21 +0,0 @@
-import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { render } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import { Plasmantine } from "../theme";
-var customRender = function(ui, options) {
-    var TestWrapper = function(param) {
-        var children = param.children;
-        return /*#__PURE__*/ _jsx(Plasmantine, {
-            children: children
-        });
-    };
-    return render(ui, _object_spread({
-        wrapper: TestWrapper
-    }, options));
-};
-export * from "@testing-library/react";
-export { userEvent };
-export { customRender as render };
-
-//# sourceMappingURL=Utils.js.map

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

@@ -1 +0,0 @@
-{"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

@@ -1,30 +0,0 @@
-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

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/__tests__/VitestSetup.ts"],"sourcesContent":["import matchers, {TestingLibraryMatchers} from '@testing-library/jest-dom/matchers';\nimport {cleanup} from '@testing-library/react';\ndeclare global {\n    namespace Vi {\n        interface JestAssertion<T = any> extends jest.Matchers<void, T>, TestingLibraryMatchers<T, void> {}\n    }\n}\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,cAAwC,qCAAqC;AACpF,SAAQC,OAAO,QAAO,yBAAyB;AAM/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"}